@manuscripts/body-editor 1.6.6 → 1.6.7-LEAN-3083-3

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

@@ -25,6 +25,7 @@ const prosemirror_dropcursor_1 = require("prosemirror-dropcursor");
 const prosemirror_history_1 = require("prosemirror-history");
 const prosemirror_tables_1 = require("prosemirror-tables");
 const keys_1 = __importDefault(require("../keys"));
+const affiliations_1 = __importDefault(require("../plugins/affiliations"));
 const bibliography_1 = __importDefault(require("../plugins/bibliography"));
 const comment_annotation_1 = __importDefault(require("../plugins/comment_annotation"));
 const elements_1 = __importDefault(require("../plugins/elements"));
@@ -57,6 +58,7 @@ exports.default = (props) => {
         (0, keywords_1.default)(props),
         (0, bibliography_1.default)(props),
         (0, objects_1.default)(props),
+        (0, affiliations_1.default)(),
         (0, comment_annotation_1.default)(props),
         (0, paragraphs_1.default)(),
         (0, placeholder_1.default)(),

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

@@ -18,6 +18,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const affiliation_1 = __importDefault(require("../views/affiliation"));
+const affiliations_1 = __importDefault(require("../views/affiliations"));
 const bibliography_element_editable_1 = __importDefault(require("../views/bibliography_element_editable"));
 const blockquote_element_editable_1 = __importDefault(require("../views/blockquote_element_editable"));
 const bullet_list_editable_1 = __importDefault(require("../views/bullet_list_editable"));
@@ -57,6 +59,8 @@ exports.default = (props, dispatch) => {
         citation: (0, citation_editable_1.default)(props),
         cross_reference: (0, cross_reference_editable_1.default)(props),
         contributors: (0, contributors_1.default)(props, dispatch),
+        affiliations: (0, affiliations_1.default)(props, dispatch),
+        affiliation: (0, affiliation_1.default)(props, dispatch),
         equation: (0, equation_editable_1.default)(props),
         equation_element: (0, equation_element_editable_1.default)(props),
         figure: (0, figure_editable_1.default)(props, dispatch),

package/dist/cjs/plugins/affiliations.js

@@ -0,0 +1,94 @@
+"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.buildPluginState = exports.affiliationsKey = void 0;
+const transform_1 = require("@manuscripts/transform");
+const prosemirror_state_1 = require("prosemirror-state");
+const prosemirror_view_1 = require("prosemirror-view");
+const track_changes_utils_1 = require("../lib/track-changes-utils");
+exports.affiliationsKey = new prosemirror_state_1.PluginKey('affiliations');
+const buildPluginState = (doc) => {
+    const contributors = [];
+    const affiliations = [];
+    doc.descendants((node, pos) => {
+        if ((0, track_changes_utils_1.isDeleted)(node)) {
+            return;
+        }
+        if ((0, transform_1.isAffiliationNode)(node)) {
+            affiliations.push([node, pos]);
+        }
+        if ((0, transform_1.isContributorNode)(node)) {
+            contributors.push([node, pos]);
+        }
+    });
+    const iAffiliations = new Set();
+    contributors
+        .map(([node]) => node)
+        .sort((a, b) => {
+        return Number(a.attrs.priority) - Number(b.attrs.priority);
+    })
+        .forEach((author) => {
+        author.attrs.affiliations.forEach((aff) => {
+            iAffiliations.add(aff);
+        });
+    });
+    const indexedAffiliationIds = new Map([...iAffiliations].map((id, i) => [id, i + 1]));
+    return {
+        indexedAffiliationIds,
+        contributors,
+    };
+};
+exports.buildPluginState = buildPluginState;
+let count = 0;
+exports.default = () => {
+    return new prosemirror_state_1.Plugin({
+        key: exports.affiliationsKey,
+        state: {
+            init(config, instance) {
+                return (0, exports.buildPluginState)(instance.doc);
+            },
+            apply(tr, value, oldState, newState) {
+                const prevPluginState = exports.affiliationsKey.getState(oldState);
+                if (!tr.docChanged && prevPluginState) {
+                    return prevPluginState;
+                }
+                else {
+                    return (0, exports.buildPluginState)(newState.doc);
+                }
+            },
+        },
+        props: {
+            decorations: (state) => {
+                const decorations = [];
+                const allNodes = [];
+                state.doc.descendants((node, pos) => {
+                    if ((0, transform_1.isAffiliationNode)(node) || (0, transform_1.isContributorNode)(node)) {
+                        allNodes.push([node, pos]);
+                    }
+                });
+                if (allNodes.length) {
+                    allNodes.forEach(([node, pos]) => {
+                        decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {}, {
+                            refresh: count++,
+                        }));
+                    });
+                }
+                return prosemirror_view_1.DecorationSet.create(state.doc, decorations);
+            },
+        },
+    });
+};

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

@@ -54,7 +54,6 @@ const buildPluginState = (doc) => {
     const decorations = prosemirror_view_1.DecorationSet.create(doc, highlights.map((h) => prosemirror_view_1.Decoration.inline(h.start, h.end, {
         nodeName: 'span',
         class: 'highlight',
-        style: `background: rgba(250, 224, 150, 0.6)`,
     })));
     return { highlights, decorations };
 };

