@manuscripts/body-editor 1.9.20-LEAN-3535.0 → 1.9.20

package/dist/cjs/lib/popper.js

@@ -22,10 +22,8 @@ exports.PopperManager = void 0;
 const popper_js_1 = __importDefault(require("popper.js"));
 class PopperManager {
     show(target, contents, placement = 'bottom', showArrow = true, modifiers = {}) {
-        this.destroy();
-        if (contents.classList.contains('context-menu')) {
-            this.clickEventHandler = this.clickEventHandler.bind(this);
-            document.body.addEventListener('click', this.clickEventHandler);
+        if (this.activePopper) {
+            return this.destroy();
         }
         window.requestAnimationFrame(() => {
             const container = document.createElement('div');
@@ -59,17 +57,8 @@ class PopperManager {
             });
         });
     }
-    clickEventHandler(event) {
-        const editorElement = document.querySelector('.manuscript-editor');
-        const contextMenuElement = document.querySelector('.context-menu');
-        if (!(editorElement === null || editorElement === void 0 ? void 0 : editorElement.contains(event.target)) &&
-            !(contextMenuElement === null || contextMenuElement === void 0 ? void 0 : contextMenuElement.contains(event.target))) {
-            this.destroy();
-        }
-    }
     destroy() {
         if (this.activePopper) {
-            document.body.removeEventListener('click', this.clickEventHandler);
             this.removeContainerClass(this.activePopper.reference);
             this.activePopper.destroy();
             delete this.activePopper;

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

@@ -69,7 +69,6 @@ class SuggestionView {
             if ((_b = (_a = dom.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains('keyword')) {
                 return;
             }
-            console.log(dom);
             dom.addEventListener('click', this.listener);
         });
     }

package/dist/cjs/views/bibliography_element.js

@@ -45,7 +45,9 @@ const ReactSubView_1 = __importDefault(require("./ReactSubView"));
 class BibliographyElementBlockView extends block_view_1.default {
     constructor() {
         super(...arguments);
+        this.clickedElementId = null;
         this.showPopper = (id) => {
+            this.props.popper.destroy();
             const bib = (0, bibliography_1.getBibliographyPluginState)(this.view.state);
             if (!bib) {
                 return;
@@ -69,6 +71,8 @@ class BibliographyElementBlockView extends block_view_1.default {
             this.props.setComment((0, transform_1.buildComment)(citationId));
         };
         this.showContextMenu = (elementId) => {
+            this.props.popper.destroy();
+            this.clickedElementId = null;
             const can = this.props.getCapabilities();
             const element = document.getElementById(elementId);
             const componentProps = {
@@ -91,6 +95,7 @@ class BibliographyElementBlockView extends block_view_1.default {
         };
         this.onClickHandler = (elementId, dataTracked) => {
             var _a;
+            this.clickedElementId = elementId;
             const isSelectedSuggestion = !!((_a = selected_suggestion_ui_1.selectedSuggestionKey
                 .getState(this.view.state)) === null || _a === void 0 ? void 0 : _a.find(this.getPos(), this.getPos() + this.node.nodeSize).length);
             const { tr, doc } = this.view.state;
@@ -102,9 +107,11 @@ class BibliographyElementBlockView extends block_view_1.default {
                 if (isSelectedSuggestion) {
                     tr.setMeta(selected_suggestion_ui_1.CLEAR_SUGGESTION_ID, true);
                 }
+                else {
+                    this.showContextMenu(elementId);
+                }
             }
             this.view.dispatch(tr);
-            this.showContextMenu(elementId);
         };
         this.updateContents = () => __awaiter(this, void 0, void 0, function* () {
             this.props.popper.destroy();
@@ -157,9 +164,7 @@ class BibliographyElementBlockView extends block_view_1.default {
                     element.classList.add('selected-suggestion');
                 }
                 if (can.seeReferencesButtons) {
-                    element.addEventListener('click', () => {
-                        this.onClickHandler(element.id, dataTracked);
-                    });
+                    element.addEventListener('click', () => this.onClickHandler(element.id, dataTracked));
                 }
                 wrapper.append(element);
             }
@@ -170,6 +175,9 @@ class BibliographyElementBlockView extends block_view_1.default {
             else {
                 this.container.appendChild(wrapper);
             }
+            if (this.clickedElementId) {
+                this.showContextMenu(this.clickedElementId);
+            }
         });
         this.createElement = () => {
             this.container = document.createElement('div');

package/dist/cjs/views/citation.js

@@ -27,7 +27,6 @@ class CitationView extends base_node_view_1.BaseNodeView {
     constructor() {
         super(...arguments);
         this.ignoreMutation = () => true;
-        this.wasUpdated = false;
         this.initialise = () => {
             if (!this.node.type.spec.toDOM) {
                 throw Error(`Node view ${this.node.type} doesn't have toDOM method`);
@@ -60,13 +59,6 @@ class CitationView extends base_node_view_1.BaseNodeView {
             this.dom.appendChild(element);
             (0, comment_annotation_1.addCommentToLeafNode)(this.getPos(), this.getPos() + this.node.nodeSize, this.view.state, this.dom);
             this.setDomAttrs(this.node, this.dom, ['rids', 'contents', 'selectedText']);
-            if (!this.wasUpdated) {
-                this.dom.addEventListener('click', () => this.onClickHandler());
-            }
-            this.wasUpdated = true;
-            this.props.popper.update();
-        };
-        this.onClickHandler = () => {
         };
     }
 }

package/dist/cjs/views/citation_editable.js

@@ -47,18 +47,17 @@ class CitationEditableView extends citation_1.CitationView {
                 element.classList.contains('comment-icon') ||
                 ((_a = element.parentElement) === null || _a === void 0 ? void 0 : _a.classList.contains('comment-icon')));
         };
-        this.onClickHandler = () => {
+        this.selectNode = () => {
             var _a;
             const can = this.props.getCapabilities();
             const dataTracked = this.node.attrs.dataTracked;
             const isSelectedSuggestion = !!((_a = selected_suggestion_ui_1.selectedSuggestionKey
                 .getState(this.view.state)) === null || _a === void 0 ? void 0 : _a.find(this.getPos(), this.getPos() + this.node.nodeSize).length);
-            const { tr, doc } = this.view.state;
-            tr.setSelection(prosemirror_state_1.NodeSelection.create(doc, this.getPos()));
+            this.dom.classList.add('ProseMirror-selectednode');
             if (dataTracked && !isSelectedSuggestion) {
-                tr.setMeta(selected_suggestion_ui_1.SET_SUGGESTION_ID, dataTracked[0].id);
+                this.view.dispatch(this.view.state.tr.setMeta(selected_suggestion_ui_1.SET_SUGGESTION_ID, dataTracked[0].id));
             }
-            if (can.seeReferencesButtons && !(0, track_changes_utils_1.isDeleted)(this.node)) {
+            else if (can.seeReferencesButtons && !(0, track_changes_utils_1.isDeleted)(this.node)) {
                 const attrs = (0, track_changes_utils_1.getActualAttrs)(this.node);
                 if (!attrs.rids.length) {
                     this.showPopper();
@@ -67,7 +66,10 @@ class CitationEditableView extends citation_1.CitationView {
                     this.showContextMenu();
                 }
             }
-            this.view.dispatch(tr);
+        };
+        this.deselectNode = () => {
+            this.dom.classList.remove('ProseMirror-selectednode');
+            this.props.popper.destroy();
         };
         this.destroy = () => {
             var _a;
@@ -83,9 +85,7 @@ class CitationEditableView extends citation_1.CitationView {
                 ],
             };
             this.contextMenu = (0, ReactSubView_1.default)(this.props, style_guide_1.ContextMenu, componentProps, this.node, this.getPos, this.view, 'context-menu');
-            setTimeout(() => {
-                this.props.popper.show(this.dom, this.contextMenu, 'right-start', false);
-            }, 0);
+            this.props.popper.show(this.dom, this.contextMenu, 'right-start', false);
         };
         this.showPopper = () => {
             this.props.popper.destroy();

package/dist/cjs/views/contributors.js

@@ -179,6 +179,7 @@ class ContributorsView extends block_view_1.default {
         };
         this.onClickHandler = (elementId, dataTracked) => {
             var _a;
+            this.props.popper.destroy();
             const isSelectedSuggestion = !!((_a = selected_suggestion_ui_1.selectedSuggestionKey
                 .getState(this.view.state)) === null || _a === void 0 ? void 0 : _a.find(this.getPos(), this.getPos() + this.node.nodeSize).length);
             const { tr, doc } = this.view.state;
@@ -191,11 +192,11 @@ class ContributorsView extends block_view_1.default {
                     tr.setMeta(selected_suggestion_ui_1.CLEAR_SUGGESTION_ID, true);
                 }
             }
-            this.view.dispatch(tr);
             if (!((dataTracked === null || dataTracked === void 0 ? void 0 : dataTracked.operation) === track_changes_plugin_1.CHANGE_OPERATION.delete &&
                 (dataTracked === null || dataTracked === void 0 ? void 0 : dataTracked.status) !== track_changes_plugin_1.CHANGE_STATUS.rejected)) {
                 this.showContextMenu(elementId);
             }
+            this.view.dispatch(tr);
         };
         this.showContextMenu = (elementId) => {
             this.props.popper.destroy();

package/dist/cjs/views/cross_reference_editable.js

@@ -54,7 +54,7 @@ class CrossReferenceEditableView extends cross_reference_1.CrossReferenceView {
                 currentCustomLabel: this.node.attrs.customLabel,
             };
             this.popperContainer = (0, ReactSubView_1.default)(this.props, CrossReferenceItems_1.CrossReferenceItems, componentProps, this.node, this.getPos, this.view, 'cross-reference-editor');
-            this.props.popper.show(this.dom, this.popperContainer, 'right');
+            this.props.popper.show(this.dom, this.popperContainer, 'auto');
         };
         this.destroy = () => {
             var _a;

package/dist/es/lib/popper.js

@@ -16,10 +16,8 @@
 import Popper from 'popper.js';
 export class PopperManager {
     show(target, contents, placement = 'bottom', showArrow = true, modifiers = {}) {
-        this.destroy();
-        if (contents.classList.contains('context-menu')) {
-            this.clickEventHandler = this.clickEventHandler.bind(this);
-            document.body.addEventListener('click', this.clickEventHandler);
+        if (this.activePopper) {
+            return this.destroy();
         }
         window.requestAnimationFrame(() => {
             const container = document.createElement('div');
@@ -53,17 +51,8 @@ export class PopperManager {
             });
         });
     }
-    clickEventHandler(event) {
-        const editorElement = document.querySelector('.manuscript-editor');
-        const contextMenuElement = document.querySelector('.context-menu');
-        if (!(editorElement === null || editorElement === void 0 ? void 0 : editorElement.contains(event.target)) &&
-            !(contextMenuElement === null || contextMenuElement === void 0 ? void 0 : contextMenuElement.contains(event.target))) {
-            this.destroy();
-        }
-    }
     destroy() {
         if (this.activePopper) {
-            document.body.removeEventListener('click', this.clickEventHandler);
             this.removeContainerClass(this.activePopper.reference);
             this.activePopper.destroy();
             delete this.activePopper;

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

@@ -66,7 +66,6 @@ class SuggestionView {
             if ((_b = (_a = dom.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains('keyword')) {
                 return;
             }
-            console.log(dom);
             dom.addEventListener('click', this.listener);
         });
     }

package/dist/es/views/bibliography_element.js

@@ -39,7 +39,9 @@ import ReactSubView from './ReactSubView';
 export class BibliographyElementBlockView extends BlockView {
     constructor() {
         super(...arguments);
+        this.clickedElementId = null;
         this.showPopper = (id) => {
+            this.props.popper.destroy();
             const bib = getBibliographyPluginState(this.view.state);
             if (!bib) {
                 return;
@@ -63,6 +65,8 @@ export class BibliographyElementBlockView extends BlockView {
             this.props.setComment(buildComment(citationId));
         };
         this.showContextMenu = (elementId) => {
+            this.props.popper.destroy();
+            this.clickedElementId = null;
             const can = this.props.getCapabilities();
             const element = document.getElementById(elementId);
             const componentProps = {
@@ -85,6 +89,7 @@ export class BibliographyElementBlockView extends BlockView {
         };
         this.onClickHandler = (elementId, dataTracked) => {
             var _a;
+            this.clickedElementId = elementId;
             const isSelectedSuggestion = !!((_a = selectedSuggestionKey
                 .getState(this.view.state)) === null || _a === void 0 ? void 0 : _a.find(this.getPos(), this.getPos() + this.node.nodeSize).length);
             const { tr, doc } = this.view.state;
@@ -96,9 +101,11 @@ export class BibliographyElementBlockView extends BlockView {
                 if (isSelectedSuggestion) {
                     tr.setMeta(CLEAR_SUGGESTION_ID, true);
                 }
+                else {
+                    this.showContextMenu(elementId);
+                }
             }
             this.view.dispatch(tr);
-            this.showContextMenu(elementId);
         };
         this.updateContents = () => __awaiter(this, void 0, void 0, function* () {
             this.props.popper.destroy();
@@ -151,9 +158,7 @@ export class BibliographyElementBlockView extends BlockView {
                     element.classList.add('selected-suggestion');
                 }
                 if (can.seeReferencesButtons) {
-                    element.addEventListener('click', () => {
-                        this.onClickHandler(element.id, dataTracked);
-                    });
+                    element.addEventListener('click', () => this.onClickHandler(element.id, dataTracked));
                 }
                 wrapper.append(element);
             }
@@ -164,6 +169,9 @@ export class BibliographyElementBlockView extends BlockView {
             else {
                 this.container.appendChild(wrapper);
             }
+            if (this.clickedElementId) {
+                this.showContextMenu(this.clickedElementId);
+            }
         });
         this.createElement = () => {
             this.container = document.createElement('div');

package/dist/es/views/citation.js

@@ -24,7 +24,6 @@ export class CitationView extends BaseNodeView {
     constructor() {
         super(...arguments);
         this.ignoreMutation = () => true;
-        this.wasUpdated = false;
         this.initialise = () => {
             if (!this.node.type.spec.toDOM) {
                 throw Error(`Node view ${this.node.type} doesn't have toDOM method`);
@@ -57,13 +56,6 @@ export class CitationView extends BaseNodeView {
             this.dom.appendChild(element);
             addCommentToLeafNode(this.getPos(), this.getPos() + this.node.nodeSize, this.view.state, this.dom);
             this.setDomAttrs(this.node, this.dom, ['rids', 'contents', 'selectedText']);
-            if (!this.wasUpdated) {
-                this.dom.addEventListener('click', () => this.onClickHandler());
-            }
-            this.wasUpdated = true;
-            this.props.popper.update();
-        };
-        this.onClickHandler = () => {
         };
     }
 }

package/dist/es/views/citation_editable.js

@@ -15,7 +15,7 @@
  */
 import { ContextMenu } from '@manuscripts/style-guide';
 import { buildComment, schema, } from '@manuscripts/transform';
-import { NodeSelection, TextSelection } from 'prosemirror-state';
+import { TextSelection } from 'prosemirror-state';
 import { findChildrenByType } from 'prosemirror-utils';
 import { CitationEditor, } from '../components/references/CitationEditor';
 import { CitationViewer, } from '../components/references/CitationViewer';
@@ -41,18 +41,17 @@ export class CitationEditableView extends CitationView {
                 element.classList.contains('comment-icon') ||
                 ((_a = element.parentElement) === null || _a === void 0 ? void 0 : _a.classList.contains('comment-icon')));
         };
-        this.onClickHandler = () => {
+        this.selectNode = () => {
             var _a;
             const can = this.props.getCapabilities();
             const dataTracked = this.node.attrs.dataTracked;
             const isSelectedSuggestion = !!((_a = selectedSuggestionKey
                 .getState(this.view.state)) === null || _a === void 0 ? void 0 : _a.find(this.getPos(), this.getPos() + this.node.nodeSize).length);
-            const { tr, doc } = this.view.state;
-            tr.setSelection(NodeSelection.create(doc, this.getPos()));
+            this.dom.classList.add('ProseMirror-selectednode');
             if (dataTracked && !isSelectedSuggestion) {
-                tr.setMeta(SET_SUGGESTION_ID, dataTracked[0].id);
+                this.view.dispatch(this.view.state.tr.setMeta(SET_SUGGESTION_ID, dataTracked[0].id));
             }
-            if (can.seeReferencesButtons && !isDeleted(this.node)) {
+            else if (can.seeReferencesButtons && !isDeleted(this.node)) {
                 const attrs = getActualAttrs(this.node);
                 if (!attrs.rids.length) {
                     this.showPopper();
@@ -61,7 +60,10 @@ export class CitationEditableView extends CitationView {
                     this.showContextMenu();
                 }
             }
-            this.view.dispatch(tr);
+        };
+        this.deselectNode = () => {
+            this.dom.classList.remove('ProseMirror-selectednode');
+            this.props.popper.destroy();
         };
         this.destroy = () => {
             var _a;
@@ -77,9 +79,7 @@ export class CitationEditableView extends CitationView {
                 ],
             };
             this.contextMenu = ReactSubView(this.props, ContextMenu, componentProps, this.node, this.getPos, this.view, 'context-menu');
-            setTimeout(() => {
-                this.props.popper.show(this.dom, this.contextMenu, 'right-start', false);
-            }, 0);
+            this.props.popper.show(this.dom, this.contextMenu, 'right-start', false);
         };
         this.showPopper = () => {
             this.props.popper.destroy();

package/dist/es/views/contributors.js

@@ -173,6 +173,7 @@ export class ContributorsView extends BlockView {
         };
         this.onClickHandler = (elementId, dataTracked) => {
             var _a;
+            this.props.popper.destroy();
             const isSelectedSuggestion = !!((_a = selectedSuggestionKey
                 .getState(this.view.state)) === null || _a === void 0 ? void 0 : _a.find(this.getPos(), this.getPos() + this.node.nodeSize).length);
             const { tr, doc } = this.view.state;
@@ -185,11 +186,11 @@ export class ContributorsView extends BlockView {
                     tr.setMeta(CLEAR_SUGGESTION_ID, true);
                 }
             }
-            this.view.dispatch(tr);
             if (!((dataTracked === null || dataTracked === void 0 ? void 0 : dataTracked.operation) === CHANGE_OPERATION.delete &&
                 (dataTracked === null || dataTracked === void 0 ? void 0 : dataTracked.status) !== CHANGE_STATUS.rejected)) {
                 this.showContextMenu(elementId);
             }
+            this.view.dispatch(tr);
         };
         this.showContextMenu = (elementId) => {
             this.props.popper.destroy();

package/dist/es/views/cross_reference_editable.js

@@ -48,7 +48,7 @@ export class CrossReferenceEditableView extends CrossReferenceView {
                 currentCustomLabel: this.node.attrs.customLabel,
             };
             this.popperContainer = ReactSubView(this.props, CrossReferenceItems, componentProps, this.node, this.getPos, this.view, 'cross-reference-editor');
-            this.props.popper.show(this.dom, this.popperContainer, 'right');
+            this.props.popper.show(this.dom, this.popperContainer, 'auto');
         };
         this.destroy = () => {
             var _a;

package/dist/types/lib/popper.d.ts

@@ -17,7 +17,6 @@ import Popper from 'popper.js';
 export declare class PopperManager {
     protected activePopper?: Popper;
     show(target: Element, contents: HTMLElement, placement?: Popper.Placement, showArrow?: boolean, modifiers?: Popper.Modifiers): void;
-    clickEventHandler(event: Event): void;
     destroy(): void;
     update(): void;
     private focusInput;

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

@@ -24,6 +24,7 @@ export declare class BibliographyElementBlockView<PropsType extends Bibliography
     private container;
     private editor;
     private contextMenu;
+    private clickedElementId;
     showPopper: (id: string) => void;
     stopEvent: () => boolean;
     ignoreMutation: () => boolean;

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

@@ -17,10 +17,8 @@ import { ManuscriptNodeView } from '@manuscripts/transform';
 import { BaseNodeProps, BaseNodeView } from './base_node_view';
 export declare class CitationView<PropsType extends BaseNodeProps> extends BaseNodeView<PropsType> implements ManuscriptNodeView {
     ignoreMutation: () => boolean;
-    wasUpdated: boolean;
     initialise: () => this;
     updateContents: () => void;
-    onClickHandler: () => void;
 }
 declare const _default: (props: BaseNodeProps, dispatch?: import("..").Dispatch | undefined) => import("../types").NodeViewCreator<CitationView<any>>;
 export default _default;

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

@@ -19,7 +19,8 @@ export declare class CitationEditableView extends CitationView<EditableBlockProp
     private editor;
     private contextMenu;
     stopEvent: (event: Event) => boolean;
-    onClickHandler: () => void;
+    selectNode: () => void;
+    deselectNode: () => void;
     destroy: () => void;
     showContextMenu: () => void;
     showPopper: () => void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "1.9.20-LEAN-3535.0",
+  "version": "1.9.20",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",

package/styles/popper.css

@@ -200,10 +200,15 @@
   position: relative;
   width: 600px;
 }
+
 .popper .table-footnote-editor {
   width: 600px;
 }
 
+.popper .cross-reference-editor {
+  position: relative;
+}
+
 .popper .cross-reference-editor,
 .popper .equation-editor,
 .popper .link-editor {