@manuscripts/body-editor 3.8.7 → 3.8.9

package/dist/cjs/commands.js

@@ -15,8 +15,8 @@
  * limitations under the License.
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addRows = exports.addInlineComment = exports.addNodeComment = exports.createAndFillTableElement = exports.selectAllIsolating = exports.ignoreAtomBlockNodeForward = exports.isAtEndOfTextBlock = exports.ignoreMetaNodeBackspaceCommand = exports.ignoreAtomBlockNodeBackward = exports.isTextSelection = exports.isAtStartOfTextBlock = exports.insertTransAbstract = 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.paste = exports.copySelection = exports.exitEditorToContainer = exports.ignoreEnterInSubtitles = exports.insertHeroImage = exports.activateSearchReplace = exports.activateSearch = exports.autoComplete = exports.addColumns = exports.addHeaderRow = void 0;
+exports.addInlineComment = exports.addNodeComment = exports.createAndFillTableElement = exports.selectAllIsolating = exports.ignoreAtomBlockNodeForward = exports.isAtEndOfTextBlock = exports.ignoreMetaNodeBackspaceCommand = exports.ignoreAtomBlockNodeBackward = exports.isTextSelection = exports.isAtStartOfTextBlock = exports.insertTransGraphicalAbstract = exports.insertTransAbstract = 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.paste = exports.copySelection = exports.exitEditorToContainer = exports.ignoreEnterInSubtitles = exports.insertHeroImage = exports.activateSearchReplace = exports.activateSearch = exports.autoComplete = exports.addColumns = exports.addHeaderRow = exports.addRows = 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");
@@ -923,7 +923,7 @@ const insertTOCSection = () => {
     return false;
 };
 exports.insertTOCSection = insertTOCSection;
