@manuscripts/body-editor 3.12.67 → 3.13.1

package/src/plugins/footnotes.ts

@@ -0,0 +1,298 @@
+/*!
+ * © 2024 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 { skipTracking } from '@manuscripts/track-changes-plugin'
+import {
+  FootnoteNode,
+  FootnotesElementNode,
+  generateAlphaFootnoteLabel,
+  InlineFootnoteNode,
+  isTableElementNode,
+  ManuscriptNode,
+  schema,
+} from '@manuscripts/transform'
+import { isEqual } from 'lodash'
+import { Plugin, PluginKey, TextSelection } from 'prosemirror-state'
+import { findChildrenByType } from 'prosemirror-utils'
+import { Decoration, DecorationSet } from 'prosemirror-view'
+
+import { EditorProps } from '../configs/ManuscriptsEditor'
+import { findNodeByID } from '../lib/doc'
+import {
+  findFootnotesContainerNode,
+  findParentFootnote,
+} from '../lib/footnotes'
+import { isInit } from '../lib/plugins'
+
+/**
+ * The state for a single footnotes_element.
+ */
+export type FootnotesElementState = {
+  /**
+   * A list of inline_footnote nodes that reference footnote nodes in
+   * this element.
+   */
+  inlineFootnotes: [InlineFootnoteNode, number][]
+  /**
+   * A set of footnote node IDs that are not referenced from any
+   * inline_footnote node.
+   */
+  unusedFootnoteIDs: Set<string>
+  /**
+   * A list of footnote nodes, in reference order. i.e. footnote nodes
+   * that are referenced earlier appear earlier in the list.
+   */
+  footnotes: [FootnoteNode, number][]
+  element: [FootnotesElementNode, number]
+  /**
+   * footnote node ID => label
+   */
+  labels: Map<string, string>
+}
+
+export type FootnotesPluginState = {
+  /**
+   * footnote_element ID => state
+   */
+  footnotesElements: Map<string, FootnotesElementState>
+  /**
+   * Tracks the footnote_element node ID corresponding to a few important
+   * node IDs. The node IDs tracked are:
+   * - inline_footnote node IDs
+   * - footnote node IDs
+   * - table_element node IDs
+   */
+  footnotesElementIDs: Map<string, string>
+}
+
+export const footnotesKey = new PluginKey<FootnotesPluginState>('footnotes')
+
+/**
+ * This plugin provides support of footnotes related behaviours
+ */
+const buildPluginState = (doc: ManuscriptNode) => {
+  const states = new Map()
+  const ids = new Map()
+  const elements = findChildrenByType(doc, schema.nodes.footnotes_element)
+  elements.map(({ node, pos }) => {
+    const container = findFootnotesContainerNode(doc, pos)
+    const newState = buildFootnotesElementState(
+      [container.node, container.pos],
+      [node as FootnotesElementNode, pos]
+    )
+    const elementID = node.attrs.id
+    states.set(elementID, newState)
+    newState.footnotes.forEach(([n]) => ids.set(n.attrs.id, elementID))
+    newState.inlineFootnotes.forEach(([n]) => ids.set(n.attrs.id, elementID))
+    ids.set(container.node.attrs.id, elementID)
+  })
+  return {
+    footnotesElements: states,
+    footnotesElementIDs: ids,
+  }
+}
+
+/**
+ * Build the state for a single footnotes_element node.
+ */
+const buildFootnotesElementState = (
+  container: [ManuscriptNode, number],
+  element: [FootnotesElementNode, number]
+): FootnotesElementState => {
+  const fn: FootnotesElementState = {
+    element,
+    inlineFootnotes: [],
+    unusedFootnoteIDs: new Set(),
+    footnotes: [],
+    labels: new Map(),
+  }
+
+  // process footnote nodes
+  const footnotes = findChildrenByType(element[0], schema.nodes.footnote)
+  const footnoteIDs = new Set()
+  footnotes.forEach(({ node, pos }) => {
+    fn.footnotes.push([node as FootnoteNode, element[1] + pos + 1])
+    // this set will start with every footnote node ID. Used IDs
+    // will be removed from it while processing inline_footnote nodes.
+    fn.unusedFootnoteIDs.add(node.attrs.id)
+    footnoteIDs.add(node.attrs.id)
+  })
+
+  // process inline_footnote nodes
+  let index = 0
+  const inlineFootnotes = findChildrenByType(
+    container[0],
+    schema.nodes.inline_footnote
+  )
+  inlineFootnotes.sort((a, b) => a.pos - b.pos)
+  // this is used to track footnote node IDs based on the order of
+  // the corresponding inline_footnote nodes. It will be used later to
+  // properly generate labels for footnotes, and to order the footnotes
+  // in the state object.
+  const orderedFootnoteIDs: string[] = []
+  inlineFootnotes.forEach(({ node, pos }) => {
+    const inlineFootnote = node as InlineFootnoteNode
+    const rids = inlineFootnote.attrs.rids.filter((rid) => footnoteIDs.has(rid))
+    if (!rids.length) {
+      return
+    }
+    if (container[1]) {
+      pos += container[1] + 1
+    }
+    fn.inlineFootnotes.push([node as InlineFootnoteNode, pos])
+    const label = rids
+      .map((rid) => {
+        //this is to ensure footnotes are processed only once
+        if (fn.labels.has(rid)) {
+          return fn.labels.get(rid)
+        } else {
+          const label = isTableElementNode(container[0])
+            ? String(++index)
+            : generateAlphaFootnoteLabel(index++)
+          fn.labels.set(rid, label)
+          fn.unusedFootnoteIDs.delete(rid)
+          orderedFootnoteIDs.push(rid)
+          return label
+        }
+      })
+      .join(', ')
+    fn.labels.set(node.attrs.id, label)
+  })
+  // At this point, the set includes only footnote node IDs that have no
+  // corresponding inline_footnote. These should be added to the end
+  // of the footnote node list.
+  fn.unusedFootnoteIDs.forEach((id) => orderedFootnoteIDs.push(id))
+  // Now the footnote list is sorted based on the appearance of the
+  // corresponding inline_footnote nodes.
+  fn.footnotes.sort(
+    ([a], [b]) =>
+      orderedFootnoteIDs.indexOf(a.attrs.id) -
+      orderedFootnoteIDs.indexOf(b.attrs.id)
+  )
+
+  return fn
+}
+
+const hasChanged = (
+  $new: FootnotesElementState,
+  $old?: FootnotesElementState
+) => {
+  const nids = $new.footnotes.map(([node]) => node.attrs.id)
+  const oids = $old?.footnotes.map(([node]) => node.attrs.id)
+  return !(
+    isEqual(nids, oids) &&
+    isEqual($new.unusedFootnoteIDs, $old?.unusedFootnoteIDs)
+  )
+}
+
+export default (props: EditorProps) => {
+  return new Plugin<FootnotesPluginState>({
+    key: footnotesKey,
+    state: {
+      init(config, instance): FootnotesPluginState {
+        return buildPluginState(instance.doc)
+      },
+      apply(tr, value, oldState, newState): FootnotesPluginState {
+        const $old = footnotesKey.getState(oldState)
+        if (!tr.docChanged && $old) {
+          return $old
+        }
+        return buildPluginState(newState.doc)
+      },
+    },
+    appendTransaction(transactions, oldState, newState) {
+      if (!transactions.find((tr) => tr.docChanged || isInit(tr))) {
+        return
+      }
+      const $old = footnotesKey.getState(oldState)
+      const $new = footnotesKey.getState(newState)
+      if (!$new) {
+        return
+      }
+
+      const tr = newState.tr
+
+      $new.footnotesElements.forEach((newState, key) => {
+        const element = newState.element[0]
+        const pos = newState.element[1]
+        const oldState = $old?.footnotesElements.get(key)
+        const footnotes = newState.footnotes.map(([node]) => node)
+
+        if (hasChanged(newState, oldState)) {
+          const newElement = schema.nodes.footnotes_element.create(
+            element.attrs,
+            // footnotes here is already in the correct order.
+            footnotes
+          )
+          tr.replaceWith(pos, pos + element.nodeSize, newElement)
+        }
+      })
+
+      if (!tr.steps.length) {
+        return
+      }
+
+      // this is to ensure that the selection remains valid if it
+      // was within a footnotes_element node that was replaced.
+      const selection = newState.selection
+      const selectedFootnote = findParentFootnote(selection)
+      if (selectedFootnote) {
+        const pos = findNodeByID(tr.doc, selectedFootnote.node.attrs.id)?.pos
+        if (pos) {
+          tr.setSelection(TextSelection.create(tr.doc, pos + 2))
+        }
+      }
+
+      skipTracking(tr)
+      return tr
+    },
+    props: {
+      decorations: (state) => {
+        const fns = footnotesKey.getState(state)
+        if (!fns) {
+          return DecorationSet.empty
+        }
+
+        const decorations: Decoration[] = []
+        fns.footnotesElements.forEach((fn) => {
+          fn.footnotes.forEach(([node, pos]) => {
+            const to = pos + node.nodeSize
+            const label = fn.labels.get(node.attrs.id)
+            decorations.push(Decoration.node(pos, to, {}, { label }))
+          })
+          fn.inlineFootnotes.forEach(([node, pos]) => {
+            const to = pos + node.nodeSize
+            const label = fn.labels.get(node.attrs.id)
+            decorations.push(Decoration.node(pos, to, {}, { label }))
+          })
+        })
+        if (props.getCapabilities().editArticle) {
+          const footnote = findParentFootnote(state.selection)
+          if (footnote) {
+            const pos = footnote.pos
+            const to = pos + footnote.node.nodeSize
+            decorations.push(
+              Decoration.node(pos, to, {
+                class: 'footnote-selected',
+              })
+            )
+          }
+        }
+        return DecorationSet.create(state.doc, decorations)
+      },
+    },
+  })
+}

