@modusoperandi/licit-floatingmenu 0.1.2 → 0.1.4

package/FloatingMenuDefaults.d.ts

@@ -0,0 +1,6 @@
+/**
+ * @license MIT
+ * @copyright Copyright 2025 Modus Operandi Inc. All Rights Reserved.
+ */
+import { FloatingMenuItem } from './model';
+export declare function getDefaultMenuItems(handlers: any): FloatingMenuItem[];

package/FloatingMenuDefaults.js

@@ -0,0 +1,72 @@
+/**
+ * @license MIT
+ * @copyright Copyright 2025 Modus Operandi Inc. All Rights Reserved.
+ */
+export function getDefaultMenuItems(handlers) {
+    return [
+        {
+            id: 'comment',
+            label: 'Add Comment',
+            isEnabled: handlers.enableCitationAndComment,
+            onClick: handlers.addComment,
+        },
+        {
+            id: 'tag',
+            label: 'Add Tag',
+            isEnabled: handlers.enableCitationAndComment,
+            onClick: handlers.addTag,
+        },
+        {
+            id: 'citation',
+            label: 'Create Citation',
+            isEnabled: handlers.enableCitationAndComment,
+            onClick: handlers.createCitation,
+        },
+        {
+            id: 'info',
+            label: 'Create Infoicon',
+            isEnabled: handlers.enableTagAndInfoicon,
+            onClick: handlers.createInfoIcon,
+        },
+        {
+            id: 'copy',
+            label: 'Copy (Ctrl + C)',
+            isEnabled: handlers.enableCopy,
+            onClick: handlers.copyRich,
+        },
+        {
+            id: 'copy-plain',
+            label: 'Copy Without Formatting',
+            isEnabled: handlers.enableCopy,
+            onClick: handlers.copyPlain,
+        },
+        {
+            id: 'paste',
+            label: 'Paste (Ctrl + V)',
+            isEnabled: handlers.enablePaste,
+            onClick: handlers.paste,
+        },
+        {
+            id: 'paste-plain',
+            label: 'Paste As Plain Text',
+            isEnabled: handlers.enablePaste,
+            onClick: handlers.pastePlain,
+        },
+        {
+            id: 'paste-ref',
+            label: 'Paste As Reference (Ctrl + Alt + V)',
+            isEnabled: handlers.enablePasteAsReference,
+            onClick: handlers.pasteAsReference,
+        },
+        {
+            id: 'slice',
+            label: 'Create Referent',
+            onClick: handlers.createSlice,
+        },
+        {
+            id: 'insert-ref',
+            label: 'Insert Reference',
+            onClick: handlers.showReferences,
+        },
+    ];
+}

package/FloatingMenuPlugin.d.ts

@@ -8,7 +8,7 @@ import { Node, Schema } from 'prosemirror-model';
 import { Plugin, PluginKey, EditorState } from 'prosemirror-state';
 import { PopUpHandle, Rect } from '@modusoperandi/licit-ui-commands';
 import { createSliceManager } from './slice';
