@kerebron/extension-menu 0.4.3 → 0.4.4

package/esm/extension-markdown/src/types.d.ts

@@ -0,0 +1,28 @@
+type TupleArray = Array<[string, string]>;
+export declare const NESTING_OPENING = 1;
+export declare const NESTING_SELF_CLOSING = 0;
+export declare const NESTING_CLOSING = -1;
+type Nesting = -1 | 0 | 1;
+export declare class Token {
+    type: string;
+    tag: string;
+    nesting: Nesting;
+    attrs: TupleArray | null;
+    map: [number] | [number, number] | [number, number, number, number] | null;
+    level: number;
+    children: Array<Token> | null;
+    content: string;
+    markup: string;
+    info: string;
+    meta: any;
+    block: boolean;
+    hidden: boolean;
+    constructor(type: string, tag: string, nesting: Nesting);
+    attrIndex(name: string): number;
+    attrPush(attrData: [string, string]): void;
+    attrSet(name: string, value: string): void;
+    attrGet(name: string): string | null;
+    attrJoin(name: string, value: string): void;
+}
+export {};
+//# sourceMappingURL=types.d.ts.map

package/esm/extension-markdown/src/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/extension-markdown/src/types.ts"],"names":[],"mappings":"AAEA,KAAK,UAAU,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;AAE1C,eAAO,MAAM,eAAe,IAAI,CAAC;AACjC,eAAO,MAAM,oBAAoB,IAAI,CAAC;AACtC,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,KAAK,OAAO,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAE1B,qBAAa,KAAK;IAcP,IAAI,EAAE,MAAM;IACZ,GAAG,EAAE,MAAM;IACX,OAAO,EAAE,OAAO;IAfzB,KAAK,EAAE,UAAU,GAAG,IAAI,CAAQ;IAChC,GAAG,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CACnE;IACP,KAAK,EAAE,MAAM,CAAK;IAClB,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,IAAI,CAAQ;IACrC,OAAO,EAAE,MAAM,CAAM;IACrB,MAAM,EAAE,MAAM,CAAM;IACpB,IAAI,EAAE,MAAM,CAAM;IAClB,IAAI,EAAE,GAAG,CAAQ;IACjB,KAAK,UAAS;IACd,MAAM,UAAS;gBAGN,IAAI,EAAE,MAAM,EACZ,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,OAAO;IAIzB,SAAS,CAAC,IAAI,EAAE,MAAM;IAWtB,QAAQ,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;IAQnC,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;IAWnC,OAAO,CAAC,IAAI,EAAE,MAAM;IASpB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;CASrC"}

package/esm/extension-markdown/src/types.js

@@ -0,0 +1,131 @@
+// https://github.com/markdown-it/markdown-it/blob/master/lib/token.mjs
+export const NESTING_OPENING = 1;
+export const NESTING_SELF_CLOSING = 0;
+export const NESTING_CLOSING = -1;
+export class Token {
+    constructor(type, tag, nesting) {
+        Object.defineProperty(this, "type", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: type
+        });
+        Object.defineProperty(this, "tag", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: tag
+        });
+        Object.defineProperty(this, "nesting", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: nesting
+        });
+        Object.defineProperty(this, "attrs", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "map", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "level", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 0
+        });
+        Object.defineProperty(this, "children", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "content", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: ''
+        });
+        Object.defineProperty(this, "markup", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: ''
+        });
+        Object.defineProperty(this, "info", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: ''
+        });
+        Object.defineProperty(this, "meta", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "block", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        Object.defineProperty(this, "hidden", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+    }
+    attrIndex(name) {
+        if (!this.attrs)
+            return -1;
+        const attrs = this.attrs;
+        for (let i = 0, len = attrs.length; i < len; i++) {
+            if (attrs[i][0] === name)
+                return i;
+        }
+        return -1;
+    }
+    attrPush(attrData) {
+        if (this.attrs) {
+            this.attrs.push(attrData);
+        }
+        else {
+            this.attrs = [attrData];
+        }
+    }
+    attrSet(name, value) {
+        const idx = this.attrIndex(name);
+        const attrData = [name, value];
+        if (idx < 0 || !this.attrs) {
+            this.attrPush(attrData);
+        }
+        else {
+            this.attrs[idx] = attrData;
+        }
+    }
+    attrGet(name) {
+        const idx = this.attrIndex(name);
+        let value = null;
+        if (idx >= 0 && this.attrs) {
+            value = this.attrs[idx][1];
+        }
+        return value;
+    }
+    attrJoin(name, value) {
+        const idx = this.attrIndex(name);
+        if (idx < 0 || !this.attrs) {
+            this.attrPush([name, value]);
+        }
+        else {
+            this.attrs[idx][1] = this.attrs[idx][1] + ' ' + value;
+        }
+    }
+}