-const insertTransAbstract = (state, dispatch, category) => {
+const insertTransAbstract = (state, dispatch, category, insertAfterPos) => {
     if (!(0, template_1.templateAllows)(state, transform_1.schema.nodes.trans_abstract)) {
         return false;
     }
@@ -938,7 +938,9 @@ const insertTransAbstract = (state, dispatch, category) => {
         category,
     }, [title, paragraph]);
     const abstracts = (0, doc_1.findAbstractsNode)(state.doc);
-    const pos = abstracts.pos + abstracts.node.nodeSize - 1;
+    const pos = insertAfterPos != null
+        ? insertAfterPos
+        : abstracts.pos + abstracts.node.nodeSize - 1;
     const tr = state.tr.insert(pos, node);
     const selection = prosemirror_state_1.TextSelection.create(tr.doc, pos + 1);
     tr.setSelection(selection).scrollIntoView();
@@ -946,6 +948,37 @@ const insertTransAbstract = (state, dispatch, category) => {
     return true;
 };
 exports.insertTransAbstract = insertTransAbstract;
+const insertTransGraphicalAbstract = (category, insertAfterPos) => (state, dispatch, view) => {
+    if (!(0, template_1.templateAllows)(state, transform_1.schema.nodes.trans_graphical_abstract)) {
+        return false;
+    }
+    if (!dispatch) {
+        return true;
+    }
+    const lang = state.doc.attrs.primaryLanguageCode || 'en';
+    const abstracts = (0, doc_1.findAbstractsNode)(state.doc);
+    const pos = insertAfterPos != null
+        ? insertAfterPos
+        : abstracts.pos + abstracts.node.content.size + 1;
+    const node = transform_1.schema.nodes.trans_graphical_abstract.createAndFill({
+        lang,
+        category: category.id,
+    }, [
+        transform_1.schema.nodes.section_title.create({}, transform_1.schema.text(category.titles[0])),
+        createAndFillFigureElement(state),
+    ]);
+    const tr = state.tr.insert(pos, node);
+    if (node.lastChild) {
+        (0, accessibility_element_1.expandAccessibilitySection)(tr, node.lastChild);
+    }
+    const selection = prosemirror_state_1.TextSelection.create(tr.doc, pos + 1);
+    if (view) {
+        view.focus();
+    }
+    dispatch(tr.setSelection(selection).scrollIntoView());
+    return true;
+};
+exports.insertTransGraphicalAbstract = insertTransGraphicalAbstract;
 const findCutBefore = ($pos) => {
     if (!$pos.parent.type.spec.isolating) {
         for (let i = $pos.depth - 1; i >= 0; i--) {

package/dist/cjs/components/outline/DraggableTree.js

@@ -61,6 +61,7 @@ const excludedTypes = [
     transform_1.schema.nodes.alt_text,
     transform_1.schema.nodes.long_desc,
     transform_1.schema.nodes.trans_abstract,
+    transform_1.schema.nodes.trans_graphical_abstract,
     transform_1.schema.nodes.subtitles,
     transform_1.schema.nodes.subtitle,
     transform_1.schema.nodes.supplement,

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

@@ -56,6 +56,7 @@ const table_element_editable_1 = __importDefault(require("../views/table_element
 const table_element_footer_1 = __importDefault(require("../views/table_element_footer"));
 const title_editable_1 = __importDefault(require("../views/title_editable"));
 const translated_abstract_editable_1 = __importDefault(require("../views/translated_abstract_editable"));
+const trans_graphical_abstract_editable_1 = __importDefault(require("../views/trans_graphical_abstract_editable"));
 exports.default = (props, dispatch) => {
     return {
         title: (0, title_editable_1.default)(props, dispatch),
@@ -112,6 +113,7 @@ exports.default = (props, dispatch) => {
         hero_image: (0, hero_image_editable_1.default)(props, dispatch),
         abstracts: (0, abstracts_1.default)(props),
         trans_abstract: (0, translated_abstract_editable_1.default)(props),
+        trans_graphical_abstract: (0, trans_graphical_abstract_editable_1.default)(props),
         attachment: (0, attachment_1.default)(props, dispatch),
         attachments: (0, attachments_1.default)(props, dispatch),
     };

package/dist/cjs/node-type-icons.js

@@ -38,6 +38,7 @@ const icons = new Map([
     [nodes.section, style_guide_1.OutlineSectionIcon],
     [nodes.table_element, style_guide_1.OutlineTableIcon],
     [nodes.graphical_abstract_section, style_guide_1.OutlineSectionIcon],
+    [nodes.trans_graphical_abstract, style_guide_1.OutlineSectionIcon],
     [nodes.footnotes_section, style_guide_1.OutlineSectionIcon],
     [nodes.image_element, OutlineImageIcon],
     [nodes.hero_image, OutlineImageIcon],

package/dist/cjs/plugins/translations.js

@@ -21,6 +21,7 @@ const prosemirror_view_1 = require("prosemirror-view");
 const commands_1 = require("../commands");
 const icons_1 = require("../icons");
 const languages_1 = require("../lib/languages");
+const template_1 = require("../lib/template");
 const createMenuItem = (props, contents, handler, isSelected = false) => {
     const item = document.createElement('div');
     item.className = `menu-item ${isSelected ? 'selected' : ''}`;
@@ -44,26 +45,50 @@ exports.default = (props) => new prosemirror_state_1.Plugin({
     props: {
         decorations: (state) => {
             const can = props.getCapabilities();
-            const canEdit = can.editArticle && (0, commands_1.insertTransAbstract)(state);
+            const canEditTransAbstract = can.editArticle &&
+                (0, template_1.templateAllows)(state, transform_1.schema.nodes.trans_abstract) &&
+                (0, commands_1.insertTransAbstract)(state);
+            const canEditTransGraphicalAbstract = can.editArticle &&
+                (0, template_1.templateAllows)(state, transform_1.schema.nodes.trans_graphical_abstract);
             const widgets = [];
             state.doc.descendants((node, pos, parent) => {
-                if (node.type === transform_1.schema.nodes.section &&
-                    parent?.type === transform_1.schema.nodes.abstracts &&
-                    canEdit) {
-                    widgets.push(prosemirror_view_1.Decoration.widget(pos + 1, (view) => {
-                        const $span = document.createElement('span');
-                        $span.className = 'add-trans-abstract';
-                        $span.title = 'Add translation';
-                        $span.innerHTML = `${icons_1.addAuthorIcon} <span class="add-trans-abstract-text">Add translation</span>`;
-                        $span.addEventListener('mousedown', (event) => {
-                            event.preventDefault();
-                            event.stopPropagation();
-                            (0, commands_1.insertTransAbstract)(view.state, view.dispatch, node.attrs.category);
-                        });
-                        return $span;
-                    }));
+                const isAbstractSection = (node.type === transform_1.schema.nodes.section ||
+                    node.type === transform_1.schema.nodes.graphical_abstract_section) &&
+                    parent?.type === transform_1.schema.nodes.abstracts;
+                if (isAbstractSection) {
+                    const isGraphical = node.type === transform_1.schema.nodes.graphical_abstract_section;
+                    const category = props.sectionCategories.get(node.attrs.category);
+                    const canEdit = isGraphical
+                        ? canEditTransGraphicalAbstract &&
+                            category &&
+                            (0, commands_1.insertTransGraphicalAbstract)(category)(state)
+                        : canEditTransAbstract;
+                    if (canEdit) {
+                        widgets.push(prosemirror_view_1.Decoration.widget(pos + 1, (view) => {
+                            const $span = document.createElement('span');
+                            $span.className = 'add-trans-abstract';
+                            $span.title = 'Add translation';
+                            $span.innerHTML = `${icons_1.addAuthorIcon} <span class="add-trans-abstract-text">Add translation</span>`;
+                            $span.addEventListener('mousedown', (event) => {
+                                event.preventDefault();
+                                event.stopPropagation();
+                                if (isGraphical && category) {
+                                    (0, commands_1.insertTransGraphicalAbstract)(category, pos + node.nodeSize)(view.state, view.dispatch, view);
+                                }
+                                else {
+                                    (0, commands_1.insertTransAbstract)(view.state, view.dispatch, node.attrs.category, pos + node.nodeSize);
+                                }
+                            });
+                            return $span;
+                        }));
+                    }
                 }
-                if (node.type === transform_1.schema.nodes.trans_abstract) {
+                const isTransNode = node.type === transform_1.schema.nodes.trans_abstract ||
+                    node.type === transform_1.schema.nodes.trans_graphical_abstract;
+                if (isTransNode) {
+                    const canEdit = node.type === transform_1.schema.nodes.trans_abstract
+                        ? canEditTransAbstract
+                        : canEditTransGraphicalAbstract;
                     widgets.push(prosemirror_view_1.Decoration.widget(pos + 1, (view) => {
                         const $btn = document.createElement('span');
                         $btn.className = 'language-selector-btn';

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

package/dist/cjs/views/section_title.js

@@ -32,6 +32,7 @@ class SectionTitleView extends block_view_1.default {
             transform_1.schema.nodes.bibliography_section,
             transform_1.schema.nodes.footnotes_section,
             transform_1.schema.nodes.graphical_abstract_section,
+            transform_1.schema.nodes.trans_graphical_abstract,
             transform_1.schema.nodes.supplements,
         ];
         this.createElement = () => {

package/dist/cjs/views/trans_graphical_abstract.js

@@ -0,0 +1,53 @@
+"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.TransGraphicalAbstractView = void 0;
+const block_view_1 = __importDefault(require("./block_view"));
+const creators_1 = require("./creators");
+class TransGraphicalAbstractView extends block_view_1.default {
+    constructor() {
+        super(...arguments);
+        this.elementType = 'section';
+    }
+    createDOM() {
+        super.createDOM();
+        this.dom.classList.add('block-section');
+    }
+    createElement() {
+        super.createElement();
+        if (this.contentDOM) {
+            this.contentDOM.classList.add('trans-graphical-abstract');
+        }
+    }
+    updateContents() {
+        super.updateContents();
+        this.updateAttributes();
+    }
+    updateAttributes() {
+        if (this.contentDOM && this.node.attrs.lang) {
+            this.contentDOM.lang = this.node.attrs.lang;
+        }
+        if (this.dom && this.node.attrs.category) {
+            this.dom.setAttribute('data-category', this.node.attrs.category);
+        }
+    }
+}
+exports.TransGraphicalAbstractView = TransGraphicalAbstractView;
+exports.default = (0, creators_1.createNodeView)(TransGraphicalAbstractView);

package/dist/cjs/views/trans_graphical_abstract_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 trans_graphical_abstract_1 = require("./trans_graphical_abstract");
+exports.default = (0, creators_1.createEditableNodeView)((0, editable_block_1.EditableBlock)(trans_graphical_abstract_1.TransGraphicalAbstractView));

package/dist/es/commands.js

@@ -881,7 +881,7 @@ export const insertBibliographySection = () => {
 export const insertTOCSection = () => {
     return false;
 };
-export const insertTransAbstract = (state, dispatch, category) => {
+export const insertTransAbstract = (state, dispatch, category, insertAfterPos) => {
     if (!templateAllows(state, schema.nodes.trans_abstract)) {
         return false;
     }
@@ -896,13 +896,45 @@ export const insertTransAbstract = (state, dispatch, category) => {
         category,
     }, [title, paragraph]);
     const abstracts = findAbstractsNode(state.doc);
-    const pos = abstracts.pos + abstracts.node.nodeSize - 1;
+    const pos = insertAfterPos != null
+        ? insertAfterPos
+        : abstracts.pos + abstracts.node.nodeSize - 1;
     const tr = state.tr.insert(pos, node);
     const selection = TextSelection.create(tr.doc, pos + 1);
     tr.setSelection(selection).scrollIntoView();
     dispatch(tr);
     return true;
 };
+export const insertTransGraphicalAbstract = (category, insertAfterPos) => (state, dispatch, view) => {
+    if (!templateAllows(state, schema.nodes.trans_graphical_abstract)) {
+        return false;
+    }
+    if (!dispatch) {
+        return true;
+    }
+    const lang = state.doc.attrs.primaryLanguageCode || 'en';
+    const abstracts = findAbstractsNode(state.doc);
+    const pos = insertAfterPos != null
+        ? insertAfterPos
+        : abstracts.pos + abstracts.node.content.size + 1;
+    const node = schema.nodes.trans_graphical_abstract.createAndFill({
+        lang,
+        category: category.id,
+    }, [
+        schema.nodes.section_title.create({}, schema.text(category.titles[0])),
+        createAndFillFigureElement(state),
+    ]);
+    const tr = state.tr.insert(pos, node);
+    if (node.lastChild) {
+        expandAccessibilitySection(tr, node.lastChild);
+    }
+    const selection = TextSelection.create(tr.doc, pos + 1);
+    if (view) {
+        view.focus();
+    }
+    dispatch(tr.setSelection(selection).scrollIntoView());
+    return true;
+};
 const findCutBefore = ($pos) => {
     if (!$pos.parent.type.spec.isolating) {
         for (let i = $pos.depth - 1; i >= 0; i--) {

package/dist/es/components/outline/DraggableTree.js

@@ -25,6 +25,7 @@ const excludedTypes = [
     schema.nodes.alt_text,
     schema.nodes.long_desc,
     schema.nodes.trans_abstract,
+    schema.nodes.trans_graphical_abstract,
     schema.nodes.subtitles,
     schema.nodes.subtitle,
     schema.nodes.supplement,

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

@@ -51,6 +51,7 @@ import tableElement from '../views/table_element_editable';
 import tableElementFooter from '../views/table_element_footer';
 import title from '../views/title_editable';
 import transAbstract from '../views/translated_abstract_editable';
+import transGraphicalAbstract from '../views/trans_graphical_abstract_editable';
 export default (props, dispatch) => {
     return {
         title: title(props, dispatch),
@@ -107,6 +108,7 @@ export default (props, dispatch) => {
         hero_image: heroImage(props, dispatch),
         abstracts: abstracts(props),
         trans_abstract: transAbstract(props),
+        trans_graphical_abstract: transGraphicalAbstract(props),
         attachment: attachment(props, dispatch),
         attachments: attachments(props, dispatch),
     };

package/dist/es/node-type-icons.js

@@ -32,6 +32,7 @@ const icons = new Map([
     [nodes.section, OutlineSectionIcon],
     [nodes.table_element, OutlineTableIcon],
     [nodes.graphical_abstract_section, OutlineSectionIcon],
+    [nodes.trans_graphical_abstract, OutlineSectionIcon],
     [nodes.footnotes_section, OutlineSectionIcon],
     [nodes.image_element, OutlineImageIcon],
     [nodes.hero_image, OutlineImageIcon],

package/dist/es/plugins/translations.js

@@ -16,9 +16,10 @@
 import { schema } from '@manuscripts/transform';
 import { Plugin } from 'prosemirror-state';
 import { Decoration, DecorationSet } from 'prosemirror-view';
-import { insertTransAbstract } from '../commands';
+import { insertTransAbstract, insertTransGraphicalAbstract } from '../commands';
 import { addAuthorIcon, translateIcon } from '../icons';
 import { getLanguage, getLanguageLabel } from '../lib/languages';
+import { templateAllows } from '../lib/template';
 const createMenuItem = (props, contents, handler, isSelected = false) => {
     const item = document.createElement('div');
     item.className = `menu-item ${isSelected ? 'selected' : ''}`;
@@ -42,26 +43,50 @@ export default (props) => new Plugin({
     props: {
         decorations: (state) => {
             const can = props.getCapabilities();
-            const canEdit = can.editArticle && insertTransAbstract(state);
+            const canEditTransAbstract = can.editArticle &&
+                templateAllows(state, schema.nodes.trans_abstract) &&
+                insertTransAbstract(state);
+            const canEditTransGraphicalAbstract = can.editArticle &&
+                templateAllows(state, schema.nodes.trans_graphical_abstract);
             const widgets = [];
             state.doc.descendants((node, pos, parent) => {
-                if (node.type === schema.nodes.section &&
-                    parent?.type === schema.nodes.abstracts &&
-                    canEdit) {
-                    widgets.push(Decoration.widget(pos + 1, (view) => {
-                        const $span = document.createElement('span');
-                        $span.className = 'add-trans-abstract';
-                        $span.title = 'Add translation';
-                        $span.innerHTML = `${addAuthorIcon} <span class="add-trans-abstract-text">Add translation</span>`;
-                        $span.addEventListener('mousedown', (event) => {
-                            event.preventDefault();
-                            event.stopPropagation();
-                            insertTransAbstract(view.state, view.dispatch, node.attrs.category);
-                        });
-                        return $span;
-                    }));
+                const isAbstractSection = (node.type === schema.nodes.section ||
+                    node.type === schema.nodes.graphical_abstract_section) &&
+                    parent?.type === schema.nodes.abstracts;
+                if (isAbstractSection) {
+                    const isGraphical = node.type === schema.nodes.graphical_abstract_section;
+                    const category = props.sectionCategories.get(node.attrs.category);
+                    const canEdit = isGraphical
+                        ? canEditTransGraphicalAbstract &&
+                            category &&
+                            insertTransGraphicalAbstract(category)(state)
+                        : canEditTransAbstract;
+                    if (canEdit) {
+                        widgets.push(Decoration.widget(pos + 1, (view) => {
+                            const $span = document.createElement('span');
+                            $span.className = 'add-trans-abstract';
+                            $span.title = 'Add translation';
+                            $span.innerHTML = `${addAuthorIcon} <span class="add-trans-abstract-text">Add translation</span>`;
+                            $span.addEventListener('mousedown', (event) => {
+                                event.preventDefault();
+                                event.stopPropagation();
+                                if (isGraphical && category) {
+                                    insertTransGraphicalAbstract(category, pos + node.nodeSize)(view.state, view.dispatch, view);
+                                }
+                                else {
+                                    insertTransAbstract(view.state, view.dispatch, node.attrs.category, pos + node.nodeSize);
+                                }
+                            });
+                            return $span;
+                        }));
+                    }
                 }
-                if (node.type === schema.nodes.trans_abstract) {
+                const isTransNode = node.type === schema.nodes.trans_abstract ||
+                    node.type === schema.nodes.trans_graphical_abstract;
+                if (isTransNode) {
+                    const canEdit = node.type === schema.nodes.trans_abstract
+                        ? canEditTransAbstract
+                        : canEditTransGraphicalAbstract;
                     widgets.push(Decoration.widget(pos + 1, (view) => {
                         const $btn = document.createElement('span');
                         $btn.className = 'language-selector-btn';

package/dist/es/versions.js

@@ -1,2 +1,2 @@
-export const VERSION = '3.8.7';
+export const VERSION = '3.8.9';
 export const MATHJAX_VERSION = '3.2.2';

package/dist/es/views/section_title.js

@@ -26,6 +26,7 @@ export class SectionTitleView extends BlockView {
             schema.nodes.bibliography_section,
             schema.nodes.footnotes_section,
             schema.nodes.graphical_abstract_section,
+            schema.nodes.trans_graphical_abstract,
             schema.nodes.supplements,
         ];
         this.createElement = () => {

package/dist/es/views/trans_graphical_abstract.js

@@ -0,0 +1,46 @@
+/*!
+ * © 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 TransGraphicalAbstractView extends BlockView {
+    constructor() {
+        super(...arguments);
+        this.elementType = 'section';
+    }
+    createDOM() {
+        super.createDOM();
+        this.dom.classList.add('block-section');
+    }
+    createElement() {
+        super.createElement();
+        if (this.contentDOM) {
+            this.contentDOM.classList.add('trans-graphical-abstract');
+        }
+    }
+    updateContents() {
+        super.updateContents();
+        this.updateAttributes();
+    }
+    updateAttributes() {
+        if (this.contentDOM && this.node.attrs.lang) {
+            this.contentDOM.lang = this.node.attrs.lang;
+        }
+        if (this.dom && this.node.attrs.category) {
+            this.dom.setAttribute('data-category', this.node.attrs.category);
+        }
+    }
+}
+export default createNodeView(TransGraphicalAbstractView);

package/dist/es/views/trans_graphical_abstract_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 { TransGraphicalAbstractView } from './trans_graphical_abstract';
+export default createEditableNodeView(EditableBlock(TransGraphicalAbstractView));

package/dist/types/commands.d.ts

@@ -61,7 +61,8 @@ export declare const insertKeywords: (state: ManuscriptEditorState, dispatch?: D
 export declare const insertList: (type: ManuscriptNodeType, style?: string) => (state: ManuscriptEditorState, dispatch?: Dispatch, view?: EditorView) => boolean;
 export declare const insertBibliographySection: () => boolean;
 export declare const insertTOCSection: () => boolean;
-export declare const insertTransAbstract: (state: ManuscriptEditorState, dispatch?: Dispatch, category?: string) => boolean;
+export declare const insertTransAbstract: (state: ManuscriptEditorState, dispatch?: Dispatch, category?: string, insertAfterPos?: number) => boolean;
+export declare const insertTransGraphicalAbstract: (category: SectionCategory, insertAfterPos?: number) => (state: ManuscriptEditorState, dispatch?: Dispatch, view?: EditorView) => boolean;
 export declare const isAtStartOfTextBlock: (state: ManuscriptEditorState, $cursor: ResolvedPos, view?: ManuscriptEditorView) => boolean;
 export declare const isTextSelection: (selection: Selection) => selection is ManuscriptTextSelection;
 export declare const ignoreAtomBlockNodeBackward: (state: ManuscriptEditorState, dispatch?: Dispatch, view?: ManuscriptEditorView) => boolean;

package/dist/types/versions.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION = "3.8.7";
+export declare const VERSION = "3.8.9";
 export declare const MATHJAX_VERSION = "3.2.2";

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

@@ -0,0 +1,27 @@
+/*!
+ * © 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 { TransGraphicalAbstractNode } from '@manuscripts/transform';
+import { Trackable } from '../types';
+import BlockView from './block_view';
+export declare class TransGraphicalAbstractView extends BlockView<Trackable<TransGraphicalAbstractNode>> {
+    elementType: string;
+    createDOM(): void;
+    createElement(): void;
+    updateContents(): void;
+    private updateAttributes;
+}
+declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("..").Dispatch) => import("../types").NodeViewCreator<TransGraphicalAbstractView>;
+export default _default;

package/dist/types/views/trans_graphical_abstract_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 { TransGraphicalAbstractView } from './trans_graphical_abstract';
+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;
+} & TransGraphicalAbstractView>;
+export default _default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "3.8.7",
+  "version": "3.8.9",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -40,7 +40,7 @@
     "@manuscripts/json-schema": "2.2.12",
     "@manuscripts/style-guide": "3.4.1",
     "@manuscripts/track-changes-plugin": "2.2.3",
-    "@manuscripts/transform": "4.3.15",
+    "@manuscripts/transform": "4.3.17",
     "@popperjs/core": "2.11.8",
     "citeproc": "2.4.63",
     "codemirror": "5.65.19",

package/styles/AdvancedEditor.css

@@ -985,7 +985,7 @@ figure .selected-suggestion {
 }
 
 .selected-suggestion[data-track-status='pending']
-  .block:not(.box-element):not(.trans-abstract),
+  .block:not(.box-element):not(.trans-abstract):not(.trans-graphical-abstract),
 .block:has(figure.selected-suggestion),
 figure.block:has(.equation.selected-suggestion) {
   box-shadow: inset 6px 0 0 black, inset 9px 0 0 lightgray;
@@ -996,7 +996,7 @@ figure.block:has(.equation.selected-suggestion) {
 .tracking-visible
   .ProseMirror
   [data-track-op='insert'][data-track-status='pending']
-  .block:not(.box-element):not(.trans-abstract),
+  .block:not(.box-element):not(.trans-abstract):not(.trans-graphical-abstract),
 .tracking-visible
   .ProseMirror
   [data-track-op='wrap_with_node'][data-track-status='pending']
@@ -1006,7 +1006,7 @@ figure.block:has(.equation.selected-suggestion) {
 
 .tracking-visible
   .selected-suggestion[data-track-status='pending'][data-track-op='insert']
-  .block:not(.box-element):not(.trans-abstract),
+  .block:not(.box-element):not(.trans-abstract):not(.trans-graphical-abstract),
 .tracking-visible
   .selected-suggestion
   [data-track-status='pending'][data-track-op='insert']
@@ -1034,7 +1034,7 @@ figure.block:has(.equation.selected-suggestion) {
 .tracking-visible
   .ProseMirror
   [data-track-status='pending'][data-track-op='delete']
-  .block:not(.box-element):not(.trans-abstract),
+  .block:not(.box-element):not(.trans-abstract):not(.trans-graphical-abstract),
 .tracking-visible
   .ProseMirror
   .figure-block
@@ -1052,7 +1052,7 @@ figure.block:has(.equation.selected-suggestion) {
 }
 
 .selected-suggestion[data-track-status='pending'][data-track-op='delete']
-  .block:not(.box-element):not(.trans-abstract) {
+  .block:not(.box-element):not(.trans-abstract):not(.trans-graphical-abstract) {
   box-shadow: inset 6px 0 0 var(--deleted-color),
     inset 9px 0 0 var(--deleted-pending-bg-color) !important;
   animation: fadeOutBackground 3s forwards;
@@ -1063,7 +1063,7 @@ figure.block:has(.equation.selected-suggestion) {
 .tracking-visible
   .ProseMirror
   [data-track-op='set_attrs']
-  .block:not(.trans-abstract),
+  .block:not(.trans-abstract):not(.trans-graphical-abstract),
 .tracking-visible .block:has(figure[data-track-op='set_attrs']),
 .tracking-visible figure.block:has(.equation.set_attrs),
 .tracking-visible
@@ -1088,7 +1088,7 @@ figure.block:has(.equation.selected-suggestion) {
 
 .tracking-visible
   .selected-suggestion[data-track-op='set_attrs']
-  .block:not(.trans-abstract),
+  .block:not(.trans-abstract):not(.trans-graphical-abstract),
 .tracking-visible
   .block:has(figure.selected-suggestion[data-track-op='set_attrs']),
 .tracking-visible .selected-suggestion[data-track-op='node_split'] .block,
@@ -1871,7 +1871,8 @@ th:hover > .table-context-menu-button,
   color: #353535;
 }
 
-.ProseMirror .block-trans_abstract .language-selector-btn {
+.ProseMirror .block-trans_abstract .language-selector-btn,
+.ProseMirror .block-trans_graphical_abstract .language-selector-btn {
   display: flex;
   position: absolute;
   top: 14px;
@@ -1913,6 +1914,15 @@ th:hover > .table-context-menu-button,
 .ProseMirror .block-trans_abstract section.block.trans-abstract {
   padding: 0 !important;
 }
+
+.ProseMirror .block-trans_graphical_abstract p.empty-node[data-placeholder] {
+  font-style: italic;
+  color: #c9c9c9;
+  margin: 0;
+}
+.ProseMirror .block-trans_graphical_abstract section.block.trans-graphical-abstract {
+  padding: 0 !important;
+}
 .ProseMirror .abstracts.empty-node .add-translation-container {
   display: none;
 }