@manuscripts/body-editor 3.19.0 → 3.19.2

package/dist/es/lib/utils.js

@@ -15,7 +15,7 @@
  */
 import { isElementNodeType, isSectionNodeType, schema, } from '@manuscripts/transform';
 import { Fragment, } from 'prosemirror-model';
-import { findChildrenByType, findParentNode, findParentNodeOfTypeClosestToPos, } from 'prosemirror-utils';
+import { findChildren, findChildrenByType, findParentNode, findParentNodeOfTypeClosestToPos, } from 'prosemirror-utils';
 import { fieldConfigMap } from '../components/references/ReferenceForm/config';
 import { arrowDown } from '../icons';
 import { handleEnterKey } from './navigation-utils';
@@ -197,3 +197,13 @@ export const getLastTitleNode = (state) => {
     const titleNode = findChildrenByType(state.doc, state.schema.nodes.title)[0];
     return titleNode;
 };
+export const getSurroundingText = (pos, node) => {
+    const nodeContent = findChildren(pos.node(), (child) => child.attrs.id === node.attrs.id)[0];
+    const content = pos.node().content;
+    const MAX_LENGTH = 40;
+    const nodeStart = nodeContent.pos;
+    const nodeEnd = nodeContent.pos + node.nodeSize;
+    const leftHandText = content.textBetween(nodeStart > MAX_LENGTH ? nodeStart - MAX_LENGTH : 0, nodeStart);
+    const rightHandText = content.textBetween(nodeEnd, Math.min(nodeEnd + MAX_LENGTH, content.size));
+    return { leftHandText, rightHandText };
+};

package/dist/es/menus.js

@@ -26,6 +26,7 @@ import { templateAllows } from './lib/template';
 import { isEditAllowed } from './lib/utils';
 import { getEditorProps } from './plugins/editor-props';
 import { openInsertAwardModal } from './components/awards/AwardModal';