package/esm/extension-markdown/src/utils.d.ts

@@ -0,0 +1,8 @@
+export declare function spaces(num: number): string;
+export declare function inchesToSpaces(value: string): number;
+export declare function inchesToMm(value: string): number;
+export declare function inchesToPixels(value: string): number;
+export declare function fixCharacters(text: string): string;
+export declare function numberString(num: number, symbol?: string): string;
+export declare function romanize(num: number): string;
+//# sourceMappingURL=utils.d.ts.map

package/esm/extension-markdown/src/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/extension-markdown/src/utils.ts"],"names":[],"mappings":"AAAA,wBAAgB,MAAM,CAAC,GAAG,EAAE,MAAM,UAEjC;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAQpD;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAchD;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAKpD;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,UASzC;AAED,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,SAAM,UAkBrD;AAED,wBAAgB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAyB5C"}

package/esm/extension-markdown/src/utils.js

@@ -0,0 +1,86 @@
+export function spaces(num) {
+    return ' '.repeat(num || 0);
+}
+export function inchesToSpaces(value) {
+    if (!value) {
+        return 0;
+    }
+    if (value.endsWith('in')) {
+        return Math.floor(parseFloat(value.substring(0, value.length - 2)) / 0.125);
+    }
+    return 0;
+}
+export function inchesToMm(value) {
+    if (!value) {
+        return 0;
+    }
+    if (value.endsWith('pt')) {
+        return parseFloat(value.substring(0, value.length - 2)) * 0.3528;
+    }
+    if (value.endsWith('in')) {
+        return parseFloat(value.substring(0, value.length - 2)) * 25.4;
+    }
+    if (value.endsWith('em')) {
+        return parseFloat(value.substring(0, value.length - 2)) / 0.125 * 25.4;
+    }
+    return 0;
+}
+export function inchesToPixels(value) {
+    if (!value) {
+        return 0;
+    }
+    return Math.floor(100 * inchesToMm(value));
+}
+export function fixCharacters(text) {
+    return text
+        .replace(/’/g, "'")
+        .replace(/“/g, '"')
+        .replace(/”/g, '"')
+        // deno-lint-ignore no-control-regex
+        .replace(/\x0b/g, ' ')
+        .replace(/\u201d/g, '"')
+        .replace(/\u201c/g, '"');
+}
+export function numberString(num, symbol = '1') {
+    if (['a'].includes(symbol)) {
+        return String.fromCharCode('a'.charCodeAt(0) + num - 1) + '.  ';
+    }
+    if (['A'].includes(symbol)) {
+        return String.fromCharCode('A'.charCodeAt(0) + num - 1) + '.  ';
+    }
+    if (['I'].includes(symbol)) {
+        return `${romanize(num)}. `;
+    }
+    if (['i'].includes(symbol)) {
+        return `${romanize(num).toLowerCase()}. `;
+    }
+    if (['1'].includes(symbol)) {
+        return `${num}. `;
+    }
+    return `${num}. `;
+}
+export function romanize(num) {
+    const lookup = [
+        ['M', 1000],
+        ['CM', 900],
+        ['D', 500],
+        ['CD', 400],
+        ['C', 100],
+        ['XC', 90],
+        ['L', 50],
+        ['XL', 40],
+        ['X', 10],
+        ['IX', 9],
+        ['V', 5],
+        ['IV', 4],
+        ['I', 1],
+    ];
+    let roman = '';
+    for (const [symbol, value] of lookup) {
+        while (num >= value) {
+            roman += symbol;
+            num -= value;
+        }
+    }
+    return roman;
+}

package/esm/extension-menu/src/CustomMenuPlugin.d.ts

@@ -1,7 +1,6 @@
 import { EditorState, Plugin } from 'prosemirror-state';
 import { EditorView } from 'prosemirror-view';
 import type { CoreEditor } from '../../editor/src/mod.js';