package/dist/cjs/views/affiliation.js

@@ -0,0 +1,74 @@
+"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.AffiliationView = void 0;
+const affiliations_1 = require("../plugins/affiliations");
+const base_node_view_1 = require("./base_node_view");
+const creators_1 = require("./creators");
+class AffiliationView extends base_node_view_1.BaseNodeView {
+    constructor() {
+        super(...arguments);
+        this.initialise = () => {
+            this.createDOM();
+        };
+        this.updateContents = () => {
+            var _a;
+            const attrs = this.node.attrs;
+            const pluginState = affiliations_1.affiliationsKey.getState(this.view.state);
+            this.dom.innerHTML = this.formatAddress(attrs);
+            if (pluginState === null || pluginState === void 0 ? void 0 : pluginState.indexedAffiliationIds) {
+                const order = pluginState.indexedAffiliationIds.get(attrs.id);
+                this.dom.innerHTML = order
+                    ? order + ' ' + this.dom.innerHTML
+                    : this.dom.innerHTML;
+                this.dom.setAttribute('style', 'order: ' + (order || 0));
+            }
+            if ((_a = attrs.dataTracked) === null || _a === void 0 ? void 0 : _a.length) {
+                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-status');
+                this.dom.removeAttribute('data-track-type');
+            }
+        };
+        this.createDOM = () => {
+            this.dom = document.createElement('div');
+            this.dom.classList.add('affiliation');
+            this.dom.setAttribute('id', this.node.attrs.id);
+            this.updateContents();
+        };
+        this.ignoreMutation = () => true;
+        this.stopEvent = () => true;
+        this.formatAddress = (affiliation) => {
+            const { department, institution, addressLine1, city, county, country, postCode, } = affiliation;
+            return [
+                department,
+                institution,
+                addressLine1,
+                city,
+                county,
+                country,
+                postCode,
+            ]
+                .filter(Boolean)
+                .join(', ');
+        };
+    }
+}
+exports.AffiliationView = AffiliationView;
+exports.default = (0, creators_1.createNodeView)(AffiliationView);

package/dist/cjs/views/affiliations.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AffiliationsView = void 0;
+const block_view_1 = __importDefault(require("./block_view"));
+const creators_1 = require("./creators");
+class AffiliationsView extends block_view_1.default {
+    constructor() {
+        super(...arguments);
+        this.ignoreMutation = () => true;
+        this.stopEvent = () => true;
+    }
+}
+exports.AffiliationsView = AffiliationsView;
+exports.default = (0, creators_1.createNodeView)(AffiliationsView);

package/dist/cjs/views/contributors.js

@@ -4,32 +4,163 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContributorsView = void 0;
-const base_node_view_1 = require("./base_node_view");
+const style_guide_1 = require("@manuscripts/style-guide");
+const transform_1 = require("@manuscripts/transform");
+const affiliations_1 = require("../plugins/affiliations");
+const block_view_1 = __importDefault(require("./block_view"));
 const creators_1 = require("./creators");
 const ReactSubView_1 = __importDefault(require("./ReactSubView"));
