@manuscripts/body-editor 3.12.62 → 3.12.64

package/dist/cjs/components/affiliations/AffiliationForm.js

@@ -91,7 +91,7 @@ const AffiliationForm = ({ values, onSave, onChange, actionsRef, newEntity = fal
             react_1.default.createElement(style_guide_1.FormRow, null,
                 react_1.default.createElement(formik_1.Field, { name: "department", type: "textarea" }, (props) => (react_1.default.createElement(react_1.default.Fragment, null,
                     react_1.default.createElement(UnsavedLabel_1.UnsavedLabel, { htmlFor: "department", showDot: showUnsavedDot('department') }, "Department"),
-                    react_1.default.createElement(style_guide_1.TextField, { id: "department", ...props.field, as: "textarea" }))))),
+                    react_1.default.createElement(style_guide_1.TextField, { id: "department", ...props.field }))))),
             react_1.default.createElement(style_guide_1.FormRow, null,
                 react_1.default.createElement(formik_1.Field, { name: "addressLine1" }, (props) => (react_1.default.createElement(react_1.default.Fragment, null,
                     react_1.default.createElement(UnsavedLabel_1.UnsavedLabel, { htmlFor: "addressLine1", showDot: showUnsavedDot('addressLine1') }, "Street Address"),

package/dist/cjs/components/affiliations/AffiliationsModal.js

@@ -431,6 +431,7 @@ const AddAffiliationButton = styled_components_1.default.button `
   &[data-active='true'] {
     background: ${(props) => props.theme.colors.background.fifth};
     border: 1px solid ${(props) => props.theme.colors.border.primary};
+    padding: 11px 8px 11px 12px;
     border-left: 0;
     border-right: 0;
   }

package/dist/cjs/components/affiliations/AffiliationsPanel.js

@@ -13,10 +13,10 @@ function affiliationSecondaryLine(item) {
 }
 const AffiliationsPanel = ({ items, selectedItems = [], onSelect, onOpenAffiliationsModal, }) => {
     const selectedIds = (0, GenericPanel_1.useListSelectedIds)(selectedItems);
-    return (react_1.default.createElement(GenericPanel_1.GenericPanel, { title: "Institutional Affiliations", createLabel: "Create New Affiliation", onCreate: onOpenAffiliationsModal, createDataCy: "add-affiliations-link", emptyDataCy: "affiliations-panel-empty", isEmpty: items.length === 0, emptyIcon: react_1.default.createElement(style_guide_1.InfoCircleIcon, null), emptyMessage: react_1.default.createElement(react_1.default.Fragment, null,
+    return (react_1.default.createElement(GenericPanel_1.GenericPanel, { createLabel: "New Affiliation", onCreate: onOpenAffiliationsModal, createDataCy: "add-affiliations-link", emptyDataCy: "affiliations-panel-empty", isEmpty: items.length === 0, emptyIcon: react_1.default.createElement(style_guide_1.InfoCircleIcon, null), emptyMessage: react_1.default.createElement(react_1.default.Fragment, null,
             "There are no affiliations attributed yet!",
             react_1.default.createElement("br", null),
-            "Click \u2018Create New Affiliation\u2019") },
+            "Click \u2018+ New Affiliation\u2019") },
         react_1.default.createElement(GenericPanel_1.ListItems, { "data-cy": "affiliations-panel" }, items.map((item) => (react_1.default.createElement(GenericPanel_1.ListItem, { key: item.id, selected: selectedIds.has(item.id), onClick: () => onSelect(item.id), primary: item.institution, secondary: affiliationSecondaryLine(item) }))))));
 };
 exports.AffiliationsPanel = AffiliationsPanel;

package/dist/cjs/components/affiliations/CreateAffiliationModal.js

@@ -89,8 +89,8 @@ const CreateAffiliationModal = ({ affiliationsCount, onSave, onClose, }) => {
                 react_1.default.createElement(style_guide_1.CloseButton, { onClick: () => setIsOpen(false), "data-cy": "modal-close-button" })),
             react_1.default.createElement(CreateModalStyles_1.StyledModalBody, null,
                 react_1.default.createElement(CreateModalStyles_1.StyledScrollableModalContent, null,
-                    react_1.default.createElement(CreateModalStyles_1.FormTitle, null, "Create New Affiliation"),
+                    react_1.default.createElement(CreateModalStyles_1.FormTitle, null, "Create Affiliation"),
                     react_1.default.createElement(AffiliationForm_1.AffiliationForm, { values: (0, normalize_1.checkID)(selection, 'affiliation'), onSave: handleSave, onChange: handleChange, actionsRef: actionsRef, newEntity: true, onAffiliationErrorChange: setHasError }))),
-            react_1.default.createElement(FormFooter_1.default, { onCancel: () => setIsOpen(false), primaryAction: react_1.default.createElement(ModalFormActions_1.ModalFormSaveButton, { form: "affiliation-form", isDisableSave: isDisableSave || hasError, label: "Create New Affiliation", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
+            react_1.default.createElement(FormFooter_1.default, { onCancel: () => setIsOpen(false), primaryAction: react_1.default.createElement(ModalFormActions_1.ModalFormSaveButton, { form: "affiliation-form", isDisableSave: isDisableSave || hasError, label: "New Affiliation", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
 };
 exports.CreateAffiliationModal = CreateAffiliationModal;

package/dist/cjs/components/authors/AuthorDetailsForm.js

@@ -176,7 +176,7 @@ const AuthorDetailsForm = ({ values, onChange, onSave, actionsRef, isEmailRequir
                 })),
             react_1.default.createElement(style_guide_1.FormRow, null,
                 react_1.default.createElement(formik_1.Field, { name: 'role' }, (props) => (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(UnsavedLabel_1.UnsavedLabel, { htmlFor: "role", showDot: showUnsavedDot('role') }, "Job Title"),
+                    react_1.default.createElement(UnsavedLabel_1.UnsavedLabel, { htmlFor: "role", showDot: showUnsavedDot('role') }, "Job title"),
                     react_1.default.createElement(style_guide_1.TextField, { id: 'role', ...props.field }))))),
             react_1.default.createElement(style_guide_1.FormRow, null,
                 react_1.default.createElement(formik_1.Field, { name: 'ORCID', type: 'text' }, (props) => {

package/dist/cjs/components/authors/AuthorsModal.js

@@ -368,7 +368,6 @@ const AuthorsModal = ({ authors: $authors, affiliations: $affiliations, author,
                             onOpenAffiliationsModal && (react_1.default.createElement(AuthorTabPanel, null,
                                 react_1.default.createElement(AffiliationsPanel_1.AffiliationsPanel, { items: affiliations, selectedItems: selectedAffiliations, onSelect: selectAffiliation, onOpenAffiliationsModal: onOpenAffiliationsModal }))),
                             react_1.default.createElement(AuthorTabPanel, null,
-                                react_1.default.createElement(style_guide_1.FormSubtitle, null, "Contributions (CRediT)"),
                                 react_1.default.createElement(ContributionsDescriptionSubtitle, null, "Select the roles this author contributed to according to the CRediT taxonomy"),
                                 react_1.default.createElement(CreditDrawer_1.CreditContributionsCheckboxes, { items: vocabTermItems, selectedItems: selectedCreditRoles.map((r) => ({
                                         id: r.vocabTerm,
@@ -420,6 +419,7 @@ const AddAuthorButton = styled_components_1.default.button `
   &[data-active='true'] {
     background: ${(props) => props.theme.colors.background.fifth};
     border: 1px solid ${(props) => props.theme.colors.border.primary};
+    padding: 11px 8px 11px 12px;
     border-left: 0;
     border-right: 0;
   }

package/dist/cjs/components/authors/AuthorsPanel.js

@@ -9,10 +9,10 @@ const react_1 = __importDefault(require("react"));
 const GenericPanel_1 = require("../authors-affiliations/GenericPanel");
 const AuthorsPanel = ({ items, selectedItems = [], onSelect, openAuthorsModal, }) => {
     const selectedIds = (0, GenericPanel_1.useListSelectedIds)(selectedItems);
-    return (react_1.default.createElement(GenericPanel_1.GenericPanel, { title: "Authors", createLabel: "Add New Author", onCreate: openAuthorsModal, createDataCy: "add-authors-link", emptyDataCy: "authors-panel-empty", isEmpty: items.length === 0, emptyIcon: react_1.default.createElement(style_guide_1.InfoCircleIcon, null), emptyMessage: react_1.default.createElement(react_1.default.Fragment, null,
+    return (react_1.default.createElement(GenericPanel_1.GenericPanel, { createLabel: "New Author", onCreate: openAuthorsModal, createDataCy: "add-authors-link", emptyDataCy: "authors-panel-empty", isEmpty: items.length === 0, emptyIcon: react_1.default.createElement(style_guide_1.InfoCircleIcon, null), emptyMessage: react_1.default.createElement(react_1.default.Fragment, null,
             "There are no authors attributed yet!",
             react_1.default.createElement("br", null),
-            "Click \u2018Add New Author\u2019") },
+            "Click \u2018+ New Author\u2019") },
         react_1.default.createElement(GenericPanel_1.ListItems, { "data-cy": "authors-panel" }, items.map((item) => (react_1.default.createElement(GenericPanel_1.ListItem, { key: item.id, selected: selectedIds.has(item.id), onClick: () => onSelect(item.id), primary: item.label }))))));
 };
 exports.AuthorsPanel = AuthorsPanel;

package/dist/cjs/components/authors/CreateAuthorModal.js

@@ -94,9 +94,9 @@ const CreateAuthorModal = ({ authorsCount, affiliations: $affiliations, onSave,
                 react_1.default.createElement(style_guide_1.CloseButton, { onClick: () => setIsOpen(false), "data-cy": "modal-close-button" })),
             react_1.default.createElement(CreateModalStyles_1.StyledModalBody, null,
                 react_1.default.createElement(CreateModalStyles_1.StyledScrollableModalContent, null,
-                    react_1.default.createElement(CreateModalStyles_1.FormTitle, null, "Create New Author"),
+                    react_1.default.createElement(CreateModalStyles_1.FormTitle, null, "Create Author"),
                     react_1.default.createElement(AuthorDetailsForm_1.AuthorDetailsForm, { values: (0, normalize_1.normalizeAuthor)(selection), onChange: handleChange, onSave: handleSave, actionsRef: actionsRef, isEmailRequired: isEmailRequired, selectedAffiliations: selectedAffiliations.map((a) => a.id), authorFormRef: authorFormRef, selectedCreditRoles: selectedCreditRoles, newEntity: true, onAuthorDetailsTabErrorChange: setHasError }))),
-            react_1.default.createElement(FormFooter_1.default, { onCancel: () => setIsOpen(false), primaryAction: react_1.default.createElement(ModalFormActions_1.ModalFormSaveButton, { form: "author-details-form", isDisableSave: isDisableSave || hasError, label: "Create New Author", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
+            react_1.default.createElement(FormFooter_1.default, { onCancel: () => setIsOpen(false), primaryAction: react_1.default.createElement(ModalFormActions_1.ModalFormSaveButton, { form: "author-details-form", isDisableSave: isDisableSave || hasError, label: "New Author", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
 };
 exports.CreateAuthorModal = CreateAuthorModal;
 function createEmptyAuthor(priority) {

package/dist/cjs/components/authors-affiliations/GenericPanel.js

@@ -67,13 +67,6 @@ const PanelHeader = styled_components_1.default.div `
   padding: ${(props) => props.theme.grid.unit * 2}px
     ${(props) => props.theme.grid.unit * 4}px;
 `;
-const PanelTitle = styled_components_1.default.span `
-  font-family: ${(props) => props.theme.font.family.sans};
-  font-size: 18px;
-  line-height: 24px;
-  letter-spacing: -0.37px;
-  color: ${(props) => props.theme.colors.text.secondary};
-`;
 const PanelCreateButton = (0, styled_components_1.default)(style_guide_1.IconButton) `
   color: #0d79d0;
   font-size: 14px;
@@ -115,9 +108,8 @@ const PanelEmptyText = styled_components_1.default.p `
   text-align: center;
   letter-spacing: -0.369px;
 `;
-const GenericPanel = ({ title, createLabel, onCreate, createDataCy, emptyDataCy, isEmpty, emptyIcon, emptyMessage, children, }) => (react_1.default.createElement(Panel, null,
+const GenericPanel = ({ createLabel, onCreate, createDataCy, emptyDataCy, isEmpty, emptyIcon, emptyMessage, children, }) => (react_1.default.createElement(Panel, null,
     react_1.default.createElement(PanelHeader, null,
-        react_1.default.createElement(PanelTitle, null, title),
         react_1.default.createElement(PanelCreateButton, { onClick: onCreate, "data-cy": createDataCy },
             react_1.default.createElement(style_guide_1.PlusIcon, null),
             createLabel)),

package/dist/cjs/plugins/objects.js

@@ -43,18 +43,34 @@ exports.default = () => {
                         if (id) {
                             const target = targets.get(id);
                             if (target) {
-                                const labelNode = document.createElement('span');
-                                labelNode.className = 'element-label';
                                 const caption = (0, prosemirror_utils_1.findChildren)(node, (node) => node.type === transform_1.schema.nodes.caption ||
                                     node.type === transform_1.schema.nodes.caption_title, false)[0];
-                                const labelPos = getDecorationPos(target, state.doc, pos, caption);
-                                labelNode.textContent = caption
-                                    ? target.label + ':'
-                                    : target.label;
-                                decorations.push(prosemirror_view_1.Decoration.widget(labelPos, labelNode, {
-                                    side: -1,
-                                    key: `element-label-${id}-${target.label}`,
-                                }));
+                                if (caption) {
+                                    let from;
+                                    let to;
+                                    if (caption.node.type === transform_1.schema.nodes.caption_title) {
+                                        from = pos + 1 + caption.pos;
+                                        to = from + caption.node.nodeSize;
+                                    }
+                                    else {
+                                        const firstChild = caption.node.firstChild;
+                                        from = pos + 1 + caption.pos + 1;
+                                        to = from + (firstChild?.nodeSize || caption.node.nodeSize);
+                                    }
+                                    decorations.push(prosemirror_view_1.Decoration.node(from, to, {
+                                        'element-label': target.label,
+                                    }));
+                                }
+                                else {
+                                    const labelPos = getDecorationPos(target, state.doc, pos);
+                                    const labelNode = document.createElement('span');
+                                    labelNode.className = 'element-label';
+                                    labelNode.textContent = target.label;
+                                    decorations.push(prosemirror_view_1.Decoration.widget(labelPos, labelNode, {
+                                        side: -1,
+                                        key: `element-label-${id}-${target.label}`,
+                                    }));
+                                }
                             }
                         }
                     });
@@ -64,14 +80,7 @@ exports.default = () => {
         },
     });
 };
-const getDecorationPos = (target, doc, pos, caption) => {
-    const $pos = doc.resolve(pos + (caption?.pos || 1) + 1);
-    let targetPos = $pos.pos;
-    if (!caption) {
-        targetPos = $pos.end();
-    }
-    else if (!$pos.nodeBefore) {
-        targetPos -= 1;
-    }
-    return targetPos;
+const getDecorationPos = (target, doc, pos) => {
+    const $pos = doc.resolve(pos + 1);
+    return $pos.end();
 };

package/dist/cjs/plugins/placeholder.js

@@ -72,6 +72,10 @@ const getParagraphPlaceholderText = (parent, node) => {
         return 'Type here';
     }
 };
+const isTextBlockOfQuoteElement = (node, parent) => node.type === transform_1.schema.nodes.text_block &&
+    !!parent &&
+    (parent.type === transform_1.schema.nodes.pullquote_element ||
+        parent.type === transform_1.schema.nodes.blockquote_element);
 exports.default = () => new prosemirror_state_1.Plugin({
     props: {
         decorations: (state) => {
@@ -82,7 +86,7 @@ exports.default = () => new prosemirror_state_1.Plugin({
                         decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget('Insert reference here')));
                     }
                     if (node.type === node.type.schema.nodes.paragraph ||
-                        node.type === node.type.schema.nodes.text_block) {
+                        isTextBlockOfQuoteElement(node, parent)) {
                         const text = getParagraphPlaceholderText(parent, node);
                         if (text) {
                             decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget(text)));
@@ -106,6 +110,16 @@ exports.default = () => new prosemirror_state_1.Plugin({
                     else if (node.type === node.type.schema.nodes.trans_abstract) {
                         decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget('Type new abstract title here')));
                     }
+                    else if (node.type === transform_1.schema.nodes.caption_title) {
+                        decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget('Caption title...'), {
+                            key: node.attrs.id,
+                        }));
+                    }
+                    else if (node.type === transform_1.schema.nodes.text_block &&
+                        parent &&
+                        parent.type === transform_1.schema.nodes.caption) {
+                        decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget('Caption...')));
+                    }
                     else {
                         const placeholder = placeholderMap[node.type.name];
                         decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {

package/dist/cjs/versions.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MATHJAX_VERSION = exports.VERSION = void 0;
-exports.VERSION = '3.12.62';
+exports.VERSION = '3.12.64';
 exports.MATHJAX_VERSION = '3.2.2';

package/dist/es/components/affiliations/AffiliationForm.js

@@ -51,7 +51,7 @@ export const AffiliationForm = ({ values, onSave, onChange, actionsRef, newEntit
             React.createElement(FormRow, null,
                 React.createElement(Field, { name: "department", type: "textarea" }, (props) => (React.createElement(React.Fragment, null,
                     React.createElement(UnsavedLabel, { htmlFor: "department", showDot: showUnsavedDot('department') }, "Department"),
-                    React.createElement(TextField, { id: "department", ...props.field, as: "textarea" }))))),
+                    React.createElement(TextField, { id: "department", ...props.field }))))),
             React.createElement(FormRow, null,
                 React.createElement(Field, { name: "addressLine1" }, (props) => (React.createElement(React.Fragment, null,
                     React.createElement(UnsavedLabel, { htmlFor: "addressLine1", showDot: showUnsavedDot('addressLine1') }, "Street Address"),

package/dist/es/components/affiliations/AffiliationsModal.js

@@ -391,6 +391,7 @@ const AddAffiliationButton = styled.button `
   &[data-active='true'] {
     background: ${(props) => props.theme.colors.background.fifth};
     border: 1px solid ${(props) => props.theme.colors.border.primary};
+    padding: 11px 8px 11px 12px;
     border-left: 0;
     border-right: 0;
   }

package/dist/es/components/affiliations/AffiliationsPanel.js

@@ -7,9 +7,9 @@ function affiliationSecondaryLine(item) {
 }
 export const AffiliationsPanel = ({ items, selectedItems = [], onSelect, onOpenAffiliationsModal, }) => {
     const selectedIds = useListSelectedIds(selectedItems);
-    return (React.createElement(GenericPanel, { title: "Institutional Affiliations", createLabel: "Create New Affiliation", onCreate: onOpenAffiliationsModal, createDataCy: "add-affiliations-link", emptyDataCy: "affiliations-panel-empty", isEmpty: items.length === 0, emptyIcon: React.createElement(InfoCircleIcon, null), emptyMessage: React.createElement(React.Fragment, null,
+    return (React.createElement(GenericPanel, { createLabel: "New Affiliation", onCreate: onOpenAffiliationsModal, createDataCy: "add-affiliations-link", emptyDataCy: "affiliations-panel-empty", isEmpty: items.length === 0, emptyIcon: React.createElement(InfoCircleIcon, null), emptyMessage: React.createElement(React.Fragment, null,
             "There are no affiliations attributed yet!",
             React.createElement("br", null),
-            "Click \u2018Create New Affiliation\u2019") },
+            "Click \u2018+ New Affiliation\u2019") },
         React.createElement(ListItems, { "data-cy": "affiliations-panel" }, items.map((item) => (React.createElement(ListItem, { key: item.id, selected: selectedIds.has(item.id), onClick: () => onSelect(item.id), primary: item.institution, secondary: affiliationSecondaryLine(item) }))))));
 };

package/dist/es/components/affiliations/CreateAffiliationModal.js

@@ -50,7 +50,7 @@ export const CreateAffiliationModal = ({ affiliationsCount, onSave, onClose, })
                 React.createElement(CloseButton, { onClick: () => setIsOpen(false), "data-cy": "modal-close-button" })),
             React.createElement(StyledModalBody, null,
                 React.createElement(StyledScrollableModalContent, null,
-                    React.createElement(FormTitle, null, "Create New Affiliation"),
+                    React.createElement(FormTitle, null, "Create Affiliation"),
                     React.createElement(AffiliationForm, { values: checkID(selection, 'affiliation'), onSave: handleSave, onChange: handleChange, actionsRef: actionsRef, newEntity: true, onAffiliationErrorChange: setHasError }))),
-            React.createElement(FormFooter, { onCancel: () => setIsOpen(false), primaryAction: React.createElement(ModalFormSaveButton, { form: "affiliation-form", isDisableSave: isDisableSave || hasError, label: "Create New Affiliation", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
+            React.createElement(FormFooter, { onCancel: () => setIsOpen(false), primaryAction: React.createElement(ModalFormSaveButton, { form: "affiliation-form", isDisableSave: isDisableSave || hasError, label: "New Affiliation", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
 };

package/dist/es/components/authors/AuthorDetailsForm.js

@@ -136,7 +136,7 @@ export const AuthorDetailsForm = ({ values, onChange, onSave, actionsRef, isEmai
                 })),
             React.createElement(FormRow, null,
                 React.createElement(Field, { name: 'role' }, (props) => (React.createElement(React.Fragment, null,
-                    React.createElement(UnsavedLabel, { htmlFor: "role", showDot: showUnsavedDot('role') }, "Job Title"),
+                    React.createElement(UnsavedLabel, { htmlFor: "role", showDot: showUnsavedDot('role') }, "Job title"),
                     React.createElement(TextField, { id: 'role', ...props.field }))))),
             React.createElement(FormRow, null,
                 React.createElement(Field, { name: 'ORCID', type: 'text' }, (props) => {

package/dist/es/components/authors/AuthorsModal.js

@@ -329,7 +329,6 @@ export const AuthorsModal = ({ authors: $authors, affiliations: $affiliations, a
                             onOpenAffiliationsModal && (React.createElement(AuthorTabPanel, null,
                                 React.createElement(AffiliationsPanel, { items: affiliations, selectedItems: selectedAffiliations, onSelect: selectAffiliation, onOpenAffiliationsModal: onOpenAffiliationsModal }))),
                             React.createElement(AuthorTabPanel, null,
-                                React.createElement(FormSubtitle, null, "Contributions (CRediT)"),
                                 React.createElement(ContributionsDescriptionSubtitle, null, "Select the roles this author contributed to according to the CRediT taxonomy"),
                                 React.createElement(CreditContributionsCheckboxes, { items: vocabTermItems, selectedItems: selectedCreditRoles.map((r) => ({
                                         id: r.vocabTerm,
@@ -380,6 +379,7 @@ const AddAuthorButton = styled.button `
   &[data-active='true'] {
     background: ${(props) => props.theme.colors.background.fifth};
     border: 1px solid ${(props) => props.theme.colors.border.primary};
+    padding: 11px 8px 11px 12px;
     border-left: 0;
     border-right: 0;
   }

package/dist/es/components/authors/AuthorsPanel.js

@@ -3,9 +3,9 @@ import React from 'react';
 import { GenericPanel, ListItem, ListItems, useListSelectedIds, } from '../authors-affiliations/GenericPanel';
 export const AuthorsPanel = ({ items, selectedItems = [], onSelect, openAuthorsModal, }) => {
     const selectedIds = useListSelectedIds(selectedItems);
-    return (React.createElement(GenericPanel, { title: "Authors", createLabel: "Add New Author", onCreate: openAuthorsModal, createDataCy: "add-authors-link", emptyDataCy: "authors-panel-empty", isEmpty: items.length === 0, emptyIcon: React.createElement(InfoCircleIcon, null), emptyMessage: React.createElement(React.Fragment, null,
+    return (React.createElement(GenericPanel, { createLabel: "New Author", onCreate: openAuthorsModal, createDataCy: "add-authors-link", emptyDataCy: "authors-panel-empty", isEmpty: items.length === 0, emptyIcon: React.createElement(InfoCircleIcon, null), emptyMessage: React.createElement(React.Fragment, null,
             "There are no authors attributed yet!",
             React.createElement("br", null),
-            "Click \u2018Add New Author\u2019") },
+            "Click \u2018+ New Author\u2019") },
         React.createElement(ListItems, { "data-cy": "authors-panel" }, items.map((item) => (React.createElement(ListItem, { key: item.id, selected: selectedIds.has(item.id), onClick: () => onSelect(item.id), primary: item.label }))))));
 };

package/dist/es/components/authors/CreateAuthorModal.js

@@ -55,9 +55,9 @@ export const CreateAuthorModal = ({ authorsCount, affiliations: $affiliations, o
                 React.createElement(CloseButton, { onClick: () => setIsOpen(false), "data-cy": "modal-close-button" })),
             React.createElement(StyledModalBody, null,
                 React.createElement(StyledScrollableModalContent, null,
-                    React.createElement(FormTitle, null, "Create New Author"),
+                    React.createElement(FormTitle, null, "Create Author"),
                     React.createElement(AuthorDetailsForm, { values: normalizeAuthor(selection), onChange: handleChange, onSave: handleSave, actionsRef: actionsRef, isEmailRequired: isEmailRequired, selectedAffiliations: selectedAffiliations.map((a) => a.id), authorFormRef: authorFormRef, selectedCreditRoles: selectedCreditRoles, newEntity: true, onAuthorDetailsTabErrorChange: setHasError }))),
-            React.createElement(FormFooter, { onCancel: () => setIsOpen(false), primaryAction: React.createElement(ModalFormSaveButton, { form: "author-details-form", isDisableSave: isDisableSave || hasError, label: "Create New Author", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
+            React.createElement(FormFooter, { onCancel: () => setIsOpen(false), primaryAction: React.createElement(ModalFormSaveButton, { form: "author-details-form", isDisableSave: isDisableSave || hasError, label: "New Author", onSubmitForm: () => actionsRef.current?.submitForm?.() }) }))));
 };
 function createEmptyAuthor(priority) {
     return {

package/dist/es/components/authors-affiliations/GenericPanel.js

@@ -27,13 +27,6 @@ const PanelHeader = styled.div `
   padding: ${(props) => props.theme.grid.unit * 2}px
     ${(props) => props.theme.grid.unit * 4}px;
 `;
-const PanelTitle = styled.span `
-  font-family: ${(props) => props.theme.font.family.sans};
-  font-size: 18px;
-  line-height: 24px;
-  letter-spacing: -0.37px;
-  color: ${(props) => props.theme.colors.text.secondary};
-`;
 const PanelCreateButton = styled(IconButton) `
   color: #0d79d0;
   font-size: 14px;
@@ -75,9 +68,8 @@ const PanelEmptyText = styled.p `
   text-align: center;
   letter-spacing: -0.369px;
 `;
-export const GenericPanel = ({ title, createLabel, onCreate, createDataCy, emptyDataCy, isEmpty, emptyIcon, emptyMessage, children, }) => (React.createElement(Panel, null,
+export const GenericPanel = ({ createLabel, onCreate, createDataCy, emptyDataCy, isEmpty, emptyIcon, emptyMessage, children, }) => (React.createElement(Panel, null,
     React.createElement(PanelHeader, null,
-        React.createElement(PanelTitle, null, title),
         React.createElement(PanelCreateButton, { onClick: onCreate, "data-cy": createDataCy },
             React.createElement(PlusIcon, null),
             createLabel)),

package/dist/es/plugins/objects.js

@@ -40,18 +40,34 @@ export default () => {
                         if (id) {
                             const target = targets.get(id);
                             if (target) {
-                                const labelNode = document.createElement('span');
-                                labelNode.className = 'element-label';
                                 const caption = findChildren(node, (node) => node.type === schema.nodes.caption ||
                                     node.type === schema.nodes.caption_title, false)[0];
-                                const labelPos = getDecorationPos(target, state.doc, pos, caption);
-                                labelNode.textContent = caption
-                                    ? target.label + ':'
-                                    : target.label;
-                                decorations.push(Decoration.widget(labelPos, labelNode, {
-                                    side: -1,
-                                    key: `element-label-${id}-${target.label}`,
-                                }));
+                                if (caption) {
+                                    let from;
+                                    let to;
+                                    if (caption.node.type === schema.nodes.caption_title) {
+                                        from = pos + 1 + caption.pos;
+                                        to = from + caption.node.nodeSize;
+                                    }
+                                    else {
+                                        const firstChild = caption.node.firstChild;
+                                        from = pos + 1 + caption.pos + 1;
+                                        to = from + (firstChild?.nodeSize || caption.node.nodeSize);
+                                    }
+                                    decorations.push(Decoration.node(from, to, {
+                                        'element-label': target.label,
+                                    }));
+                                }
+                                else {
+                                    const labelPos = getDecorationPos(target, state.doc, pos);
+                                    const labelNode = document.createElement('span');
+                                    labelNode.className = 'element-label';
+                                    labelNode.textContent = target.label;
+                                    decorations.push(Decoration.widget(labelPos, labelNode, {
+                                        side: -1,
+                                        key: `element-label-${id}-${target.label}`,
+                                    }));
+                                }
                             }
                         }
                     });
@@ -61,14 +77,7 @@ export default () => {
         },
     });
 };
-const getDecorationPos = (target, doc, pos, caption) => {
-    const $pos = doc.resolve(pos + (caption?.pos || 1) + 1);
-    let targetPos = $pos.pos;
-    if (!caption) {
-        targetPos = $pos.end();
-    }
-    else if (!$pos.nodeBefore) {
-        targetPos -= 1;
-    }
-    return targetPos;
+const getDecorationPos = (target, doc, pos) => {
+    const $pos = doc.resolve(pos + 1);
+    return $pos.end();
 };

package/dist/es/plugins/placeholder.js

@@ -70,6 +70,10 @@ const getParagraphPlaceholderText = (parent, node) => {
         return 'Type here';
     }
 };
+const isTextBlockOfQuoteElement = (node, parent) => node.type === schema.nodes.text_block &&
+    !!parent &&
+    (parent.type === schema.nodes.pullquote_element ||
+        parent.type === schema.nodes.blockquote_element);
 export default () => new Plugin({
     props: {
         decorations: (state) => {
@@ -80,7 +84,7 @@ export default () => new Plugin({
                         decorations.push(Decoration.widget(pos + 1, placeholderWidget('Insert reference here')));
                     }
                     if (node.type === node.type.schema.nodes.paragraph ||
-                        node.type === node.type.schema.nodes.text_block) {
+                        isTextBlockOfQuoteElement(node, parent)) {
                         const text = getParagraphPlaceholderText(parent, node);
                         if (text) {
                             decorations.push(Decoration.widget(pos + 1, placeholderWidget(text)));
@@ -104,6 +108,16 @@ export default () => new Plugin({
                     else if (node.type === node.type.schema.nodes.trans_abstract) {
                         decorations.push(Decoration.widget(pos + 1, placeholderWidget('Type new abstract title here')));
                     }
+                    else if (node.type === schema.nodes.caption_title) {
+                        decorations.push(Decoration.widget(pos + 1, placeholderWidget('Caption title...'), {
+                            key: node.attrs.id,
+                        }));
+                    }
+                    else if (node.type === schema.nodes.text_block &&
+                        parent &&
+                        parent.type === schema.nodes.caption) {
+                        decorations.push(Decoration.widget(pos + 1, placeholderWidget('Caption...')));
+                    }
                     else {
                         const placeholder = placeholderMap[node.type.name];
                         decorations.push(Decoration.node(pos, pos + node.nodeSize, {

package/dist/es/versions.js

@@ -1,2 +1,2 @@
-export const VERSION = '3.12.62';
+export const VERSION = '3.12.64';
 export const MATHJAX_VERSION = '3.2.2';

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

@@ -25,7 +25,6 @@ export declare const ListItems: import("styled-components").StyledComponent<Reac
     forwardedAs?: string | React.ComponentType<any> | undefined;
 }, "ref"> & React.RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
 export interface GenericPanelProps {
-    title: string;
     createLabel: string;
     onCreate: () => void;
     createDataCy: string;

package/dist/types/versions.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION = "3.12.62";
+export declare const VERSION = "3.12.64";
 export declare const MATHJAX_VERSION = "3.2.2";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "3.12.62",
+  "version": "3.12.64",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -40,8 +40,8 @@
     "@citation-js/plugin-pubmed": "0.3.0",
     "@citation-js/plugin-ris": "0.7.18",
     "@iarna/word-count": "1.1.2",
-    "@manuscripts/style-guide": "3.5.30",
-    "@manuscripts/track-changes-plugin": "2.3.15",
+    "@manuscripts/style-guide": "3.5.31",
+    "@manuscripts/track-changes-plugin": "2.3.16",
     "@manuscripts/transform": "4.3.51",
     "@popperjs/core": "2.11.8",
     "citeproc": "2.4.63",

package/styles/AdvancedEditor.css

@@ -401,10 +401,6 @@ ProseMirror .block-embed .position-menu {
   margin-left: 52px;
 }
 
-.ProseMirror .box-element > .caption-title {
-  margin-right: 52px;
-}
-
 .ProseMirror
   .box-element
   .block-section_title

package/styles/Editor.css

@@ -314,27 +314,42 @@
 
 /* Caption and Element Label */
 
-.ProseMirror .caption-title:not(.empty-node), .ProseMirror .element-label {
+/* Shared typography for all label variants */
+.ProseMirror .element-label,
+.ProseMirror .caption-title[element-label]::before,
+.ProseMirror .caption-description > [element-label]::before {
+  color: #353535;
+  font-style: normal;
+  font-weight: 700;
+  line-height: 16px;
+  margin-right: 5px;
+}
+
+.ProseMirror .caption-title[element-label]::before,
+.ProseMirror .caption-description > [element-label]::before {
+  content: attr(element-label)":";
+}
+
+.ProseMirror .caption-title:not(:has(.placeholder-text)) {
   font-weight: bold;
 }
 
-.ProseMirror .element-label, .ProseMirror .caption-description, .ProseMirror .caption-title {
-  font-size: 14px;
-  outline: none;
-  margin: 0;
-  display: inline;
+.ProseMirror .caption-title {
+  display: block;
 }
 
-.ProseMirror .element-label + .caption-description > p:first-child {
+.ProseMirror .caption-description, .ProseMirror .caption-description[element-label] > p:first-child {
   display: inline;
 }
 
-.ProseMirror .caption-description > p {
+.ProseMirror .caption-description, .ProseMirror .caption-title, .ProseMirror .element-label {
+  font-size: 14px;
+  outline: none;
   margin: 0;
 }
 
-.ProseMirror .element-label {
-  margin-right: 5px;
+.ProseMirror .caption-description > p {
+  margin: 0;
 }
 
 .ProseMirror .block-equation_element .element-label {
@@ -342,23 +357,33 @@
   text-align: center;
 }
 
-.ProseMirror .caption-title.empty-node::before {
-  content: 'Caption Title...';
-  color: #000;
-  cursor: text;
+.ProseMirror .block-table_element .caption-title .placeholder-text::before {
+  content: 'Table title';
 }
 
-.ProseMirror .caption-description > p.empty-node::before {
-  content: 'Caption...';
-  color: #000;
-  cursor: text;
+.ProseMirror .supplement-item .caption-title .placeholder-text::before,
+.ProseMirror .supplement-item .caption-description .placeholder-text::before {
+  color: #c9c9c9;
+  font-style: italic;
 }
 
-.ProseMirror .block-table_element .caption-title.empty-node::before {
-  content: 'Table title';
+.ProseMirror .supplement-item .caption-title .placeholder-text::before {
+  content: 'Insert caption title...';
+}
+
+.ProseMirror .supplement-item .caption-description .placeholder-text::before {
+  content: 'Insert caption...';
+}
+
+.ProseMirror .supplement-item .caption-description > p {
+  text-align: start;
+}
+
+.ProseMirror .box-element > .caption-title {
+  margin: 0 52px;
 }
 
-.ProseMirror .box-element > .caption-title.empty-node::before {
+.ProseMirror .box-element > .caption-title .placeholder-text::before {
   color: #999;
   font-style: italic;
 }
@@ -1205,22 +1230,6 @@
   border-bottom: none;
 }
 
-.ProseMirror .supplement-item .caption-title.empty-node::before {
-  content: 'Insert caption title...';
-  color: #c9c9c9;
-  font-style: italic;
-}
-
-.ProseMirror .supplement-item .caption-description > p.empty-node::before {
-  content: 'Insert caption...';
-  color: #c9c9c9;
-  font-style: italic;
-}
-
-.ProseMirror .supplement-item .caption-description > p {
-  text-align: start;
-}
-
 .ProseMirror .supplement-file-info {
   display: flex;
   align-items: center;