@manuscripts/body-editor 1.7.4 → 1.7.6-LEAN-3342-0

package/dist/cjs/assets.js

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.commentIcon = exports.editIcon = void 0;
+exports.editAttrsTrackingIcon = exports.commentIcon = exports.editIcon = void 0;
 exports.editIcon = `
   <svg
     width="14"
@@ -78,3 +78,27 @@ exports.commentIcon = `
     />
   </svg>
 `;
+exports.editAttrsTrackingIcon = `
+ <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M12 2L14 4L9 9L6 10L7 7L12 2Z"
+      stroke="#353535"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+    <path
+      d="M13 10V11.5C13 12.328 12.328 13 11.5 13H4.5C3.672 13 3 12.328 3 11.5V4.5C3 3.672 3.672 3 4.5 3H6"
+      stroke="#353535"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+  </svg>
+`;

package/dist/cjs/commands.js

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateCommentAnnotationState = exports.addComment = exports.deleteHighlightMarkers = exports.insertHighlight = exports.createAndFillTableElement = exports.selectAllIsolating = exports.ignoreAtomBlockNodeForward = exports.isAtEndOfTextBlock = exports.ignoreAtomBlockNodeBackward = exports.isTextSelection = exports.isAtStartOfTextBlock = exports.ifInTableBody = exports.insertTOCSection = exports.insertBibliographySection = exports.insertList = exports.insertSection = exports.insertGraphicalAbstract = exports.insertInlineFootnote = exports.insertInlineEquation = exports.insertCrossReference = exports.insertInlineCitation = exports.insertLink = exports.insertSectionLabel = exports.insertBreak = exports.deleteBlock = exports.insertBlock = exports.insertFileAsFigure = exports.createBlock = exports.createSelection = exports.canInsert = exports.blockActive = exports.isNodeSelection = exports.markActive = void 0;
+exports.insertTableFootnote = exports.updateCommentAnnotationState = exports.addComment = exports.deleteHighlightMarkers = exports.insertHighlight = exports.createAndFillTableElement = exports.selectAllIsolating = exports.ignoreAtomBlockNodeForward = exports.isAtEndOfTextBlock = exports.ignoreAtomBlockNodeBackward = exports.isTextSelection = exports.isAtStartOfTextBlock = exports.ifInTableBody = exports.insertTOCSection = exports.insertBibliographySection = exports.insertList = exports.insertSection = exports.insertGraphicalAbstract = exports.insertInlineFootnote = exports.insertInlineEquation = exports.insertCrossReference = exports.insertInlineCitation = exports.insertLink = exports.insertSectionLabel = exports.insertBreak = exports.deleteBlock = exports.insertBlock = exports.insertFileAsFigure = exports.insertGeneralFootnote = exports.createBlock = exports.createSelection = exports.canInsert = exports.blockActive = exports.isNodeSelection = exports.markActive = void 0;
 const json_schema_1 = require("@manuscripts/json-schema");
 const track_changes_plugin_1 = require("@manuscripts/track-changes-plugin");
 const transform_1 = require("@manuscripts/transform");
@@ -122,6 +122,29 @@ const createBlock = (nodeType, position, state, dispatch) => {
     }
 };
 exports.createBlock = createBlock;
+const insertGeneralFootnote = (tableNode, position, state, dispatch, tableElementFooter, view) => {
+    var _a;
+    const generalNote = state.schema.nodes.paragraph.create();
+    const tr = state.tr;
+    const pos = (tableElementFooter === null || tableElementFooter === void 0 ? void 0 : tableElementFooter.length)
+        ? position + tableElementFooter[0].pos + 2
+        : position + (((_a = tableNode.content.firstChild) === null || _a === void 0 ? void 0 : _a.nodeSize) || 0);
+    if (tableElementFooter === null || tableElementFooter === void 0 ? void 0 : tableElementFooter.length) {
+        tr.insert(pos, generalNote);
+    }
+    else {
+        const tableElementFooter = transform_1.schema.nodes.table_element_footer.create({
+            id: (0, transform_1.generateID)(json_schema_1.ObjectTypes.TableElementFooter),
+        }, [generalNote]);
+        tr.insert(pos, tableElementFooter);
+    }
+    if (dispatch && pos) {
+        const selection = (0, exports.createSelection)(state.schema.nodes.paragraph, pos, tr.doc);
+        view === null || view === void 0 ? void 0 : view.focus();
+        dispatch(tr.setSelection(selection).scrollIntoView());
+    }
+};
+exports.insertGeneralFootnote = insertGeneralFootnote;
 const insertFileAsFigure = (file, state, dispatch) => {
     const position = findBlockInsertPosition(state);
     if (position === null || !dispatch) {
@@ -688,3 +711,41 @@ const updateCommentAnnotationState = (state, dispatch) => {
     }
 };
 exports.updateCommentAnnotationState = updateCommentAnnotationState;
+const insertTableFootnote = (node, position, state, dispatch) => {
+    var _a;
+    const footnote = state.schema.nodes.footnote.createAndFill({
+        id: (0, transform_1.generateID)(json_schema_1.ObjectTypes.Footnote),
+        kind: 'footnote',
+    });
+    const insertedAt = state.selection.to;
+    const inlineFootnotes = (0, prosemirror_utils_1.findChildrenByType)(node, transform_1.schema.nodes.inline_footnote);
+    const inlineFootnoteNode = state.schema.nodes.inline_footnote.create({
+        rids: [footnote.attrs.id],
+        contents: inlineFootnotes.length + 1,
+    });
+    const tr = state.tr;
+    tr.insert(insertedAt, inlineFootnoteNode);
+    const footnoteElement = state.schema.nodes.footnotes_element.create({}, footnote);
+    const tableElementFooter = (0, prosemirror_utils_1.findChildrenByType)(node, transform_1.schema.nodes.table_element_footer);
+    let insertionPos;
+    if (tableElementFooter.length) {
+        const pos = tableElementFooter[0].pos;
+        insertionPos = position + pos + tableElementFooter[0].node.nodeSize + 1;
+        tr.insert(insertionPos, footnoteElement);
+    }
+    else {
+        const tableSize = (_a = node.content.firstChild) === null || _a === void 0 ? void 0 : _a.nodeSize;
+        if (tableSize) {
+            insertionPos = position + tableSize + 2;
+            const tableElementFooter = transform_1.schema.nodes.table_element_footer.create({
+                id: (0, transform_1.generateID)(json_schema_1.ObjectTypes.TableElementFooter),
+            }, [footnoteElement]);
+            tr.insert(insertionPos, tableElementFooter);
+        }
+    }
+    if (dispatch && insertionPos) {
+        const nodeSelection = prosemirror_state_1.NodeSelection.create(tr.doc, insertionPos);
+        dispatch(tr.setSelection(nodeSelection));
+    }
+};
+exports.insertTableFootnote = insertTableFootnote;

package/dist/cjs/configs/editor-plugins.js

@@ -36,10 +36,9 @@ const paragraphs_1 = __importDefault(require("../plugins/paragraphs"));
 const persist_1 = __importDefault(require("../plugins/persist"));
 const placeholder_1 = __importDefault(require("../plugins/placeholder"));
 const sections_1 = __importDefault(require("../plugins/sections"));
+const selected_suggestion_ui_1 = __importDefault(require("../plugins/selected-suggestion-ui"));
 const tables_cursor_fix_1 = __importDefault(require("../plugins/tables-cursor-fix"));
 const toc_1 = __importDefault(require("../plugins/toc"));
-const track_changes_ui_1 = __importDefault(require("../plugins/track-changes-ui"));
-const tracking_mark_1 = __importDefault(require("../plugins/tracking-mark"));
 const rules_1 = __importDefault(require("../rules"));
 exports.default = (props) => {
     const plugins = props.plugins || [];
@@ -62,8 +61,7 @@ exports.default = (props) => {
         (0, placeholder_1.default)(),
         (0, prosemirror_tables_1.tableEditing)(),
         (0, highlight_1.default)(props),
-        (0, track_changes_ui_1.default)(props),
-        (0, tracking_mark_1.default)(),
+        (0, selected_suggestion_ui_1.default)(props),
         (0, footnotes_1.default)(),
     ];
     if (props.collabProvider) {

package/dist/cjs/index.js

@@ -29,7 +29,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isHighlightComment = exports.isThereSelector = exports.commentScroll = exports.PopperManager = exports.CollabProvider = exports.LevelSelector = exports.OutlineManuscript = exports.OutlineItemIcon = exports.ManuscriptOutline = void 0;
+exports.SET_SUGGESTION_ID = exports.isHighlightComment = exports.isThereSelector = exports.commentScroll = exports.PopperManager = exports.CollabProvider = exports.LevelSelector = exports.OutlineManuscript = exports.OutlineItemIcon = exports.ManuscriptOutline = void 0;
 __exportStar(require("./citation-sources"), exports);
 __exportStar(require("./commands"), exports);
 var ManuscriptOutline_1 = require("./components/outline/ManuscriptOutline");
@@ -51,6 +51,8 @@ var comment_annotation_1 = require("./plugins/comment_annotation");
 Object.defineProperty(exports, "commentScroll", { enumerable: true, get: function () { return comment_annotation_1.commentScroll; } });
 Object.defineProperty(exports, "isThereSelector", { enumerable: true, get: function () { return comment_annotation_1.isThereSelector; } });
 Object.defineProperty(exports, "isHighlightComment", { enumerable: true, get: function () { return comment_annotation_1.isHighlightComment; } });
+var selected_suggestion_ui_1 = require("./plugins/selected-suggestion-ui");
+Object.defineProperty(exports, "SET_SUGGESTION_ID", { enumerable: true, get: function () { return selected_suggestion_ui_1.SET_SUGGESTION_ID; } });
 __exportStar(require("./lib/utils"), exports);
 __exportStar(require("./lib/track-changes-utils"), exports);
 __exportStar(require("./useEditor"), exports);

package/dist/cjs/lib/context-menu.js

@@ -17,6 +17,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContextMenu = exports.sectionLevel = void 0;
 const transform_1 = require("@manuscripts/transform");
+const prosemirror_utils_1 = require("prosemirror-utils");
 const commands_1 = require("../commands");
 const popper_1 = require("./popper");
 const popper = new popper_1.PopperManager();
@@ -134,6 +135,7 @@ class ContextMenu {
             this.addPopperEventListeners();
         };
         this.showEditMenu = (target) => {
+            var _a;
             const menu = document.createElement('div');
             menu.className = 'menu';
             const $pos = this.resolvePos();
@@ -164,6 +166,33 @@ class ContextMenu {
                     }));
                 }));
             }
+            if (type === transform_1.schema.nodes.table_element) {
+                const tableElementFooter = (0, prosemirror_utils_1.findChildrenByType)(this.node, transform_1.schema.nodes.table_element_footer);
+                const hasGeneralNote = tableElementFooter.length &&
+                    ((_a = tableElementFooter[0].node.firstChild) === null || _a === void 0 ? void 0 : _a.type) === transform_1.schema.nodes.paragraph;
+                if (!hasGeneralNote) {
+                    menu.appendChild(this.createMenuSection((section) => {
+                        section.appendChild(this.createMenuItem('Add General Note', () => {
+                            const { state, dispatch } = this.view;
+                            (0, commands_1.insertGeneralFootnote)(this.node, this.getPos(), state, dispatch, tableElementFooter, this.view);
+                        }));
+                    }));
+                }
+            }
+            if (type === transform_1.schema.nodes.table_element) {
+                const isInTable = (0, prosemirror_utils_1.hasParentNodeOfType)(transform_1.schema.nodes.table)(this.view.state.selection);
+                if (isInTable) {
+                    menu.appendChild(this.createMenuSection((section) => {
+                        section.appendChild(this.createMenuItem('Add Reference Note', () => {
+                            const footnotesElement = (0, prosemirror_utils_1.findChildrenByType)(this.node, transform_1.schema.nodes.footnotes_element);
+                            if (!footnotesElement.length) {
+                                const { state, dispatch } = this.view;
+                                (0, commands_1.insertTableFootnote)(this.node, this.getPos(), state, dispatch);
+                            }
+                        }));
+                    }));
+                }
+            }
             if (!readonlyTypes.includes(type) &&
                 !readonlyTypes.includes($pos.parent.type)) {
                 menu.appendChild(this.createMenuSection((section) => {

package/dist/cjs/lib/track-changes-utils.js

@@ -15,7 +15,8 @@
  * limitations under the License.
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getActualAttrs = exports.isTracked = exports.getChangeClasses = exports.isPendingSetAttrs = exports.isPending = exports.isPendingInsert = exports.isDeleted = exports.isRejectedInsert = void 0;
+exports.getAttrsTrackingButton = exports.getActualAttrs = exports.isTracked = exports.getChangeClasses = exports.isPendingSetAttrs = exports.isPending = exports.isPendingInsert = exports.isDeleted = exports.isRejectedInsert = void 0;
+const assets_1 = require("../assets");
 function isRejectedInsert(node) {
     if (node.attrs.dataTracked) {
         const changes = node.attrs.dataTracked;
@@ -56,10 +57,10 @@ function isPendingSetAttrs(node) {
     return false;
 }
 exports.isPendingSetAttrs = isPendingSetAttrs;
-function getChangeClasses(node) {
+function getChangeClasses(dataTracked) {
     const classes = [];
-    if (node.attrs.dataTracked) {
-        const changes = node.attrs.dataTracked;
+    if (dataTracked) {
+        const changes = dataTracked;
         const operationClasses = new Map([
             ['insert', 'inserted'],
             ['delete', 'deleted'],
@@ -90,3 +91,11 @@ function getActualAttrs(node) {
     return attrs;
 }
 exports.getActualAttrs = getActualAttrs;
+const getAttrsTrackingButton = (changeID) => {
+    const el = document.createElement('button');
+    el.className = 'attrs-popper-button';
+    el.value = changeID;
+    el.innerHTML = assets_1.editAttrsTrackingIcon;
+    return el;
+};
+exports.getAttrsTrackingButton = getAttrsTrackingButton;

package/dist/cjs/plugins/comment_annotation.js

@@ -130,7 +130,8 @@ const getCommentIcon = (comment, setSelectedComment) => () => {
         element.classList.add(location === 'point' ? 'point-comment' : 'inline-citation');
     }
     element.classList.add('block-comment-button', elementClass);
-    element.onclick = () => {
+    element.onclick = (e) => {
+        e.stopPropagation();
         setSelectedComment(commentId);
         (0, exports.commentScroll)(commentId, 'inspector');
     };

package/dist/cjs/plugins/footnotes/index.js

@@ -22,6 +22,7 @@ const prosemirror_state_1 = require("prosemirror-state");
 const prosemirror_utils_1 = require("prosemirror-utils");
 const prosemirror_view_1 = require("prosemirror-view");
 const utils_1 = require("../../lib/utils");
+const placeholder_1 = require("../placeholder");
 exports.footnotesKey = new prosemirror_state_1.PluginKey('footnotes');
 const buildPluginState = (doc) => {
     const nodes = [];
@@ -101,9 +102,10 @@ exports.default = () => {
                 }
                 const { labels } = exports.footnotesKey.getState(state);
                 state.doc.descendants((node, pos) => {
-                    if (labels) {
-                        if ((0, transform_1.isFootnoteNode)(node)) {
-                            const id = node.attrs.id;
+                    var _a, _b;
+                    if ((0, transform_1.isFootnoteNode)(node)) {
+                        const id = node.attrs.id;
+                        if (labels) {
                             const label = labels.get(id);
                             if (label) {
                                 decorations.push(prosemirror_view_1.Decoration.widget(pos + 2, labelWidget(label, id), {
@@ -111,12 +113,20 @@ exports.default = () => {
                                 }));
                             }
                         }
+                        if (!((_a = node.firstChild) === null || _a === void 0 ? void 0 : _a.textContent)) {
+                            decorations.push(prosemirror_view_1.Decoration.widget(pos + 2, (0, placeholder_1.placeholderWidget)('Add new note here')));
+                        }
                     }
                     if (node.type === transform_1.schema.nodes.footnotes_element) {
                         decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {
                             class: 'footnote-element',
                         }));
                     }
+                    if (node.type === transform_1.schema.nodes.table_element_footer) {
+                        if (((_b = node.firstChild) === null || _b === void 0 ? void 0 : _b.type) === transform_1.schema.nodes.paragraph) {
+                            decorations.push(prosemirror_view_1.Decoration.widget(pos + 2, (0, placeholder_1.placeholderWidget)('Add general note here')));
+                        }
+                    }
                 });
                 return prosemirror_view_1.DecorationSet.create(state.doc, decorations);
             },

package/dist/cjs/plugins/placeholder.js

@@ -15,6 +15,7 @@
  * limitations under the License.
  */
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.placeholderWidget = void 0;
 const prosemirror_state_1 = require("prosemirror-state");
 const prosemirror_view_1 = require("prosemirror-view");
 const placeholderWidget = (placeholder) => (view, getPos) => {
@@ -27,6 +28,7 @@ const placeholderWidget = (placeholder) => (view, getPos) => {
     });
     return element;
 };
+exports.placeholderWidget = placeholderWidget;
 exports.default = () => new prosemirror_state_1.Plugin({
     props: {
         decorations: (state) => {
@@ -38,7 +40,7 @@ exports.default = () => new prosemirror_state_1.Plugin({
                     node.type.isBlock &&
                     node.childCount === 0) {
                     if (node.type === node.type.schema.nodes.paragraph) {
-                        decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget(placeholder)));
+                        decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, (0, exports.placeholderWidget)(placeholder)));
                     }
                     else {
                         decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {

package/dist/cjs/plugins/selected-suggestion-ui.js

@@ -0,0 +1,129 @@
+"use strict";
+/*!
+ * © 2019 Atypon Systems LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.selectedSuggestionKey = exports.SET_SUGGESTION_ID = void 0;
+const track_changes_plugin_1 = require("@manuscripts/track-changes-plugin");
+const lodash_1 = require("lodash");
+const prosemirror_state_1 = require("prosemirror-state");
+const prosemirror_view_1 = require("prosemirror-view");
+class SuggestionView {
+    constructor(view) {
+        this.listener = (e) => {
+            const changeId = e.currentTarget.getAttribute('data-track-id');
+            this.view.dispatch(this.view.state.tr.setMeta(exports.SET_SUGGESTION_ID, changeId));
+        };
+        this.view = view;
+        this.addEventListener(view);
+        this.update(view, undefined);
+    }
+    update(view, prevState) {
+        var _a, _b;
+        this.view = view;
+        if (!prevState) {
+            return;
+        }
+        const oldChanges = ((_a = track_changes_plugin_1.trackChangesPluginKey.getState(prevState)) === null || _a === void 0 ? void 0 : _a.changeSet.changes) || [];
+        const newChangeSet = (_b = track_changes_plugin_1.trackChangesPluginKey.getState(view.state)) === null || _b === void 0 ? void 0 : _b.changeSet;
+        if (newChangeSet && !(0, lodash_1.isEqual)(oldChanges, newChangeSet.changes)) {
+            this.addEventListener(view);
+            oldChanges.map((change) => {
+                var _a;
+                if (!newChangeSet.get(change.id) ||
+                    ((_a = newChangeSet.get(change.id)) === null || _a === void 0 ? void 0 : _a.dataTracked.status) === 'rejected') {
+                    const dom = view.dom.querySelector(`[data-track-id="${change.id}"]`);
+                    dom === null || dom === void 0 ? void 0 : dom.removeEventListener('click', this.listener);
+                }
+            });
+        }
+    }
+    destroy() {
+        this.view.dom
+            .querySelectorAll('[data-track-status="pending"], [data-track-status="accepted"]')
+            .forEach((dom) => {
+            var _a, _b;
+            if ((_b = (_a = dom.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains('keyword')) {
+                return;
+            }
+            dom.removeEventListener('click', this.listener);
+        });
+    }
+    addEventListener(view) {
+        view.dom
+            .querySelectorAll('[data-track-status="pending"], [data-track-status="accepted"]')
+            .forEach((dom) => {
+            var _a, _b;
+            if ((_b = (_a = dom.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains('keyword')) {
+                return;
+            }
+            dom.addEventListener('click', this.listener);
+        });
+    }
+}
+const getTrackChangesData = (node) => {
+    var _a;
+    const trackChangesMark = node.marks.find((mark) => (mark.type.name === 'tracked_insert' ||
+        mark.type.name === 'tracked_delete') &&
+        mark.attrs.dataTracked);
+    return (_a = trackChangesMark === null || trackChangesMark === void 0 ? void 0 : trackChangesMark.attrs) === null || _a === void 0 ? void 0 : _a.dataTracked;
+};
+exports.SET_SUGGESTION_ID = 'SET_SELECTED_SUGGESTION_ID';
+const CLEAR_SUGGESTION_ID = 'CLEAR_SUGGESTION_ID';
+exports.selectedSuggestionKey = new prosemirror_state_1.PluginKey('selected_suggestion');
+exports.default = (props) => new prosemirror_state_1.Plugin({
+    key: exports.selectedSuggestionKey,
+    view: (view) => new SuggestionView(view),
+    state: {
+        init: () => prosemirror_view_1.DecorationSet.empty,
+        apply: (tr, value, _, state) => {
+            const suggestionId = tr.getMeta(exports.SET_SUGGESTION_ID);
+            if (suggestionId) {
+                return buildSelectedSuggestionDecoration(suggestionId, state, props);
+            }
+            if (tr.getMeta(CLEAR_SUGGESTION_ID) ||
+                tr.getMeta('track-changes-refresh-changes')) {
+                props.setEditorSelectedSuggestion(undefined);
+                return prosemirror_view_1.DecorationSet.empty;
+            }
+            return value;
+        },
+    },
+    props: {
+        handleClick(view, pos) {
+            const nodeClicked = view.state.doc.nodeAt(pos);
+            const trackChangesData = nodeClicked && getTrackChangesData(nodeClicked);
+            if (!trackChangesData) {
+                view.dispatch(view.state.tr.setMeta(CLEAR_SUGGESTION_ID, true));
+                props.setEditorSelectedSuggestion(undefined);
+            }
+        },
+        decorations: (state) => exports.selectedSuggestionKey.getState(state),
+    },
+});
+const buildSelectedSuggestionDecoration = (suggestionId, state, props) => {
+    var _a;
+    const change = (_a = track_changes_plugin_1.trackChangesPluginKey
+        .getState(state)) === null || _a === void 0 ? void 0 : _a.changeSet.get(suggestionId);
+    const decorations = [];
+    if (change) {
+        const decoration = change.type === 'text-change' ? prosemirror_view_1.Decoration.inline : prosemirror_view_1.Decoration.node;
+        decorations.push(decoration(change.from, change.to, {
+            class: 'selected-suggestion',
+        }));
+        props.setEditorSelectedSuggestion(change.id);
+    }
+    return prosemirror_view_1.DecorationSet.create(state.doc, decorations);
+};

package/dist/cjs/views/affiliation.js

@@ -39,10 +39,12 @@ class AffiliationView extends base_node_view_1.BaseNodeView {
                 this.dom.setAttribute('style', 'order: ' + (order || (pluginState === null || pluginState === void 0 ? void 0 : pluginState.affiliations.length) + 1));
             }
             if ((_a = attrs.dataTracked) === null || _a === void 0 ? void 0 : _a.length) {
+                this.dom.setAttribute('data-track-id', attrs.dataTracked[0].id);
                 this.dom.setAttribute('data-track-status', attrs.dataTracked[0].status);
                 this.dom.setAttribute('data-track-op', attrs.dataTracked[0].operation);
             }
             else {
+                this.dom.removeAttribute('data-track-id');
                 this.dom.removeAttribute('data-track-status');
                 this.dom.removeAttribute('data-track-type');
             }
@@ -54,7 +56,6 @@ class AffiliationView extends base_node_view_1.BaseNodeView {
             this.updateContents();
         };
         this.ignoreMutation = () => true;
-        this.stopEvent = () => true;
         this.formatAddress = (affiliation) => {
             const { department, institution, addressLine1, city, county, country, postCode, } = affiliation;
             return [

package/dist/cjs/views/bibliography_element.js

@@ -32,9 +32,10 @@ const track_changes_plugin_1 = require("@manuscripts/track-changes-plugin");
 const transform_1 = require("@manuscripts/transform");
 const assets_1 = require("../assets");
 const dompurify_1 = require("../lib/dompurify");
+const track_changes_utils_1 = require("../lib/track-changes-utils");
 const bibliography_1 = require("../plugins/bibliography");
 const comment_annotation_1 = require("../plugins/comment_annotation");
-const tracking_mark_1 = require("../plugins/tracking-mark");
+const selected_suggestion_ui_1 = require("../plugins/selected-suggestion-ui");
 const block_view_1 = __importDefault(require("./block_view"));
 const creators_1 = require("./creators");
 const ReactSubView_1 = __importDefault(require("./ReactSubView"));
@@ -61,11 +62,13 @@ class BibliographyElementBlockView extends block_view_1.default {
         this.updateContents = () => __awaiter(this, void 0, void 0, function* () {
             const bib = (0, bibliography_1.getBibliographyPluginState)(this.view.state);
             const commentsDecorationSet = comment_annotation_1.commentAnnotation.getState(this.view.state);
+            const selectedSuggestion = selected_suggestion_ui_1.selectedSuggestionKey.getState(this.view.state);
             const commentElementMap = new Map();
             const dataTrackedMap = new Map();
+            let selectedBibItemSuggestion;
             this.node.descendants((node, pos) => {
+                const nodePosition = this.getPos() + pos + 2;
                 if (commentsDecorationSet) {
-                    const nodePosition = this.getPos() + pos + 2;
                     const commentWidget = commentsDecorationSet.find(nodePosition, nodePosition);
                     if (commentWidget.length) {
                         const commentElement = commentWidget[0].type.toDOM();
@@ -77,6 +80,10 @@ class BibliographyElementBlockView extends block_view_1.default {
                     const lastChange = dataTracked[dataTracked.length - 1];
                     dataTrackedMap.set(node.attrs.id, lastChange);
                 }
+                if ((dataTracked === null || dataTracked === void 0 ? void 0 : dataTracked.length) &&
+                    (selectedSuggestion === null || selectedSuggestion === void 0 ? void 0 : selectedSuggestion.find(nodePosition, nodePosition + node.nodeSize).length)) {
+                    selectedBibItemSuggestion = node.attrs.id;
+                }
             });
             const can = this.props.getCapabilities();
             const wrapper = document.createElement('div');
@@ -114,13 +121,16 @@ class BibliographyElementBlockView extends block_view_1.default {
                 }
                 const dataTracked = dataTrackedMap.get(element.id);
                 if (dataTracked) {
-                    element.classList.add('attrs-track-mark');
-                    const decoration = (0, tracking_mark_1.getMarkDecoration)(dataTracked);
-                    decoration.style && element.setAttribute('style', decoration.style);
+                    element.classList.add('attrs-track-mark', ...(0, track_changes_utils_1.getChangeClasses)([dataTracked]));
                     if (dataTracked.status === track_changes_plugin_1.CHANGE_STATUS.pending &&
                         dataTracked.operation === track_changes_plugin_1.CHANGE_OPERATION.set_node_attributes) {
-                        element.appendChild((0, tracking_mark_1.getAttrsTrackingButton)(dataTracked.id));
+                        element.appendChild((0, track_changes_utils_1.getAttrsTrackingButton)(dataTracked.id));
                     }
+                    this.addClickListenerToBibItem(element, dataTracked);
+                }
+                if (selectedBibItemSuggestion &&
+                    selectedBibItemSuggestion === element.id) {
+                    element.classList.add('selected-suggestion');
                 }
                 wrapper.append(element);
             }
@@ -146,6 +156,13 @@ class BibliographyElementBlockView extends block_view_1.default {
         this.handleDelete = (item) => {
             return this.deleteNode(item._id);
         };
+        this.addClickListenerToBibItem = (element, dataTracked) => {
+            if (dataTracked.status !== track_changes_plugin_1.CHANGE_STATUS.rejected) {
+                element.addEventListener('click', () => {
+                    this.view.dispatch(this.view.state.tr.setMeta(selected_suggestion_ui_1.SET_SUGGESTION_ID, dataTracked.id));
+                });
+            }
+        };
     }
 }
 exports.BibliographyElementBlockView = BibliographyElementBlockView;

package/dist/cjs/views/citation.js

@@ -47,7 +47,10 @@ class CitationView extends base_node_view_1.BaseNodeView {
         this.updateContents = () => {
             const bib = (0, bibliography_1.getBibliographyPluginState)(this.view.state);
             const citation = this.getCitation();
-            const classes = ['citation', ...(0, track_changes_utils_1.getChangeClasses)(this.node)];
+            const classes = [
+                'citation',
+                ...(0, track_changes_utils_1.getChangeClasses)(this.node.attrs.dataTracked),
+            ];
             const element = document.createElement('span');
             element.className = classes.join(' ');
             const text = bib.renderedCitations.get(citation._id);

package/dist/cjs/views/contributors.js

@@ -8,6 +8,7 @@ const style_guide_1 = require("@manuscripts/style-guide");
 const transform_1 = require("@manuscripts/transform");
 const track_changes_utils_1 = require("../lib/track-changes-utils");
 const affiliations_1 = require("../plugins/affiliations");
+const selected_suggestion_ui_1 = require("../plugins/selected-suggestion-ui");
 const block_view_1 = __importDefault(require("./block_view"));
 const creators_1 = require("./creators");
 const ReactSubView_1 = __importDefault(require("./ReactSubView"));
@@ -31,12 +32,17 @@ class ContributorsView extends block_view_1.default {
         };
         this.buildAuthors = () => {
             var _a;
+            const selectedSuggestion = selected_suggestion_ui_1.selectedSuggestionKey.getState(this.view.state);
+            let selectedAuthor;
             const authors = [];
             const authorsWrapper = document.createElement('div');
             authorsWrapper.classList.add('contributors-list');
-            (_a = this.node.content) === null || _a === void 0 ? void 0 : _a.forEach((node) => {
+            (_a = this.node.content) === null || _a === void 0 ? void 0 : _a.forEach((node, offset) => {
                 if ((0, transform_1.isContributorNode)(node)) {
                     authors.push(node);
+                    if (selectedSuggestion === null || selectedSuggestion === void 0 ? void 0 : selectedSuggestion.find(this.getPos() + offset + 2, this.getPos() + offset + node.nodeSize + 2).length) {
+                        selectedAuthor = node.attrs.id;
+                    }
                 }
             });
             authors
@@ -46,11 +52,11 @@ class ContributorsView extends block_view_1.default {
                     return;
                 }
                 const jointAuthors = this.isJointFirstAuthor(authors, i);
-                authorsWrapper.appendChild(this.buildAuthor(author, jointAuthors));
+                authorsWrapper.appendChild(this.buildAuthor(author, jointAuthors, selectedAuthor));
             });
             this.container.appendChild(authorsWrapper);
         };
-        this.buildAuthor = (node, isJointFirstAuthor) => {
+        this.buildAuthor = (node, isJointFirstAuthor, selectedAuthor) => {
             var _a;
             const pluginState = affiliations_1.affiliationsKey.getState(this.view.state);
             const attrs = node.attrs;
@@ -60,10 +66,12 @@ class ContributorsView extends block_view_1.default {
             container.setAttribute('id', attrs.id);
             container.setAttribute('contenteditable', 'false');
             if ((_a = attrs.dataTracked) === null || _a === void 0 ? void 0 : _a.length) {
+                container.setAttribute('data-track-id', attrs.dataTracked[0].id);
                 container.setAttribute('data-track-status', attrs.dataTracked[0].status);
                 container.setAttribute('data-track-op', attrs.dataTracked[0].operation);
             }
             else {
+                container.removeAttribute('data-track-id');
                 container.removeAttribute('data-track-status');
                 container.removeAttribute('data-track-type');
             }
@@ -100,6 +108,9 @@ class ContributorsView extends block_view_1.default {
             if (displayAttr.isCorresponding) {
                 container.appendChild(this.createNote('*', 'Corresponding author'));
             }
+            if (selectedAuthor && selectedAuthor === attrs.id) {
+                container.classList.add('selected-suggestion');
+            }
             return container;
         };
         this.initials = (given) => given

package/dist/cjs/views/cross_reference.js

@@ -36,7 +36,10 @@ class CrossReferenceView extends base_node_view_1.BaseNodeView {
             });
         };
         this.updateContents = () => {
-            const nodeClasses = ['cross-reference', ...(0, track_changes_utils_1.getChangeClasses)(this.node)];
+            const nodeClasses = [
+                'cross-reference',
+                ...(0, track_changes_utils_1.getChangeClasses)(this.node.attrs.dataTracked),
+            ];
             this.dom.className = nodeClasses.join(' ');
             this.dom.textContent = this.node.attrs.customLabel || this.node.attrs.label;
             this.dom.addEventListener('click', this.handleClick);