-class ContributorsView extends base_node_view_1.BaseNodeView {
+class ContributorsView extends block_view_1.default {
     constructor() {
         super(...arguments);
         this.initialise = () => {
             this.createDOM();
+            this.createGutter('block-gutter', this.gutterButtons().filter(Boolean));
+            this.createElement();
+            this.createGutter('action-gutter', this.actionGutterButtons().filter(Boolean));
+            this.updateContents();
+        };
+        this.updateContents = () => {
+            this.updateClasses();
+            this.updateAttributes();
+            this.container.innerHTML = '';
+            this.buildAuthors();
+            this.createEditButton();
+            this.createLegend();
+        };
+        this.buildAuthors = () => {
+            var _a;
+            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) => {
+                if ((0, transform_1.isContributorNode)(node)) {
+                    authors.push(node);
+                }
+            });
+            authors
+                .sort((a, b) => Number(a.attrs.priority) - Number(b.attrs.priority))
+                .forEach((author, i) => {
+                const jointAuthors = this.isJointFirstAuthor(authors, i);
+                authorsWrapper.appendChild(this.buildAuthor(author, jointAuthors));
+            });
+            this.container.appendChild(authorsWrapper);
+        };
+        this.buildAuthor = (node, isJointFirstAuthor) => {
+            var _a;
+            const pluginState = affiliations_1.affiliationsKey.getState(this.view.state);
+            const attrs = node.attrs;
+            const container = document.createElement('button');
+            container.classList.add('contributor');
+            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-status', attrs.dataTracked[0].status);
+                container.setAttribute('data-track-op', attrs.dataTracked[0].operation);
+            }
+            else {
+                container.removeAttribute('data-track-status');
+                container.removeAttribute('data-track-type');
+            }
+            const can = this.props.getCapabilities();
+            const disableEditButton = !can.editMetadata;
+            const { bibliographicName, isCorresponding, email, id } = attrs;
+            container.addEventListener('click', (e) => {
+                e.preventDefault();
+                if (!disableEditButton) {
+                    this.props.openAuthorEditing();
+                    this.props.selectAuthorForEditing(id);
+                }
+            });
+            const name = this.buildNameLiteral(bibliographicName);
+            container.innerHTML = isCorresponding && email ? `${name} (${email})` : name;
+            let noteText = '';
+            if (pluginState === null || pluginState === void 0 ? void 0 : pluginState.indexedAffiliationIds) {
+                attrs.affiliations.map((af) => {
+                    const index = pluginState === null || pluginState === void 0 ? void 0 : pluginState.indexedAffiliationIds.get(af);
+                    if (index) {
+                        noteText += index.toString();
+                    }
+                });
+            }
+            if (isJointFirstAuthor) {
+                container.appendChild(this.createNote('†', 'Joint contributor'));
+            }
+            if (noteText) {
+                container.appendChild(this.createNote(noteText));
+            }
+            if (attrs.isCorresponding) {
+                container.appendChild(this.createNote('*', 'Corresponding author'));
+            }
+            return container;
+        };
+        this.initials = (given) => given
+            ? given
+                .trim()
+                .split(' ')
+                .map((part) => part.substr(0, 1).toUpperCase() + '.')
+                .join('')
+            : '';
+        this.buildNameLiteral = ({ given = '', family = '', suffix = '' }) => {
+            if (!given && !family) {
+                return 'Unknown Author';
+            }
+            return [this.initials(given), family, suffix]
+                .filter((part) => part)
+                .join(' ');
+        };
+        this.isJointFirstAuthor = (authors, index) => {
+            const author = index === 0 ? authors[index] : authors[index - 1];
+            return Boolean(author.attrs.isJointContributor);
+        };
+        this.createElement = () => {
+            this.inner = document.createElement('div');
+            this.inner.classList.add('authors-container', 'block');
+            this.dom.appendChild(this.inner);
+            this.container = document.createElement('div');
+            this.container.classList.add('contributors');
+            this.inner.appendChild(this.container);
         };
         this.createDOM = () => {
             this.dom = document.createElement('div');
-            this.dom.classList.add('contributors');
+            this.dom.classList.add('block-container', `block-${this.node.type.name}`);
+        };
+        this.createEditButton = () => {
             const can = this.props.getCapabilities();
-            const { components: { AuthorsInlineViewContainer }, subscribeStore, } = this.props;
-            this.metadata = (0, ReactSubView_1.default)(this.props, AuthorsInlineViewContainer, {
-                showAuthorEditButton: true,
-                disableEditButton: !can.editMetadata,
-                subscribe: subscribeStore,
-            }, this.node, this.getPos, this.view, 'metadata-container');
-            if (this.metadata) {
-                this.dom.appendChild(this.metadata);
+            const button = (0, ReactSubView_1.default)(this.props, style_guide_1.SecondaryButton, {
+                mini: true,
+                onClick: this.props.openAuthorEditing,
+                className: 'edit-authors-button',
+                disabled: !can.editMetadata,
+                children: 'Edit Authors',
+            }, this.node, this.getPos, this.view);
+            this.container.appendChild(button);
+        };
+        this.createLegend = () => {
+            const state = affiliations_1.affiliationsKey.getState(this.view.state);
+            if (state === null || state === void 0 ? void 0 : state.contributors) {
+                const isThereJointContributor = state.contributors.find(([contributor]) => contributor.attrs.isJointContributor);
+                if (isThereJointContributor) {
+                    const element = document.createElement('p');
+                    element.classList.add('contributors-legend');
+                    element.innerHTML =
+                        '<span class="symbol">†</span>These authors contributed equally to this work.';
+                    this.container.appendChild(element);
+                }
             }
         };
         this.ignoreMutation = () => true;
         this.stopEvent = () => true;
     }
+    createNote(text = '', title = '') {
+        const el = document.createElement('span');
+        el.innerHTML = text;
+        if (title) {
+            el.setAttribute('title', title);
+        }
+        el.classList.add('contributor-note');
+        return el;
+    }
 }
 exports.ContributorsView = ContributorsView;
 exports.default = (0, creators_1.createNodeView)(ContributorsView);

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

@@ -20,6 +20,7 @@ import { dropCursor } from 'prosemirror-dropcursor';
 import { history } from 'prosemirror-history';
 import { tableEditing } from 'prosemirror-tables';
 import keys from '../keys';
+import affiliations from '../plugins/affiliations';
 import bibliography from '../plugins/bibliography';
 import comment_annotation from '../plugins/comment_annotation';
 import elements from '../plugins/elements';
