@manuscripts/body-editor 3.5.4 → 3.5.6

package/dist/cjs/commands.js

@@ -118,6 +118,10 @@ const canInsert = (type) => (state) => {
             (0, prosemirror_utils_1.hasParentNodeOfType)(transform_1.schema.nodes.box_element)(state.selection))) {
         return false;
     }
+    if (type === transform_1.schema.nodes.hero_image &&
+        (0, utils_1.getChildOfType)(state.doc, transform_1.schema.nodes.hero_image, true)) {
+        return false;
+    }
     const initDepth = (0, prosemirror_utils_1.findParentNodeOfType)(transform_1.schema.nodes.box_element)(state.selection)?.depth ||
         0;
     for (let d = $from.depth; d >= initDepth; d--) {
@@ -579,7 +583,7 @@ const insertBoxElement = (state, dispatch) => {
         const tr = state.tr.insert(position, node);
         const sectionTitlePosition = position + 4;
         tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, sectionTitlePosition));
-        dispatch(tr);
+        dispatch(tr.scrollIntoView());
     }
     return true;
 };
@@ -769,15 +773,8 @@ const insertKeywords = (state, dispatch, view) => {
     if ((0, utils_1.getChildOfType)(state.doc, transform_1.schema.nodes.keywords, true)) {
         return false;
     }
-    const supplements = (0, prosemirror_utils_1.findChildrenByType)(state.doc, state.schema.nodes.supplements)[0];
     const abstracts = (0, prosemirror_utils_1.findChildrenByType)(state.doc, state.schema.nodes.abstracts)[0];
-    let pos;
-    if (supplements) {
-        pos = supplements.pos + supplements.node.nodeSize;
-    }
-    else {
-        pos = abstracts.pos;
-    }
+    const pos = abstracts.pos;
     const keywords = transform_1.schema.nodes.keywords.createAndFill({}, [
         transform_1.schema.nodes.section_title.create({}, transform_1.schema.text('Keywords')),
         transform_1.schema.nodes.keywords_element.create({}, [
@@ -1292,11 +1289,8 @@ const createHeroImage = (attrs) => transform_1.schema.nodes.hero_image.create({
     transform_1.schema.nodes.long_desc.create(),
 ]);
 const insertHeroImage = () => (state, dispatch, view) => {
-    if ((0, utils_1.getChildOfType)(state.doc, transform_1.schema.nodes.hero_image, true)) {
-        return false;
-    }
-    const backmatter = (0, doc_1.findBackmatter)(state.doc);
-    const position = backmatter.pos + backmatter.node.content.size + 1;
+    const comments = (0, prosemirror_utils_1.findChildrenByType)(state.doc, transform_1.schema.nodes.comments)[0];
+    const position = comments.pos;
     view?.focus();
     (0, exports.createBlock)(transform_1.schema.nodes.hero_image, position, state, dispatch);
     return true;

package/dist/cjs/lib/doc.js

@@ -37,8 +37,8 @@ const insertSupplementsNode = (tr) => {
     if (supplements) {
         return supplements;
     }
-    const abstracts = (0, exports.findAbstractsNode)(doc);
-    const pos = abstracts.pos - 1;
+    const backmatter = (0, exports.findBackmatter)(doc);
+    const pos = backmatter.pos + backmatter.node.content.size + 1;
     const node = transform_1.schema.nodes.supplements.createAndFill();
     tr.insert(pos, node);
     return {

package/dist/cjs/menus.js

@@ -256,7 +256,8 @@ const getEditorMenus = (editor) => {
             {
                 id: 'insert-hero-image',
                 label: 'Hero Image',
-                isEnabled: (0, utils_1.isEditAllowed)(state) && isCommandValid((0, commands_1.insertHeroImage)()),
+                isEnabled: (0, utils_1.isEditAllowed)(state) &&
+                    isCommandValid((0, commands_1.canInsert)(transform_1.schema.nodes.hero_image)),
                 run: doCommand((0, commands_1.insertHeroImage)()),
                 isHidden: !(0, template_1.templateAllows)(state, transform_1.schema.nodes.hero_image),
             },

package/dist/cjs/plugins/placeholder.js

@@ -17,6 +17,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 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 placeholderWidget = (placeholder) => (view, getPos) => {
     const element = document.createElement('span');
@@ -55,6 +56,9 @@ const getParagraphPlaceholderText = (parent, node) => {
     if ((0, transform_1.isFootnoteNode)(parent) || (0, transform_1.isGeneralTableFootnoteNode)(parent)) {
         return 'Type new footnote here';
     }
+    if (parent.type === transform_1.schema.nodes.trans_abstract) {
+        return 'Type here';
+    }
 };
 exports.default = () => new prosemirror_state_1.Plugin({
     props: {
@@ -71,6 +75,17 @@ exports.default = () => new prosemirror_state_1.Plugin({
                             decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget(text)));
                         }
                     }
+                    else if (node.type === node.type.schema.nodes.section_title) {
+                        const $pos = state.doc.resolve(pos);
+                        let placeholderText = 'Type heading here';
+                        if ((0, prosemirror_utils_1.findParentNodeOfTypeClosestToPos)($pos, transform_1.schema.nodes.box_element)) {
+                            placeholderText = 'Optional box title...';
+                        }
+                        decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, placeholderWidget(placeholderText)));
+                    }
+                    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 {
                         decorations.push(prosemirror_view_1.Decoration.node(pos, pos + node.nodeSize, {
                             class: 'empty-node',

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

package/dist/cjs/views/abstracts.js

@@ -29,9 +29,7 @@ class AbstractsView extends base_node_view_1.BaseNodeView {
             const { schema } = state;
             const documentLanguage = state.doc.attrs.primaryLanguageCode || 'en';
             const sectionTitle = schema.nodes.section_title.create();
-            const paragraph = schema.nodes.paragraph.create({
-                placeholder: 'Type here',
-            });
+            const paragraph = schema.nodes.paragraph.create();
             const transAbstractNode = schema.nodes.trans_abstract.create({
                 lang: documentLanguage,
             }, [sectionTitle, paragraph]);

package/dist/cjs/views/section_title.js

@@ -58,15 +58,6 @@ class SectionTitleView extends block_view_1.default {
         }
         else {
             this.contentDOM.classList.add('empty-node');
-            if ($pos.node($pos.depth - 1).type === transform_1.schema.nodes.box_element) {
-                this.contentDOM.setAttribute('data-placeholder', `Optional box title...`);
-            }
-            else if ($pos.node($pos.depth).type === transform_1.schema.nodes.trans_abstract) {
-                this.contentDOM.setAttribute('data-placeholder', `Type new abstract title here`);
-            }
-            else {
-                this.contentDOM.setAttribute('data-placeholder', `Type heading here`);
-            }
         }
         if (sectionTitleState && sectionNumber) {
             this.contentDOM.dataset.sectionNumber = sectionNumber;

package/dist/es/commands.js

@@ -110,6 +110,10 @@ export const canInsert = (type) => (state) => {
             hasParentNodeOfType(schema.nodes.box_element)(state.selection))) {
         return false;
     }
+    if (type === schema.nodes.hero_image &&
+        getChildOfType(state.doc, schema.nodes.hero_image, true)) {
+        return false;
+    }
     const initDepth = findParentNodeOfType(schema.nodes.box_element)(state.selection)?.depth ||
         0;
     for (let d = $from.depth; d >= initDepth; d--) {
@@ -549,7 +553,7 @@ export const insertBoxElement = (state, dispatch) => {
         const tr = state.tr.insert(position, node);
         const sectionTitlePosition = position + 4;
         tr.setSelection(TextSelection.create(tr.doc, sectionTitlePosition));
-        dispatch(tr);
+        dispatch(tr.scrollIntoView());
     }
     return true;
 };
@@ -731,15 +735,8 @@ export const insertKeywords = (state, dispatch, view) => {
     if (getChildOfType(state.doc, schema.nodes.keywords, true)) {
         return false;
     }
-    const supplements = findChildrenByType(state.doc, state.schema.nodes.supplements)[0];
     const abstracts = findChildrenByType(state.doc, state.schema.nodes.abstracts)[0];
-    let pos;
-    if (supplements) {
-        pos = supplements.pos + supplements.node.nodeSize;
-    }
-    else {
-        pos = abstracts.pos;
-    }
+    const pos = abstracts.pos;
     const keywords = schema.nodes.keywords.createAndFill({}, [
         schema.nodes.section_title.create({}, schema.text('Keywords')),
         schema.nodes.keywords_element.create({}, [
@@ -1233,11 +1230,8 @@ const createHeroImage = (attrs) => schema.nodes.hero_image.create({
     schema.nodes.long_desc.create(),
 ]);
 export const insertHeroImage = () => (state, dispatch, view) => {
-    if (getChildOfType(state.doc, schema.nodes.hero_image, true)) {
-        return false;
-    }
-    const backmatter = findBackmatter(state.doc);
-    const position = backmatter.pos + backmatter.node.content.size + 1;
+    const comments = findChildrenByType(state.doc, schema.nodes.comments)[0];
+    const position = comments.pos;
     view?.focus();
     createBlock(schema.nodes.hero_image, position, state, dispatch);
     return true;

package/dist/es/lib/doc.js

@@ -33,8 +33,8 @@ export const insertSupplementsNode = (tr) => {
     if (supplements) {
         return supplements;
     }
-    const abstracts = findAbstractsNode(doc);
-    const pos = abstracts.pos - 1;
+    const backmatter = findBackmatter(doc);
+    const pos = backmatter.pos + backmatter.node.content.size + 1;
     const node = schema.nodes.supplements.createAndFill();
     tr.insert(pos, node);
     return {

package/dist/es/menus.js

@@ -253,7 +253,8 @@ export const getEditorMenus = (editor) => {
             {
                 id: 'insert-hero-image',
                 label: 'Hero Image',
-                isEnabled: isEditAllowed(state) && isCommandValid(insertHeroImage()),
+                isEnabled: isEditAllowed(state) &&
+                    isCommandValid(canInsert(schema.nodes.hero_image)),
                 run: doCommand(insertHeroImage()),
                 isHidden: !templateAllows(state, schema.nodes.hero_image),
             },

package/dist/es/plugins/placeholder.js

@@ -15,6 +15,7 @@
  */
 import { isFootnoteNode, isGeneralTableFootnoteNode, isPullquoteElement, schema, } from '@manuscripts/transform';
 import { Plugin, TextSelection } from 'prosemirror-state';
+import { findParentNodeOfTypeClosestToPos } from 'prosemirror-utils';
 import { Decoration, DecorationSet } from 'prosemirror-view';
 const placeholderWidget = (placeholder) => (view, getPos) => {
     const element = document.createElement('span');
@@ -53,6 +54,9 @@ const getParagraphPlaceholderText = (parent, node) => {
     if (isFootnoteNode(parent) || isGeneralTableFootnoteNode(parent)) {
         return 'Type new footnote here';
     }
+    if (parent.type === schema.nodes.trans_abstract) {
+        return 'Type here';
+    }
 };
 export default () => new Plugin({
     props: {
@@ -69,6 +73,17 @@ export default () => new Plugin({
                             decorations.push(Decoration.widget(pos + 1, placeholderWidget(text)));
                         }
                     }
+                    else if (node.type === node.type.schema.nodes.section_title) {
+                        const $pos = state.doc.resolve(pos);
+                        let placeholderText = 'Type heading here';
+                        if (findParentNodeOfTypeClosestToPos($pos, schema.nodes.box_element)) {
+                            placeholderText = 'Optional box title...';
+                        }
+                        decorations.push(Decoration.widget(pos + 1, placeholderWidget(placeholderText)));
+                    }
+                    else if (node.type === node.type.schema.nodes.trans_abstract) {
+                        decorations.push(Decoration.widget(pos + 1, placeholderWidget('Type new abstract title here')));
+                    }
                     else {
                         decorations.push(Decoration.node(pos, pos + node.nodeSize, {
                             class: 'empty-node',

package/dist/es/versions.js

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

package/dist/es/views/abstracts.js

@@ -26,9 +26,7 @@ export class AbstractsView extends BaseNodeView {
             const { schema } = state;
             const documentLanguage = state.doc.attrs.primaryLanguageCode || 'en';
             const sectionTitle = schema.nodes.section_title.create();
-            const paragraph = schema.nodes.paragraph.create({
-                placeholder: 'Type here',
-            });
+            const paragraph = schema.nodes.paragraph.create();
             const transAbstractNode = schema.nodes.trans_abstract.create({
                 lang: documentLanguage,
             }, [sectionTitle, paragraph]);

package/dist/es/views/section_title.js

@@ -52,15 +52,6 @@ export class SectionTitleView extends BlockView {
         }
         else {
             this.contentDOM.classList.add('empty-node');
-            if ($pos.node($pos.depth - 1).type === schema.nodes.box_element) {
-                this.contentDOM.setAttribute('data-placeholder', `Optional box title...`);
-            }
-            else if ($pos.node($pos.depth).type === schema.nodes.trans_abstract) {
-                this.contentDOM.setAttribute('data-placeholder', `Type new abstract title here`);
-            }
-            else {
-                this.contentDOM.setAttribute('data-placeholder', `Type heading here`);
-            }
         }
         if (sectionTitleState && sectionNumber) {
             this.contentDOM.dataset.sectionNumber = sectionNumber;

package/dist/types/versions.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION = "3.5.4";
+export declare const VERSION = "3.5.6";
 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.5.4",
+  "version": "3.5.6",
   "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.14",
+    "@manuscripts/transform": "4.2.15",
     "@popperjs/core": "2.11.8",
     "citeproc": "2.4.63",
     "codemirror": "5.65.19",

package/styles/AdvancedEditor.css

@@ -32,28 +32,10 @@
   -webkit-appearance: none;
 }
 
-.ProseMirror
-  > div.body
-  section:not(.toc)
-  .block-section_title
-  h1.empty-node[data-placeholder]::before {
-  content: attr(data-section-number) '. ' attr(data-placeholder);
-}
-
 .ProseMirror > div.body section:not(.toc) .block-section_title h1::before {
   content: attr(data-section-number) '. ';
 }
 
-.ProseMirror
-  > div.body
-  .block-box_element
-  .box-element
-  section:not(.toc)
-  .block-section_title
-  h1.empty-node[data-placeholder]::before {
-  content: attr(data-placeholder);
-}
-
 .ProseMirror
   > div.body
   .block-box_element

package/styles/Editor.css

@@ -297,6 +297,21 @@
   content: 'Caption Title...';
 }
 
+.ProseMirror .block-box_element .caption-title.empty-node::before {
+  content: none;
+}
+
+.ProseMirror .block-box_element label.caption-title.placeholder.empty-node {
+  display: inline-flex;
+}
+
+.ProseMirror .block-box_element .caption-title.empty-node::after {
+  content: 'Caption Title...';
+  color: #999;
+  font-style: italic;
+  pointer-events: none;
+} 
+
 .ProseMirror .caption-description.empty-node::before {
   content: 'Caption...';
 }