@manuscripts/body-editor 3.5.6 → 3.5.8

package/dist/cjs/commands.js

@@ -16,7 +16,7 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addRows = exports.addInlineComment = exports.addNodeComment = exports.isCommentingAllowed = exports.createAndFillTableElement = exports.selectAllIsolating = exports.ignoreAtomBlockNodeForward = exports.isAtEndOfTextBlock = exports.ignoreMetaNodeBackspaceCommand = exports.ignoreAtomBlockNodeBackward = exports.isTextSelection = exports.isAtStartOfTextBlock = exports.insertTOCSection = exports.insertBibliographySection = exports.insertList = exports.insertKeywords = exports.insertAward = exports.insertAffiliation = exports.insertContributors = exports.insertGraphicalAbstract = exports.insertBackmatterSection = exports.insertAbstractSection = exports.insertSection = exports.insertBoxElement = exports.insertInlineFootnote = exports.insertFootnotesElement = exports.insertTableElementFooter = exports.insertInlineEquation = exports.insertCrossReference = exports.insertInlineCitation = exports.insertLink = exports.insertSectionLabel = exports.findPosBeforeFirstSubsection = exports.insertBreak = exports.deleteBlock = exports.insertBlock = exports.insertAttachment = exports.insertSupplement = exports.insertTable = exports.insertEmbed = exports.insertFigure = exports.insertGeneralTableFootnote = exports.insertInlineTableFootnote = exports.createBlock = exports.createSelection = exports.canInsert = exports.blockActive = exports.isNodeSelection = exports.markActive = exports.addToStart = void 0;
-exports.insertHeroImage = exports.activateSearchReplace = exports.activateSearch = exports.autoComplete = exports.addColumns = exports.addHeaderRow = void 0;
+exports.ignoreEnterInSubtitles = exports.insertHeroImage = exports.activateSearchReplace = exports.activateSearch = exports.autoComplete = exports.addColumns = exports.addHeaderRow = void 0;
 const json_schema_1 = require("@manuscripts/json-schema");
 const track_changes_plugin_1 = require("@manuscripts/track-changes-plugin");
 const transform_1 = require("@manuscripts/transform");
@@ -1101,6 +1101,7 @@ const getParentNode = (selection) => {
     return node;
 };
 const isCommentingAllowed = (type) => type === transform_1.schema.nodes.title ||
+    type === transform_1.schema.nodes.subtitles ||
     type === transform_1.schema.nodes.section ||
     type === transform_1.schema.nodes.citation ||
     type === transform_1.schema.nodes.bibliography_item ||
@@ -1296,3 +1297,16 @@ const insertHeroImage = () => (state, dispatch, view) => {
     return true;
 };
 exports.insertHeroImage = insertHeroImage;
+const ignoreEnterInSubtitles = (state) => {
+    const { selection } = state;
+    if (!(0, exports.isTextSelection)(selection)) {
+        return false;
+    }
+    const cursorParent = selection.$from.node();
+    if (cursorParent.type === state.schema.nodes.subtitle ||
+        cursorParent.type === state.schema.nodes.subtitles) {
+        return true;
+    }
+    return false;
+};
+exports.ignoreEnterInSubtitles = ignoreEnterInSubtitles;

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

@@ -27,6 +27,7 @@ const prosemirror_history_1 = require("prosemirror-history");
 const prosemirror_tables_1 = require("prosemirror-tables");
 const keys_1 = __importDefault(require("../keys"));
 const accessibility_element_1 = __importDefault(require("../plugins/accessibility_element"));
+const add_subtitle_1 = __importDefault(require("../plugins/add-subtitle"));
 const affiliations_1 = __importDefault(require("../plugins/affiliations"));
 const alt_titles_1 = __importDefault(require("../plugins/alt-titles"));
 const bibliography_1 = __importDefault(require("../plugins/bibliography"));
