@manuscripts/body-editor 1.7.20 → 1.7.22

package/dist/cjs/commands.js

@@ -26,6 +26,7 @@ const prosemirror_transform_1 = require("prosemirror-transform");
 const prosemirror_utils_1 = require("prosemirror-utils");
 const list_1 = require("./keys/list");
 const helpers_1 = require("./lib/helpers");
+const track_changes_utils_1 = require("./lib/track-changes-utils");
 const utils_1 = require("./lib/utils");
 const comment_annotation_1 = require("./plugins/comment_annotation");
 const highlight_1 = require("./plugins/highlight");
@@ -127,10 +128,14 @@ const insertGeneralFootnote = (tableNode, position, view, tableElementFooter) =>
     const generalNote = state.schema.nodes.paragraph.create({
         placeholder: 'Add general note here',
     });
+    const tableColGroup = (0, prosemirror_utils_1.findChildrenByType)(tableNode, transform_1.schema.nodes.table_colgroup)[0];
     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);
+        : position +
+            (!tableColGroup
+                ? ((_a = tableNode.content.firstChild) === null || _a === void 0 ? void 0 : _a.nodeSize) || 0
+                : tableColGroup.pos + tableColGroup.node.nodeSize);
     if (tableElementFooter === null || tableElementFooter === void 0 ? void 0 : tableElementFooter.length) {
         tr.insert(pos, generalNote);
     }