-import { CustomMenuOptions } from './ExtensionCustomMenu.js';
 import type { MenuElement } from './menu.js';
 interface ToolItem {
     id: string;
@@ -19,6 +18,7 @@ export declare class CustomMenuView {
     pinnedDropdownMenu: HTMLElement | null;
     modal: HTMLElement | null;
     tools: ToolItem[];
+    trailingElements: MenuElement[];
     root: Document | ShadowRoot;
     resizeHandle: HTMLElement;
     editorContainer: HTMLElement;
@@ -26,7 +26,7 @@ export declare class CustomMenuView {
     private closePinnedDropdownHandler;
     private submenuStack;
     private pinnedDropdownStack;
-    constructor(editorView: EditorView, editor: CoreEditor, content: readonly (readonly MenuElement[])[]);
+    constructor(editorView: EditorView, editor: CoreEditor, content: readonly (readonly MenuElement[])[], trailingElements?: readonly MenuElement[]);
     private initializeTools;
     /**
      * Generate a stable ID from a label by converting it to a kebab-case slug.
@@ -54,8 +54,12 @@ export declare class CustomMenuView {
     update(view: EditorView, prevState: EditorState): void;
     destroy(): void;
 }
+export interface CustomMenuPluginOptions {
+    content: readonly (readonly MenuElement[])[];
+    trailingElements?: readonly MenuElement[];
+}
 export declare class CustomMenuPlugin extends Plugin {
-    constructor(editor: CoreEditor, options: CustomMenuOptions);
+    constructor(editor: CoreEditor, options: CustomMenuPluginOptions);
 }
 export {};
 //# sourceMappingURL=CustomMenuPlugin.d.ts.map

package/esm/extension-menu/src/CustomMenuPlugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CustomMenuPlugin.d.ts","sourceRoot":"","sources":["../../../src/extension-menu/src/CustomMenuPlugin.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAuB7C,UAAU,QAAQ;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,qBAAa,cAAc;IAkBvB,QAAQ,CAAC,UAAU,EAAE,UAAU;IAC/B,QAAQ,CAAC,MAAM,EAAE,UAAU;IAC3B,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE;IAnBvD,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC;IACrB,YAAY,EAAE,WAAW,CAAC;IAC1B,kBAAkB,EAAE,WAAW,GAAG,IAAI,CAAQ;IAC9C,KAAK,EAAE,WAAW,GAAG,IAAI,CAAQ;IACjC,KAAK,EAAE,QAAQ,EAAE,CAAM;IACvB,IAAI,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC5B,YAAY,EAAE,WAAW,CAAC;IAC1B,eAAe,EAAE,WAAW,CAAC;IAC7B,OAAO,CAAC,oBAAoB,CAA0C;IACtE,OAAO,CAAC,0BAA0B,CAA0C;IAC5E,OAAO,CAAC,YAAY,CAAmD;IACvE,OAAO,CAAC,mBAAmB,CAEpB;gBAGI,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,SAAS,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE;IAgEvD,OAAO,CAAC,eAAe;IAgCvB;;;OAGG;IACH,OAAO,CAAC,gBAAgB;IAyBxB;;OAEG;IACH,OAAO,CAAC,UAAU;IAUlB,OAAO,CAAC,YAAY;IAyBpB,OAAO,CAAC,eAAe;IAsCvB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,WAAW;IAqCnB,OAAO,CAAC,MAAM;IAQd,OAAO,CAAC,kBAAkB;IA0C1B,OAAO,CAAC,oBAAoB;IAsB5B,OAAO,CAAC,yBAAyB;IAuCjC,OAAO,CAAC,oBAAoB;IA8J5B,OAAO,CAAC,kBAAkB;IA6R1B,OAAO,CAAC,MAAM;IAyLd,OAAO,CAAC,eAAe;IAyHvB,OAAO,CAAC,gBAAgB;IAoBxB,OAAO,CAAC,WAAW;IAgDnB,MAAM,CAAC,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW;IAQ/C,OAAO;CA8BR;AAED,qBAAa,gBAAiB,SAAQ,MAAM;gBAC9B,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,iBAAiB;CAO3D"}
+{"version":3,"file":"CustomMenuPlugin.d.ts","sourceRoot":"","sources":["../../../src/extension-menu/src/CustomMenuPlugin.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAI1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAuB7C,UAAU,QAAQ;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,qBAAa,cAAc;IAmBvB,QAAQ,CAAC,UAAU,EAAE,UAAU;IAC/B,QAAQ,CAAC,MAAM,EAAE,UAAU;IAC3B,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE;IApBvD,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC;IACrB,YAAY,EAAE,WAAW,CAAC;IAC1B,kBAAkB,EAAE,WAAW,GAAG,IAAI,CAAQ;IAC9C,KAAK,EAAE,WAAW,GAAG,IAAI,CAAQ;IACjC,KAAK,EAAE,QAAQ,EAAE,CAAM;IACvB,gBAAgB,EAAE,WAAW,EAAE,CAAM;IACrC,IAAI,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC5B,YAAY,EAAE,WAAW,CAAC;IAC1B,eAAe,EAAE,WAAW,CAAC;IAC7B,OAAO,CAAC,oBAAoB,CAA0C;IACtE,OAAO,CAAC,0BAA0B,CAA0C;IAC5E,OAAO,CAAC,YAAY,CAAmD;IACvE,OAAO,CAAC,mBAAmB,CAEpB;gBAGI,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,SAAS,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE,EACrD,gBAAgB,CAAC,EAAE,SAAS,WAAW,EAAE;IAmE3C,OAAO,CAAC,eAAe;IAgCvB;;;OAGG;IACH,OAAO,CAAC,gBAAgB;IAyBxB;;OAEG;IACH,OAAO,CAAC,UAAU;IAUlB,OAAO,CAAC,YAAY;IAyBpB,OAAO,CAAC,eAAe;IAsCvB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,WAAW;IAqCnB,OAAO,CAAC,MAAM;IAQd,OAAO,CAAC,kBAAkB;IA0C1B,OAAO,CAAC,oBAAoB;IAsB5B,OAAO,CAAC,yBAAyB;IAuCjC,OAAO,CAAC,oBAAoB;IA8L5B,OAAO,CAAC,kBAAkB;IA6R1B,OAAO,CAAC,MAAM;IAuMd,OAAO,CAAC,eAAe;IAyHvB,OAAO,CAAC,gBAAgB;IAoBxB,OAAO,CAAC,WAAW;IAgDnB,MAAM,CAAC,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW;IAQ/C,OAAO;CA8BR;AAED,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,SAAS,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE,CAAC;IAC7C,gBAAgB,CAAC,EAAE,SAAS,WAAW,EAAE,CAAC;CAC3C;AAED,qBAAa,gBAAiB,SAAQ,MAAM;gBAC9B,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,uBAAuB;CAYjE"}

package/esm/extension-menu/src/CustomMenuPlugin.js

@@ -20,7 +20,7 @@ function debug(...args) {
     }
 }
 export class CustomMenuView {
-    constructor(editorView, editor, content) {
+    constructor(editorView, editor, content, trailingElements) {
         Object.defineProperty(this, "editorView", {
             enumerable: true,
             configurable: true,
@@ -75,6 +75,12 @@ export class CustomMenuView {
             writable: true,
             value: []
         });
+        Object.defineProperty(this, "trailingElements", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
         Object.defineProperty(this, "root", {
             enumerable: true,
             configurable: true,
@@ -120,6 +126,8 @@ export class CustomMenuView {
         debug('CustomMenuView constructor called');
         debug('Content groups:', content.length);
         this.root = editorView.root;
+        // Store trailing elements
+        this.trailingElements = trailingElements ? [...trailingElements] : [];
         // Create wrapper
         this.wrapper = document.createElement('div');
         this.wrapper.classList.add(CSS_PREFIX + '__wrapper');
@@ -434,6 +442,37 @@ export class CustomMenuView {
         // Create dropdown menu
         this.pinnedDropdownMenu = document.createElement('div');
         this.pinnedDropdownMenu.classList.add(CSS_PREFIX + '__pinned-dropdown');
+        // Inherit theme CSS variables from editor container
+        // This ensures dropdowns match the editor's theme even when appended to body
+        const editorContainer = this.editorView.dom.closest('.kb-component') ||
+            this.editorView.dom.parentElement;
+        if (editorContainer) {
+            const computedStyle = getComputedStyle(editorContainer);
+            const themeVars = [
+                // New unified naming
+                '--kb-menu-dropdown-bg',
+                '--kb-menu-dropdown-border',
+                '--kb-menu-dropdown-text',
+                // Legacy naming (for backwards compatibility)
+                '--kb-menu-dropdown-dark-bg',
+                '--kb-menu-dropdown-dark-border',
+                '--kb-menu-dropdown-dark-text',
+                // General theme colors
+                '--kb-color-surface',
+                '--kb-color-surface-elevated',
+                '--kb-color-surface-hover',
+                '--kb-color-border',
+                '--kb-color-border-strong',
+                '--kb-color-text',
+                '--kb-color-text-muted',
+            ];
+            themeVars.forEach((varName) => {
+                const value = computedStyle.getPropertyValue(varName).trim();
+                if (value) {
+                    this.pinnedDropdownMenu.style.setProperty(varName, value);
+                }
+            });
+        }
         // Position it below the trigger element
         const rect = triggerElement.getBoundingClientRect();
         this.pinnedDropdownMenu.style.position = 'absolute';
@@ -933,10 +972,27 @@ export class CustomMenuView {
             });
             this.toolbar.appendChild(overflowToggle);
         }
+        // Render trailing elements (always visible, not pinnable)
+        if (this.trailingElements.length > 0) {
+            // Add separator before trailing elements
+            const separator = document.createElement('div');
+            separator.classList.add(CSS_PREFIX + '__separator');
+            separator.classList.add(CSS_PREFIX + '__separator--trailing');
+            this.toolbar.appendChild(separator);
+            // Create a trailing group container
+            const trailingGroup = document.createElement('div');
+            trailingGroup.classList.add(CSS_PREFIX + '__trailing-group');
+            this.trailingElements.forEach((element) => {
+                const { dom, update } = element.render(this.editorView);
+                const wrapper = document.createElement('span');
+                wrapper.classList.add(CSS_PREFIX + '__trailing-item');
+                wrapper.appendChild(dom);
+                trailingGroup.appendChild(wrapper);
+            });
+            this.toolbar.appendChild(trailingGroup);
+        }
         // Render overflow menu content
         this.renderOverflowMenu();
-        console.log('[kb-custom-menu] render() complete. Toolbar children:', this.toolbar.children.length);
-        console.log('[kb-custom-menu] Toolbar HTML:', this.toolbar.innerHTML.substring(0, 200));
     }
     openManageModal() {
         // Close overflow menu
@@ -1123,7 +1179,7 @@ export class CustomMenuPlugin extends Plugin {
     constructor(editor, options) {
         super({
             view(editorView) {
-                return new CustomMenuView(editorView, editor, options.content);
+                return new CustomMenuView(editorView, editor, options.content, options.trailingElements);
             },
         });
     }

package/esm/extension-menu/src/ExtensionCustomMenu.d.ts

@@ -1,10 +1,14 @@
+import "../../_dnt.polyfills.js";
 import { Plugin } from 'prosemirror-state';
 import { Extension } from '../../editor/src/mod.js';
 import { type MenuElement } from './menu.js';
 export interface CustomMenuOptions {
-    content: readonly (readonly MenuElement[])[];
+    content?: readonly (readonly MenuElement[])[];
+    trailingElements?: readonly MenuElement[];
+    autoAddCollaborationStatus?: boolean;
+    autoAddLspStatus?: boolean;
 }
-export declare class ExtensionCustomMenu extends Extension {
+export declare class ExtensionCustomMenu extends Extension<CustomMenuOptions> {
     name: string;
     getProseMirrorPlugins(): Plugin[];
 }

package/esm/extension-menu/src/ExtensionCustomMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExtensionCustomMenu.d.ts","sourceRoot":"","sources":["../../../src/extension-menu/src/ExtensionCustomMenu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC;AAI7C,MAAM,WAAW,iBAAiB;IAEhC,OAAO,EAAE,SAAS,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE,CAAC;CAC9C;AAGD,qBAAa,mBAAoB,SAAQ,SAAS;IAChD,IAAI,SAAgB;IAEX,qBAAqB,IAAI,MAAM,EAAE;CAS3C"}
+{"version":3,"file":"ExtensionCustomMenu.d.ts","sourceRoot":"","sources":["../../../src/extension-menu/src/ExtensionCustomMenu.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC;AAM7C,MAAM,WAAW,iBAAiB;IAEhC,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE,CAAC;IAG9C,gBAAgB,CAAC,EAAE,SAAS,WAAW,EAAE,CAAC;IAG1C,0BAA0B,CAAC,EAAE,OAAO,CAAC;IAGrC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAGD,qBAAa,mBAAoB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACnE,IAAI,SAAgB;IAEX,qBAAqB,IAAI,MAAM,EAAE;CA2C3C"}

package/esm/extension-menu/src/ExtensionCustomMenu.js

@@ -1,6 +1,9 @@
+import "../../_dnt.polyfills.js";
 import { Extension } from '../../editor/src/mod.js';
 import { buildMenu } from './buildMenu.js';
 import { CustomMenuPlugin } from './CustomMenuPlugin.js';
+import { CollaborationStatusElement } from '../../extension-yjs/src/CollaborationStatus.js';
+import { LspStatusElement } from '../../extension-lsp/src/LspStatus.js';
 /// Extension for a customizable menu with pinned items
 export class ExtensionCustomMenu extends Extension {
     constructor() {
@@ -13,10 +16,42 @@ export class ExtensionCustomMenu extends Extension {
         });
     }
     getProseMirrorPlugins() {
-        const content = buildMenu(this.editor, this.editor.schema);
+        const content = this.config?.content ??
+            buildMenu(this.editor, this.editor.schema);
+        const trailingElements = this.config?.trailingElements
+            ? [...this.config.trailingElements]
+            : [];
+        // Auto-add collaboration status if YJS extension is present
+        const autoAdd = this.config?.autoAddCollaborationStatus ?? true;
+        if (autoAdd) {
+            const yjsExtension = this.editor.getExtension('yjs');
+            if (yjsExtension) {
+                const yjsConfig = yjsExtension.config;
+                if (yjsConfig?.provider?.awareness) {
+                    const collabStatus = new CollaborationStatusElement({
+                        awareness: yjsConfig.provider.awareness,
+                        provider: yjsConfig.provider,
+                    });
+                    trailingElements.push(collabStatus);
+                }
+            }
+        }
+        // Auto-add LSP status if LSP extension is present
+        const autoAddLsp = this.config?.autoAddLspStatus ?? true;
+        if (autoAddLsp) {
+            const lspExtension = this.editor.getExtension('lsp');
+            if (lspExtension) {
+                const lspStatus = new LspStatusElement({
+                    lspExtension: lspExtension,
+                    label: 'LSP',
+                });
+                trailingElements.push(lspStatus);
+            }
+        }
         return [
             new CustomMenuPlugin(this.editor, {
                 content,
+                trailingElements,
             }),
         ];
     }

package/esm/extension-menu/src/mod.d.ts

@@ -1,3 +1,4 @@
+import "../../_dnt.polyfills.js";
 export { Dropdown, DropdownSubmenu, type MenuElement, MenuItem, type MenuItemSpec, } from './menu.js';
 export * from './ExtensionCustomMenu.js';
 //# sourceMappingURL=mod.d.ts.map

package/esm/extension-menu/src/mod.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mod.d.ts","sourceRoot":"","sources":["../../../src/extension-menu/src/mod.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,eAAe,EACf,KAAK,WAAW,EAChB,QAAQ,EACR,KAAK,YAAY,GAClB,MAAM,WAAW,CAAC;AAEnB,cAAc,0BAA0B,CAAC"}
+{"version":3,"file":"mod.d.ts","sourceRoot":"","sources":["../../../src/extension-menu/src/mod.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,EACL,QAAQ,EACR,eAAe,EACf,KAAK,WAAW,EAChB,QAAQ,EACR,KAAK,YAAY,GAClB,MAAM,WAAW,CAAC;AAEnB,cAAc,0BAA0B,CAAC"}

package/esm/extension-menu/src/mod.js

@@ -1,2 +1,3 @@
+import "../../_dnt.polyfills.js";
 export { Dropdown, DropdownSubmenu, MenuItem, } from './menu.js';
 export * from './ExtensionCustomMenu.js';

package/esm/extension-yjs/src/CollaborationStatus.d.ts

@@ -0,0 +1,59 @@
+import { EditorState, Plugin, PluginKey } from 'prosemirror-state';
+import { EditorView } from 'prosemirror-view';
+import type * as awarenessProtocol from 'y-protocols/awareness';
+import type { MenuElement } from '../../extension-menu/src/mod.js';
+export interface CollaborationUser {
+    clientId: number;
+    name: string;
+    color: string;
+    colorLight?: string;
+}
+export interface CollaborationStatusOptions {
+    /** The Yjs awareness instance */
+    awareness: awarenessProtocol.Awareness;
+    /** Called when connection status changes */
+    onStatusChange?: (status: 'connected' | 'connecting' | 'disconnected') => void;
+}
+/**
+ * Plugin key for accessing collaboration status state
+ */
+export declare const collaborationStatusPluginKey: PluginKey<CollaborationStatusState>;
+export interface CollaborationStatusState {
+    status: 'connected' | 'connecting' | 'disconnected';
+    users: CollaborationUser[];
+}
+/**
+ * Creates a ProseMirror plugin that tracks collaboration status and user presence.
+ * This plugin maintains state that can be accessed by other components.
+ */
+export declare function collaborationStatusPlugin(awareness: awarenessProtocol.Awareness, options?: {
+    onStatusChange?: (status: 'connected' | 'connecting' | 'disconnected') => void;
+}): Plugin;
+/**
+ * A menu element that displays collaboration status, user count, and a dropdown of users.
+ */
+export declare class CollaborationStatusElement implements MenuElement {
+    private awareness;
+    private provider;
+    private dom;
+    private statusDot;
+    private userCount;
+    private dropdown;
+    private userList;
+    private isOpen;
+    private status;
+    constructor(options: {
+        awareness: awarenessProtocol.Awareness;
+        provider: any;
+    });
+    render(view: EditorView): {
+        dom: HTMLElement;
+        update: (state: EditorState) => boolean;
+    };
+    private setStatus;
+    private updateUserList;
+    private toggleDropdown;
+    private openDropdown;
+    private closeDropdown;
+}
+//# sourceMappingURL=CollaborationStatus.d.ts.map

package/esm/extension-yjs/src/CollaborationStatus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollaborationStatus.d.ts","sourceRoot":"","sources":["../../../src/extension-yjs/src/CollaborationStatus.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,KAAK,KAAK,iBAAiB,MAAM,uBAAuB,CAAC;AAEhE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAInE,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,0BAA0B;IACzC,iCAAiC;IACjC,SAAS,EAAE,iBAAiB,CAAC,SAAS,CAAC;IACvC,4CAA4C;IAC5C,cAAc,CAAC,EAAE,CACf,MAAM,EAAE,WAAW,GAAG,YAAY,GAAG,cAAc,KAChD,IAAI,CAAC;CACX;AAED;;GAEG;AACH,eAAO,MAAM,4BAA4B,qCAEhB,CAAC;AAE1B,MAAM,WAAW,wBAAwB;IACvC,MAAM,EAAE,WAAW,GAAG,YAAY,GAAG,cAAc,CAAC;IACpD,KAAK,EAAE,iBAAiB,EAAE,CAAC;CAC5B;AAED;;;GAGG;AACH,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,iBAAiB,CAAC,SAAS,EACtC,OAAO,GAAE;IACP,cAAc,CAAC,EAAE,CACf,MAAM,EAAE,WAAW,GAAG,YAAY,GAAG,cAAc,KAChD,IAAI,CAAC;CACN,GACL,MAAM,CAsCR;AAiBD;;GAEG;AACH,qBAAa,0BAA2B,YAAW,WAAW;IAC5D,OAAO,CAAC,SAAS,CAA8B;IAC/C,OAAO,CAAC,QAAQ,CAAM;IACtB,OAAO,CAAC,GAAG,CAA4B;IACvC,OAAO,CAAC,SAAS,CAA4B;IAC7C,OAAO,CAAC,SAAS,CAA4B;IAC7C,OAAO,CAAC,QAAQ,CAA4B;IAC5C,OAAO,CAAC,QAAQ,CAA4B;IAC5C,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,MAAM,CAA6D;gBAGzE,OAAO,EAAE;QAAE,SAAS,EAAE,iBAAiB,CAAC,SAAS,CAAC;QAAC,QAAQ,EAAE,GAAG,CAAA;KAAE;IAMpE,MAAM,CACJ,IAAI,EAAE,UAAU,GACf;QAAE,GAAG,EAAE,WAAW,CAAC;QAAC,MAAM,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,OAAO,CAAA;KAAE;IA+FhE,OAAO,CAAC,SAAS;IAoBjB,OAAO,CAAC,cAAc;IAuDtB,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,aAAa;CAOtB"}