@@ -75,6 +76,7 @@ exports.default = (props) => {
         (0, comments_1.default)(),
         (0, paragraphs_1.default)(),
         (0, placeholder_1.default)(),
+        (0, add_subtitle_1.default)(),
         (0, prosemirror_tables_1.tableEditing)(),
         (0, selected_suggestion_1.default)(),
         (0, footnotes_1.default)(props),

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

@@ -43,6 +43,8 @@ const quote_image_editable_1 = __importDefault(require("../views/quote_image_edi
 const section_1 = __importDefault(require("../views/section"));
 const section_label_1 = __importDefault(require("../views/section_label"));
 const section_title_editable_1 = __importDefault(require("../views/section_title_editable"));
+const subtitle_editable_1 = __importDefault(require("../views/subtitle_editable"));
+const subtitles_editable_1 = __importDefault(require("../views/subtitles_editable"));
 const table_cell_1 = __importDefault(require("../views/table_cell"));
 const table_element_editable_1 = __importDefault(require("../views/table_element_editable"));
 const table_element_footer_1 = __importDefault(require("../views/table_element_footer"));
@@ -51,8 +53,8 @@ const translated_abstract_editable_1 = __importDefault(require("../views/transla
 exports.default = (props, dispatch) => {
     return {
         title: (0, title_editable_1.default)(props, dispatch),
-        subtitle: (0, empty_1.default)('subtitle'),
-        subtitles: (0, empty_1.default)('subtitles'),
+        subtitles: (0, subtitles_editable_1.default)(props, dispatch),
+        subtitle: (0, subtitle_editable_1.default)(props, dispatch),
         alt_title: (0, alt_title_1.default)(props),
         alt_titles: (0, alt_titles_section_1.default)(props),
         bibliography_element: (0, bibliography_element_1.default)(props, dispatch),

package/dist/cjs/icons.js

@@ -1,10 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.translateIcon = exports.draggableIcon = exports.fileCorruptedIcon = exports.imageDefaultIcon = exports.imageLeftIcon = exports.imageRightIcon = exports.addBtnIcon = exports.plusIcon = exports.lockIcon = exports.scrollIcon = exports.sectionCategoryIcon = exports.editIcon = exports.deleteIcon = exports.alertIcon = exports.arrowUp = exports.arrowDown = void 0;
+exports.translateIcon = exports.draggableIcon = exports.fileCorruptedIcon = exports.imageDefaultIcon = exports.imageLeftIcon = exports.imageRightIcon = exports.addBtnIcon = exports.plusIcon = exports.lockIcon = exports.scrollIcon = exports.sectionCategoryIcon = exports.editIcon = exports.deleteIcon = exports.alertIcon = exports.arrowUp = exports.arrowDown = exports.addAuthorIcon = void 0;
 const style_guide_1 = require("@manuscripts/style-guide");
 const react_1 = require("react");
 const server_1 = require("react-dom/server");
 const renderIcon = (c) => (0, server_1.renderToStaticMarkup)((0, react_1.createElement)(c));
+exports.addAuthorIcon = renderIcon(style_guide_1.AddAuthorIcon);
 exports.arrowDown = renderIcon(style_guide_1.ArrowDownCircleIcon);
 exports.arrowUp = renderIcon(style_guide_1.ArrowUpIcon);
 exports.alertIcon = renderIcon(style_guide_1.AlertIcon);

package/dist/cjs/keys/misc.js

@@ -40,7 +40,7 @@ const customKeymap = {
     'Mod-Alt-=': (0, prosemirror_commands_1.toggleMark)(transform_1.schema.marks.superscript),
     'Mod-Alt--': (0, prosemirror_commands_1.toggleMark)(transform_1.schema.marks.subscript),
     'Ctrl->': (0, prosemirror_commands_1.wrapIn)(transform_1.schema.nodes.blockquote),
-    Enter: (0, prosemirror_commands_1.chainCommands)(commands_1.autoComplete, commands_1.addToStart, prosemirror_commands_1.newlineInCode, prosemirror_commands_1.createParagraphNear, prosemirror_commands_1.liftEmptyBlock, prosemirror_commands_1.splitBlock),
+    Enter: (0, prosemirror_commands_1.chainCommands)(commands_1.ignoreEnterInSubtitles, commands_1.autoComplete, commands_1.addToStart, prosemirror_commands_1.newlineInCode, prosemirror_commands_1.createParagraphNear, prosemirror_commands_1.liftEmptyBlock, prosemirror_commands_1.splitBlock),
     'Shift-Mod-Enter': (0, commands_1.insertSection)(true),
     'Mod-Enter': (0, prosemirror_commands_1.chainCommands)(prosemirror_commands_1.exitCode, (0, commands_1.insertSection)()),
     'Shift-Enter': (0, prosemirror_commands_1.chainCommands)(prosemirror_commands_1.exitCode, commands_1.insertBreak),

package/dist/cjs/keys/title.js

@@ -114,7 +114,8 @@ const protectTitles = (state, dispatch, view) => {
     if (!$cursor) {
         return false;
     }
-    if ($cursor.parent.type === transform_1.schema.nodes.alt_title &&
+    if (($cursor.parent.type === transform_1.schema.nodes.alt_title ||
+        $cursor.parent.type === transform_1.schema.nodes.subtitle) &&
         $cursor.pos === $cursor.before() + 1) {
         return true;
     }

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

@@ -18,6 +18,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContextMenu = exports.contextMenuBtnClass = exports.sectionLevel = void 0;
 const style_guide_1 = require("@manuscripts/style-guide");
 const transform_1 = require("@manuscripts/transform");
+const prosemirror_state_1 = require("prosemirror-state");
 const prosemirror_utils_1 = require("prosemirror-utils");
 const react_1 = require("react");
 const server_1 = require("react-dom/server");
@@ -370,6 +371,16 @@ class ContextMenu {
                     this.view.dispatch(this.view.state.tr.delete($pos.before($pos.depth - 1), $pos.after($pos.depth - 1)));
                     break;
                 }
+                case 'subtitles': {
+                    const pos = this.getPos();
+                    const tr = this.view.state.tr;
+                    tr.delete(pos, pos + this.node.nodeSize);
+                    const titleNode = (0, prosemirror_utils_1.findChildrenByType)(tr.doc, transform_1.schema.nodes.title)[0];
+                    const titleEndPos = titleNode.pos + titleNode.node.nodeSize - 1;
+                    tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, titleEndPos));
+                    this.view.dispatch(tr);
+                    break;
+                }
                 default: {
                     const pos = this.getPos();
                     this.view.dispatch(this.view.state.tr.delete(pos, pos + this.node.nodeSize));

package/dist/cjs/plugins/add-subtitle.js

@@ -0,0 +1,70 @@
+"use strict";
+/*!
+ * © 2025 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 });
+const transform_1 = require("@manuscripts/transform");
+const prosemirror_state_1 = require("prosemirror-state");
+const prosemirror_view_1 = require("prosemirror-view");
+const uuid_1 = require("uuid");
+const icons_1 = require("../icons");
+const createAddSubtitleButton = (handler) => {
+    const button = document.createElement('span');
+    button.className = 'add-subtitle';
+    button.innerHTML = `${icons_1.addAuthorIcon} <span class="add-subtitle-text">Add subtitle</span>`;
+    button.addEventListener('mousedown', (e) => {
+        e.preventDefault();
+        handler();
+    });
+    return button;
+};
+exports.default = () => new prosemirror_state_1.Plugin({
+    props: {
+        decorations: (state) => {
+            let titleHasContent = false;
+            let titlePos = -1;
+            let hasSubtitles = false;
+            state.doc.descendants((node, pos) => {
+                if (node.type === transform_1.schema.nodes.title && node.textContent.trim()) {
+                    titleHasContent = true;
+                    titlePos = pos;
+                }
+                else if (node.type === transform_1.schema.nodes.subtitles) {
+                    hasSubtitles = true;
+                    return false;
+                }
+            });
+            if (titleHasContent && !hasSubtitles) {
+                const titleNode = state.doc.nodeAt(titlePos);
+                if (titleNode) {
+                    const titleEndPos = titlePos + titleNode.nodeSize;
+                    return prosemirror_view_1.DecorationSet.create(state.doc, [
+                        prosemirror_view_1.Decoration.widget(titleEndPos, (view) => {
+                            return createAddSubtitleButton(() => {
+                                const subtitlesNode = transform_1.schema.nodes.subtitles.create({ id: (0, uuid_1.v4)() }, [transform_1.schema.nodes.subtitle.create({ id: (0, uuid_1.v4)() })]);
+                                const tr = view.state.tr.insert(titleEndPos, subtitlesNode);
+                                const subtitlePos = titleEndPos + 1;
+                                tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, subtitlePos));
+                                view.dispatch(tr);
+                                view.focus();
+                            });
+                        }),
+                    ]);
+                }
+            }
+            return prosemirror_view_1.DecorationSet.empty;
+        },
+    },
+});

package/dist/cjs/plugins/alt-titles.js

@@ -8,6 +8,7 @@ const prosemirror_view_1 = require("prosemirror-view");
 const utils_1 = require("../lib/utils");
 function getTitlesData(doc) {
     let title;
+    let subtitles;
     let runningTitle;
     let shortTitle;
     let altTitlesSection;
@@ -18,6 +19,9 @@ function getTitlesData(doc) {
         if (node.type === transform_1.schema.nodes.title) {
             title = [node, pos];
         }
+        if (node.type === transform_1.schema.nodes.subtitles) {
+            subtitles = [node, pos];
+        }
         if (node.type === transform_1.schema.nodes.alt_titles) {
             altTitlesSection = [node, pos];
         }
@@ -30,7 +34,7 @@ function getTitlesData(doc) {
             }
         }
     });
-    return { title, runningTitle, shortTitle, altTitlesSection };
+    return { title, subtitles, runningTitle, shortTitle, altTitlesSection };
 }
 function selectionInAltTitles(from, to, state) {
     if (state.runningTitle && state.shortTitle) {
@@ -75,13 +79,14 @@ exports.default = () => {
                 !exports.altTitlesKey.getState(newState)) {
                 return null;
             }
-            const { title, runningTitle, shortTitle, altTitlesSection } = exports.altTitlesKey.getState(newState);
+            const { title, subtitles, runningTitle, shortTitle, altTitlesSection } = exports.altTitlesKey.getState(newState);
             const schema = newState.schema;
             if (!title) {
                 return null;
             }
             if (!altTitlesSection) {
-                const titleEnd = title[0].nodeSize + title[1];
+                const prev = subtitles || title;
+                const titleEnd = prev[0].nodeSize + prev[1];
                 const section = schema.nodes.alt_titles.create({}, [
                     schema.nodes.alt_title.create({
                         type: 'running',

package/dist/cjs/plugins/placeholder.js

@@ -19,6 +19,9 @@ const transform_1 = require("@manuscripts/transform");
 const prosemirror_state_1 = require("prosemirror-state");
 const prosemirror_utils_1 = require("prosemirror-utils");
 const prosemirror_view_1 = require("prosemirror-view");
+const placeholderMap = {
+    subtitle: 'Type subtitle here...',
+};
 const placeholderWidget = (placeholder) => (view, getPos) => {
     const element = document.createElement('span');
     element.className = 'placeholder-text';
@@ -87,8 +90,10 @@ exports.default = () => new prosemirror_state_1.Plugin({
                         decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget('Type new abstract title here')));
                     }
                     else {
+                        const placeholder = placeholderMap[node.type.name];
                         decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {
                             class: 'empty-node',
+                            ...(placeholder && { 'data-placeholder': placeholder }),
                         }));
                     }
                 }

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.5.6';
+exports.VERSION = '3.5.8';
 exports.MATHJAX_VERSION = '3.2.2';

package/dist/cjs/views/alt_titles_section.js

@@ -19,6 +19,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AltTitleSectionView = void 0;
+const prosemirror_state_1 = require("prosemirror-state");
+const prosemirror_utils_1 = require("prosemirror-utils");
 const icons_1 = require("../icons");
 const alt_titles_1 = require("../plugins/alt-titles");
 const block_view_1 = __importDefault(require("./block_view"));
@@ -48,6 +50,13 @@ class AltTitleSectionView extends block_view_1.default {
             const tr = this.view.state.tr.setMeta(alt_titles_1.altTitlesKey, {
                 collapsed: true,
             });
+            const titleNode = (0, prosemirror_utils_1.findChildrenByType)(this.view.state.doc, this.view.state.schema.nodes.title)[0];
+            const subtitleNode = (0, prosemirror_utils_1.findChildrenByType)(this.view.state.doc, this.view.state.schema.nodes.subtitle)[0];
+            const prev = subtitleNode || titleNode;
+            if (prev) {
+                const titleEndPos = prev.pos + prev.node.nodeSize;
+                tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, titleEndPos));
+            }
             this.view.dispatch(tr);
         });
         closingPanel.appendChild(button);

package/dist/cjs/views/editable_block.js

@@ -41,6 +41,7 @@ const EditableBlock = (Base) => {
             const $pos = this.view.state.doc.resolve(this.getPos());
             const nodeType = this.node.type;
             if (nodeType === transform_1.schema.nodes.hero_image ||
+                nodeType === transform_1.schema.nodes.subtitles ||
                 (0, utils_1.hasParent)($pos, [
                     transform_1.schema.nodes.keywords,
                     transform_1.schema.nodes.bibliography_section,

package/dist/cjs/views/subtitle.js

@@ -0,0 +1,37 @@
+"use strict";
+/*!
+ * © 2025 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.SubtitleView = void 0;
+const base_node_view_1 = require("./base_node_view");
+const creators_1 = require("./creators");
+class SubtitleView extends base_node_view_1.BaseNodeView {
+    constructor() {
+        super(...arguments);
+        this.initialise = () => {
+            this.createDOM();
+        };
+        this.createDOM = () => {
+            this.dom = document.createElement('div');
+            this.dom.classList.add('manuscript-subtitle');
+            this.contentDOM = document.createElement('span');
+            this.dom.appendChild(this.contentDOM);
+            this.updateContents();
+        };
+    }
+}
+exports.SubtitleView = SubtitleView;
+exports.default = (0, creators_1.createNodeView)(SubtitleView);

package/dist/cjs/views/subtitle_editable.js

@@ -0,0 +1,20 @@
+"use strict";
+/*!
+ * © 2025 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 });
+const creators_1 = require("./creators");
+const subtitle_1 = require("./subtitle");
+exports.default = (0, creators_1.createEditableNodeView)(subtitle_1.SubtitleView);

package/dist/cjs/views/subtitles.js

@@ -0,0 +1,35 @@
+"use strict";
+/*!
+ * © 2025 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.
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SubtitlesView = void 0;
+const block_view_1 = __importDefault(require("./block_view"));
+const creators_1 = require("./creators");
+class SubtitlesView extends block_view_1.default {
+    constructor() {
+        super(...arguments);
+        this.createElement = () => {
+            this.contentDOM = document.createElement('div');
+            this.contentDOM.classList.add('block');
+            this.dom.appendChild(this.contentDOM);
+        };
+    }
+}
+exports.SubtitlesView = SubtitlesView;
+exports.default = (0, creators_1.createNodeView)(SubtitlesView);

package/dist/cjs/views/subtitles_editable.js

@@ -0,0 +1,21 @@
+"use strict";
+/*!
+ * © 2025 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 });
+const creators_1 = require("./creators");
+const editable_block_1 = require("./editable_block");
+const subtitles_1 = require("./subtitles");
+exports.default = (0, creators_1.createEditableNodeView)((0, editable_block_1.EditableBlock)(subtitles_1.SubtitlesView));

package/dist/es/commands.js

@@ -1051,6 +1051,7 @@ const getParentNode = (selection) => {
     return node;
 };
 export const isCommentingAllowed = (type) => type === schema.nodes.title ||
+    type === schema.nodes.subtitles ||
     type === schema.nodes.section ||
     type === schema.nodes.citation ||
     type === schema.nodes.bibliography_item ||
@@ -1236,3 +1237,15 @@ export const insertHeroImage = () => (state, dispatch, view) => {
     createBlock(schema.nodes.hero_image, position, state, dispatch);
     return true;
 };
+export const ignoreEnterInSubtitles = (state) => {
+    const { selection } = state;
+    if (!isTextSelection(selection)) {
+        return false;
+    }
+    const cursorParent = selection.$from.node();
+    if (cursorParent.type === state.schema.nodes.subtitle ||
+        cursorParent.type === state.schema.nodes.subtitles) {
+        return true;
+    }
+    return false;
+};

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

@@ -22,6 +22,7 @@ import { history } from 'prosemirror-history';
 import { tableEditing } from 'prosemirror-tables';
 import keys from '../keys';
 import accessibility_element from '../plugins/accessibility_element';
+import add_subtitle from '../plugins/add-subtitle';
 import affiliations from '../plugins/affiliations';
 import alt_titles from '../plugins/alt-titles';
 import bibliography from '../plugins/bibliography';
@@ -70,6 +71,7 @@ export default (props) => {
         comments(),
         paragraphs(),
         placeholder(),
+        add_subtitle(),
         tableEditing(),
         selected_suggestion(),
         footnotes(props),

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

@@ -38,6 +38,8 @@ import quoteImage from '../views/quote_image_editable';
 import section from '../views/section';
 import sectionLabel from '../views/section_label';
 import sectionTitle from '../views/section_title_editable';
+import subtitle from '../views/subtitle_editable';
+import subtitles from '../views/subtitles_editable';
 import tableCell from '../views/table_cell';
 import tableElement from '../views/table_element_editable';
 import tableElementFooter from '../views/table_element_footer';
@@ -46,8 +48,8 @@ import transAbstract from '../views/translated_abstract_editable';
 export default (props, dispatch) => {
     return {
         title: title(props, dispatch),
-        subtitle: empty('subtitle'),
-        subtitles: empty('subtitles'),
+        subtitles: subtitles(props, dispatch),
+        subtitle: subtitle(props, dispatch),
         alt_title: alt_title(props),
         alt_titles: alt_titles_section(props),
         bibliography_element: bibliographyElement(props, dispatch),

package/dist/es/icons.js

@@ -1,7 +1,8 @@
-import { AlertIcon, ArrowDownCircleIcon, ArrowUpIcon, DeleteIcon, DraggableIcon, EditIcon, FileCorruptedIcon, ImageDefaultIcon, ImageLeftIcon, ImageRightIcon, LockIcon, PlusIcon, ScrollIcon, SectionCategoryIcon, TranslateIcon, } from '@manuscripts/style-guide';
+import { AddAuthorIcon, AlertIcon, ArrowDownCircleIcon, ArrowUpIcon, DeleteIcon, DraggableIcon, EditIcon, FileCorruptedIcon, ImageDefaultIcon, ImageLeftIcon, ImageRightIcon, LockIcon, PlusIcon, ScrollIcon, SectionCategoryIcon, TranslateIcon, } from '@manuscripts/style-guide';
 import { createElement } from 'react';
 import { renderToStaticMarkup } from 'react-dom/server';
 const renderIcon = (c) => renderToStaticMarkup(createElement(c));
+export const addAuthorIcon = renderIcon(AddAuthorIcon);
 export const arrowDown = renderIcon(ArrowDownCircleIcon);
 export const arrowUp = renderIcon(ArrowUpIcon);
 export const alertIcon = renderIcon(AlertIcon);

package/dist/es/keys/misc.js

@@ -18,7 +18,7 @@ import { chainCommands, createParagraphNear, exitCode, joinBackward, joinDown, j
 import { redo, undo } from 'prosemirror-history';
 import { undoInputRule } from 'prosemirror-inputrules';
 import { goToNextCell } from 'prosemirror-tables';
-import { activateSearch, activateSearchReplace, addToStart, autoComplete, ignoreAtomBlockNodeBackward, ignoreAtomBlockNodeForward, ignoreMetaNodeBackspaceCommand, insertBlock, insertBreak, insertCrossReference, insertInlineCitation, insertInlineEquation, insertSection, selectAllIsolating, } from '../commands';
+import { activateSearch, activateSearchReplace, addToStart, autoComplete, ignoreAtomBlockNodeBackward, ignoreAtomBlockNodeForward, ignoreEnterInSubtitles, ignoreMetaNodeBackspaceCommand, insertBlock, insertBreak, insertCrossReference, insertInlineCitation, insertInlineEquation, insertSection, selectAllIsolating, } from '../commands';
 import { skipCommandTracking } from './list';
 const customKeymap = {
     Backspace: chainCommands(undoInputRule, ignoreAtomBlockNodeBackward, ignoreMetaNodeBackspaceCommand, skipCommandTracking(joinBackward)),
@@ -38,7 +38,7 @@ const customKeymap = {
     'Mod-Alt-=': toggleMark(schema.marks.superscript),
     'Mod-Alt--': toggleMark(schema.marks.subscript),
     'Ctrl->': wrapIn(schema.nodes.blockquote),
-    Enter: chainCommands(autoComplete, addToStart, newlineInCode, createParagraphNear, liftEmptyBlock, splitBlock),
+    Enter: chainCommands(ignoreEnterInSubtitles, autoComplete, addToStart, newlineInCode, createParagraphNear, liftEmptyBlock, splitBlock),
     'Shift-Mod-Enter': insertSection(true),
     'Mod-Enter': chainCommands(exitCode, insertSection()),
     'Shift-Enter': chainCommands(exitCode, insertBreak),

package/dist/es/keys/title.js

@@ -111,7 +111,8 @@ const protectTitles = (state, dispatch, view) => {
     if (!$cursor) {
         return false;
     }
-    if ($cursor.parent.type === schema.nodes.alt_title &&
+    if (($cursor.parent.type === schema.nodes.alt_title ||
+        $cursor.parent.type === schema.nodes.subtitle) &&
         $cursor.pos === $cursor.before() + 1) {
         return true;
     }

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

@@ -15,6 +15,7 @@
  */
 import { TriangleCollapsedIcon } from '@manuscripts/style-guide';
 import { isInGraphicalAbstractSection, isSectionTitleNode, nodeNames, schema, } from '@manuscripts/transform';
+import { TextSelection } from 'prosemirror-state';
 import { findChildrenByType } from 'prosemirror-utils';
 import { createElement } from 'react';
 import { renderToStaticMarkup } from 'react-dom/server';
@@ -366,6 +367,16 @@ export class ContextMenu {
                     this.view.dispatch(this.view.state.tr.delete($pos.before($pos.depth - 1), $pos.after($pos.depth - 1)));
                     break;
                 }
+                case 'subtitles': {
+                    const pos = this.getPos();
+                    const tr = this.view.state.tr;
+                    tr.delete(pos, pos + this.node.nodeSize);
+                    const titleNode = findChildrenByType(tr.doc, schema.nodes.title)[0];
+                    const titleEndPos = titleNode.pos + titleNode.node.nodeSize - 1;
+                    tr.setSelection(TextSelection.create(tr.doc, titleEndPos));
+                    this.view.dispatch(tr);
+                    break;
+                }
                 default: {
                     const pos = this.getPos();
                     this.view.dispatch(this.view.state.tr.delete(pos, pos + this.node.nodeSize));

package/dist/es/plugins/add-subtitle.js

@@ -0,0 +1,68 @@
+/*!
+ * © 2025 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 { schema } from '@manuscripts/transform';
+import { Plugin, TextSelection } from 'prosemirror-state';
+import { Decoration, DecorationSet } from 'prosemirror-view';
+import { v4 as uuidv4 } from 'uuid';
+import { addAuthorIcon } from '../icons';
+const createAddSubtitleButton = (handler) => {
+    const button = document.createElement('span');
+    button.className = 'add-subtitle';
+    button.innerHTML = `${addAuthorIcon} <span class="add-subtitle-text">Add subtitle</span>`;
+    button.addEventListener('mousedown', (e) => {
+        e.preventDefault();
+        handler();
+    });
+    return button;
+};
+export default () => new Plugin({
+    props: {
+        decorations: (state) => {
+            let titleHasContent = false;
+            let titlePos = -1;
+            let hasSubtitles = false;
+            state.doc.descendants((node, pos) => {
+                if (node.type === schema.nodes.title && node.textContent.trim()) {
+                    titleHasContent = true;
+                    titlePos = pos;
+                }
+                else if (node.type === schema.nodes.subtitles) {
+                    hasSubtitles = true;
+                    return false;
+                }
+            });
+            if (titleHasContent && !hasSubtitles) {
+                const titleNode = state.doc.nodeAt(titlePos);
+                if (titleNode) {
+                    const titleEndPos = titlePos + titleNode.nodeSize;
+                    return DecorationSet.create(state.doc, [
+                        Decoration.widget(titleEndPos, (view) => {
+                            return createAddSubtitleButton(() => {
+                                const subtitlesNode = schema.nodes.subtitles.create({ id: uuidv4() }, [schema.nodes.subtitle.create({ id: uuidv4() })]);
+                                const tr = view.state.tr.insert(titleEndPos, subtitlesNode);
+                                const subtitlePos = titleEndPos + 1;
+                                tr.setSelection(TextSelection.create(tr.doc, subtitlePos));
+                                view.dispatch(tr);
+                                view.focus();
+                            });
+                        }),
+                    ]);
+                }
+            }
+            return DecorationSet.empty;
+        },
+    },
+});

package/dist/es/plugins/alt-titles.js

@@ -5,6 +5,7 @@ import { Decoration, DecorationSet } from 'prosemirror-view';
 import { createToggleButton } from '../lib/utils';
 function getTitlesData(doc) {
     let title;
+    let subtitles;
     let runningTitle;
     let shortTitle;
     let altTitlesSection;
@@ -15,6 +16,9 @@ function getTitlesData(doc) {
         if (node.type === schema.nodes.title) {
             title = [node, pos];
         }
+        if (node.type === schema.nodes.subtitles) {
+            subtitles = [node, pos];
+        }
         if (node.type === schema.nodes.alt_titles) {
             altTitlesSection = [node, pos];
         }
@@ -27,7 +31,7 @@ function getTitlesData(doc) {
             }
         }
     });
-    return { title, runningTitle, shortTitle, altTitlesSection };
+    return { title, subtitles, runningTitle, shortTitle, altTitlesSection };
 }
 function selectionInAltTitles(from, to, state) {
     if (state.runningTitle && state.shortTitle) {
@@ -72,13 +76,14 @@ export default () => {
                 !altTitlesKey.getState(newState)) {
                 return null;
             }
-            const { title, runningTitle, shortTitle, altTitlesSection } = altTitlesKey.getState(newState);
+            const { title, subtitles, runningTitle, shortTitle, altTitlesSection } = altTitlesKey.getState(newState);
             const schema = newState.schema;
             if (!title) {
                 return null;
             }
             if (!altTitlesSection) {
-                const titleEnd = title[0].nodeSize + title[1];
+                const prev = subtitles || title;
+                const titleEnd = prev[0].nodeSize + prev[1];
                 const section = schema.nodes.alt_titles.create({}, [
                     schema.nodes.alt_title.create({
                         type: 'running',

package/dist/es/plugins/placeholder.js

@@ -17,6 +17,9 @@ import { isFootnoteNode, isGeneralTableFootnoteNode, isPullquoteElement, schema,
 import { Plugin, TextSelection } from 'prosemirror-state';
 import { findParentNodeOfTypeClosestToPos } from 'prosemirror-utils';
 import { Decoration, DecorationSet } from 'prosemirror-view';
+const placeholderMap = {
+    subtitle: 'Type subtitle here...',
+};
 const placeholderWidget = (placeholder) => (view, getPos) => {
     const element = document.createElement('span');
     element.className = 'placeholder-text';
@@ -85,8 +88,10 @@ export default () => new Plugin({
                         decorations.push(Decoration.widget(pos + 1, placeholderWidget('Type new abstract title here')));
                     }
                     else {
+                        const placeholder = placeholderMap[node.type.name];
                         decorations.push(Decoration.node(pos, pos + node.nodeSize, {
                             class: 'empty-node',
+                            ...(placeholder && { 'data-placeholder': placeholder }),
                         }));
                     }
                 }

package/dist/es/versions.js

@@ -1,2 +1,2 @@
-export const VERSION = '3.5.6';
+export const VERSION = '3.5.8';
 export const MATHJAX_VERSION = '3.2.2';

package/dist/es/views/alt_titles_section.js

@@ -13,6 +13,8 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { TextSelection } from 'prosemirror-state';
+import { findChildrenByType } from 'prosemirror-utils';
 import { arrowDown } from '../icons';
 import { altTitlesKey } from '../plugins/alt-titles';
 import BlockView from './block_view';
@@ -42,6 +44,13 @@ export class AltTitleSectionView extends BlockView {
             const tr = this.view.state.tr.setMeta(altTitlesKey, {
                 collapsed: true,
             });
+            const titleNode = findChildrenByType(this.view.state.doc, this.view.state.schema.nodes.title)[0];
+            const subtitleNode = findChildrenByType(this.view.state.doc, this.view.state.schema.nodes.subtitle)[0];
+            const prev = subtitleNode || titleNode;
+            if (prev) {
+                const titleEndPos = prev.pos + prev.node.nodeSize;
+                tr.setSelection(TextSelection.create(tr.doc, titleEndPos));
+            }
             this.view.dispatch(tr);
         });
         closingPanel.appendChild(button);

package/dist/es/views/editable_block.js

@@ -38,6 +38,7 @@ export const EditableBlock = (Base) => {
             const $pos = this.view.state.doc.resolve(this.getPos());
             const nodeType = this.node.type;
             if (nodeType === schema.nodes.hero_image ||
+                nodeType === schema.nodes.subtitles ||
                 hasParent($pos, [
                     schema.nodes.keywords,
                     schema.nodes.bibliography_section,

package/dist/es/views/subtitle.js

@@ -0,0 +1,33 @@
+/*!
+ * © 2025 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 { BaseNodeView } from './base_node_view';
+import { createNodeView } from './creators';
+export class SubtitleView extends BaseNodeView {
+    constructor() {
+        super(...arguments);
+        this.initialise = () => {
+            this.createDOM();
+        };
+        this.createDOM = () => {
+            this.dom = document.createElement('div');
+            this.dom.classList.add('manuscript-subtitle');
+            this.contentDOM = document.createElement('span');
+            this.dom.appendChild(this.contentDOM);
+            this.updateContents();
+        };
+    }
+}
+export default createNodeView(SubtitleView);

package/dist/es/views/subtitle_editable.js

@@ -0,0 +1,18 @@
+/*!
+ * © 2025 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 { createEditableNodeView } from './creators';
+import { SubtitleView } from './subtitle';
+export default createEditableNodeView(SubtitleView);

package/dist/es/views/subtitles.js

@@ -0,0 +1,28 @@
+/*!
+ * © 2025 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 BlockView from './block_view';
+import { createNodeView } from './creators';
+export class SubtitlesView extends BlockView {
+    constructor() {
+        super(...arguments);
+        this.createElement = () => {
+            this.contentDOM = document.createElement('div');
+            this.contentDOM.classList.add('block');
+            this.dom.appendChild(this.contentDOM);
+        };
+    }
+}
+export default createNodeView(SubtitlesView);

package/dist/es/views/subtitles_editable.js

@@ -0,0 +1,19 @@
+/*!
+ * © 2025 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 { createEditableNodeView } from './creators';
+import { EditableBlock } from './editable_block';
+import { SubtitlesView } from './subtitles';
+export default createEditableNodeView(EditableBlock(SubtitlesView));

package/dist/types/commands.d.ts

@@ -84,3 +84,4 @@ export declare const autoComplete: (state: ManuscriptEditorState, dispatch?: Dis
 export declare const activateSearch: (state: ManuscriptEditorState, dispatch?: Dispatch) => boolean;
 export declare const activateSearchReplace: (state: ManuscriptEditorState, dispatch?: Dispatch) => boolean;
 export declare const insertHeroImage: () => (state: ManuscriptEditorState, dispatch?: Dispatch, view?: EditorView) => boolean;
+export declare const ignoreEnterInSubtitles: (state: ManuscriptEditorState) => boolean;

package/dist/types/icons.d.ts

@@ -1,3 +1,4 @@
+export declare const addAuthorIcon: string;
 export declare const arrowDown: string;
 export declare const arrowUp: string;
 export declare const alertIcon: string;

package/dist/types/plugins/add-subtitle.d.ts

@@ -0,0 +1,18 @@
+/*!
+ * © 2025 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 { Plugin } from 'prosemirror-state';
+declare const _default: () => Plugin<null>;
+export default _default;

package/dist/types/plugins/alt-titles.d.ts

@@ -1,8 +1,9 @@
-import { AltTitleNode, AltTitlesSectionNode, TitleNode } from '@manuscripts/transform';
+import { AltTitleNode, AltTitlesSectionNode, SubtitlesNode, TitleNode } from '@manuscripts/transform';
 import { Plugin, PluginKey } from 'prosemirror-state';
 export interface PluginState {
     collapsed: boolean;
     title: [TitleNode, number] | undefined;
+    subtitles: [SubtitlesNode, number] | undefined;
     runningTitle: [AltTitleNode, number] | undefined;
     shortTitle: [AltTitleNode, number] | undefined;
     altTitlesSection: [AltTitlesSectionNode, number] | undefined;

package/dist/types/versions.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION = "3.5.6";
+export declare const VERSION = "3.5.8";
 export declare const MATHJAX_VERSION = "3.2.2";

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

@@ -0,0 +1,24 @@
+/*!
+ * © 2025 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 { ManuscriptNodeView, SubtitleNode } from '@manuscripts/transform';
+import { BaseNodeView } from './base_node_view';
+export declare class SubtitleView extends BaseNodeView<SubtitleNode> implements ManuscriptNodeView {
+    contentDOM: HTMLElement;
+    initialise: () => void;
+    protected createDOM: () => void;
+}
+declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("..").Dispatch) => import("../types").NodeViewCreator<SubtitleView>;
+export default _default;

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

@@ -0,0 +1,18 @@
+/*!
+ * © 2025 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 { SubtitleView } from './subtitle';
+declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("..").Dispatch) => import("../types").NodeViewCreator<SubtitleView>;
+export default _default;

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

@@ -0,0 +1,23 @@
+/*!
+ * © 2025 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 { ManuscriptNodeView, SubtitlesNode } from '@manuscripts/transform';
+import { Trackable } from '../types';
+import BlockView from './block_view';
+export declare class SubtitlesView extends BlockView<Trackable<SubtitlesNode>> implements ManuscriptNodeView {
+    createElement: () => void;
+}
+declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("..").Dispatch) => import("../types").NodeViewCreator<SubtitlesView>;
+export default _default;

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

@@ -0,0 +1,44 @@
+/*!
+ * © 2025 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 { SubtitlesView } from './subtitles';
+declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("..").Dispatch) => import("../types").NodeViewCreator<{
+    gutterButtons(): HTMLElement[];
+    actionGutterButtons(): never[];
+    createAddButton(): HTMLAnchorElement | null;
+    createEditButton(): HTMLElement | null;
+    createMenu: () => import("../lib/context-menu").ContextMenu;
+    initialise(): void;
+    updateContents(): void;
+    handleTrackChanges(): void;
+    updateClasses(): void;
+    updatePlaceholder(): void;
+    createElement(): void;
+    createDOM(): void;
+    gutter: Record<string, HTMLElement>;
+    createGutter(className: string, buttons: HTMLElement[]): void;
+    dom: HTMLElement;
+    contentDOM?: HTMLElement;
+    elementType: string;
+    readonly props: import("../configs/ManuscriptsEditor").EditorProps;
+    node: import("prosemirror-model").Node;
+    readonly view: import("@manuscripts/transform").ManuscriptEditorView;
+    readonly getPos: () => number;
+    update(newNode: import("@manuscripts/transform").ManuscriptNode): boolean;
+    selectNode(): void;
+    deselectNode(): void;
+    destroy(): void;
+} & SubtitlesView>;
+export default _default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "3.5.6",
+  "version": "3.5.8",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -41,7 +41,7 @@
     "@manuscripts/json-schema": "2.2.12",
     "@manuscripts/style-guide": "3.3.0",
     "@manuscripts/track-changes-plugin": "2.0.12",
-    "@manuscripts/transform": "4.2.15",
+    "@manuscripts/transform": "4.2.17",
     "@popperjs/core": "2.11.8",
     "citeproc": "2.4.63",
     "codemirror": "5.65.19",

package/styles/AdvancedEditor.css

@@ -520,6 +520,13 @@ ProseMirror .block-embed .position-menu {
   display: block;
 }
 
+.block-subtitles .comment-marker {
+  top: 0;
+  left: -10px;
+  float: right;
+  position: relative;
+}
+
 .block > div.comment-marker,
 .figure-block > div.comment-marker {
   top: -25px;

package/styles/Editor.css

@@ -566,6 +566,22 @@
   color: #c9c9c9;
   margin: 0;
 }
+
+.ProseMirror .add-subtitle {
+  display: inline-flex;
+  align-items: center;
+  cursor: pointer;
+  padding-left: var(--body-side-margin);
+}
+
+.ProseMirror .add-subtitle-text {
+  margin-left: 8px;
+}
+
+.ProseMirror .add-subtitle svg rect {
+  fill: #6E6E6E !important;
+}
+
 .ProseMirror .empty-node:hover::before {
   color: #6e6e6e;
 }
@@ -589,6 +605,9 @@
 
 .ProseMirror .empty-node[data-placeholder]::before {
   content: attr(data-placeholder); /* TODO: innerHTML? */
+  color: #c9c9c9;
+  position: absolute;
+  pointer-events: none;
 }
 
 .ProseMirror table {
@@ -698,6 +717,9 @@
 .ProseMirror .block-paragraph .block-gutter {
   margin-top: 16px;
 }
+.ProseMirror .block-subtitles .block-gutter {
+  margin-top: 4px;
+}
 
 .ProseMirror
   .block-container:not(
@@ -1101,6 +1123,14 @@
   padding-left: var(--body-side-margin);
   padding-right: var(--body-side-margin);
 }
+.manuscript-subtitle {
+  font-family: Lato;
+  font-size: 24px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 32px;
+  align-items: center;
+}
 .highlight {
   background-color: #ffeebf !important;
 }