package/src/plugins/link.ts

@@ -0,0 +1,53 @@
+/*!
+ * © 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 {
+  CHANGE_STATUS,
+  skipTracking,
+  TrackChangesAction,
+} from '@manuscripts/track-changes-plugin'
+import { schema } from '@manuscripts/transform'
+import { NodeSelection, Plugin } from 'prosemirror-state'
+
+/**
+ * This plugin make sure unselected link with empty href get deleted
+ */
+export default () =>
+  new Plugin({
+    appendTransaction(transactions, oldState, newState) {
+      if (
+        !transactions.some(
+          (tr) =>
+            oldState.selection instanceof NodeSelection &&
+            oldState.selection.node.type === schema.nodes.link &&
+            (tr.getMeta(TrackChangesAction.setChangeStatuses)?.status ===
+              CHANGE_STATUS.accepted ||
+              (tr.getMeta('pointer') && tr.selectionSet))
+        )
+      ) {
+        return null
+      }
+      const {
+        $from: { pos },
+        node,
+      } = oldState.selection as NodeSelection
+      if (!node.content.size || !node.attrs.href) {
+        const tr = newState.tr.setMeta('clear-empty-link', true)
+        tr.delete(pos, pos + node.nodeSize)
+        return skipTracking(tr.insert(pos, node.content))
+      }
+      return null
+    },
+  })

