@manuscripts/body-editor 2.2.10 → 2.2.11-LEAN-3969.0

package/dist/cjs/commands.js

@@ -86,11 +86,14 @@ const blockActive = (type) => (state) => {
 };
 exports.blockActive = blockActive;
 const canInsert = (type) => (state) => {
+    var _a;
     const { $from, $to } = state.selection;
     if ($from.node().type === transform_1.schema.nodes.title && $from.pos === $to.pos) {
         return false;
     }
-    for (let d = $from.depth; d >= 0; d--) {
+    const initDepth = ((_a = (0, prosemirror_utils_1.findParentNodeOfType)(transform_1.schema.nodes.box_element)(state.selection)) === null || _a === void 0 ? void 0 : _a.depth) ||
+        0;
+    for (let d = $from.depth; d >= initDepth; d--) {
         const index = $from.index(d);
         if ($from.node(d).canReplaceWith(index, index, type)) {
             return true;
@@ -504,7 +507,8 @@ const insertGraphicalAbstract = (state, dispatch, view) => {
 exports.insertGraphicalAbstract = insertGraphicalAbstract;
 const insertSection = (subsection = false) => (state, dispatch, view) => {
     const selection = state.selection;
-    if ((0, prosemirror_utils_1.hasParentNodeOfType)(transform_1.schema.nodes.bibliography_section)(selection)) {
+    if ((0, prosemirror_utils_1.hasParentNodeOfType)(transform_1.schema.nodes.bibliography_section)(selection) ||
+        (!subsection && (0, prosemirror_utils_1.hasParentNodeOfType)(transform_1.schema.nodes.box_element)(selection))) {
         return false;
     }
     let pos;
@@ -924,6 +928,7 @@ const isCommentingAllowed = (type) => type === transform_1.schema.nodes.title ||
     type === transform_1.schema.nodes.bibliography_item ||
     type === transform_1.schema.nodes.footnotes_section ||
     type === transform_1.schema.nodes.bibliography_section ||
+    type === transform_1.schema.nodes.box_element ||
     type === transform_1.schema.nodes.graphical_abstract_section ||
     type === transform_1.schema.nodes.keyword_group ||
     type === transform_1.schema.nodes.paragraph ||

package/dist/cjs/components/toolbar/LevelSelector.js

@@ -22,6 +22,7 @@ exports.LevelSelector = void 0;
 const transform_1 = require("@manuscripts/transform");
 const prosemirror_model_1 = require("prosemirror-model");
 const prosemirror_state_1 = require("prosemirror-state");
+const prosemirror_utils_1 = require("prosemirror-utils");
 const react_1 = __importDefault(require("react"));
 const react_select_1 = __importDefault(require("react-select"));
 const styled_components_1 = __importDefault(require("styled-components"));
@@ -40,7 +41,9 @@ const optionName = (nodeType, depth, listType) => {
 const titleCase = (text) => text.replace(/\b([a-z])/g, (match) => match.toUpperCase());
 const buildOption = (props) => (Object.assign(Object.assign({}, props), { icon: (0, node_type_icons_1.nodeTypeIcon)(props.nodeType, props.listType), label: titleCase(optionName(props.nodeType, props.depth, props.listType)), isDisabled: Boolean(props.isDisabled), isSelected: Boolean(props.isSelected), isFocused: Boolean(props.isFocused) }));
 const buildOptions = (state, dispatch, view) => {
+    var _a;
     const { doc, selection: { $from, $to }, schema, tr, } = state;
+    doc.resolve($from.index($from.depth - 1));
     const { nodes } = schema;
     if (!$from.sameParent($to)) {
         return [];
@@ -49,6 +52,7 @@ const buildOptions = (state, dispatch, view) => {
     if (!parentElement) {
         return [];
     }
+    const depth = ((_a = (0, prosemirror_utils_1.findParentNodeOfType)(schema.nodes.box_element)(state.selection)) === null || _a === void 0 ? void 0 : _a.depth) || 1;
     const moveParagraphToNewSubsection = () => {
         const paragraph = $from.node($from.depth);
         const beforeParagraph = $from.before($from.depth);
@@ -131,7 +135,7 @@ const buildOptions = (state, dispatch, view) => {
         const $beforeParagraph = doc.resolve(beforeParagraph);
         const beforeParagraphOffset = $beforeParagraph.parentOffset;
         const afterParagraphOffset = beforeParagraphOffset + paragraph.nodeSize;
-        const sectionDepth = $from.depth - 1;
+        const sectionDepth = $from.depth - depth;
         const parentSection = $from.node(sectionDepth);
         const startIndex = $from.index(sectionDepth);
         const endIndex = $from.indexAfter(sectionDepth);
@@ -167,7 +171,7 @@ const buildOptions = (state, dispatch, view) => {
         const afterSectionTitle = $from.after($from.depth);
         const $afterSectionTitle = doc.resolve(afterSectionTitle);
         const afterSectionTitleOffset = $afterSectionTitle.parentOffset;
-        const sectionDepth = $from.depth - 1;
+        const sectionDepth = $from.depth - depth;
         const section = $from.node(sectionDepth);
         const beforeSection = $from.before(sectionDepth);
         const afterSection = $from.after(sectionDepth);
@@ -213,7 +217,7 @@ const buildOptions = (state, dispatch, view) => {
     const parentElementType = parentElement.node.type;
     switch (parentElementType) {
         case parentElementType.schema.nodes.section: {
-            const sectionDepth = Math.max(1, $from.depth - 1);
+            const sectionDepth = Math.max(1, $from.depth - depth);
             const parentSectionDepth = sectionDepth - 1;
             const minimumDepth = Math.max(1, parentSectionDepth);
             const beforeSection = $from.before(sectionDepth);
@@ -284,7 +288,7 @@ const buildOptions = (state, dispatch, view) => {
             return [{ options: typeOptions }, { options: sectionOptions }];
         }
         case parentElementType.schema.nodes.paragraph: {
-            const sectionDepth = $from.depth - 1;
+            const sectionDepth = $from.depth - depth;
             const minimumDepth = Math.max(1, sectionDepth);
             let parentSectionDepth = 0;
             const typeOptions = [

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

@@ -22,6 +22,7 @@ const affiliations_1 = __importDefault(require("../views/affiliations"));
 const author_notes_1 = __importDefault(require("../views/author_notes"));
 const bibliography_element_1 = __importDefault(require("../views/bibliography_element"));
 const blockquote_element_editable_1 = __importDefault(require("../views/blockquote_element_editable"));
+const box_element_1 = __importDefault(require("../views/box_element"));
 const citation_editable_1 = __importDefault(require("../views/citation_editable"));
 const contributors_1 = __importDefault(require("../views/contributors"));
 const cross_reference_editable_1 = __importDefault(require("../views/cross_reference_editable"));
@@ -56,6 +57,7 @@ exports.default = (props, dispatch) => {
         title: (0, title_editable_1.default)(props, dispatch),
         bibliography_element: (0, bibliography_element_1.default)(props, dispatch),
         blockquote_element: (0, blockquote_element_editable_1.default)(props),
+        box_element: (0, box_element_1.default)(props),
         citation: (0, citation_editable_1.default)(props, dispatch),
         cross_reference: (0, cross_reference_editable_1.default)(props, dispatch),
         contributors: (0, contributors_1.default)(props, dispatch),

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

@@ -30,6 +30,8 @@ const track_changes_utils_1 = require("./track-changes-utils");
 const utils_1 = require("./utils");
 const popper = new popper_1.PopperManager();
 const readonlyTypes = [transform_1.schema.nodes.keywords, transform_1.schema.nodes.bibliography_element];
+const isBoxElementSectionTitle = ($pos, node) => (0, transform_1.isSectionTitleNode)(node) &&
+    $pos.node($pos.depth - 1).type === transform_1.schema.nodes.box_element;
 const sectionLevel = (depth) => {
     switch (depth) {
         case 1:
@@ -150,7 +152,8 @@ class ContextMenu {
             const menu = document.createElement('div');
             menu.className = 'menu';
             const $pos = this.resolvePos();
-            const type = this.node.type;
+            const isBox = isBoxElementSectionTitle($pos, this.node);
+            const type = isBox ? transform_1.schema.nodes.box_element : this.node.type;
             if (type === transform_1.schema.nodes.list) {
                 menu.appendChild(this.createMenuSection((section) => {
                     const actualAttrs = (0, track_changes_utils_1.getActualAttrs)(this.node);
@@ -338,14 +341,12 @@ class ContextMenu {
             switch (nodeType.name) {
                 case 'section_title': {
                     const $pos = this.resolvePos();
-                    this.view.dispatch(this.view.state.tr
-                        .setMeta('fromContextMenu', true)
-                        .delete($pos.before(), $pos.after()));
+                    this.view.dispatch(this.view.state.tr.delete($pos.before(), $pos.after()));
                     break;
                 }
-                case 'bibliography_element': {
+                case 'box_element': {
                     const $pos = this.resolvePos();
-                    this.view.dispatch(this.view.state.tr.delete($pos.before($pos.depth), $pos.after($pos.depth)));
+                    this.view.dispatch(this.view.state.tr.delete($pos.before($pos.depth - 1), $pos.after($pos.depth - 1)));
                     break;
                 }
                 default: {

package/dist/cjs/plugins/section-category/section-category-utils.js

@@ -87,6 +87,9 @@ function buildPluginState(state, props) {
                 decorations.push(prosemirror_view_1.Decoration.widget(pos + 1, (view) => createButton(view, props, node, pos, attrs.category, can === null || can === void 0 ? void 0 : can.editArticle)));
             }
         }
+        if (node.type === transform_1.schema.nodes.box_element) {
+            return false;
+        }
     });
     return { decorations: prosemirror_view_1.DecorationSet.create(state.doc, decorations) };
 }

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

@@ -10,7 +10,8 @@ const autocompletion_1 = require("./autocompletion");
 exports.sectionTitleKey = new prosemirror_state_1.PluginKey('sectionNumbering');
 const calculateSectionLevels = (node, startPos, sectionNumberMap, numbering = [0]) => {
     node.forEach((childNode, offset) => {
-        if (childNode.type === transform_1.schema.nodes.section &&
+        if ((childNode.type === transform_1.schema.nodes.section ||
+            childNode.type === transform_1.schema.nodes.box_element) &&
             !(0, track_changes_utils_1.isRejectedInsert)(childNode)) {
             numbering[numbering.length - 1] += 1;
             const sectionNumber = numbering.join('.');

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 = '2.2.10';
+exports.VERSION = '2.2.11-LEAN-3969.0';
 exports.MATHJAX_VERSION = '3.2.2';

package/dist/cjs/views/box_element.js

@@ -0,0 +1,37 @@
+"use strict";
+/*!
+ * © 2019 Atypon Systems LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BoxElementView = void 0;
+const block_view_1 = __importDefault(require("./block_view"));
+const creators_1 = require("./creators");
+class BoxElementView extends block_view_1.default {
+    constructor() {
+        super(...arguments);
+        this.elementType = 'div';
+        this.createElement = () => {
+            this.contentDOM = document.createElement(this.elementType);
+            this.contentDOM.className = 'block box-element';
+            this.contentDOM.setAttribute('id', this.node.attrs.id);
+            this.dom.appendChild(this.contentDOM);
+        };
+    }
+}
+exports.BoxElementView = BoxElementView;
+exports.default = (0, creators_1.createNodeView)(BoxElementView);

package/dist/cjs/views/section_title.js

@@ -34,7 +34,10 @@ class SectionTitleView extends block_view_1.default {
             const sectionTitleState = section_title_1.sectionTitleKey.getState(this.view.state);
             const parentSection = (0, prosemirror_utils_1.findParentNodeOfTypeClosestToPos)($pos, transform_1.schema.nodes.section);
             const sectionNumber = sectionTitleState === null || sectionTitleState === void 0 ? void 0 : sectionTitleState.get(parentSection === null || parentSection === void 0 ? void 0 : parentSection.node.attrs.id);
-            const level = $pos.depth > 1 ? $pos.depth - 1 : $pos.depth;
+            let level = $pos.depth > 1 ? $pos.depth - 1 : $pos.depth;
+            if ((0, prosemirror_utils_1.findParentNodeOfTypeClosestToPos)($pos, transform_1.schema.nodes.box_element)) {
+                level = level - 2;
+            }
             if (this.node.childCount) {
                 this.contentDOM.classList.remove('empty-node');
             }
@@ -42,7 +45,7 @@ class SectionTitleView extends block_view_1.default {
                 this.contentDOM.classList.add('empty-node');
                 this.contentDOM.setAttribute('data-placeholder', `${(0, context_menu_1.sectionLevel)(level)} heading`);
             }
-            if (sectionTitleState) {
+            if (sectionTitleState && sectionNumber) {
                 this.contentDOM.dataset.sectionNumber = sectionNumber;
                 this.contentDOM.dataset.titleLevel = level.toString();
             }

package/dist/es/commands.js

@@ -79,11 +79,14 @@ export const blockActive = (type) => (state) => {
     return false;
 };
 export const canInsert = (type) => (state) => {
+    var _a;
     const { $from, $to } = state.selection;
     if ($from.node().type === schema.nodes.title && $from.pos === $to.pos) {
         return false;
     }
-    for (let d = $from.depth; d >= 0; d--) {
+    const initDepth = ((_a = findParentNodeOfType(schema.nodes.box_element)(state.selection)) === null || _a === void 0 ? void 0 : _a.depth) ||
+        0;
+    for (let d = $from.depth; d >= initDepth; d--) {
         const index = $from.index(d);
         if ($from.node(d).canReplaceWith(index, index, type)) {
             return true;
@@ -476,7 +479,8 @@ export const insertGraphicalAbstract = (state, dispatch, view) => {
 };
 export const insertSection = (subsection = false) => (state, dispatch, view) => {
     const selection = state.selection;
-    if (hasParentNodeOfType(schema.nodes.bibliography_section)(selection)) {
+    if (hasParentNodeOfType(schema.nodes.bibliography_section)(selection) ||
+        (!subsection && hasParentNodeOfType(schema.nodes.box_element)(selection))) {
         return false;
     }
     let pos;
@@ -880,6 +884,7 @@ const isCommentingAllowed = (type) => type === schema.nodes.title ||
     type === schema.nodes.bibliography_item ||
     type === schema.nodes.footnotes_section ||
     type === schema.nodes.bibliography_section ||
+    type === schema.nodes.box_element ||
     type === schema.nodes.graphical_abstract_section ||
     type === schema.nodes.keyword_group ||
     type === schema.nodes.paragraph ||

package/dist/es/components/toolbar/LevelSelector.js

@@ -16,6 +16,7 @@
 import { generateNodeID, getListType, isSectionNodeType, nodeNames, } from '@manuscripts/transform';
 import { Fragment } from 'prosemirror-model';
 import { TextSelection } from 'prosemirror-state';
+import { findParentNodeOfType } from 'prosemirror-utils';
 import React from 'react';
 import Select from 'react-select';
 import styled from 'styled-components';
@@ -34,7 +35,9 @@ const optionName = (nodeType, depth, listType) => {
 const titleCase = (text) => text.replace(/\b([a-z])/g, (match) => match.toUpperCase());
 const buildOption = (props) => (Object.assign(Object.assign({}, props), { icon: nodeTypeIcon(props.nodeType, props.listType), label: titleCase(optionName(props.nodeType, props.depth, props.listType)), isDisabled: Boolean(props.isDisabled), isSelected: Boolean(props.isSelected), isFocused: Boolean(props.isFocused) }));
 const buildOptions = (state, dispatch, view) => {
+    var _a;
     const { doc, selection: { $from, $to }, schema, tr, } = state;
+    doc.resolve($from.index($from.depth - 1));
     const { nodes } = schema;
     if (!$from.sameParent($to)) {
         return [];
@@ -43,6 +46,7 @@ const buildOptions = (state, dispatch, view) => {
     if (!parentElement) {
         return [];
     }
+    const depth = ((_a = findParentNodeOfType(schema.nodes.box_element)(state.selection)) === null || _a === void 0 ? void 0 : _a.depth) || 1;
     const moveParagraphToNewSubsection = () => {
         const paragraph = $from.node($from.depth);
         const beforeParagraph = $from.before($from.depth);
@@ -125,7 +129,7 @@ const buildOptions = (state, dispatch, view) => {
         const $beforeParagraph = doc.resolve(beforeParagraph);
         const beforeParagraphOffset = $beforeParagraph.parentOffset;
         const afterParagraphOffset = beforeParagraphOffset + paragraph.nodeSize;
-        const sectionDepth = $from.depth - 1;
+        const sectionDepth = $from.depth - depth;
         const parentSection = $from.node(sectionDepth);
         const startIndex = $from.index(sectionDepth);
         const endIndex = $from.indexAfter(sectionDepth);
@@ -161,7 +165,7 @@ const buildOptions = (state, dispatch, view) => {
         const afterSectionTitle = $from.after($from.depth);
         const $afterSectionTitle = doc.resolve(afterSectionTitle);
         const afterSectionTitleOffset = $afterSectionTitle.parentOffset;
-        const sectionDepth = $from.depth - 1;
+        const sectionDepth = $from.depth - depth;
         const section = $from.node(sectionDepth);
         const beforeSection = $from.before(sectionDepth);
         const afterSection = $from.after(sectionDepth);
@@ -207,7 +211,7 @@ const buildOptions = (state, dispatch, view) => {
     const parentElementType = parentElement.node.type;
     switch (parentElementType) {
         case parentElementType.schema.nodes.section: {
-            const sectionDepth = Math.max(1, $from.depth - 1);
+            const sectionDepth = Math.max(1, $from.depth - depth);
             const parentSectionDepth = sectionDepth - 1;
             const minimumDepth = Math.max(1, parentSectionDepth);
             const beforeSection = $from.before(sectionDepth);
@@ -278,7 +282,7 @@ const buildOptions = (state, dispatch, view) => {
             return [{ options: typeOptions }, { options: sectionOptions }];
         }
         case parentElementType.schema.nodes.paragraph: {
-            const sectionDepth = $from.depth - 1;
+            const sectionDepth = $from.depth - depth;
             const minimumDepth = Math.max(1, sectionDepth);
             let parentSectionDepth = 0;
             const typeOptions = [

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

@@ -17,6 +17,7 @@ import affiliations from '../views/affiliations';
 import authorNotes from '../views/author_notes';
 import bibliographyElement from '../views/bibliography_element';
 import blockquoteElement from '../views/blockquote_element_editable';
+import boxElement from '../views/box_element';
 import citation from '../views/citation_editable';
 import contributors from '../views/contributors';
 import crossReference from '../views/cross_reference_editable';
@@ -51,6 +52,7 @@ export default (props, dispatch) => {
         title: title(props, dispatch),
         bibliography_element: bibliographyElement(props, dispatch),
         blockquote_element: blockquoteElement(props),
+        box_element: boxElement(props),
         citation: citation(props, dispatch),
         cross_reference: crossReference(props, dispatch),
         contributors: contributors(props, dispatch),

package/dist/es/keys/misc.js

@@ -18,7 +18,7 @@ import { chainCommands, createParagraphNear, exitCode, joinDown, joinUp, lift, l
 import { redo, undo } from 'prosemirror-history';
 import { undoInputRule } from 'prosemirror-inputrules';
 import { goToNextCell } from 'prosemirror-tables';
-import { autoComplete, addToStart, ignoreAtomBlockNodeBackward, ignoreAtomBlockNodeForward, ignoreMetaNodeBackspaceCommand, insertBlock, insertBreak, insertCrossReference, insertInlineCitation, insertInlineEquation, insertSection, selectAllIsolating, } from '../commands';
+import { addToStart, autoComplete, ignoreAtomBlockNodeBackward, ignoreAtomBlockNodeForward, ignoreMetaNodeBackspaceCommand, insertBlock, insertBreak, insertCrossReference, insertInlineCitation, insertInlineEquation, insertSection, selectAllIsolating, } from '../commands';
 const customKeymap = {
     Backspace: chainCommands(undoInputRule, ignoreAtomBlockNodeBackward, ignoreMetaNodeBackspaceCommand),
     Delete: ignoreAtomBlockNodeForward,

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

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { getListType, isInBibliographySection, nodeNames, schema, } from '@manuscripts/transform';
+import { getListType, isInBibliographySection, isSectionTitleNode, nodeNames, schema, } from '@manuscripts/transform';
 import { findChildrenByType, hasParentNodeOfType } from 'prosemirror-utils';
 import { addNodeComment, createBlock, findPosBeforeFirstSubsection, insertGeneralFootnote, insertTableFootnote, } from '../commands';
 import { FootnotesSelector } from '../components/views/FootnotesSelector';
@@ -24,6 +24,8 @@ import { getActualAttrs, isDeleted, isRejectedInsert, } from './track-changes-ut
 import { getChildOfType, isChildOfNodeTypes } from './utils';
 const popper = new PopperManager();
 const readonlyTypes = [schema.nodes.keywords, schema.nodes.bibliography_element];
+const isBoxElementSectionTitle = ($pos, node) => isSectionTitleNode(node) &&
+    $pos.node($pos.depth - 1).type === schema.nodes.box_element;
 export const sectionLevel = (depth) => {
     switch (depth) {
         case 1:
@@ -143,7 +145,8 @@ export class ContextMenu {
             const menu = document.createElement('div');
             menu.className = 'menu';
             const $pos = this.resolvePos();
-            const type = this.node.type;
+            const isBox = isBoxElementSectionTitle($pos, this.node);
+            const type = isBox ? schema.nodes.box_element : this.node.type;
             if (type === schema.nodes.list) {
                 menu.appendChild(this.createMenuSection((section) => {
                     const actualAttrs = getActualAttrs(this.node);
@@ -331,14 +334,12 @@ export class ContextMenu {
             switch (nodeType.name) {
                 case 'section_title': {
                     const $pos = this.resolvePos();
-                    this.view.dispatch(this.view.state.tr
-                        .setMeta('fromContextMenu', true)
-                        .delete($pos.before(), $pos.after()));
+                    this.view.dispatch(this.view.state.tr.delete($pos.before(), $pos.after()));
                     break;
                 }
-                case 'bibliography_element': {
+                case 'box_element': {
                     const $pos = this.resolvePos();
-                    this.view.dispatch(this.view.state.tr.delete($pos.before($pos.depth), $pos.after($pos.depth)));
+                    this.view.dispatch(this.view.state.tr.delete($pos.before($pos.depth - 1), $pos.after($pos.depth - 1)));
                     break;
                 }
                 default: {

package/dist/es/plugins/section-category/section-category-utils.js

@@ -84,6 +84,9 @@ export function buildPluginState(state, props) {
                 decorations.push(Decoration.widget(pos + 1, (view) => createButton(view, props, node, pos, attrs.category, can === null || can === void 0 ? void 0 : can.editArticle)));
             }
         }
+        if (node.type === schema.nodes.box_element) {
+            return false;
+        }
     });
     return { decorations: DecorationSet.create(state.doc, decorations) };
 }

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

@@ -7,7 +7,8 @@ import { checkForCompletion } from './autocompletion';
 export const sectionTitleKey = new PluginKey('sectionNumbering');
 const calculateSectionLevels = (node, startPos, sectionNumberMap, numbering = [0]) => {
     node.forEach((childNode, offset) => {
-        if (childNode.type === schema.nodes.section &&
+        if ((childNode.type === schema.nodes.section ||
+            childNode.type === schema.nodes.box_element) &&
             !isRejectedInsert(childNode)) {
             numbering[numbering.length - 1] += 1;
             const sectionNumber = numbering.join('.');

package/dist/es/versions.js

@@ -1,2 +1,2 @@
-export const VERSION = '2.2.10';
+export const VERSION = '2.2.11-LEAN-3969.0';
 export const MATHJAX_VERSION = '3.2.2';

package/dist/es/views/box_element.js

@@ -0,0 +1,30 @@
+/*!
+ * © 2019 Atypon Systems LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import BlockView from './block_view';
+import { createNodeView } from './creators';
+export class BoxElementView extends BlockView {
+    constructor() {
+        super(...arguments);
+        this.elementType = 'div';
+        this.createElement = () => {
+            this.contentDOM = document.createElement(this.elementType);
+            this.contentDOM.className = 'block box-element';
+            this.contentDOM.setAttribute('id', this.node.attrs.id);
+            this.dom.appendChild(this.contentDOM);
+        };
+    }
+}
+export default createNodeView(BoxElementView);

package/dist/es/views/section_title.js

@@ -28,7 +28,10 @@ export class SectionTitleView extends BlockView {
             const sectionTitleState = sectionTitleKey.getState(this.view.state);
             const parentSection = findParentNodeOfTypeClosestToPos($pos, schema.nodes.section);
             const sectionNumber = sectionTitleState === null || sectionTitleState === void 0 ? void 0 : sectionTitleState.get(parentSection === null || parentSection === void 0 ? void 0 : parentSection.node.attrs.id);
-            const level = $pos.depth > 1 ? $pos.depth - 1 : $pos.depth;
+            let level = $pos.depth > 1 ? $pos.depth - 1 : $pos.depth;
+            if (findParentNodeOfTypeClosestToPos($pos, schema.nodes.box_element)) {
+                level = level - 2;
+            }
             if (this.node.childCount) {
                 this.contentDOM.classList.remove('empty-node');
             }
@@ -36,7 +39,7 @@ export class SectionTitleView extends BlockView {
                 this.contentDOM.classList.add('empty-node');
                 this.contentDOM.setAttribute('data-placeholder', `${sectionLevel(level)} heading`);
             }
-            if (sectionTitleState) {
+            if (sectionTitleState && sectionNumber) {
                 this.contentDOM.dataset.sectionNumber = sectionNumber;
                 this.contentDOM.dataset.titleLevel = level.toString();
             }

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

@@ -53,6 +53,7 @@ declare const _default: (props: EditorProps, dispatch: Dispatch) => {
         destroy: () => void;
         handleDecorations: (decorations: readonly import("prosemirror-view").Decoration[]) => void;
     } & import("../views/blockquote_element").BlockquoteElementView>;
+    box_element: import("../types").NodeViewCreator<import("../views/box_element").BoxElementView>;
     citation: import("../types").NodeViewCreator<import("../views/citation_editable").CitationEditableView>;
     cross_reference: import("../types").NodeViewCreator<import("../views/cross_reference_editable").CrossReferenceEditableView>;
     contributors: import("../types").NodeViewCreator<import("../views/contributors").ContributorsView>;

package/dist/types/versions.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION = "2.2.10";
+export declare const VERSION = "2.2.11-LEAN-3969.0";
 export declare const MATHJAX_VERSION = "3.2.2";

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

@@ -0,0 +1,23 @@
+/*!
+ * © 2019 Atypon Systems LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { ManuscriptNode } from '@manuscripts/transform';
+import BlockView from './block_view';
+export declare class BoxElementView extends BlockView<ManuscriptNode> {
+    elementType: string;
+    createElement: () => void;
+}
+declare const _default: (props: import("./base_node_view").BaseNodeProps, dispatch?: import("..").Dispatch | undefined) => import("../types").NodeViewCreator<BoxElementView>;
+export default _default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "2.2.10",
+  "version": "2.2.11-LEAN-3969.0",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -34,7 +34,7 @@
     "@manuscripts/library": "1.3.11",
     "@manuscripts/style-guide": "2.0.21",
     "@manuscripts/track-changes-plugin": "1.7.23",
-    "@manuscripts/transform": "3.0.0",
+    "@manuscripts/transform": "3.0.1-LEAN-3969.0",
     "@popperjs/core": "^2.11.8",
     "astrocite-eutils": "^0.16.4",
     "codemirror": "^5.58.1",

package/styles/AdvancedEditor.css

@@ -10,14 +10,24 @@
   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 .box-element section:not(.toc)
+.block-section_title h1::before {
+  content: none;
+}
+
 .ProseMirror > div .block-section_title > h1 {
   font-size: 16pt !important;
   font-style: normal !important;
   font-weight: bold !important;
   color: #000 !important;
   text-align: left;
-  margin-top: 8pt !important;
-  margin-bottom: 5pt !important;
+  padding-top: 8pt !important;
+  padding-bottom: 5pt !important;
   line-height: 1.5;
   text-indent: 0pt;
   display: inline;
@@ -60,8 +70,8 @@
   font-weight: normal !important;
   color: #353535 !important;
   text-align: left !important;
-  margin-top: 10pt !important;
-  margin-bottom: 10pt !important;
+  padding-top: 10pt !important;
+  padding-bottom: 10pt !important;
   line-height: 2 !important;
   text-indent: 0pt !important;
 }
@@ -131,6 +141,37 @@
   text-align: center !important;
 }
 
+.ProseMirror .block-container.block-box_element {
+  grid-template-columns: auto;
+}
+
+.ProseMirror .block-container.block-box_element > .block.box-element {
+  position: relative;
+  display: grid;
+  grid-template-columns: auto;
+}
+
+.ProseMirror .box-element .block-container .block {
+  background: #FAFAFA;
+  padding-left: 12px;
+  border-left: 2px solid #E2E2E2;
+  border-right: 2px solid #E2E2E2;
+}
+
+.ProseMirror .box-element::after {
+  content: ' ';
+  margin-left: 52px;
+  margin-right: 52px;
+  border-top: 2px solid #E2E2E2;
+}
+
+.box-element figcaption {
+  margin-left: 54px;
+  margin-right: 54px;
+  padding-bottom: 6px;
+  border-bottom: 2px solid #E2E2E2;
+}
+
 .unsupported-format-label {
   font-size: 140%;
   line-height: 1.3;
@@ -395,12 +436,17 @@ span.comment-marker {
   width: auto;
 }
 .author-notes > .block-section_title > .block-gutter,
-.keywords > .block-section_title > .block-gutter {
+.keywords > .block-section_title > .block-gutter,
+.block-box_element > .block-gutter {
   display: flex;
   justify-content: flex-end;
   margin-top: 0;
 }
 
+.block-box_element > .block-gutter {
+  margin-top: 14px;
+}
+
 .author-notes > .block-section_title > .block,
 .keywords > .block-section_title > .block {
   align-items: center;

package/styles/Editor.css

@@ -296,7 +296,7 @@
   word-wrap: break-word;
 }
 
-.ProseMirror .block-table_element figcaption {
+.ProseMirror .block-table_element figcaption, .block-box_element figcaption {
   text-align: left;
 }
 
@@ -666,7 +666,12 @@
   margin-top: 16px;
 }
 
-.ProseMirror .block-container:not(.block-section):hover .block-gutter {
+.ProseMirror .block-container:not(.block-section, .block-box_element):hover .block-gutter {
+  opacity: 1;
+  z-index: 2;
+}
+
+.ProseMirror .block-box_element:hover > .block-gutter {
   opacity: 1;
   z-index: 2;
 }
@@ -1055,4 +1060,4 @@
 }
 .highlight {
   background-color: #ffeebf !important;
-}
+}