-import { FloatRuntime } from './model';
+import { FloatRuntime, FloatingMenuItem } from './model';
 export declare const CMPluginKey: PluginKey<FloatingMenuPlugin>;
 interface SliceModel {
     name: string;
@@ -32,8 +32,9 @@ export declare class FloatingMenuPlugin extends Plugin {
     _popUpHandle: PopUpHandle | null;
     _view: EditorView | null;
     _urlConfig: UrlConfig | null;
+    menuItems?: FloatingMenuItem[];
     sliceManager: ReturnType<typeof createSliceManager>;
-    constructor(sliceRuntime: FloatRuntime, urlConfig?: UrlConfig);
+    constructor(sliceRuntime: FloatRuntime, urlConfig?: UrlConfig, menuItems?: FloatingMenuItem[]);
     initKeyCommands(): Plugin[];
     getEffectiveSchema(schema: Schema): Schema;
 }
@@ -47,7 +48,27 @@ export declare function clipboardHasData(): Promise<boolean>;
 export declare function clipboardHasProseMirrorData(): Promise<boolean>;
 export declare function getDecorations(doc: Node, state: EditorState): DecorationSet;
 export declare function positionAboveOrBelow(anchorRect?: Rect, bodyRect?: Rect): Rect;
-export declare function openFloatingMenu(plugin: FloatingMenuPlugin, view: EditorView, pos: number, anchorEl?: HTMLElement, contextPos?: {
+export declare function createMenuCallbacks(view: EditorView, plugin: FloatingMenuPlugin, hasClipboard?: boolean, hasPM?: boolean): {
+    enableCopy: () => boolean;
+    enablePaste: () => boolean;
+    enablePasteAsReference: () => boolean;
+    enableCitationAndComment: () => boolean;
+    enableTagAndInfoicon: () => boolean;
+    copyRich: () => void;
+    copyPlain: () => void;
+    paste: () => Promise<void>;
+    pastePlain: () => Promise<void>;
+    pasteAsReference: () => Promise<void>;
+    createCitation: () => void;
+    createInfoIcon: () => void;
+    createSlice: () => void;
+    showReferences: () => Promise<void>;
+    addComment: () => void;
+    addTag: () => void;
+};
+export declare function closeExistingPopup(plugin: FloatingMenuPlugin): void;
+export declare function createOnCloseHandler(plugin: FloatingMenuPlugin, anchorEl?: HTMLElement): () => void;
+export declare function openFloatingMenu(plugin: FloatingMenuPlugin, view: EditorView, pos?: number, anchorEl?: HTMLElement, contextPos?: {
     x: number;
     y: number;
 }): void;

package/FloatingMenuPlugin.js

@@ -12,17 +12,50 @@ import { v4 as uuidv4 } from 'uuid';
 import { insertReference } from '@modusoperandi/licit-referencing';
 import { createSliceManager } from './slice';
 import { createKeyMapPlugin, makeKeyMapWithCommon } from '@modusoperandi/licit-doc-attrs-step';
+import { getDefaultMenuItems } from './FloatingMenuDefaults';
 export const CMPluginKey = new PluginKey('floating-menu');
 export const KEY_COPY = makeKeyMapWithCommon('FloatingMenuPlugin', 'Mod-c');
 export const KEY_CUT = makeKeyMapWithCommon('FloatingMenuPlugin', 'Mod-x');
 export const KEY_PASTE = makeKeyMapWithCommon('FloatingMenuPlugin', 'Mod-v');
 export const KEY_PASTE_REF = makeKeyMapWithCommon('FloatingMenuPlugin', 'Mod-Alt-v');
+const EMPTY_DECORATIONS = DecorationSet.empty;
+function stepAddsParagraph(content) {
+    if (!Array.isArray(content)) {
+        return false;
+    }
+    return content.some((item) => {
+        if (!item || typeof item !== 'object') {
+            return false;
+        }
+        const node = item;
+        return node.type === 'paragraph' || stepAddsParagraph(node.content);
+    });
+}
+function shouldRescanDecorations(tr) {
+    const forceRescan = typeof tr.getMeta === 'function'
+        ? tr.getMeta(CMPluginKey)?.forceRescan
+        : false;
+    if (forceRescan) {
+        return true;
+    }
+    return tr.steps.some((step) => {
+        const serializedStep = step.toJSON();
+        if (serializedStep.stepType === 'setNodeMarkup' || serializedStep.stepType === 'replaceAround') {
+            return true;
+        }
+        if (serializedStep.stepType !== 'replace') {
+            return false;
+        }
+        return stepAddsParagraph(serializedStep.slice?.content);
+    });
+}
 export class FloatingMenuPlugin extends Plugin {
     _popUpHandle = null;
     _view = null;
     _urlConfig = null;
+    menuItems;
     sliceManager;
-    constructor(sliceRuntime, urlConfig = {}) {
+    constructor(sliceRuntime, urlConfig = {}, menuItems) {
         const sliceManager = createSliceManager(sliceRuntime);
         super({
             key: CMPluginKey,
@@ -33,21 +66,19 @@ export class FloatingMenuPlugin extends Plugin {
                     };
                 },
                 apply(tr, prev, _oldState, newState) {
-                    let decos = prev.decorations;
-                    if (!tr.docChanged) {
-                        return { decorations: decos ? DecorationSet.prototype.map.call(decos, tr.mapping, tr.doc) : decos };
+                    const forceRescan = typeof tr.getMeta === 'function'
+                        ? tr.getMeta(CMPluginKey)?.forceRescan
+                        : false;
+                    const mappedDecorations = prev.decorations
+                        ? prev.decorations.map(tr.mapping, tr.doc)
+                        : EMPTY_DECORATIONS;
+                    if (!tr.docChanged && !forceRescan) {
+                        return { decorations: mappedDecorations };
                     }
-                    decos = DecorationSet.prototype.map.call(decos, tr.mapping, tr.doc);
-                    const requiresRescan = tr.steps.some((step) => {
-                        const s = step.toJSON();
-                        return (s.stepType === 'replace' ||
-                            s.stepType === 'replaceAround' ||
-                            s.stepType === 'setNodeMarkup');
-                    }) || tr.getMeta(CMPluginKey)?.forceRescan;
-                    if (requiresRescan) {
-                        decos = getDecorations(tr.doc, newState);
+                    if (shouldRescanDecorations(tr)) {
+                        return { decorations: getDecorations(tr.doc, newState) };
                     }
-                    return { decorations: decos };
+                    return { decorations: mappedDecorations };
                 },
             },
             props: {
@@ -62,7 +93,7 @@ export class FloatingMenuPlugin extends Plugin {
                 plugin.sliceManager = sliceManager;
                 plugin._urlConfig = urlConfig;
                 getDocSlices.call(plugin, view);
-                view.dom.addEventListener('pointerdown', (e) => {
+                const pointerDownHandler = (e) => {
                     const targetEl = getClosestHTMLElement(e.target, '.float-icon');
                     if (!targetEl)
                         return;
@@ -72,9 +103,10 @@ export class FloatingMenuPlugin extends Plugin {
                     wrapper?.classList.add('popup-open');
                     const pos = Number(targetEl.dataset.pos);
                     openFloatingMenu(plugin, view, pos, targetEl);
-                });
+                };
+                view.dom.addEventListener('pointerdown', pointerDownHandler);
                 // --- Alt + Right Click handler ---
-                view.dom.addEventListener('contextmenu', (e) => {
+                const contextMenuHandler = (e) => {
                     if (e.altKey && e.button === 2 && view.editable) {
                         e.preventDefault();
                         e.stopPropagation();
@@ -84,7 +116,8 @@ export class FloatingMenuPlugin extends Plugin {
                         };
                         openFloatingMenu(plugin, view, undefined, undefined, pos);
                     }
-                });
+                };
+                view.dom.addEventListener('contextmenu', contextMenuHandler);
                 // --- Close popup on outside click ---
                 const outsideClickHandler = (e) => {
                     const el = e.target;
@@ -96,9 +129,18 @@ export class FloatingMenuPlugin extends Plugin {
                     }
                 };
                 document.addEventListener('click', outsideClickHandler);
-                return {};
+                return {
+                    destroy() {
+                        view.dom.removeEventListener('pointerdown', pointerDownHandler);
+                        view.dom.removeEventListener('contextmenu', contextMenuHandler);
+                        document.removeEventListener('click', outsideClickHandler);
+                        closeExistingPopup(plugin);
+                        plugin._view = null;
+                    },
+                };
             },
         });
+        this.menuItems = menuItems;
     }
     initKeyCommands() {
         return createKeyMapPlugin([
@@ -338,53 +380,58 @@ export function getDecorations(doc, state) {
     (node, pos) => {
         if (node.type.name !== 'paragraph')
             return;
-        const wrapper = document.createElement('span');
-        wrapper.className = 'pm-hamburger-wrapper';
-        const hamburger = document.createElement('span');
-        hamburger.className = 'float-icon fa fa-bars';
-        hamburger.style.fontFamily = 'FontAwesome'; // for fa compatibility
-        hamburger.dataset.pos = String(pos);
-        wrapper.appendChild(hamburger);
-        decorations.push(Decoration.widget(pos + 1, wrapper, { side: 1 }));
+        decorations.push(Decoration.widget(pos + 1, () => {
+            const wrapper = document.createElement('span');
+            wrapper.className = 'pm-hamburger-wrapper';
+            const hamburger = document.createElement('span');
+            hamburger.className = 'float-icon fa fa-bars';
+            hamburger.style.fontFamily = 'FontAwesome'; // for fa compatibility
+            hamburger.dataset.pos = String(pos);
+            wrapper.appendChild(hamburger);
+            return wrapper;
+        }, {
+            key: `float-icon-${node.attrs?.objectId ?? pos}`,
+            side: 1,
+        }));
         const decoFlags = node.attrs?.isDeco;
         if (!decoFlags)
             return;
         if (decoFlags.isSlice || decoFlags.isTag || decoFlags.isComment) {
-            // --- Container for gutter marks ---
-            const container = document.createElement('span');
-            container.style.position = 'absolute';
-            container.style.left = '27px';
-            container.style.display = 'inline-flex';
-            container.style.gap = '6px';
-            container.style.alignItems = 'center';
-            container.contentEditable = 'false';
-            container.style.userSelect = 'none';
-            // --- Slice ---
-            if (decoFlags.isSlice) {
-                const SliceMark = document.createElement('span');
-                SliceMark.id = `slicemark-${uuidv4()}`;
-                SliceMark.style.fontFamily = 'FontAwesome';
-                SliceMark.innerHTML = '&#xf097';
-                SliceMark.onclick = () => { };
-                container.appendChild(SliceMark);
-            }
-            // --- Tag ---
-            if (decoFlags.isTag) {
-                const TagMark = document.createElement('span');
-                TagMark.style.fontFamily = 'FontAwesome';
-                TagMark.innerHTML = '';
-                TagMark.onclick = () => { };
-                container.appendChild(TagMark);
-            }
-            // --- Comment ---
-            if (decoFlags.isComment) {
-                const CommentMark = document.createElement('span');
-                CommentMark.style.fontFamily = 'FontAwesome';
-                CommentMark.innerHTML = '';
-                CommentMark.onclick = () => { };
-                container.appendChild(CommentMark);
-            }
-            decorations.push(Decoration.widget(pos + 1, container, { side: -1 }));
+            decorations.push(Decoration.widget(pos + 1, () => {
+                const container = document.createElement('span');
+                container.style.position = 'absolute';
+                container.style.left = '27px';
+                container.style.display = 'inline-flex';
+                container.style.gap = '6px';
+                container.style.alignItems = 'center';
+                container.contentEditable = 'false';
+                container.style.userSelect = 'none';
+                if (decoFlags.isSlice) {
+                    const sliceMark = document.createElement('span');
+                    sliceMark.style.fontFamily = 'FontAwesome';
+                    sliceMark.innerHTML = '&#xf097';
+                    sliceMark.onclick = () => { };
+                    container.appendChild(sliceMark);
+                }
+                if (decoFlags.isTag) {
+                    const tagMark = document.createElement('span');
+                    tagMark.style.fontFamily = 'FontAwesome';
+                    tagMark.innerHTML = '';
+                    tagMark.onclick = () => { };
+                    container.appendChild(tagMark);
+                }
+                if (decoFlags.isComment) {
+                    const commentMark = document.createElement('span');
+                    commentMark.style.fontFamily = 'FontAwesome';
+                    commentMark.innerHTML = '';
+                    commentMark.onclick = () => { };
+                    container.appendChild(commentMark);
+                }
+                return container;
+            }, {
+                key: `float-marks-${node.attrs?.objectId ?? pos}-${Number(!!decoFlags.isSlice)}${Number(!!decoFlags.isTag)}${Number(!!decoFlags.isComment)}`,
+                side: -1,
+            }));
         }
     });
     return DecorationSet.create(state.doc, decorations);
@@ -426,46 +473,60 @@ export function positionAboveOrBelow(anchorRect, bodyRect) {
         h: Math.round(menuH),
     };
 }
-export function openFloatingMenu(plugin, view, pos, anchorEl, contextPos) {
-    // Close existing popup if any
+export function createMenuCallbacks(view, plugin, hasClipboard = true, hasPM = true) {
+    return {
+        enableCopy: () => !view.state.selection.empty,
+        enablePaste: () => hasClipboard,
+        enablePasteAsReference: () => hasPM,
+        enableCitationAndComment: () => !view.state.selection.empty,
+        enableTagAndInfoicon: () => true,
+        copyRich: () => copySelectionRich(view, plugin),
+        copyPlain: () => copySelectionPlain(view, plugin),
+        paste: () => pasteFromClipboard(view, plugin),
+        pastePlain: () => pasteAsPlainText(view, plugin),
+        pasteAsReference: () => pasteAsReference(view, plugin),
+        createCitation: () => createCitationHandler(view),
+        createInfoIcon: () => createInfoIconHandler(view),
+        createSlice: () => createNewSlice(view),
+        showReferences: () => showReferences(view),
+        addComment: () => { },
+        addTag: () => { },
+    };
+}
+export function closeExistingPopup(plugin) {
     if (plugin._popUpHandle) {
         plugin._popUpHandle.close(null);
-        plugin._popUpHandle = null;
     }
-    // Determine if clipboard has ProseMirror data
+}
+export function createOnCloseHandler(plugin, anchorEl) {
+    return () => {
+        plugin._popUpHandle = null;
+        anchorEl?.closest('.pm-hamburger-wrapper')?.classList.remove('popup-open');
+    };
+}
+export function openFloatingMenu(plugin, view, pos, anchorEl, contextPos) {
+    closeExistingPopup(plugin);
     Promise.all([clipboardHasProseMirrorData(), clipboardHasData()])
-        .then(([hasPM, clipboardHasData]) => {
-        plugin._popUpHandle = createPopUp(FloatingMenu, {
+        .then(([hasPM, hasClipboard]) => {
+        const ctx = {
             editorState: view.state,
-            editorView: view,
             paragraphPos: pos,
-            pasteAsReferenceEnabled: hasPM,
-            enablePasteAsPlainText: clipboardHasData,
-            copyRichHandler: () => copySelectionRich(view, plugin),
-            copyPlainHandler: () => copySelectionPlain(view, plugin),
-            pasteHandler: () => pasteFromClipboard(view, plugin),
-            pasteAsReferenceHandler: () => pasteAsReference(view, plugin),
-            pastePlainHandler: () => pasteAsPlainText(view, plugin),
-            createInfoIconHandler: () => createInfoIconHandler(view),
-            createCitationHandler: () => createCitationHandler(view),
-            createNewSliceHandler: () => createNewSlice(view),
-            showReferencesHandler: () => showReferences(view),
+        };
+        const items = plugin.menuItems ??
+            getDefaultMenuItems(createMenuCallbacks(view, plugin, hasClipboard, hasPM));
+        plugin._popUpHandle = createPopUp(FloatingMenu, {
+            context: ctx,
+            items,
         }, {
             anchor: anchorEl || view.dom,
-            contextPos: contextPos,
+            contextPos,
             position: positionAboveOrBelow,
             autoDismiss: false,
-            onClose: () => {
-                plugin._popUpHandle = null;
-                // Remove 'popup-open' class if anchor is a hamburger wrapper
-                anchorEl
-                    ?.closest('.pm-hamburger-wrapper')
-                    ?.classList.remove('popup-open');
-            },
+            onClose: createOnCloseHandler(plugin, anchorEl),
         });
     })
-        .catch(err => {
-        console.error('Failed to check clipboard data:', err);
+        .catch((err) => {
+        console.error('Failed to open floating menu:', err);
     });
 }
 export function addAltRightClickHandler(view, plugin) {
@@ -496,6 +557,8 @@ export function changeAttribute(_view) {
     const node = _view.state.doc.nodeAt(from);
     if (!node)
         return; // early return if node does not exist
+    if (node.attrs?.isDeco?.isSlice)
+        return;
     let tr = _view.state.tr;
     const newattrs = { ...node.attrs };
     const isDeco = { ...newattrs.isDeco };

package/FloatingPopup.d.ts

@@ -3,24 +3,12 @@
  * @copyright Copyright 2025 Modus Operandi Inc. All Rights Reserved.
  */
 import React from 'react';
-import { EditorState } from 'prosemirror-state';
+import { FloatingMenuItem, FloatingMenuContext } from './model';
 interface FloatingMenuProps {
-    editorState: EditorState;
-    paragraphPos: number;
-    pasteAsReferenceEnabled: boolean;
-    enablePasteAsPlainText: boolean;
-    copyRichHandler: () => void;
-    copyPlainHandler: () => void;
-    createCitationHandler: () => void;
-    createInfoIconHandler: () => void;
-    pasteHandler: () => void;
-    pasteAsReferenceHandler: () => void;
-    pastePlainHandler: () => void;
-    createNewSliceHandler: () => void;
-    showReferencesHandler: () => void;
+    context: FloatingMenuContext;
+    items: FloatingMenuItem[];
 }
-export declare class FloatingMenu extends React.PureComponent<FloatingMenuProps, FloatingMenuProps> {
-    constructor(props: any);
+export declare class FloatingMenu extends React.PureComponent<FloatingMenuProps> {
     render(): React.ReactNode;
 }
 export {};

package/FloatingPopup.js

@@ -5,41 +5,14 @@
 import React from 'react';
 import { CustomButton } from '@modusoperandi/licit-ui-commands';
 export class FloatingMenu extends React.PureComponent {
-    constructor(props) {
-        super(props);
-        this.state = {
-            ...props,
-        };
-    }
     render() {
-        const { editorState, paragraphPos } = this.props;
-        const { selection } = editorState;
-        const $from = selection.$from;
-        const $to = selection.$to;
-        const inThisParagraph = $from.before($from.depth) === paragraphPos &&
-            $to.before($to.depth) === paragraphPos;
-        const isTextSelected = inThisParagraph && !selection.empty;
-        const enableCitationAndComment = isTextSelected;
-        const enableTagAndInfoicon = inThisParagraph;
-        const enableCopy = !selection.empty;
+        const { context, items } = this.props;
         return (React.createElement("div", { className: "context-menu", role: "menu", tabIndex: -1 },
-            React.createElement("div", { className: "context-menu__items" },
-                React.createElement(CustomButton, { disabled: !enableCitationAndComment, label: "Create Citation", onClick: this.props.createCitationHandler }),
-                React.createElement(CustomButton, { disabled: !enableTagAndInfoicon, label: "Create Infoicon", onClick: this.props.createInfoIconHandler }),
-                React.createElement(CustomButton, { disabled: !enableCopy, label: "Copy(Ctrl + C)", onClick: this.props.copyRichHandler }),
-                React.createElement(CustomButton, { disabled: !enableCopy, label: "Copy Without Formatting", onClick: this.props.copyPlainHandler }),
-                React.createElement(CustomButton, { disabled: !this.props.enablePasteAsPlainText, label: "Paste(Ctrl + V)", onClick: () => {
-                        this.props.pasteHandler();
-                    } }),
-                React.createElement(CustomButton, { disabled: !this.props.enablePasteAsPlainText, label: "Paste As Plain Text", onClick: this.props.pastePlainHandler }),
-                React.createElement(CustomButton, { disabled: !this.props.pasteAsReferenceEnabled, label: "Paste As Reference(Ctrl + Alt + V)", onClick: () => {
-                        this.props.pasteAsReferenceHandler();
-                    } }),
-                React.createElement(CustomButton, { label: "Create Bookmark", onClick: () => {
-                        this.props.createNewSliceHandler();
-                    } }),
-                React.createElement(CustomButton, { label: "Insert Reference", onClick: () => {
-                        this.props.showReferencesHandler();
-                    } }))));
+            React.createElement("div", { className: "context-menu__items" }, items.map((item) => {
+                const enabled = item.isEnabled
+                    ? item.isEnabled(context)
+                    : true;
+                return (React.createElement(CustomButton, { key: item.id, label: item.label, disabled: !enabled, onClick: item.onClick }));
+            }))));
     }
 }

package/model.d.ts

@@ -2,6 +2,7 @@
  * @license MIT
  * @copyright Copyright 2025 Modus Operandi Inc. All Rights Reserved.
  */
+import { EditorState } from 'prosemirror-state';
 export interface SliceModel {
     name: string;
     description: string;
@@ -19,3 +20,13 @@ export interface FloatRuntime {
     insertCitationFloat(): void;
     insertReference(): Promise<SliceModel>;
 }
+export interface FloatingMenuContext {
+    editorState: EditorState;
+    paragraphPos?: number;
+}
+export interface FloatingMenuItem {
+    id: string;
+    label: string;
+    onClick: () => void;
+    isEnabled?: (ctx: FloatingMenuContext) => boolean;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "@modusoperandi/licit-floatingmenu",
-   "version": "0.1.2",
+   "version": "0.1.4",
    "type": "module",
    "description": "licit-floatingmenu plugin built with ProseMirror",
    "main": "index.js",
@@ -41,18 +41,18 @@
    },
    "devDependencies": {
       "@cfaester/enzyme-adapter-react-18": "^0.8.0",
-      "@modusoperandi/eslint-config": "^3.0.3",
+      "@modusoperandi/eslint-config": "^3.0.4",
       "@testing-library/jest-dom": "^6.9.1",
-      "@testing-library/react": "^16.3.1",
+      "@testing-library/react": "^16.3.2",
       "@testing-library/user-event": "^14.6.1",
       "@types/jest": "^29.5.14",
-      "@types/node": "^20.19.28",
+      "@types/node": "^20.19.37",
       "@types/orderedmap": "^2.0.0",
-      "@types/react": "^18.3.27",
+      "@types/react": "^18.3.28",
       "@types/react-dom": "^18.3.7",
       "copyfiles": "^2.4.1",
       "enzyme": "^3.11.0",
-      "eslint": "^9.39.2",
+      "eslint": "^9.39.4",
       "husky": "^9.1.7",
       "identity-obj-proxy": "^3.0.0",
       "jest": "^29.7.0",
@@ -62,7 +62,7 @@
       "jest-prosemirror": "^2.2.0",
       "jest-sonar-reporter": "^2.0.0",
       "lint-staged": "^15.5.2",
-      "prettier": "^3.7.4",
+      "prettier": "^3.8.1",
       "stylelint-config-standard": "^36.0.1",
       "stylelint-prettier": "^5.0.3",
       "ts-jest": "^29.4.6",

package/slice.js

@@ -2,13 +2,33 @@
  * @license MIT
  * @copyright Copyright 2025 Modus Operandi Inc. All Rights Reserved.
  */
+function getSliceCacheKey(slice) {
+    return [
+        slice.id ?? '',
+        slice.source ?? '',
+        slice.from ?? '',
+        slice.to ?? '',
+        slice.referenceType ?? '',
+    ].join('::');
+}
+function dedupeSlices(slices) {
+    const seen = new Set();
+    return slices.filter((slice) => {
+        const key = getSliceCacheKey(slice);
+        if (seen.has(key)) {
+            return false;
+        }
+        seen.add(key);
+        return true;
+    });
+}
 export function createSliceManager(runtime) {
     let docSlices = [];
     // store slices in cache
     function setSlices(slices, state) {
         const objectId = state.doc.attrs.objectId;
         const filteredSlices = slices.filter((slice) => slice.source === objectId);
-        docSlices = [...docSlices, ...filteredSlices];
+        docSlices = dedupeSlices([...docSlices, ...filteredSlices]);
     }
     function getDocSlices() {
         return docSlices;
@@ -19,25 +39,35 @@ export function createSliceManager(runtime) {
     }
     // add new slice to cache
     function addSliceToList(slice) {
-        docSlices.push(slice);
+        docSlices = dedupeSlices([...docSlices, slice]);
         return docSlices;
     }
     // apply slice attributes to the doc
     function setSliceAttrs(view) {
         const result = getDocSlices();
+        const sliceIds = new Set(result.map((slice) => slice.from).filter(Boolean));
+        if (sliceIds.size === 0) {
+            return;
+        }
         let tr = view.state.tr;
-        for (const obj of result) {
-            view.state.doc.descendants((nodeactual, pos) => {
-                if (nodeactual?.attrs?.objectId === obj?.from) {
-                    const newattrs = { ...nodeactual.attrs };
-                    const isDeco = { ...newattrs.isDeco };
-                    isDeco.isSlice = true;
-                    newattrs.isDeco = isDeco;
-                    tr = tr.setNodeMarkup(pos, undefined, newattrs);
-                }
-            });
+        let hasChanges = false;
+        view.state.doc.descendants((nodeactual, pos) => {
+            if (!sliceIds.has(nodeactual?.attrs?.objectId)) {
+                return;
+            }
+            if (nodeactual.attrs?.isDeco?.isSlice) {
+                return;
+            }
+            const newattrs = { ...nodeactual.attrs };
+            const isDeco = { ...newattrs.isDeco };
+            isDeco.isSlice = true;
+            newattrs.isDeco = isDeco;
+            tr = tr.setNodeMarkup(pos, undefined, newattrs);
+            hasChanges = true;
+        });
+        if (hasChanges) {
+            view.dispatch(tr);
         }
-        view.dispatch(tr);
     }
     function addInfoIcon() {
         return runtime?.insertInfoIconFloat();
@@ -60,6 +90,6 @@ export function createSliceManager(runtime) {
         addInfoIcon,
         addCitation,
         createSliceViaDialog,
-        insertReference
+        insertReference,
     };
 }

package/ui/menu.css

@@ -7,7 +7,6 @@
 /* Icon hidden by default */
 .float-icon {
   position: absolute;
-  right: 0;
   top: 0;
   cursor: pointer;
   margin-right: 6px;