package/src/plugins/lock-body.ts

@@ -0,0 +1,136 @@
+/*!
+ * © 2025 Atypon Systems LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { schema } from '@manuscripts/transform'
+import { Node } from 'prosemirror-model'
+import { Plugin } from 'prosemirror-state'
+import { Decoration, DecorationSet } from 'prosemirror-view'
+
+import { lockIcon } from '../icons'
+import { isBodyLocked, isSelectionInBody } from '../lib/utils'
+
+/**
+ * This plugin prevents editing in the body of the document when it is locked.
+ * It also adds a lock icon to indicate that the body is non-editable.
+ */
+export default () => {
+  return new Plugin({
+    state: {
+      init(_, state) {
+        const decorations = isBodyLocked(state) ? getDecorations(state.doc) : []
+        return DecorationSet.create(state.doc, decorations)
+      },
+      apply(tr, oldDecorationSet, oldState, newState) {
+        if (
+          tr.docChanged ||
+          isBodyLocked(oldState) !== isBodyLocked(newState)
+        ) {
+          const decorations = isBodyLocked(newState)
+            ? getDecorations(newState.doc)
+            : []
+          return DecorationSet.create(newState.doc, decorations)
+        }
+        return oldDecorationSet
+      },
+    },
+    props: {
+      decorations(state) {
+        return this.getState(state) || DecorationSet.empty
+      },
+      handleDOMEvents: {
+        beforeinput(view, event) {
+          if (isSelectionInBody(view.state) && isBodyLocked(view.state)) {
+            event.preventDefault()
+            return true
+          }
+          return false
+        },
+        keydown(view, event) {
+          if (isSelectionInBody(view.state) && isBodyLocked(view.state)) {
+            event.preventDefault()
+            return true
+          }
+          return false
+        },
+        paste(view, event) {
+          if (isSelectionInBody(view.state) && isBodyLocked(view.state)) {
+            event.preventDefault()
+            return true
+          }
+          return false
+        },
+      },
+      handleClickOn: (view, pos, node, nodePos, event) => {
+        if (isSelectionInBody(view.state) && isBodyLocked(view.state)) {
+          event.preventDefault()
+          return true
+        }
+        return false
+      },
+      handleTripleClickOn: (view, pos, node, nodePos, event) => {
+        event.preventDefault()
+        return true
+      },
+    },
+  })
+}
+
+const getDecorations = (doc: Node): Decoration[] => {
+  const decorations: Decoration[] = []
+  doc.descendants((node, pos) => {
+    if (node.type === schema.nodes.body) {
+      decorations.push(
+        Decoration.node(pos, pos + node.nodeSize, { class: 'non-editable' })
+      )
+
+      decorations.push(
+        Decoration.widget(pos + 1, () => {
+          const div = document.createElement('div')
+          div.innerHTML = lockIcon
+          div.className = 'icon'
+          return div
+        })
+      )
+
+      decorations.push(
+        Decoration.widget(
+          pos + 1,
+          () => {
+            const overlay = document.createElement('div')
+            overlay.className = 'body-overlay'
+            return overlay
+          },
+          { side: 1 }
+        )
+      )
+    }
+
+    if (node.type.name === 'figure') {
+      decorations.push(
+        Decoration.widget(
+          pos + 1,
+          () => {
+            const overlay = document.createElement('div')
+            overlay.className = 'figure-overlay'
+            return overlay
+          },
+          { side: 1 }
+        )
+      )
+    }
+  })
+  return decorations
+}