@@ -52,6 +53,7 @@ export default (props) => {
         keywords(props),
         bibliography(props),
         objects(props),
+        affiliations(),
         comment_annotation(props),
         paragraphs(),
         placeholder(),

package/dist/es/configs/editor-views.js

@@ -13,6 +13,8 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import affiliation from '../views/affiliation';
+import affiliationsSection from '../views/affiliations';
 import bibliographyElement from '../views/bibliography_element_editable';
 import blockquoteElement from '../views/blockquote_element_editable';
 import bulletList from '../views/bullet_list_editable';
@@ -52,6 +54,8 @@ export default (props, dispatch) => {
         citation: citation(props),
         cross_reference: crossReference(props),
         contributors: contributorsSection(props, dispatch),
+        affiliations: affiliationsSection(props, dispatch),
+        affiliation: affiliation(props, dispatch),
         equation: equation(props),
         equation_element: equationElement(props),
         figure: figure(props, dispatch),

package/dist/es/plugins/affiliations.js

@@ -0,0 +1,90 @@
+/*!
+ * © 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.
+ */
+import { isAffiliationNode, isContributorNode, } from '@manuscripts/transform';
+import { Plugin, PluginKey } from 'prosemirror-state';
+import { Decoration, DecorationSet } from 'prosemirror-view';
+import { isDeleted } from '../lib/track-changes-utils';
+export const affiliationsKey = new PluginKey('affiliations');
+export const buildPluginState = (doc) => {
+    const contributors = [];
+    const affiliations = [];
+    doc.descendants((node, pos) => {
+        if (isDeleted(node)) {
+            return;
+        }
+        if (isAffiliationNode(node)) {
+            affiliations.push([node, pos]);
+        }
+        if (isContributorNode(node)) {
+            contributors.push([node, pos]);
+        }
+    });
+    const iAffiliations = new Set();
+    contributors
+        .map(([node]) => node)
+        .sort((a, b) => {
+        return Number(a.attrs.priority) - Number(b.attrs.priority);
+    })
+        .forEach((author) => {
+        author.attrs.affiliations.forEach((aff) => {
+            iAffiliations.add(aff);
+        });
+    });
+    const indexedAffiliationIds = new Map([...iAffiliations].map((id, i) => [id, i + 1]));
+    return {
+        indexedAffiliationIds,
+        contributors,
+    };
+};
+let count = 0;
+export default () => {
+    return new Plugin({
+        key: affiliationsKey,
+        state: {
+            init(config, instance) {
+                return buildPluginState(instance.doc);
+            },
+            apply(tr, value, oldState, newState) {
+                const prevPluginState = affiliationsKey.getState(oldState);
+                if (!tr.docChanged && prevPluginState) {
+                    return prevPluginState;
+                }
+                else {
+                    return buildPluginState(newState.doc);
+                }
+            },
+        },
+        props: {
+            decorations: (state) => {
+                const decorations = [];
+                const allNodes = [];
+                state.doc.descendants((node, pos) => {
+                    if (isAffiliationNode(node) || isContributorNode(node)) {
+                        allNodes.push([node, pos]);
+                    }
+                });
+                if (allNodes.length) {
+                    allNodes.forEach(([node, pos]) => {
+                        decorations.push(Decoration.node(pos, pos + node.nodeSize, {}, {
+                            refresh: count++,
+                        }));
+                    });
+                }
+                return DecorationSet.create(state.doc, decorations);
+            },
+        },
+    });
+};

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

@@ -48,7 +48,6 @@ const buildPluginState = (doc) => {
     const decorations = DecorationSet.create(doc, highlights.map((h) => Decoration.inline(h.start, h.end, {
         nodeName: 'span',
         class: 'highlight',
-        style: `background: rgba(250, 224, 150, 0.6)`,
     })));
     return { highlights, decorations };
 };

package/dist/es/views/affiliation.js

@@ -0,0 +1,70 @@
+/*!
+ * © 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.
+ */
+import { affiliationsKey } from '../plugins/affiliations';
+import { BaseNodeView } from './base_node_view';
+import { createNodeView } from './creators';
+export class AffiliationView extends BaseNodeView {
+    constructor() {
+        super(...arguments);
+        this.initialise = () => {
+            this.createDOM();
+        };
+        this.updateContents = () => {
+            var _a;
+            const attrs = this.node.attrs;
+            const pluginState = affiliationsKey.getState(this.view.state);
+            this.dom.innerHTML = this.formatAddress(attrs);
+            if (pluginState === null || pluginState === void 0 ? void 0 : pluginState.indexedAffiliationIds) {
+                const order = pluginState.indexedAffiliationIds.get(attrs.id);
+                this.dom.innerHTML = order
+                    ? order + ' ' + this.dom.innerHTML
+                    : this.dom.innerHTML;
+                this.dom.setAttribute('style', 'order: ' + (order || 0));
+            }
+            if ((_a = attrs.dataTracked) === null || _a === void 0 ? void 0 : _a.length) {
+                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-status');
+                this.dom.removeAttribute('data-track-type');
+            }
+        };
+        this.createDOM = () => {
+            this.dom = document.createElement('div');
+            this.dom.classList.add('affiliation');
+            this.dom.setAttribute('id', this.node.attrs.id);
+            this.updateContents();
+        };
+        this.ignoreMutation = () => true;
+        this.stopEvent = () => true;
+        this.formatAddress = (affiliation) => {
+            const { department, institution, addressLine1, city, county, country, postCode, } = affiliation;
+            return [
+                department,
+                institution,
+                addressLine1,
+                city,
+                county,
+                country,
+                postCode,
+            ]
+                .filter(Boolean)
+                .join(', ');
+        };
+    }
+}
+export default createNodeView(AffiliationView);

package/dist/es/views/affiliations.js

@@ -0,0 +1,10 @@
+import BlockView from './block_view';
+import { createNodeView } from './creators';
+export class AffiliationsView extends BlockView {
+    constructor() {
+        super(...arguments);
+        this.ignoreMutation = () => true;
+        this.stopEvent = () => true;
+    }
+}
+export default createNodeView(AffiliationsView);

package/dist/es/views/contributors.js

@@ -1,28 +1,159 @@
-import { BaseNodeView } from './base_node_view';
+import { SecondaryButton } from '@manuscripts/style-guide';
+import { isContributorNode } from '@manuscripts/transform';
+import { affiliationsKey } from '../plugins/affiliations';
+import BlockView from './block_view';
 import { createNodeView } from './creators';
 import ReactSubView from './ReactSubView';
-export class ContributorsView extends BaseNodeView {
+export class ContributorsView extends BlockView {
     constructor() {
         super(...arguments);
         this.initialise = () => {
             this.createDOM();
+            this.createGutter('block-gutter', this.gutterButtons().filter(Boolean));
+            this.createElement();
+            this.createGutter('action-gutter', this.actionGutterButtons().filter(Boolean));
+            this.updateContents();
+        };
+        this.updateContents = () => {
+            this.updateClasses();
+            this.updateAttributes();
+            this.container.innerHTML = '';
+            this.buildAuthors();
+            this.createEditButton();
+            this.createLegend();
+        };
+        this.buildAuthors = () => {
+            var _a;
+            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) => {
+                if (isContributorNode(node)) {
+                    authors.push(node);
+                }
+            });
+            authors
+                .sort((a, b) => Number(a.attrs.priority) - Number(b.attrs.priority))
+                .forEach((author, i) => {
+                const jointAuthors = this.isJointFirstAuthor(authors, i);
+                authorsWrapper.appendChild(this.buildAuthor(author, jointAuthors));
+            });
+            this.container.appendChild(authorsWrapper);
+        };
+        this.buildAuthor = (node, isJointFirstAuthor) => {
+            var _a;
+            const pluginState = affiliationsKey.getState(this.view.state);
+            const attrs = node.attrs;
+            const container = document.createElement('button');
+            container.classList.add('contributor');
+            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-status', attrs.dataTracked[0].status);
+                container.setAttribute('data-track-op', attrs.dataTracked[0].operation);
+            }
+            else {
+                container.removeAttribute('data-track-status');
+                container.removeAttribute('data-track-type');
+            }
+            const can = this.props.getCapabilities();
+            const disableEditButton = !can.editMetadata;
+            const { bibliographicName, isCorresponding, email, id } = attrs;
+            container.addEventListener('click', (e) => {
+                e.preventDefault();
+                if (!disableEditButton) {
+                    this.props.openAuthorEditing();
+                    this.props.selectAuthorForEditing(id);
+                }
+            });
+            const name = this.buildNameLiteral(bibliographicName);
+            container.innerHTML = isCorresponding && email ? `${name} (${email})` : name;
+            let noteText = '';
+            if (pluginState === null || pluginState === void 0 ? void 0 : pluginState.indexedAffiliationIds) {
+                attrs.affiliations.map((af) => {
+                    const index = pluginState === null || pluginState === void 0 ? void 0 : pluginState.indexedAffiliationIds.get(af);
+                    if (index) {
+                        noteText += index.toString();
+                    }
+                });
+            }
+            if (isJointFirstAuthor) {
+                container.appendChild(this.createNote('†', 'Joint contributor'));
+            }
+            if (noteText) {
+                container.appendChild(this.createNote(noteText));
+            }
+            if (attrs.isCorresponding) {
+                container.appendChild(this.createNote('*', 'Corresponding author'));
+            }
+            return container;
+        };
+        this.initials = (given) => given
+            ? given
+                .trim()
+                .split(' ')
+                .map((part) => part.substr(0, 1).toUpperCase() + '.')
+                .join('')
+            : '';
+        this.buildNameLiteral = ({ given = '', family = '', suffix = '' }) => {
+            if (!given && !family) {
+                return 'Unknown Author';
+            }
+            return [this.initials(given), family, suffix]
+                .filter((part) => part)
+                .join(' ');
+        };
+        this.isJointFirstAuthor = (authors, index) => {
+            const author = index === 0 ? authors[index] : authors[index - 1];
+            return Boolean(author.attrs.isJointContributor);
+        };
+        this.createElement = () => {
+            this.inner = document.createElement('div');
+            this.inner.classList.add('authors-container', 'block');
+            this.dom.appendChild(this.inner);
+            this.container = document.createElement('div');
+            this.container.classList.add('contributors');
+            this.inner.appendChild(this.container);
         };
         this.createDOM = () => {
             this.dom = document.createElement('div');
-            this.dom.classList.add('contributors');
+            this.dom.classList.add('block-container', `block-${this.node.type.name}`);
+        };
+        this.createEditButton = () => {
             const can = this.props.getCapabilities();
-            const { components: { AuthorsInlineViewContainer }, subscribeStore, } = this.props;
-            this.metadata = ReactSubView(this.props, AuthorsInlineViewContainer, {
-                showAuthorEditButton: true,
-                disableEditButton: !can.editMetadata,
-                subscribe: subscribeStore,
-            }, this.node, this.getPos, this.view, 'metadata-container');
-            if (this.metadata) {
-                this.dom.appendChild(this.metadata);
+            const button = ReactSubView(this.props, SecondaryButton, {
+                mini: true,
+                onClick: this.props.openAuthorEditing,
+                className: 'edit-authors-button',
+                disabled: !can.editMetadata,
+                children: 'Edit Authors',
+            }, this.node, this.getPos, this.view);
+            this.container.appendChild(button);
+        };
+        this.createLegend = () => {
+            const state = affiliationsKey.getState(this.view.state);
+            if (state === null || state === void 0 ? void 0 : state.contributors) {
+                const isThereJointContributor = state.contributors.find(([contributor]) => contributor.attrs.isJointContributor);
+                if (isThereJointContributor) {
+                    const element = document.createElement('p');
+                    element.classList.add('contributors-legend');
+                    element.innerHTML =
+                        '<span class="symbol">†</span>These authors contributed equally to this work.';
+                    this.container.appendChild(element);
+                }
             }
         };
         this.ignoreMutation = () => true;
         this.stopEvent = () => true;
     }
+    createNote(text = '', title = '') {
+        const el = document.createElement('span');
+        el.innerHTML = text;
+        if (title) {
+            el.setAttribute('title', title);
+        }
+        el.classList.add('contributor-note');
+        return el;
+    }
 }
 export default createNodeView(ContributorsView);

package/dist/types/configs/ManuscriptsEditor.d.ts

@@ -58,6 +58,8 @@ export interface EditorProps {
     retrySync: (componentIDs: string[]) => Promise<void>;
     environment?: string;
     collabProvider?: CollabProvider;
+    openAuthorEditing: () => void;
+    selectAuthorForEditing: (authorId: string) => void;
 }
 export declare const createEditorState: (props: EditorProps) => EditorState;
 export declare const createEditorView: (props: EditorProps, root: HTMLElement, state: EditorState, dispatch: Dispatch) => EditorView;

package/dist/types/configs/editor-views.d.ts

@@ -141,6 +141,8 @@ declare const _default: (props: EditorProps, dispatch: Dispatch) => {
     citation: import("../types").NodeViewCreator<import("../views/citation_editable").CitationEditableView>;
     cross_reference: import("../types").NodeViewCreator<import("../views/cross_reference_editable").CrossReferenceEditableView>;
     contributors: import("../types").NodeViewCreator<import("../views/contributors").ContributorsView<any>>;
+    affiliations: import("../types").NodeViewCreator<import("../views/affiliations").AffiliationsView<any>>;
+    affiliation: import("../types").NodeViewCreator<import("../views/affiliation").AffiliationView<any>>;
     equation: import("../types").NodeViewCreator<import("../views/equation_editable").EquationEditableView>;
     equation_element: import("../types").NodeViewCreator<{
         gutterButtons: () => HTMLElement[];

package/dist/types/plugins/affiliations.d.ts

@@ -0,0 +1,25 @@
+/*!
+ * © 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.
+ */
+import { ContributorNode, ManuscriptNode } from '@manuscripts/transform';
+import { Plugin, PluginKey } from 'prosemirror-state';
+interface PluginState {
+    indexedAffiliationIds: Map<string, number>;
+    contributors: Array<[ContributorNode, number]>;
+}
+export declare const affiliationsKey: PluginKey<PluginState>;
+export declare const buildPluginState: (doc: ManuscriptNode) => PluginState;
+declare const _default: () => Plugin<PluginState>;
+export default _default;

package/dist/types/types.d.ts

@@ -13,6 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { TrackedAttrs } from '@manuscripts/track-changes-plugin';
 import { ManuscriptEditorState, ManuscriptEditorView, ManuscriptNode, ManuscriptNodeView, ManuscriptTransaction } from '@manuscripts/transform';
 import { Decoration } from 'prosemirror-view';
 export type EditorAction = (state: ManuscriptEditorState, dispatch?: (tr: ManuscriptTransaction) => void, view?: ManuscriptEditorView) => boolean;
@@ -24,3 +25,6 @@ export type ChangeReceiver = (op: string, id?: string, data?: ManuscriptNode | n
 export interface SyncError {
     _id: string;
 }
+export type TrackableAttributes<T extends ManuscriptNode> = T['attrs'] & {
+    dataTracked?: TrackedAttrs[];
+};

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

@@ -0,0 +1,31 @@
+/*!
+ * © 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.
+ */
+import { Capabilities } from '@manuscripts/style-guide';
+import { AffiliationNode, ManuscriptNodeView } from '@manuscripts/transform';
+import { BaseNodeProps, BaseNodeView } from './base_node_view';
+export interface Props extends BaseNodeProps {
+    getCapabilities: () => Capabilities;
+}
+export declare class AffiliationView<PropsType extends BaseNodeProps> extends BaseNodeView<PropsType> implements ManuscriptNodeView {
+    initialise: () => void;
+    updateContents: () => void;
+    protected createDOM: () => void;
+    ignoreMutation: () => boolean;
+    stopEvent: () => boolean;
+    formatAddress: (affiliation: AffiliationNode['attrs']) => string;
+}
+declare const _default: (props: BaseNodeProps, dispatch?: import("..").Dispatch | undefined) => import("../types").NodeViewCreator<AffiliationView<any>>;
+export default _default;

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

@@ -0,0 +1,8 @@
+import BlockView from './block_view';
+import { EditableBlockProps } from './editable_block';
+export declare class AffiliationsView<PropsType extends EditableBlockProps> extends BlockView<PropsType> {
+    ignoreMutation: () => boolean;
+    stopEvent: () => boolean;
+}
+declare const _default: (props: import("./base_node_view").BaseNodeProps, dispatch?: import("..").Dispatch | undefined) => import("../types").NodeViewCreator<AffiliationsView<any>>;
+export default _default;

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

@@ -1,15 +1,31 @@
-import { ManuscriptNodeView } from '@manuscripts/transform';
-import React from 'react';
-import { BaseNodeView } from './base_node_view';
+import { Capabilities } from '@manuscripts/style-guide';
+import { ContributorNode } from '@manuscripts/transform';
+import BlockView from './block_view';
 import { EditableBlockProps } from './editable_block';
 export interface ContributorsProps extends EditableBlockProps {
-    components: Record<string, React.ComponentType<unknown>>;
-    subscribeStore: unknown;
+    getCapabilities: () => Capabilities;
+    openAuthorEditing: () => void;
+    selectAuthorForEditing: (authorId: string) => void;
 }
-export declare class ContributorsView<PropsType extends ContributorsProps> extends BaseNodeView<PropsType> implements ManuscriptNodeView {
-    private metadata;
+export declare class ContributorsView<PropsType extends ContributorsProps> extends BlockView<PropsType> {
     initialise: () => void;
-    protected createDOM: () => void;
+    updateContents: () => void;
+    buildAuthors: () => void;
+    container: HTMLElement;
+    inner: HTMLElement;
+    buildAuthor: (node: ContributorNode, isJointFirstAuthor: boolean) => HTMLButtonElement;
+    createNote(text?: string, title?: string): HTMLSpanElement;
+    initials: (given: string) => string;
+    buildNameLiteral: ({ given, family, suffix }: {
+        given?: string | undefined;
+        family?: string | undefined;
+        suffix?: string | undefined;
+    }) => string;
+    isJointFirstAuthor: (authors: ContributorNode[], index: number) => boolean;
+    createElement: () => void;
+    createDOM: () => void;
+    createEditButton: () => void;
+    createLegend: () => void;
     ignoreMutation: () => boolean;
     stopEvent: () => boolean;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "1.6.6",
+  "version": "1.6.7-LEAN-3083-3",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -33,7 +33,7 @@
     "@manuscripts/library": "1.3.0",
     "@manuscripts/style-guide": "1.5.0",
     "@manuscripts/track-changes-plugin": "^1.7.5",
-    "@manuscripts/transform": "2.0.0",
+    "@manuscripts/transform": "2.0.1-LEAN-3083-5",
     "astrocite-eutils": "^0.16.4",
     "axios": "^1.2.2",
     "codemirror": "^5.58.1",

package/styles/AdvancedEditor.css

@@ -40,7 +40,11 @@ Next levels are shifted 'up' by 1
 .ProseMirror > div.body {
   counter-reset: level_1;
 }
-.ProseMirror > div.body > section:not(.toc) > .block-section_title > h1::before {
+.ProseMirror
+  > div.body
+  > section:not(.toc)
+  > .block-section_title
+  > h1::before {
   content: counter(level_1, decimal) '. ';
 }
 
@@ -90,13 +94,7 @@ Next levels are shifted 'up' by 1
   counter-increment: level_3;
   counter-reset: level_4;
 }
-.ProseMirror
-  > div
-  > section
-  > section
-  > section
-  > .block-section_title
-  > h1 {
+.ProseMirror > div > section > section > section > .block-section_title > h1 {
   font-size: 12pt !important;
   font-style: normal !important;
   font-weight: bold !important;
@@ -297,17 +295,15 @@ Next levels are shifted 'up' by 1
 }
 .ProseMirror div.backmatter::before {
   content: '';
-  border-bottom: 1px dashed #C9C9C9;
+  border-bottom: 1px dashed #c9c9c9;
   display: block;
   margin: 11pt 49pt;
-
 }
 .ProseMirror div.backmatter .block-section_title > h1 {
   font-size: 13.5pt !important;
-  color: #6E6E6E !important;
+  color: #6e6e6e !important;
 }
 
-
 .ProseMirror p.block {
   font-size: 12pt !important;
   font-style: normal !important;
@@ -550,12 +546,12 @@ Next levels are shifted 'up' by 1
 }
 
 .ProseMirror > .keywords > .block-section_title > h1 {
-    color: #353535 !important;
-    font-size: 12px !important;
-    font-style: italic !important;
-    font-weight: 400 !important;
-    line-height: 16px !important;
-    margin-top: 4px !important;
+  color: #353535 !important;
+  font-size: 12px !important;
+  font-style: italic !important;
+  font-weight: 400 !important;
+  line-height: 16px !important;
+  margin-top: 4px !important;
 }
 
 .keywords-list {
@@ -643,11 +639,6 @@ Next levels are shifted 'up' by 1
   align-items: center;
 }
 
-.ProseMirror .inserted.accepted,
-.ProseMirror .set_attrs.accepted {
-  background: #bffca7;
-  text-decoration: none;
-}
 .attrs-popper-button-active,
 .attrs-track-mark:hover .attrs-popper-button {
   display: inline-flex;
@@ -682,28 +673,66 @@ Next levels are shifted 'up' by 1
   right: 0;
 }
 
+.ProseMirror span.highlight {
+  background-color: var(--highlight-bg-color);
+}
+
+.ProseMirror {
+  --pending-bg-color: #e6f7fc;
+  --accepted-bg-color: #d1edaf;
+  --deleted-color: #f35143;
+  --highlight-bg-color: #ffeebf;
+  --selection-bg-color: #bce7f6;
+}
+
+.ProseMirror ::selection {
+  background: var(--selection-bg-color);
+}
+
 .ProseMirror .inserted.pending {
-  background: #ddf3fa;
+  background: var(--pending-bg-color);
   text-decoration: none;
 }
-.ProseMirror .inserted.pending,
-.ProseMirror .set_attrs.pending {
+.ProseMirror .inserted.accepted {
+  background: var(--accepted-bg-color);
   text-decoration: none;
 }
 .ProseMirror .inserted.rejected {
   display: none;
 }
+
+.ProseMirror .set_attrs.pending {
+  background: var(--pending-bg-color);
+  text-decoration: none;
+}
+.ProseMirror .set_attrs.accepted {
+  background: var(--accepted-bg-color);
+  text-decoration: none;
+}
+
+.ProseMirror .deleted.pending {
+  background: var(--pending-bg-color);
+  color: var(--deleted-color);
+  text-decoration: line-through;
+}
 .ProseMirror .deleted.accepted {
-  background: #bffca7;
+  background: var(--accepted-bg-color);
+  color: var(--deleted-color);
+  text-decoration: line-through;
 }
 .ProseMirror .deleted.rejected {
   text-decoration: none;
 }
+
+.affiliation[data-track-status='pending'],
+.contributor[data-track-status='pending'],
 .ProseMirror .inserted.pending,
 .ProseMirror .set_attrs.pending,
 .ProseMirror .deleted.pending {
   background: #ddf3fa;
 }
+.ProseMirror .affiliation[data-track-status='rejected'][data-track-op='insert'],
+.ProseMirror .contributor[data-track-status='rejected'][data-track-op='insert'],
 .ProseMirror figure[data-track-status='rejected'][data-track-op='insert'],
 .ProseMirror table[data-track-status='rejected'][data-track-op='insert'],
 .ProseMirror
@@ -711,6 +740,12 @@ Next levels are shifted 'up' by 1
   display: none;
 }
 
+.affiliation[data-track-status='pending'][data-track-op='delete'],
+.contributor[data-track-status='pending'][data-track-op='delete'] {
+  text-decoration: line-through;
+  background: #e6f7fc;
+}
+
 .citation-wrapper {
   position: relative;
 }
@@ -732,24 +767,79 @@ Next levels are shifted 'up' by 1
 
 .contributors {
   white-space: initial;
-  margin-bottom: 24px;
   margin-top: 24px;
+  align-items: center;
+  display: flex;
+}
+.contributors-list {
+  flex: 1 0 auto;
 }
 
 .contributors .tools-panel {
   position: initial;
 }
 
-.contributors table {
-  line-height: initial;
-  width: inherit;
+.contributor {
+  display: inline-flex;
+  background: transparent;
+  border: 0;
+  font-size: 1rem;
+  text-decoration: none;
+  color: inherit;
+  outline: none;
+}
+
+.contributor:not(:disabled):hover {
+  text-decoration: underline;
+  cursor: pointer !important;
+}
+.contributor:not(:disabled):focus {
+  text-decoration: underline;
+  cursor: pointer !important;
+}
+.contributor::after {
+  content: ', ';
+}
+.contributor:last-child::after {
+  content: '';
+}
+
+.block-affiliations {
+  margin-top: 16px;
+  color: #6e6e6e;
+  margin-bottom: 24px;
+}
+.affiliation {
+  line-height: 1.2;
+}
+.block-affiliations .block {
+  display: flex;
+  width: 100%;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.contributors-legend {
+  margin: 16px 0 0 0;
 }
 
-.contributors tr th, .contributors tr td {
-  border: none !important;
-  background: none !important;
+.contributor-legend .symbol {
+  display: inline-block;
+  font-size: 0.75em;
+  line-height: 1;
+  vertical-align: top;
 }
 
-.contributors th, .contributors td {
-  padding: initial;
+.contributors .tools-panel {
+  align-items: center;
+  display: flex;
+  margin-left: 8px;
+}
+
+.contributor-note {
+  display: inline-block;
+  font-size: 0.75em;
+  margin: 0 1px;
+  line-height: 1;
+  vertical-align: top;
 }

package/styles/Editor.css

@@ -731,7 +731,6 @@
   text-align: center;
 }
 
-
 .ProseMirror .bib-item {
   position: relative;
   margin-right: 40px;
@@ -956,7 +955,7 @@
 }
 .article-titles {
   cursor: text;
-  font-family: "PT Serif", serif;
+  font-family: 'PT Serif', serif;
   font-size: 28px;
   font-weight: 700;
   line-height: 1.43;