@manuscripts/body-editor 3.17.2 → 3.17.5

package/dist/es/versions.js

@@ -1,2 +1,2 @@
-export const VERSION = '3.17.2';
+export const VERSION = '3.17.5';
 export const MATHJAX_VERSION = '3.2.2';

package/dist/es/views/link_editable.js

@@ -13,14 +13,16 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { ContextMenu } from '@manuscripts/style-guide';
+import { isDeleted } from '@manuscripts/track-changes-plugin';
 import { schema } from '@manuscripts/transform';
 import { TextSelection } from 'prosemirror-state';
+import { convertLinkToSupplementWeblink } from '../commands';
 import { LinkForm, } from '../components/views/LinkForm';
 import { allowedHref } from '../lib/url';
 import { createEditableNodeView } from './creators';
 import { LinkView } from './link';
 import ReactSubView from './ReactSubView';
-import { isDeleted } from '@manuscripts/track-changes-plugin';
 export class LinkEditableView extends LinkView {
     constructor() {
         super(...arguments);
@@ -35,7 +37,7 @@ export class LinkEditableView extends LinkView {
             this.dom.addEventListener('click', this.handleClick);
         };
         this.selectNode = () => {
-            if (!isDeleted(this.node)) {
+            if (!isDeleted(this.node) && !this.node.attrs.href) {
                 this.showForm();
             }
         };
@@ -45,6 +47,50 @@ export class LinkEditableView extends LinkView {
         this.deselectNode = () => {
             this.closeForm();
         };
+        this.showContextMenu = () => {
+            if (!this.props.getCapabilities().editArticle) {
+                return;
+            }
+            this.closeForm();
+            const href = this.node.attrs.href;
+            const componentProps = {
+                actions: [
+                    {
+                        label: 'Edit',
+                        action: this.handleEdit,
+                        icon: 'Edit',
+                    },
+                    {
+                        label: 'Convert to Weblink',
+                        action: this.handleConvertToWebLink,
+                        icon: 'ConvertToWebLink',
+                    },
+                    {
+                        label: 'Open Link',
+                        action: this.handleOpenLink,
+                        icon: 'ExternalLink',
+                        disabled: !allowedHref(href),
+                    },
+                ],
+            };
+            this.popperContainer = ReactSubView(this.props, ContextMenu, componentProps, this.node, this.getPos, this.view, ['context-menu', 'link-context-menu']);
+            this.props.popper.show(this.dom, this.popperContainer, 'bottom');
+        };
+        this.handleEdit = () => {
+            this.closeForm();
+            this.showForm();
+        };
+        this.handleConvertToWebLink = () => {
+            this.closeForm();
+            convertLinkToSupplementWeblink(this.getPos(), this.node, this.view);
+        };
+        this.handleOpenLink = () => {
+            const href = this.node.attrs.href;
+            if (allowedHref(href)) {
+                window.open(href, '_blank', 'noopener,noreferrer');
+            }
+            this.closeForm();
+        };
         this.showForm = () => {
             if (!this.props.getCapabilities().editArticle) {
                 return;
@@ -65,9 +111,14 @@ export class LinkEditableView extends LinkView {
             this.props.popper.show(this.dom, this.popperContainer, 'bottom');
         };
         this.handleClick = (e) => {
-            if (this.props.getCapabilities().editArticle) {
-                e.preventDefault();
+            if (!this.props.getCapabilities().editArticle) {
+                return;
+            }
+            e.preventDefault();
+            if (isDeleted(this.node) || !this.node.attrs.href) {
+                return;
             }
+            this.showContextMenu();
         };
         this.handleCancel = () => {
             const attrs = this.node.attrs;

package/dist/types/commands.d.ts

@@ -35,6 +35,7 @@ export declare const insertEmbed: (state: ManuscriptEditorState, dispatch?: Disp
 export declare const insertTable: (config: TableConfig, state: ManuscriptEditorState, dispatch?: Dispatch) => boolean;
 export declare const insertSupplement: (file: FileAttachment, view: ManuscriptEditorView, setSelection?: boolean) => boolean;
 export declare const insertSupplementWeblink: (url: string, title: string, view: ManuscriptEditorView) => boolean;
+export declare const convertLinkToSupplementWeblink: (pos: number, node: ManuscriptNode, view: ManuscriptEditorView) => boolean;
 export declare const updateSupplementWeblink: (pos: number, url: string, title: string, view: ManuscriptEditorView) => boolean;
 export declare const insertAttachment: (file: FileAttachment, state: ManuscriptEditorState, type: string, dispatch?: Dispatch) => boolean;
 export declare const insertBlock: (nodeType: ManuscriptNodeType) => (state: ManuscriptEditorState, dispatch?: Dispatch) => boolean;
@@ -66,8 +67,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, insertAfterPos?: number) => boolean;
-export declare const insertTransGraphicalAbstract: (category: SectionCategory, insertAfterPos?: number) => (state: ManuscriptEditorState, dispatch?: Dispatch, view?: EditorView) => boolean;
+export declare const insertTransAbstract: (state: ManuscriptEditorState, dispatch?: Dispatch, category?: string) => boolean;
+export declare const insertTransGraphicalAbstract: (category: SectionCategory) => (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.17.2";
+export declare const VERSION = "3.17.5";
 export declare const MATHJAX_VERSION = "3.2.2";

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

@@ -23,6 +23,10 @@ export declare class LinkEditableView extends LinkView {
     selectNode: () => void;
     destroy: () => void;
     deselectNode: () => void;
+    private showContextMenu;
+    private handleEdit;
+    private handleConvertToWebLink;
+    private handleOpenLink;
     private showForm;
     private handleClick;
     private handleCancel;
@@ -31,5 +35,5 @@ export declare class LinkEditableView extends LinkView {
     private removeLink;
     private closeForm;
 }
-declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("..").Dispatch) => import("../types").NodeViewCreator<LinkEditableView>;
+declare const _default: (props: import("../configs/ManuscriptsEditor").EditorProps, dispatch?: import("../commands").Dispatch) => import("../types").NodeViewCreator<LinkEditableView>;
 export default _default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "3.17.2",
+  "version": "3.17.5",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -41,9 +41,9 @@
     "@citation-js/plugin-pubmed": "0.3.0",
     "@citation-js/plugin-ris": "0.7.18",
     "@iarna/word-count": "1.1.2",
-    "@manuscripts/style-guide": "3.7.1",
+    "@manuscripts/style-guide": "3.7.2",
     "@manuscripts/track-changes-plugin": "2.4.0",
-    "@manuscripts/transform": "4.5.2",
+    "@manuscripts/transform": "4.5.4",
     "@popperjs/core": "2.11.8",
     "citeproc": "2.4.63",
     "codemirror": "5.65.19",

package/src/commands.ts

@@ -543,6 +543,40 @@ export const insertSupplementWeblink = (
   return true
 }
 
+export const convertLinkToSupplementWeblink = (
+  pos: number,
+  node: ManuscriptNode,
+  view: ManuscriptEditorView
+) => {
+  const href = node.attrs.href
+  if (!href) {
+    return false
+  }
+
+  const text = node.textContent.trim()
+  const id = generateNodeID(schema.nodes.supplement)
+
+  const supplement = schema.nodes.supplement.createAndFill(
+    { id, href },
+    createAndFillCaption()
+  ) as SupplementNode
+
+  const crossReference = schema.nodes.cross_reference.create({
+    id: generateNodeID(schema.nodes.cross_reference),
+    rids: [id],
+    label: text,
+  })
+
+  const tr = view.state.tr
+  tr.replaceWith(pos, pos + node.nodeSize, crossReference)
+  upsertSupplementsSection(tr, supplement)
+  tr.setSelection(TextSelection.create(tr.doc, pos))
+
+  view.focus()
+  view.dispatch(tr)
+  return true
+}
+
 export const updateSupplementWeblink = (
   pos: number,
   url: string,
@@ -1109,24 +1143,20 @@ export const insertAbstractSection =
       return false
     }
     const abstracts = findAbstractsNode(state.doc)
-    const sections = findChildrenByType(abstracts.node, schema.nodes.section)
-    // Check if the section already exists
-    if (sections.some((s) => s.node.attrs.category === category.id)) {
+    const abstractNodes = findChildrenByType(
+      abstracts.node,
+      schema.nodes.abstract
+    )
+    if (abstractNodes.some((s) => s.node.attrs.category === category.id)) {
       return false
     }
 
-    // check if graphical abstract node exist to insert before it.
-    const ga = findChildrenByType(
-      state.doc,
-      schema.nodes.graphical_abstract_section
-    )[0]
-
-    let pos = ga ? ga.pos : abstracts.pos + abstracts.node.content.size + 1
-    if (category.id === 'abstract') {
-      pos = abstracts.pos + 1
-    }
+    const pos =
+      findInsertionPosition(schema.nodes.abstract, abstracts.node) +
+      abstracts.pos +
+      1
 
-    const node = schema.nodes.section.create({ category: category.id }, [
+    const node = schema.nodes.abstract.create({ category: category.id }, [
       schema.nodes.section_title.create({}, schema.text(category.titles[0])),
       schema.nodes.paragraph.create({ placeholder: 'Type abstract here...' }),
     ])
@@ -1204,15 +1234,13 @@ export const insertGraphicalAbstract =
       return false
     }
 
-    const ga = findChildrenByType(
-      state.doc,
-      schema.nodes.graphical_abstract_section
-    )[0]
-
-    // insert at the end of abstracts section
-    let pos = abstracts.pos + abstracts.node.content.size + 1
-    // abstract-key-image insert before abstract-graphical
-    pos = ga && category.id === 'abstract-key-image' ? ga.pos : pos
+    const pos =
+      findInsertionPosition(
+        schema.nodes.graphical_abstract_section,
+        abstracts.node
+      ) +
+      abstracts.pos +
+      1
 
     const node = schema.nodes.graphical_abstract_section.createAndFill(
       { category: category.id },
@@ -1503,8 +1531,7 @@ export const insertTOCSection = () => {
 export const insertTransAbstract = (
   state: ManuscriptEditorState,
   dispatch?: Dispatch,
-  category?: string,
-  insertAfterPos?: number
+  category?: string
 ) => {
   if (!templateAllows(state, schema.nodes.trans_abstract)) {
     return false
@@ -1532,11 +1559,8 @@ export const insertTransAbstract = (
   )
 
   const abstracts = findAbstractsNode(state.doc)
-
-  const pos =
-    insertAfterPos != null
-      ? insertAfterPos
-      : abstracts.pos + abstracts.node.nodeSize - 1
+  // append at the end of the abstracts node, not just the first valid-but-earlier slot.
+  const pos = abstracts.node.content.size + abstracts.pos + 1
   const tr = state.tr.insert(pos, node)
 
   const selection = TextSelection.create(tr.doc, pos + 1)
@@ -1547,7 +1571,7 @@ export const insertTransAbstract = (
 }
 
 export const insertTransGraphicalAbstract =
-  (category: SectionCategory, insertAfterPos?: number) =>
+  (category: SectionCategory) =>
   (state: ManuscriptEditorState, dispatch?: Dispatch, view?: EditorView) => {
     if (!templateAllows(state, schema.nodes.trans_graphical_abstract)) {
       return false
@@ -1559,10 +1583,7 @@ export const insertTransGraphicalAbstract =
     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 pos = abstracts.node.content.size + abstracts.pos + 1
 
     const node = schema.nodes.trans_graphical_abstract.createAndFill(
       {

package/src/components/references/ReferenceSearch.tsx

@@ -75,14 +75,7 @@ export const ReferenceSearch: React.FC<{
   onAdd: () => void
   onCite: (items: BibliographyItemAttrs[]) => void
   onCancel: () => void
-}> = ({
-  query: initialQuery,
-  sources,
-  items,
-  onAdd,
-  onCite,
-  onCancel,
-}) => {
+}> = ({ query: initialQuery, sources, items, onAdd, onCite, onCancel }) => {
   const [query, setQuery] = useState<string>(initialQuery || '')
   const [selections, setSelections] = useState(
     new Map<string, BibliographyItemAttrs>()

package/src/configs/editor-views.ts

@@ -137,6 +137,7 @@ export default (
     headshot_element: headshotElement(props, dispatch),
     headshot_image: headshotImage(props, dispatch),
     abstracts: abstracts(props),
+    abstract: section(props),
     trans_abstract: transAbstract(props),
     trans_graphical_abstract: transGraphicalAbstract(props),
     attachment: attachment(props, dispatch),

package/src/lib/__tests__/plugins.test.ts

@@ -34,7 +34,7 @@ import { defaultTheme } from '@manuscripts/style-guide'
 const userProfile: UserProfile = {
   _id: 'MPUserProfile:1',
   userID: 'MPUser:1',
-  connectID: 'connectID1'
+  connectID: 'connectID1',
 }
 
 const history = createMemoryHistory()

package/src/lib/context-menu.ts

@@ -397,7 +397,10 @@ export class ContextMenu {
         this.createMenuSection((section: HTMLElement) => {
           let nodeName = nodeNames.get(type) || ''
           if (type === schema.nodes.section_title) {
-            nodeName = nodeNames.get(schema.nodes.section) as string
+            const containerType = $pos.parent.type
+            nodeName =
+              nodeNames.get(containerType) ??
+              (nodeNames.get(schema.nodes.section) as string)
           }
           section.appendChild(
             this.createMenuItem(`Delete ${nodeName}`, () => {

package/src/menus.tsx

@@ -563,7 +563,7 @@ export const getEditorMenus = (
   const abstractSection = allAbstractsCategories.find(
     (s) => s.id === ABSTRACT_ID
   )
-  const ABSTRACT_GRAPHICAL_ID = 'abstract-graphical'
+  const ABSTRACT_GRAPHICAL_ID = 'graphical'
   const graphicalAbstractSection = allAbstractsCategories.find(
     (s) => s.id === ABSTRACT_GRAPHICAL_ID
   )

package/src/node-type-icons.tsx

@@ -69,6 +69,7 @@ const icons: Map<
   [nodes.paragraph, OutlineParagraphIcon],
   [nodes.pullquote_element, OutlinePullQuoteIcon],
   [nodes.section, OutlineSectionIcon],
+  [nodes.abstract, OutlineSectionIcon],
   [nodes.table_element, OutlineTableIcon],
   [nodes.graphical_abstract_section, OutlineSectionIcon],
   [nodes.trans_graphical_abstract, OutlineSectionIcon],

package/src/plugins/section_category.ts

@@ -15,6 +15,7 @@
  */
 import {
   getGroupCategories,
+  isAbstractNode,
   isSectionNode,
   schema,
   SectionCategory,
@@ -154,7 +155,8 @@ const buildPluginState = (
     if (node.type === schema.nodes.box_element) {
       return false
     }
-    if (isSectionNode(node)) {
+
+    if (isSectionNode(node) || isAbstractNode(node)) {
       const categoryID = node.attrs.category
       const category = categories.get(categoryID)
       const $pos = state.doc.resolve(pos)
@@ -191,7 +193,10 @@ const buildPluginState = (
 }
 
 const getUsedSectionCategoryIDs = (state: EditorState): Set<string> => {
-  const sections = findChildrenByType(state.doc, schema.nodes.section)
+  const sections = [
+    ...findChildrenByType(state.doc, schema.nodes.section),
+    ...findChildrenByType(state.doc, schema.nodes.abstract),
+  ]
   const used = new Set<string>()
   sections.forEach(({ node }) => {
     if (node.attrs.category) {

package/src/plugins/translations.ts

@@ -14,8 +14,13 @@
  * limitations under the License.
  */
 
-import { schema } from '@manuscripts/transform'
-import { Node } from 'prosemirror-model'
+import {
+  isAbstractNode,
+  isGraphicalAbstractSectionNode,
+  isTransAbstractNode,
+  isTransGraphicalAbstractNode,
+  schema,
+} from '@manuscripts/transform'
 import { Plugin } from 'prosemirror-state'
 import { Decoration, DecorationSet } from 'prosemirror-view'
 
@@ -23,11 +28,11 @@ import { insertTransAbstract, insertTransGraphicalAbstract } from '../commands'
 import { EditorProps } from '../configs/ManuscriptsEditor'
 import { addAuthorIcon, translateIcon } from '../icons'
 import { getLanguage, getLanguageLabel } from '../lib/languages'
-import { templateAllows } from '../lib/template'
 import {
-  handleEnterKey,
   createKeyboardInteraction,
+  handleEnterKey,
 } from '../lib/navigation-utils'
+import { templateAllows } from '../lib/template'
 
 const createMenuItem = (
   props: EditorProps,
@@ -90,11 +95,6 @@ const createLanguageMenu = (
   return { menu, destroy }
 }
 
-const getInsertionPos = (doc: Node, nodePos: number): number | null => {
-  const node = doc.nodeAt(nodePos)
-  return node ? nodePos + node.nodeSize : null
-}
-
 export default (props: EditorProps) =>
   new Plugin<null>({
     props: {
@@ -110,19 +110,14 @@ export default (props: EditorProps) =>
 
         const widgets: Decoration[] = []
 
-        state.doc.descendants((node, pos, parent) => {
+        state.doc.descendants((node, pos) => {
           const isAbstractSection =
-            (node.type === schema.nodes.section ||
-              node.type === schema.nodes.graphical_abstract_section) &&
-            parent?.type === schema.nodes.abstracts
+            isAbstractNode(node) || isGraphicalAbstractSectionNode(node)
 
           // Show "Add translation" for abstract sections
           if (isAbstractSection) {
-            const isGraphical =
-              node.type === schema.nodes.graphical_abstract_section
             const category = props.sectionCategories.get(node.attrs.category)
-
-            const canEdit = isGraphical
+            const canEdit = isGraphicalAbstractSectionNode(node)
               ? canEditTransGraphicalAbstract &&
                 category &&
                 insertTransGraphicalAbstract(category)(state)
@@ -142,12 +137,8 @@ export default (props: EditorProps) =>
                     const handleActivate = (event: Event) => {
                       event.preventDefault()
                       event.stopPropagation()
-                      const insertPos = getInsertionPos(view.state.doc, pos)
-                      if (insertPos == null) {
-                        return
-                      }
-                      if (isGraphical && category) {
-                        insertTransGraphicalAbstract(category, insertPos)(
+                      if (isGraphicalAbstractSectionNode(node) && category) {
+                        insertTransGraphicalAbstract(category)(
                           view.state,
                           view.dispatch,
                           view
@@ -156,8 +147,7 @@ export default (props: EditorProps) =>
                         insertTransAbstract(
                           view.state,
                           view.dispatch,
-                          node.attrs.category,
-                          insertPos
+                          node.attrs.category
                         )
                       }
                     }
@@ -177,8 +167,7 @@ export default (props: EditorProps) =>
 
           // Language selector for trans_abstract and trans_graphical_abstract nodes
           const isTransNode =
-            node.type === schema.nodes.trans_abstract ||
-            node.type === schema.nodes.trans_graphical_abstract
+            isTransAbstractNode(node) || isTransGraphicalAbstractNode(node)
 
           if (isTransNode) {
             const canEdit =

package/src/versions.ts

@@ -1,3 +1,3 @@
 //THIS FILE WAS GENERATED BY versions.mjs
-export const VERSION = '3.17.2';
+export const VERSION = '3.17.5';
 export const MATHJAX_VERSION = '3.2.2';

package/src/views/link_editable.ts

@@ -14,9 +14,12 @@
  * limitations under the License.
  */
 
+import { ContextMenu, ContextMenuProps } from '@manuscripts/style-guide'
+import { isDeleted } from '@manuscripts/track-changes-plugin'
 import { schema } from '@manuscripts/transform'
 import { TextSelection } from 'prosemirror-state'
 
+import { convertLinkToSupplementWeblink } from '../commands'
 import {
   LinkForm,
   LinkFormProps,
@@ -26,7 +29,6 @@ import { allowedHref } from '../lib/url'
 import { createEditableNodeView } from './creators'
 import { LinkView } from './link'
 import ReactSubView from './ReactSubView'
-import { isDeleted } from '@manuscripts/track-changes-plugin'
 
 export class LinkEditableView extends LinkView {
   protected popperContainer: HTMLDivElement
@@ -59,7 +61,7 @@ export class LinkEditableView extends LinkView {
   }
 
   public selectNode = () => {
-    if (!isDeleted(this.node)) {
+    if (!isDeleted(this.node) && !this.node.attrs.href) {
       this.showForm()
     }
   }
@@ -72,6 +74,67 @@ export class LinkEditableView extends LinkView {
     this.closeForm()
   }
 
+  private showContextMenu = () => {
+    if (!this.props.getCapabilities().editArticle) {
+      return
+    }
+
+    this.closeForm()
+
+    const href = this.node.attrs.href
+
+    const componentProps: ContextMenuProps = {
+      actions: [
+        {
+          label: 'Edit',
+          action: this.handleEdit,
+          icon: 'Edit',
+        },
+        {
+          label: 'Convert to Weblink',
+          action: this.handleConvertToWebLink,
+          icon: 'ConvertToWebLink',
+        },
+        {
+          label: 'Open Link',
+          action: this.handleOpenLink,
+          icon: 'ExternalLink',
+          disabled: !allowedHref(href),
+        },
+      ],
+    }
+
+    this.popperContainer = ReactSubView(
+      this.props,
+      ContextMenu,
+      componentProps,
+      this.node,
+      this.getPos,
+      this.view,
+      ['context-menu', 'link-context-menu']
+    )
+
+    this.props.popper.show(this.dom, this.popperContainer, 'bottom')
+  }
+
+  private handleEdit = () => {
+    this.closeForm()
+    this.showForm()
+  }
+
+  private handleConvertToWebLink = () => {
+    this.closeForm()
+    convertLinkToSupplementWeblink(this.getPos(), this.node, this.view)
+  }
+
+  private handleOpenLink = () => {
+    const href = this.node.attrs.href
+    if (allowedHref(href)) {
+      window.open(href, '_blank', 'noopener,noreferrer')
+    }
+    this.closeForm()
+  }
+
   private showForm = () => {
     if (!this.props.getCapabilities().editArticle) {
       return
@@ -106,9 +169,15 @@ export class LinkEditableView extends LinkView {
   }
 
   private handleClick = (e: Event) => {
-    if (this.props.getCapabilities().editArticle) {
-      e.preventDefault()
+    if (!this.props.getCapabilities().editArticle) {
+      return
+    }
+    e.preventDefault()
+
+    if (isDeleted(this.node) || !this.node.attrs.href) {
+      return
     }
+    this.showContextMenu()
   }
 
   private handleCancel = () => {

package/styles/Editor.css

@@ -694,12 +694,14 @@
   grid-template-columns: 52px auto 100px 28px;
 }
 .ProseMirror .block-container.block-section,
+.ProseMirror .block-container.block-abstract,
 .ProseMirror .block-container.block-graphical_abstract_section {
   position: relative;
   display: grid;
   grid-template-columns: auto;
 }
 .ProseMirror .block-container.block-section section,
+.ProseMirror .block-container.block-abstract section,
 .ProseMirror .block-container.block-graphical_abstract_section section {
   position: relative;
 }
@@ -707,6 +709,7 @@
 .ProseMirror
   .block-container:not(
     .block-section,
+    .block-abstract,
     .block-graphical_abstract_section
   ):hover {
   z-index: 2;
@@ -789,6 +792,7 @@
   .block-container:not(
     .block-section,
     .block-box_element,
+    .block-abstract,
     .block-graphical_abstract_section
   ):hover
   .block-gutter,
@@ -796,6 +800,7 @@
   .block-container:not(
     .block-section,
     .block-box_element,
+    .block-abstract,
     .block-graphical_abstract_section
   ):focus-within
   .block-gutter {
@@ -818,6 +823,7 @@
   .block-container:not(
     .block-section,
     .block-box_element,
+    .block-abstract,
     .block-graphical_abstract_section
   ):hover
   .action-gutter,
@@ -825,6 +831,7 @@
   .block-container:not(
     .block-section,
     .block-box_element,
+    .block-abstract,
     .block-graphical_abstract_section
   ):focus-within
   .action-gutter {