package/src/plugins/move-node.ts

@@ -0,0 +1,55 @@
+/*!
+ * © 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 {
+  CHANGE_OPERATION,
+  CHANGE_STATUS,
+  TrackedAttrs,
+} from '@manuscripts/track-changes-plugin'
+import { Plugin } from 'prosemirror-state'
+import { Decoration, DecorationSet } from 'prosemirror-view'
+
+export default () => {
+  return new Plugin({
+    props: {
+      decorations(state) {
+        const decos: Decoration[] = []
+
+        // Find all nodes that are deleted parts of move operations
+        state.doc.descendants((node, pos) => {
+          const moveTrack = node.attrs.dataTracked?.find(
+            (t: TrackedAttrs) =>
+              t.operation === CHANGE_OPERATION.delete &&
+              t.status === CHANGE_STATUS.pending &&
+              t.moveNodeId // Has an associated move operation
+          )
+
+          if (moveTrack) {
+            decos.push(
+              Decoration.node(pos, pos + node.nodeSize, {
+                class: 'move-deleted-node',
+                'data-move-id': moveTrack.moveNodeId,
+                'data-original-id': node.attrs.id,
+              })
+            )
+          }
+        })
+
+        return DecorationSet.create(state.doc, decos)
+      },
+    },
+  })
+}

package/src/plugins/objects.ts

@@ -0,0 +1,125 @@
+/*!
+ * © 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 {
+  buildTargets,
+  ManuscriptNode,
+  schema,
+  Target,
+} from '@manuscripts/transform'
+import { Plugin, PluginKey } from 'prosemirror-state'
+import { Decoration, DecorationSet } from 'prosemirror-view'
+
+import { findChildren } from 'prosemirror-utils'
+import { clear } from '@manuscripts/track-changes-plugin'
+
+export const objectsKey = new PluginKey<Map<string, Target>>('objects')
+
+/**
+ * This plugin sets the labels for cross-references, and adds the label as a decoration to cross-referenceable elements.
+ */
+export default () => {
+  return new Plugin<Map<string, Target>>({
+    key: objectsKey,
+
+    state: {
+      init: (config, state) => {
+        // Build targets from filtered document to exclude moved nodes
+        return buildTargets(clear(state.doc).descendants) // @TODO - make sure binding works ok here - same problem as in transform
+      },
+      apply: (tr) => {
+        // TODO: use decorations to track figure deletion?
+        // TODO: map decorations?
+        // TODO: use setMeta to update labels
+
+        // Build targets from filtered document to exclude moved nodes
+        return buildTargets(clear(tr.doc).descendants)
+      },
+    },
+    props: {
+      decorations: (state) => {
+        const decorations: Decoration[] = []
+        const targets = objectsKey.getState(state)
+
+        if (targets) {
+          state.doc.descendants((node, pos) => {
+            const { id } = node.attrs
+            if (id) {
+              const target = targets.get(id)
+
+              if (target) {
+                const caption = findChildren(
+                  node,
+                  (node) =>
+                    node.type === schema.nodes.caption ||
+                    node.type === schema.nodes.caption_title,
+                  false
+                )[0]
+
+                if (caption) {
+                  let from: number
+                  let to: number
+                  if (caption.node.type === schema.nodes.caption_title) {
+                    from = pos + 1 + caption.pos
+                    to = from + caption.node.nodeSize
+                  } else {
+                    // caption node: decorate its first child (text_block) so the label
+                    // appears inline before the caption text
+                    const firstChild = caption.node.firstChild
+                    from = pos + 1 + caption.pos + 1
+                    to = from + (firstChild?.nodeSize || caption.node.nodeSize)
+                  }
+
+                  decorations.push(
+                    Decoration.node(from, to, {
+                      'element-label': target.label,
+                    })
+                  )
+                } else {
+                  // No caption at all — fall back to a widget label at the end of the node
+                  const labelPos = getDecorationPos(target, state.doc, pos)
+                  const labelNode = document.createElement('span')
+                  labelNode.className = 'element-label'
+                  labelNode.textContent = target.label
+                  decorations.push(
+                    Decoration.widget(labelPos, labelNode, {
+                      side: -1,
+                      key: `element-label-${id}-${target.label}`,
+                    })
+                  )
+                }
+              }
+            }
+          })
+        }
+        return DecorationSet.create(state.doc, decorations)
+      },
+    },
+  })
+}
+
+/**
+ * Returns the position for a widget decoration when there is no caption.
+ * Falls back to the end of the node.
+ */
+const getDecorationPos = (
+  target: Target,
+  doc: ManuscriptNode,
+  pos: number
+) => {
+  const $pos = doc.resolve(pos + 1)
+  return $pos.end()
+}