@@ -737,10 +742,12 @@ const insertTableFootnote = (node, position, state, dispatch) => {
     const tr = state.tr;
     tr.insert(insertedAt, inlineFootnoteNode);
     let insertionPos;
-    const footnotesElement = (0, prosemirror_utils_1.findChildrenByType)(node, transform_1.schema.nodes.footnotes_element);
-    if (footnotesElement.length) {
-        const pos = footnotesElement[0].pos;
-        insertionPos = position + pos + footnotesElement[0].node.nodeSize + 1;
+    const footnotesElement = (0, prosemirror_utils_1.findChildrenByType)(node, transform_1.schema.nodes.footnotes_element).pop();
+    if (footnotesElement &&
+        !(0, track_changes_utils_1.isDeleted)(footnotesElement.node) &&
+        !(0, track_changes_utils_1.isRejectedInsert)(footnotesElement.node)) {
+        const pos = footnotesElement.pos;
+        insertionPos = position + pos + footnotesElement.node.nodeSize + 1;
         tr.insert(insertionPos, footnote);
     }
     else {
@@ -752,14 +759,22 @@ const insertTableFootnote = (node, position, state, dispatch) => {
             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]);
+            const tableElementFooter = transform_1.schema.nodes.table_element_footer.create({
+                id: (0, transform_1.generateID)(json_schema_1.ObjectTypes.TableElementFooter),
+            }, [footnoteElement]);
+            const tableColGroup = (0, prosemirror_utils_1.findChildrenByType)(node, transform_1.schema.nodes.table_colgroup)[0];
+            if (tableColGroup) {
+                insertionPos =
+                    position + tableColGroup.pos + tableColGroup.node.nodeSize + 2;
                 tr.insert(insertionPos, tableElementFooter);
             }
+            else {
+                const tableSize = (_a = node.content.firstChild) === null || _a === void 0 ? void 0 : _a.nodeSize;
+                if (tableSize) {
+                    insertionPos = position + tableSize + 2;
+                    tr.insert(insertionPos, tableElementFooter);
+                }
+            }
         }
     }
     if (dispatch && insertionPos) {

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

@@ -25,6 +25,7 @@ const prosemirror_utils_1 = require("prosemirror-utils");
 const commands_1 = require("../commands");
 const ReactSubView_1 = __importDefault(require("../views/ReactSubView"));
 const popper_1 = require("./popper");
+const track_changes_utils_1 = require("./track-changes-utils");
 const popper = new popper_1.PopperManager();
 const listTypes = [transform_1.schema.nodes.ordered_list, transform_1.schema.nodes.bullet_list];
 const readonlyTypes = [transform_1.schema.nodes.keywords, transform_1.schema.nodes.bibliography_element];
@@ -186,14 +187,16 @@ class ContextMenu {
                 if (isInTable) {
                     menu.appendChild(this.createMenuSection((section) => {
                         section.appendChild(this.createMenuItem('Add Reference Note', () => {
-                            var _a;
-                            const footnotesElement = (0, prosemirror_utils_1.findChildrenByType)(this.node, transform_1.schema.nodes.footnotes_element);
-                            if (!footnotesElement.length) {
+                            var _a, _b;
+                            const footnotesElement = (_a = (0, prosemirror_utils_1.findChildrenByType)(this.node, transform_1.schema.nodes.footnotes_element).pop()) === null || _a === void 0 ? void 0 : _a.node;
+                            if (!footnotesElement ||
+                                (0, track_changes_utils_1.isDeleted)(footnotesElement) ||
+                                (0, track_changes_utils_1.isRejectedInsert)(footnotesElement)) {
                                 const { state, dispatch } = this.view;
                                 (0, commands_1.insertTableFootnote)(this.node, this.getPos(), state, dispatch);
                             }
                             else {
-                                const footnotes = (0, prosemirror_utils_1.findChildrenByType)(footnotesElement[0].node, transform_1.schema.nodes.footnote).map((nodeWithPos) => {
+                                const footnotes = (0, prosemirror_utils_1.findChildrenByType)(footnotesElement, transform_1.schema.nodes.footnote).map((nodeWithPos) => {
                                     return nodeWithPos.node;
                                 });
                                 const targetDom = this.view.domAtPos(this.view.state.selection.from);
@@ -225,7 +228,7 @@ class ContextMenu {
                                             (_a = this.props) === null || _a === void 0 ? void 0 : _a.popper.destroy();
                                         },
                                     }, this.node, this.getPos, this.view, 'table-footnote-editor');
-                                    (_a = this.props) === null || _a === void 0 ? void 0 : _a.popper.show(targetDom.node, popperContainer, 'bottom-end');
+                                    (_b = this.props) === null || _b === void 0 ? void 0 : _b.popper.show(targetDom.node, popperContainer, 'bottom-end');
                                 }
                             }
                         }));

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

@@ -132,10 +132,10 @@ exports.default = () => {
                         }
                     }
                     if (node.type === transform_1.schema.nodes.footnotes_element) {
-                        decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {
-                            class: 'footnote-element',
-                        }));
                         if ((parent === null || parent === void 0 ? void 0 : parent.type) === transform_1.schema.nodes.table_element_footer) {
+                            decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {
+                                class: 'table-footnotes-element',
+                            }));
                             tableInlineFootnoteIds = (0, footnotes_utils_1.findTableInlineFootnoteIds)(state.doc.resolve(pos));
                         }
                         else {

package/dist/cjs/views/footnote.js

@@ -18,7 +18,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FootnoteView = void 0;
+exports.setTCClasses = exports.FootnoteView = void 0;
+const track_changes_utils_1 = require("../lib/track-changes-utils");
 const block_view_1 = __importDefault(require("./block_view"));
 const creators_1 = require("./creators");
 class FootnoteView extends block_view_1.default {
@@ -28,4 +29,13 @@ class FootnoteView extends block_view_1.default {
     }
 }
 exports.FootnoteView = FootnoteView;
-exports.default = (0, creators_1.createNodeOrElementView)(FootnoteView, 'div');
+const setTCClasses = (node, dom) => {
+    const dataTracked = node.attrs.dataTracked;
+    if (dataTracked === null || dataTracked === void 0 ? void 0 : dataTracked.length) {
+        const lastChange = dataTracked[dataTracked.length - 1];
+        const changeClasses = (0, track_changes_utils_1.getChangeClasses)([lastChange]);
+        dom.classList.add(...changeClasses);
+    }
+};
+exports.setTCClasses = setTCClasses;
+exports.default = (0, creators_1.createNodeOrElementView)(FootnoteView, 'div', exports.setTCClasses);

package/dist/cjs/views/footnote_editable.js

@@ -18,4 +18,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const creators_1 = require("./creators");
 const editable_block_1 = require("./editable_block");
 const footnote_1 = require("./footnote");
-exports.default = (0, creators_1.createNodeOrElementView)((0, editable_block_1.EditableBlock)(footnote_1.FootnoteView), 'div');
+exports.default = (0, creators_1.createNodeOrElementView)((0, editable_block_1.EditableBlock)(footnote_1.FootnoteView), 'div', footnote_1.setTCClasses);

package/dist/cjs/views/footnotes_element.js

@@ -21,6 +21,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FootnotesElementView = void 0;
 const block_view_1 = __importDefault(require("./block_view"));
 const creators_1 = require("./creators");
+const footnote_1 = require("./footnote");
 class FootnotesElementView extends block_view_1.default {
     constructor() {
         super(...arguments);
@@ -37,4 +38,4 @@ class FootnotesElementView extends block_view_1.default {
     }
 }
 exports.FootnotesElementView = FootnotesElementView;
-exports.default = (0, creators_1.createNodeOrElementView)(FootnotesElementView, 'div');
+exports.default = (0, creators_1.createNodeOrElementView)(FootnotesElementView, 'div', footnote_1.setTCClasses);

package/dist/cjs/views/footnotes_element_editable.js

@@ -17,5 +17,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const creators_1 = require("./creators");
 const editable_block_1 = require("./editable_block");
+const footnote_1 = require("./footnote");
 const footnotes_element_1 = require("./footnotes_element");
-exports.default = (0, creators_1.createNodeOrElementView)((0, editable_block_1.EditableBlock)(footnotes_element_1.FootnotesElementView), 'div');
+exports.default = (0, creators_1.createNodeOrElementView)((0, editable_block_1.EditableBlock)(footnotes_element_1.FootnotesElementView), 'div', footnote_1.setTCClasses);

package/dist/cjs/views/inline_footnote.js

@@ -16,6 +16,7 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InlineFootnoteView = void 0;
+const track_changes_utils_1 = require("../lib/track-changes-utils");
 const base_node_view_1 = require("./base_node_view");
 const creators_1 = require("./creators");
 class InlineFootnoteView extends base_node_view_1.BaseNodeView {
@@ -26,6 +27,10 @@ class InlineFootnoteView extends base_node_view_1.BaseNodeView {
         };
         this.updateContents = () => {
             this.setDomAttrs(this.node, this.dom);
+            this.dom.className = [
+                'footnote',
+                ...(0, track_changes_utils_1.getChangeClasses)(this.node.attrs.dataTracked),
+            ].join(' ');
         };
         this.initialise = () => {
             this.dom = this.createDOM();

package/dist/es/commands.js

@@ -23,6 +23,7 @@ import { findWrapping } from 'prosemirror-transform';
 import { findChildrenByType, findParentNodeOfType, } from 'prosemirror-utils';
 import { skipCommandTracking } from './keys/list';
 import { isNodeOfType, nearestAncestor } from './lib/helpers';
+import { isDeleted, isRejectedInsert } from './lib/track-changes-utils';
 import { findParentNodeWithId, getChildOfType } from './lib/utils';
 import { commentAnnotation } from './plugins/comment_annotation';
 import { highlightKey, SET_COMMENT } from './plugins/highlight';
@@ -118,10 +119,14 @@ export const insertGeneralFootnote = (tableNode, position, view, tableElementFoo
     const generalNote = state.schema.nodes.paragraph.create({
         placeholder: 'Add general note here',
     });
+    const tableColGroup = findChildrenByType(tableNode, schema.nodes.table_colgroup)[0];
     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);
+        : position +
+            (!tableColGroup
+                ? ((_a = tableNode.content.firstChild) === null || _a === void 0 ? void 0 : _a.nodeSize) || 0
+                : tableColGroup.pos + tableColGroup.node.nodeSize);
     if (tableElementFooter === null || tableElementFooter === void 0 ? void 0 : tableElementFooter.length) {
         tr.insert(pos, generalNote);
     }
@@ -700,10 +705,12 @@ export const insertTableFootnote = (node, position, state, dispatch) => {
     const tr = state.tr;
     tr.insert(insertedAt, inlineFootnoteNode);
     let insertionPos;
-    const footnotesElement = findChildrenByType(node, schema.nodes.footnotes_element);
-    if (footnotesElement.length) {
-        const pos = footnotesElement[0].pos;
-        insertionPos = position + pos + footnotesElement[0].node.nodeSize + 1;
+    const footnotesElement = findChildrenByType(node, schema.nodes.footnotes_element).pop();
+    if (footnotesElement &&
+        !isDeleted(footnotesElement.node) &&
+        !isRejectedInsert(footnotesElement.node)) {
+        const pos = footnotesElement.pos;
+        insertionPos = position + pos + footnotesElement.node.nodeSize + 1;
         tr.insert(insertionPos, footnote);
     }
     else {
@@ -715,14 +722,22 @@ export const insertTableFootnote = (node, position, state, dispatch) => {
             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 = schema.nodes.table_element_footer.create({
-                    id: generateID(ObjectTypes.TableElementFooter),
-                }, [footnoteElement]);
+            const tableElementFooter = schema.nodes.table_element_footer.create({
+                id: generateID(ObjectTypes.TableElementFooter),
+            }, [footnoteElement]);
+            const tableColGroup = findChildrenByType(node, schema.nodes.table_colgroup)[0];
+            if (tableColGroup) {
+                insertionPos =
+                    position + tableColGroup.pos + tableColGroup.node.nodeSize + 2;
                 tr.insert(insertionPos, tableElementFooter);
             }
+            else {
+                const tableSize = (_a = node.content.firstChild) === null || _a === void 0 ? void 0 : _a.nodeSize;
+                if (tableSize) {
+                    insertionPos = position + tableSize + 2;
+                    tr.insert(insertionPos, tableElementFooter);
+                }
+            }
         }
     }
     if (dispatch && insertionPos) {

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

@@ -19,6 +19,7 @@ import { findChildrenByType, hasParentNodeOfType } from 'prosemirror-utils';
 import { addComment, createBlock, insertGeneralFootnote, insertTableFootnote, } from '../commands';
 import ReactSubView from '../views/ReactSubView';
 import { PopperManager } from './popper';
+import { isDeleted, isRejectedInsert } from './track-changes-utils';
 const popper = new PopperManager();
 const listTypes = [schema.nodes.ordered_list, schema.nodes.bullet_list];
 const readonlyTypes = [schema.nodes.keywords, schema.nodes.bibliography_element];
@@ -179,14 +180,16 @@ export class ContextMenu {
                 if (isInTable) {
                     menu.appendChild(this.createMenuSection((section) => {
                         section.appendChild(this.createMenuItem('Add Reference Note', () => {
-                            var _a;
-                            const footnotesElement = findChildrenByType(this.node, schema.nodes.footnotes_element);
-                            if (!footnotesElement.length) {
+                            var _a, _b;
+                            const footnotesElement = (_a = findChildrenByType(this.node, schema.nodes.footnotes_element).pop()) === null || _a === void 0 ? void 0 : _a.node;
+                            if (!footnotesElement ||
+                                isDeleted(footnotesElement) ||
+                                isRejectedInsert(footnotesElement)) {
                                 const { state, dispatch } = this.view;
                                 insertTableFootnote(this.node, this.getPos(), state, dispatch);
                             }
                             else {
-                                const footnotes = findChildrenByType(footnotesElement[0].node, schema.nodes.footnote).map((nodeWithPos) => {
+                                const footnotes = findChildrenByType(footnotesElement, schema.nodes.footnote).map((nodeWithPos) => {
                                     return nodeWithPos.node;
                                 });
                                 const targetDom = this.view.domAtPos(this.view.state.selection.from);
@@ -218,7 +221,7 @@ export class ContextMenu {
                                             (_a = this.props) === null || _a === void 0 ? void 0 : _a.popper.destroy();
                                         },
                                     }, this.node, this.getPos, this.view, 'table-footnote-editor');
-                                    (_a = this.props) === null || _a === void 0 ? void 0 : _a.popper.show(targetDom.node, popperContainer, 'bottom-end');
+                                    (_b = this.props) === null || _b === void 0 ? void 0 : _b.popper.show(targetDom.node, popperContainer, 'bottom-end');
                                 }
                             }
                         }));

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

@@ -127,10 +127,10 @@ export default () => {
                         }
                     }
                     if (node.type === schema.nodes.footnotes_element) {
-                        decorations.push(Decoration.node(pos, pos + node.nodeSize, {
-                            class: 'footnote-element',
-                        }));
                         if ((parent === null || parent === void 0 ? void 0 : parent.type) === schema.nodes.table_element_footer) {
+                            decorations.push(Decoration.node(pos, pos + node.nodeSize, {
+                                class: 'table-footnotes-element',
+                            }));
                             tableInlineFootnoteIds = findTableInlineFootnoteIds(state.doc.resolve(pos));
                         }
                         else {

package/dist/es/views/footnote.js

@@ -13,6 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { getChangeClasses } from '../lib/track-changes-utils';
 import BlockView from './block_view';
 import { createNodeOrElementView } from './creators';
 export class FootnoteView extends BlockView {
@@ -21,4 +22,12 @@ export class FootnoteView extends BlockView {
         this.elementType = 'div';
     }
 }
-export default createNodeOrElementView(FootnoteView, 'div');
+export const setTCClasses = (node, dom) => {
+    const dataTracked = node.attrs.dataTracked;
+    if (dataTracked === null || dataTracked === void 0 ? void 0 : dataTracked.length) {
+        const lastChange = dataTracked[dataTracked.length - 1];
+        const changeClasses = getChangeClasses([lastChange]);
+        dom.classList.add(...changeClasses);
+    }
+};
+export default createNodeOrElementView(FootnoteView, 'div', setTCClasses);

package/dist/es/views/footnote_editable.js

@@ -15,5 +15,5 @@
  */
 import { createNodeOrElementView } from './creators';
 import { EditableBlock } from './editable_block';
-import { FootnoteView } from './footnote';
-export default createNodeOrElementView(EditableBlock(FootnoteView), 'div');
+import { FootnoteView, setTCClasses } from './footnote';
+export default createNodeOrElementView(EditableBlock(FootnoteView), 'div', setTCClasses);

package/dist/es/views/footnotes_element.js

@@ -15,6 +15,7 @@
  */
 import BlockView from './block_view';
 import { createNodeOrElementView } from './creators';
+import { setTCClasses } from './footnote';
 export class FootnotesElementView extends BlockView {
     constructor() {
         super(...arguments);
@@ -30,4 +31,4 @@ export class FootnotesElementView extends BlockView {
         this.checkEditability();
     }
 }
-export default createNodeOrElementView(FootnotesElementView, 'div');
+export default createNodeOrElementView(FootnotesElementView, 'div', setTCClasses);

package/dist/es/views/footnotes_element_editable.js

@@ -15,5 +15,6 @@
  */
 import { createNodeOrElementView } from './creators';
 import { EditableBlock } from './editable_block';
+import { setTCClasses } from './footnote';
 import { FootnotesElementView } from './footnotes_element';
-export default createNodeOrElementView(EditableBlock(FootnotesElementView), 'div');
+export default createNodeOrElementView(EditableBlock(FootnotesElementView), 'div', setTCClasses);

package/dist/es/views/inline_footnote.js

@@ -13,6 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { getChangeClasses } from '../lib/track-changes-utils';
 import { BaseNodeView } from './base_node_view';
 import { createNodeView } from './creators';
 export class InlineFootnoteView extends BaseNodeView {
@@ -23,6 +24,10 @@ export class InlineFootnoteView extends BaseNodeView {
         };
         this.updateContents = () => {
             this.setDomAttrs(this.node, this.dom);
+            this.dom.className = [
+                'footnote',
+                ...getChangeClasses(this.node.attrs.dataTracked),
+            ].join(' ');
         };
         this.initialise = () => {
             this.dom = this.createDOM();

package/dist/types/views/footnote.d.ts

@@ -13,10 +13,12 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { ManuscriptNode } from '@manuscripts/transform';
 import { BaseNodeProps } from './base_node_view';
 import BlockView from './block_view';
 export declare class FootnoteView<PropsType extends BaseNodeProps> extends BlockView<PropsType> {
     elementType: string;
 }
+export declare const setTCClasses: (node: ManuscriptNode, dom: HTMLElement) => void;
 declare const _default: (props: BaseNodeProps) => import("../types").NodeViewCreator<FootnoteView<any>>;
 export default _default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "1.7.20",
+  "version": "1.7.22",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -111,4 +111,4 @@
   "resolutions": {
     "@types/react": "^17.0.2"
   }
-}
+}

package/styles/Editor.css

@@ -944,18 +944,18 @@
   padding-top: 8px;
 }
 
-.ProseMirror .table-footer .footnote-element:not(:first-child)::before {
+.ProseMirror .table-footnotes-element:not(:first-child)::before {
   content: '';
   border-bottom: 1px dashed #C9C9C9;
   display: block;
   margin-bottom: 8px;
 }
 
-.ProseMirror .table-footer .footnote-element {
+.ProseMirror .table-footnotes-element {
   counter-reset: table_footnote;
 }
 
-.ProseMirror .table-footer .footnote-element > div:not(:has(.unctied-table-footnote)) p::before  {
+.ProseMirror .table-footnotes-element > div:not(:has(.unctied-table-footnote)) p::before  {
   counter-increment: table_footnote;
   content: counter(table_footnote);
   display: inline-block;
@@ -978,7 +978,7 @@
 .table-footer > div > p {
   padding-bottom: 10px;
 }
-.ProseMirror .table-footer .footnote-element .footnote-selected {
+.ProseMirror .table-footnotes-element .footnote-selected {
   border: 1px solid #bce7f6;
 }
 .table-footer > div:has(> p.footnote-selected) > p {
@@ -998,7 +998,7 @@
   cursor: pointer;
 }
 
-.ProseMirror .footnote-element > div:has(.unctied-table-footnote) {
+.ProseMirror .table-footnotes-element > div:has(.unctied-table-footnote) {
   position: relative;
 }