+import { openReferencesEditor } from './components/references/ReferencesEditor';
 export const getEditorMenus = (editor) => {
     const { isCommandValid, state, view } = editor;
     const doCommand = (command) => () => editor.doCommand(command);
@@ -563,6 +564,17 @@ export const getEditorMenus = (editor) => {
                 run: doCommand(insertInlineCitation),
                 isHidden: !templateAllows(state, schema.nodes.citation),
             },
+            {
+                id: 'insert-reference-section',
+                label: 'New reference',
+                shortcut: {
+                    mac: 'Option+CommandOrControl+N',
+                    pc: 'CommandOrControl+Option+N',
+                },
+                isEnabled: isEditAllowed(state),
+                run: doCommand(openReferencesEditor),
+                isHidden: !templateAllows(state, schema.nodes.bibliography_item),
+            },
             {
                 id: 'insert-cross-reference',
                 label: 'Cross-reference',

package/dist/es/plugins/cross-references.js

@@ -14,14 +14,17 @@
  * limitations under the License.
  */
 import { schema, } from '@manuscripts/transform';
-import { trackChangesPluginKey } from '@manuscripts/track-changes-plugin';
+import { trackChangesPluginKey, TrackChangesAction, } from '@manuscripts/track-changes-plugin';
 import isEqual from 'lodash/isEqual';
 import { NodeSelection, Plugin } from 'prosemirror-state';
 import { Decoration, DecorationSet } from 'prosemirror-view';
 import { openCrossRefWarningModal } from '../components/cross-ref-check-modal/openModal';
 import { objectsKey } from './objects';
+export const DELETE_WITHOUT_REF = 'delete-without-ref';
+export const SELECTED_CROSS_REF_CLASS = 'selected-cross-reference';
 let modalActive = false;
 let modalElement = null;
+let scrollTargetEl = null;
 export default () => {
     let view = null;
     return new Plugin({
@@ -40,7 +43,10 @@ export default () => {
             if (!view ||
                 !tr.docChanged ||
                 tr.getMeta(trackChangesPluginKey) ||
-                tr.getMeta('addToHistory') === false) {
+                tr.getMeta(TrackChangesAction.refreshChanges) ||
+                tr.getMeta('addToHistory') === false ||
+                tr.getMeta('collab$') ||
+                tr.getMeta(DELETE_WITHOUT_REF)) {
                 return true;
             }
             if (modalActive) {
@@ -59,6 +65,9 @@ export default () => {
                     modalElement.remove();
                     modalElement = null;
                 }
+                if (scrollTargetEl) {
+                    scrollTargetEl.classList.remove(SELECTED_CROSS_REF_CLASS);
+                }
             };
             const deletedIds = new Set(xrefGroups.map((g) => g.referenced.attrs.id));
             const onClose = () => {
@@ -149,12 +158,13 @@ function createXrefGroups(targets, stateDoc, resultDoc) {
         const xrefs = xrefsByRid.get(id);
         if (xrefs?.length) {
             const label = targets.get(referenced.attrs.id)?.label || '';
-            xrefGroups.push({ referenced, label, xrefs });
+            const caption = targets.get(referenced.attrs.id)?.caption || '';
+            xrefGroups.push({ referenced, label, caption, xrefs });
         }
     }
     return xrefGroups;
 }
-const onConfirmCreator = (view, cleanup, deletedIds, tr) => () => {
+const onConfirmCreator = (view, cleanup, deletedIds, tr) => (deleteOption) => {
     cleanup();
     if (!view) {
         return;
@@ -168,18 +178,23 @@ const onConfirmCreator = (view, cleanup, deletedIds, tr) => () => {
         }
         newTr.step(step);
     }
-    const xrefPositions = [];
-    newTr.doc.descendants((node, pos) => {
-        if (node.type === schema.nodes.cross_reference) {
-            const rids = node.attrs.rids;
-            if (rids.some((rid) => deletedIds.has(rid))) {
-                xrefPositions.push({ from: pos, to: pos + node.nodeSize });
+    if (deleteOption === 'delete-with-ref') {
+        const xrefPositions = [];
+        newTr.doc.descendants((node, pos) => {
+            if (node.type === schema.nodes.cross_reference) {
+                const rids = node.attrs.rids;
+                if (rids.some((rid) => deletedIds.has(rid))) {
+                    xrefPositions.push({ from: pos, to: pos + node.nodeSize });
+                }
             }
+        });
+        for (let i = xrefPositions.length - 1; i >= 0; i--) {
+            const { from, to } = xrefPositions[i];
+            newTr.delete(from, to);
         }
-    });
-    for (let i = xrefPositions.length - 1; i >= 0; i--) {
-        const { from, to } = xrefPositions[i];
-        newTr.delete(from, to);
+    }
+    else {
+        newTr.setMeta(DELETE_WITHOUT_REF, true);
     }
     view.dispatch(newTr);
 };
@@ -189,7 +204,6 @@ const selectAndScrollToCreator = (view) => ($pos) => {
     }
     const selTr = view.state.tr;
     selTr.setSelection(NodeSelection.create(view.state.doc, $pos.pos));
-    view.focus();
     view.dispatch(selTr);
     let scrollable = view.dom.parentElement;
     while (scrollable != null &&
@@ -212,4 +226,12 @@ const selectAndScrollToCreator = (view) => ($pos) => {
         modalElement?.classList.remove('modal-bottom');
         scrollable.scrollTo({ top: scrollTo, behavior: 'smooth' });
     }
+    const dom = view.nodeDOM($pos.pos);
+    if (dom && dom instanceof HTMLElement) {
+        dom.classList.add(SELECTED_CROSS_REF_CLASS);
+        if (scrollTargetEl && scrollTargetEl !== dom) {
+            scrollTargetEl?.classList.remove(SELECTED_CROSS_REF_CLASS);
+        }
+        scrollTargetEl = dom;
+    }
 };

package/dist/es/versions.js

@@ -1,2 +1,2 @@
-export const VERSION = '3.19.0';
+export const VERSION = '3.19.2';
 export const MATHJAX_VERSION = '3.2.2';

package/dist/es/views/ReactSubView.js

@@ -20,6 +20,7 @@ import { createRoot } from 'react-dom/client';
 import { ThemeProvider } from 'styled-components';
 function createSubView(props, Component, componentProps, node, getPos, view, classNames = []) {
     const container = document.createElement('div');
+    container.unmount = () => root.unmount();
     const Wrapped = createView(props, Component, componentProps, node, getPos, view, classNames, container);
     const root = createRoot(container);
     root.render(React.createElement(Wrapped, null));

package/dist/es/views/cross_reference.js

@@ -50,10 +50,21 @@ export class CrossReferenceView extends BaseNodeView {
         const target = attrs.rids.length ? targets.get(attrs.rids[0]) : undefined;
         const isSupplement = target?.type === schema.nodes.supplement.name;
         const derivedLabel = isSupplement
-            ? target?.caption || target?.label || ''
-            : target?.label || '';
+            ? target?.caption || target?.label || '[cross-ref]'
+            : target?.label || '[cross-ref]';
         this.dom.textContent = attrs.label || derivedLabel;
         this.dom.addEventListener('click', this.handleClick);
+        if (this.isOrphaned()) {
+            this.dom.classList.add('orphaned-cross-reference');
+        }
+        else {
+            this.dom.classList.remove('orphaned-cross-reference');
+        }
+    }
+    isOrphaned() {
+        const targets = objectsKey.getState(this.view.state);
+        const rid = this.node.attrs.rids[0];
+        return !targets?.get(rid);
     }
 }
 export default createNodeView(CrossReferenceView);

package/dist/es/views/cross_reference_editable.js

@@ -111,9 +111,7 @@ export class CrossReferenceEditableView extends CrossReferenceView {
         this.showContextMenu = () => {
             this.props.popper.destroy();
             const can = this.props.getCapabilities();
-            const targets = objectsKey.getState(this.view.state);
-            const rid = this.node.attrs.rids[0];
-            const isOrphaned = !targets?.get(rid);
+            const isOrphaned = this.isOrphaned();
             const actions = [
                 {
                     label: 'Comment',
@@ -135,7 +133,6 @@ export class CrossReferenceEditableView extends CrossReferenceView {
                     label: 'Edit',
                     icon: 'Edit',
                     action: () => this.handleEdit(),
-                    disabled: isOrphaned,
                 });
             }
             this.contextMenu = ReactSubView(this.props, ContextMenu, { actions }, this.node, this.getPos, this.view, ['context-menu']);

package/dist/types/components/authors-affiliations/AuthorsAndAffiliationsModals.d.ts

@@ -26,4 +26,4 @@ export interface AuthorsAndAffiliationsModalsProps {
     addNewAffiliation?: boolean;
 }
 export declare const AuthorsAndAffiliationsModals: React.FC<AuthorsAndAffiliationsModalsProps>;
-export declare const openAuthorsAndAffiliationsModals: (pos: number, view: ManuscriptEditorView | EditorView | undefined, initialModal: "authors" | "affiliations") => HTMLDivElement | undefined;
+export declare const openAuthorsAndAffiliationsModals: (pos: number, view: ManuscriptEditorView | EditorView | undefined, initialModal: "authors" | "affiliations") => import("../../views/ReactSubView").SubViewContainer | undefined;

package/dist/types/components/cross-ref-check-modal/CrossRefWarningModal.d.ts

@@ -14,16 +14,18 @@
  * limitations under the License.
  */
 import { ManuscriptNode } from '@manuscripts/transform';
-import React from 'react';
 import { ResolvedPos } from 'prosemirror-model';
+import React from 'react';
 export type XrefGroup = {
     referenced: ManuscriptNode;
     label: string;
+    caption: string;
     xrefs: [ManuscriptNode, ResolvedPos][];
 };
+export type DeleteOption = 'delete-without-ref' | 'delete-with-ref';
 export declare const CrossRefWarningModal: React.FC<{
     onClose: () => void;
     xrefs: XrefGroup[];
-    onConfirm: () => void;
+    onConfirm: (deleteOption: DeleteOption) => void;
     selectAndScrollTo: ($pos: ResolvedPos) => void;
 }>;

package/dist/types/components/cross-ref-check-modal/openModal.d.ts

@@ -15,5 +15,5 @@
  */
 import { ManuscriptEditorView } from '@manuscripts/transform';
 import { ResolvedPos } from 'prosemirror-model';
-import { XrefGroup } from './CrossRefWarningModal';
-export declare const openCrossRefWarningModal: (view: ManuscriptEditorView, xrefGroups: XrefGroup[], onConfirm: () => void, onClose: () => void, selectAndScrollTo: ($pos: ResolvedPos) => void) => HTMLDivElement;
+import { DeleteOption, XrefGroup } from './CrossRefWarningModal';
+export declare const openCrossRefWarningModal: (view: ManuscriptEditorView, xrefGroups: XrefGroup[], onConfirm: (deleteOption: DeleteOption) => void, onClose: () => void, selectAndScrollTo: ($pos: ResolvedPos) => void) => HTMLDivElement;

package/dist/types/components/references/ReferenceForm/ReferenceForm.d.ts

@@ -17,13 +17,13 @@ import { BibliographyItemAttrs } from '@manuscripts/transform';
 import React, { MutableRefObject } from 'react';
 export interface ReferenceFormActions {
     reset: () => void;
+    submit: () => void;
+    isDirty: () => boolean;
 }
+export declare const validateReference: (values: BibliographyItemAttrs) => Partial<BibliographyItemAttrs>;
 export declare const ReferenceForm: React.FC<{
     values: BibliographyItemAttrs;
-    showDelete: boolean;
     onChange: (values: BibliographyItemAttrs) => void;
-    onCancel: () => void;
-    onDelete: () => void;
     onSave: (values: BibliographyItemAttrs) => void;
     actionsRef?: MutableRefObject<ReferenceFormActions | undefined>;
 }>;

package/dist/types/components/references/ReferenceForm/styled-components.d.ts

@@ -243,7 +243,6 @@ export declare const Button: import("styled-components/dist/types").IStyledCompo
     as?: import("styled-components").WebTarget | undefined;
     forwardedAs?: import("styled-components").WebTarget | undefined;
 }, "$defaultColor" | "$size">>> & string;
-export declare const Actions: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
 export declare const ReferenceTextField: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import("@manuscripts/style-guide").TextFieldProps> & import("@manuscripts/style-guide").TextFieldProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import("@manuscripts/style-guide").TextFieldProps> & import("@manuscripts/style-guide").TextFieldProps, never>>, "as" | "forwardedAs"> & {
     as?: import("styled-components").WebTarget | undefined;
     forwardedAs?: import("styled-components").WebTarget | undefined;

package/dist/types/components/references/ReferencesEditor.d.ts

@@ -1,7 +1,10 @@
 import { BibliographyItemAttrs } from '@manuscripts/transform';
 import React from 'react';
 import { ReferencesModalProps } from './ReferencesModal';
+import { EditorState, Transaction } from 'prosemirror-state';
+import { EditorView } from 'prosemirror-view';
 export type ReferencesEditorProps = Omit<ReferencesModalProps, 'isOpen' | 'onCancel' | 'handleImport' | 'onSave'> & {
     onSave: (item: BibliographyItemAttrs[]) => void;
 };
 export declare const ReferencesEditor: React.FC<ReferencesEditorProps>;
+export declare const openReferencesEditor: (state: EditorState, _?: (tr: Transaction) => void, view?: EditorView) => boolean;

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

@@ -43,3 +43,7 @@ export declare const getLastTitleNode: (state: ManuscriptEditorState) => {
     node: ProseMirrorNode;
     pos: number;
 };
+export declare const getSurroundingText: (pos: ResolvedPos, node: ManuscriptNode) => {
+    leftHandText: string;
+    rightHandText: string;
+};

package/dist/types/plugins/cross-references.d.ts

@@ -15,5 +15,7 @@
  */
 import { Plugin } from 'prosemirror-state';
 import { DecorationSet } from 'prosemirror-view';
+export declare const DELETE_WITHOUT_REF = "delete-without-ref";
+export declare const SELECTED_CROSS_REF_CLASS = "selected-cross-reference";
 declare const _default: () => Plugin<DecorationSet>;
 export default _default;

package/dist/types/versions.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION = "3.19.0";
+export declare const VERSION = "3.19.2";
 export declare const MATHJAX_VERSION = "3.2.2";

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

@@ -17,6 +17,9 @@ import { ManuscriptEditorView, ManuscriptNode } from '@manuscripts/transform';
 import React from 'react';
 import { EditorProps } from '../configs/ManuscriptsEditor';
 import { Trackable } from '../types';
+export type SubViewContainer = HTMLDivElement & {
+    unmount: () => void;
+};
 export interface ReactViewComponentProps<NodeT extends ManuscriptNode> {
     nodeAttrs: NodeT['attrs'];
     setNodeAttrs: (nextAttrs: Partial<NodeT['attrs']>) => void;
@@ -25,8 +28,8 @@ export interface ReactViewComponentProps<NodeT extends ManuscriptNode> {
         getPos: () => number;
         node: ManuscriptNode | Trackable<ManuscriptNode>;
     };
-    container: HTMLDivElement;
+    container: SubViewContainer;
 }
-declare function createSubView<T extends Trackable<ManuscriptNode>>(props: EditorProps, Component: React.FC<any>, componentProps: object, node: T, getPos: () => number, view: ManuscriptEditorView, classNames?: string[]): HTMLDivElement;
+declare function createSubView<T extends Trackable<ManuscriptNode>>(props: EditorProps, Component: React.FC<any>, componentProps: object, node: T, getPos: () => number, view: ManuscriptEditorView, classNames?: string[]): SubViewContainer;
 export declare function createSubViewAsync<T extends Trackable<ManuscriptNode>>(props: EditorProps, Component: React.FC<any>, componentProps: object, node: T, getPos: () => number, view: ManuscriptEditorView, classNames?: string[]): Promise<HTMLDivElement>;
 export default createSubView;

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

@@ -22,6 +22,7 @@ export declare class CrossReferenceView extends BaseNodeView<Trackable<CrossRefe
     initialise: () => void;
     ignoreMutation: () => boolean;
     createDOM: () => void;
+    protected isOrphaned(): boolean;
 }
 declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("..").Dispatch) => import("../types").NodeViewCreator<CrossReferenceView>;
 export default _default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "3.19.0",
+  "version": "3.19.2",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -41,7 +41,7 @@
     "@citation-js/plugin-pubmed": "0.3.0",
     "@citation-js/plugin-ris": "0.7.18",
     "@iarna/word-count": "1.1.2",
-    "@manuscripts/style-guide": "3.8.0",
+    "@manuscripts/style-guide": "3.8.1",
     "@manuscripts/track-changes-plugin": "2.4.0",
     "@manuscripts/transform": "4.5.7",
     "@popperjs/core": "2.11.8",