@rg-dev/tinymce-helpers 1.0.11 → 1.0.12

package/index.d.mts

@@ -1,5 +1,14 @@
 import { Editor, RawEditorOptions } from 'tinymce';
 
+type RemoveIndexSignature<T> = {
+   [K in keyof T as
+   string extends K ? never :
+   number extends K ? never :
+   symbol extends K ? never :
+   K
+   ]: T[K]
+  };
+
 declare const skinsTable: {
     dark: () => Promise<{
         css: string;
@@ -10,20 +19,71 @@ declare const skinsTable: {
         skin: string;
     }>;
 };
-type RemoveIndexSignature<T> = {
-    [K in keyof T as string extends K ? never : number extends K ? never : symbol extends K ? never : K]: T[K];
-};
 type RawEditorOptionsExtended = RawEditorOptions & {
     quickbars_insert_toolbar?: string;
     quickbars_selection_toolbar?: string;
+    image_advtab: boolean;
 };
+type EditorOpts = Omit<RemoveIndexSignature<RawEditorOptionsExtended>, 'setup' | 'target' | 'selector'> & Record<string, unknown>;
+/** A partial patch object, or a function that derives one from the defaults. */
+type TinyMCEPatch = Partial<EditorOpts> | ((defaults: EditorOpts) => Partial<EditorOpts>);
+declare class ListBuilder {
+    private items;
+    constructor(existing: string);
+    /** add('btn') appends at the end. add(3, 'btn') inserts at index 3. */
+    add(indexOrItem: number | string, item?: string): this;
+    start(item: string): this;
+    after(target: string, item: string): this;
+    before(target: string, item: string): this;
+    remove(...names: string[]): this;
+    /** Insert a '|' separator at the end, or at a given index. */
+    separator(index?: number): this;
+    toString(): string;
+}
+type ListPatch = string | ((t: ListBuilder) => ListBuilder | void);
+type MenuEntry = {
+    title: string;
+    items: string;
+};
+type MenuConfig = Record<string, MenuEntry>;
+declare class MenuBuilder {
+    private menus;
+    constructor(existing: MenuConfig);
+    /** Add or replace an entire menu, e.g. m.addMenu('others_menu', { title: 'Others', items: 'foo bar' }) */
+    addMenu(key: string, config: MenuEntry): this;
+    removeMenu(key: string): this;
+    /** Mutate one menu's items string via the same ListBuilder used for toolbar/contextmenu. */
+    items(key: string, patch: ListPatch): this;
+    /** Shorthand: m.addItem('file', 'newitem') / m.addItem('file', 2, 'newitem') */
+    addItem(key: string, indexOrItem: number | string, item?: string): this;
+    removeItem(key: string, ...names: string[]): this;
+    toObject(): MenuConfig;
+}
+type MenuPatch = MenuConfig | ((m: MenuBuilder) => MenuBuilder | void);
 type MyTinymceOpts = {
     skin?: keyof typeof skinsTable;
     direction?: 'rtl' | 'ltr';
     customSetup?: (editor: Editor) => void;
-    overrides?: (defaultOpts: EditorOpts) => EditorOpts;
+    /** Free-form deep-merge patch applied over the default options.
+     *  Accepts a plain partial object, or a function of the defaults
+     *  that returns a partial object. */
+    overrides?: TinyMCEPatch;
+    /** Toolbar string, or a builder function: (t) => t.add('btn'), t.after('x','y'), etc. */
+    toolbar?: ListPatch;
+    /** Context menu string, or a builder function, same API as toolbar. */
+    contextmenu?: ListPatch;
+    /** Plugin list string, or a builder function, same API as toolbar.
+     *  Note: this only toggles the string passed to tinymce.init - the
+     *  underlying plugin JS still needs to be imported at the top of this
+     *  file regardless of what's listed here. */
+    plugins?: ListPatch;
+    /** Menubar string (top-level menu keys, e.g. 'file edit view'), or a
+     *  builder function, same API as toolbar. */
+    menubar?: ListPatch;
+    /** Menu config object ({ key: { title, items } }), or a builder
+     *  function: (m) => m.addItem('file','newitem').removeItem('file','print') */
+    menu?: MenuPatch;
 };
-type EditorOpts = Omit<RemoveIndexSignature<RawEditorOptionsExtended>, 'setup' | 'target' | 'selector'> & Record<string, unknown>;
 declare class tinymceHelpers {
     private _editor;
     private _lockButton?;

package/index.mjs

@@ -14,6 +14,18 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
 // src/client/custom-components/tinymce-helpers.ts
@@ -65,9 +77,9 @@ async function defaultSkin(document2 = false) {
   ]);
   return {
     css: tinymce.Resource.get(`content/${contentSkin}/content.css`) + tinymce.Resource.get(`ui/${shellSkin}/content.css`) + `
- 
- 
- 
+
+
+
   `,
     skin: shellSkin
   };
@@ -84,7 +96,6 @@ async function darkSkin() {
   );
   return {
     css: tinymce.Resource.get(`content/${contentSkin}/content.css`) + tinymce.Resource.get(`ui/${shellSkin}/content.css`) + `
- 
 
 
    .mce-content-body {
@@ -105,6 +116,126 @@ var skinsTable = {
   dark: () => darkSkin(),
   default: () => defaultSkin()
 };
+function resolvePatch(defaults, patch) {
+  if (!patch) return {};
+  const resolved = typeof patch === "function" ? patch(defaults) : patch;
+  const _a = resolved, { target, setup, selector } = _a, safe = __objRest(_a, ["target", "setup", "selector"]);
+  return safe;
+}
+function deepMerge(base, patch) {
+  const out = __spreadValues({}, base);
+  for (const key in patch) {
+    const value = patch[key];
+    const baseValue = base[key];
+    const isPlainObject = (v) => v !== null && typeof v === "object" && !Array.isArray(v);
+    if (isPlainObject(value) && isPlainObject(baseValue)) {
+      out[key] = deepMerge(baseValue, value);
+    } else {
+      out[key] = value;
+    }
+  }
+  return out;
+}
+var ListBuilder = class {
+  constructor(existing) {
+    __publicField(this, "items");
+    this.items = existing.trim().length ? existing.trim().split(/\s+/) : [];
+  }
+  /** add('btn') appends at the end. add(3, 'btn') inserts at index 3. */
+  add(indexOrItem, item) {
+    if (typeof indexOrItem === "number") {
+      this.items.splice(indexOrItem, 0, item);
+    } else {
+      this.items.push(indexOrItem);
+    }
+    return this;
+  }
+  start(item) {
+    this.items.unshift(item);
+    return this;
+  }
+  after(target, item) {
+    const i = this.items.indexOf(target);
+    this.items.splice(i === -1 ? this.items.length : i + 1, 0, item);
+    return this;
+  }
+  before(target, item) {
+    const i = this.items.indexOf(target);
+    this.items.splice(i === -1 ? this.items.length : i, 0, item);
+    return this;
+  }
+  remove(...names) {
+    const removeSet = new Set(names.map((n) => n.toLowerCase()));
+    this.items = this.items.filter((i) => i === "|" || !removeSet.has(i.toLowerCase()));
+    return this;
+  }
+  /** Insert a '|' separator at the end, or at a given index. */
+  separator(index) {
+    if (index === void 0) {
+      this.items.push("|");
+    } else {
+      this.items.splice(index, 0, "|");
+    }
+    return this;
+  }
+  toString() {
+    return this.items.join(" ");
+  }
+};
+function applyListPatch(existing, patch) {
+  if (!patch) return existing;
+  if (typeof patch === "string") return patch;
+  const builder = new ListBuilder(existing);
+  const result = patch(builder);
+  return (result != null ? result : builder).toString();
+}
+var MenuBuilder = class {
+  constructor(existing) {
+    __publicField(this, "menus");
+    this.menus = Object.fromEntries(
+      Object.entries(existing).map(([k, v]) => [k, __spreadValues({}, v)])
+    );
+  }
+  /** Add or replace an entire menu, e.g. m.addMenu('others_menu', { title: 'Others', items: 'foo bar' }) */
+  addMenu(key, config) {
+    this.menus[key] = __spreadValues({}, config);
+    return this;
+  }
+  removeMenu(key) {
+    delete this.menus[key];
+    return this;
+  }
+  /** Mutate one menu's items string via the same ListBuilder used for toolbar/contextmenu. */
+  items(key, patch) {
+    const existing = this.menus[key];
+    if (!existing) {
+      console.error(`MenuBuilder.items: menu "${key}" does not exist`);
+      return this;
+    }
+    existing.items = applyListPatch(existing.items, patch);
+    return this;
+  }
+  /** Shorthand: m.addItem('file', 'newitem') / m.addItem('file', 2, 'newitem') */
+  addItem(key, indexOrItem, item) {
+    return this.items(
+      key,
+      (t) => typeof indexOrItem === "number" ? t.add(indexOrItem, item) : t.add(indexOrItem)
+    );
+  }
+  removeItem(key, ...names) {
+    return this.items(key, (t) => t.remove(...names));
+  }
+  toObject() {
+    return this.menus;
+  }
+};
+function applyMenuPatch(existing, patch) {
+  if (!patch) return existing;
+  if (typeof patch !== "function") return patch;
+  const builder = new MenuBuilder(existing);
+  const result = patch(builder);
+  return (result != null ? result : builder).toObject();
+}
 var tinymceHelpers = class _tinymceHelpers {
   constructor() {
     __publicField(this, "_editor");
@@ -118,7 +249,7 @@ var tinymceHelpers = class _tinymceHelpers {
     this.editor.insertContent(`<img src="${src}" alt="">`);
   }
   async _initMce(el, customOpts = Object()) {
-    var _a, _b;
+    var _a;
     if (!(el instanceof HTMLElement)) {
       throw new Error("invalid element");
     }
@@ -293,7 +424,9 @@ var tinymceHelpers = class _tinymceHelpers {
                 () => {
                   if (blockquote) {
                     const parent = blockquote.parentNode;
-                    if (!parent) return;
+                    if (!parent) {
+                      return;
+                    }
                     while (blockquote.firstChild) {
                       parent.insertBefore(blockquote.firstChild, blockquote);
                     }
@@ -378,14 +511,28 @@ var tinymceHelpers = class _tinymceHelpers {
       // contextmenu: false,
       contextmenu: "insert-image link image table create-block-above create-block-below reset-style-button-img clearTextStyle"
     };
-    opts = __spreadValues(__spreadValues({}, opts), ((_a = customOpts.overrides) == null ? void 0 : _a.call(customOpts, opts)) || {});
+    opts = deepMerge(opts, resolvePatch(opts, customOpts.overrides));
+    if (typeof opts.toolbar === "string") {
+      opts.toolbar = applyListPatch(opts.toolbar, customOpts.toolbar);
+    }
+    if (typeof opts.contextmenu === "string") {
+      opts.contextmenu = applyListPatch(opts.contextmenu, customOpts.contextmenu);
+    }
+    if (typeof opts.plugins === "string") {
+      opts.plugins = applyListPatch(opts.plugins, customOpts.plugins);
+    }
+    if (typeof opts.menubar === "string") {
+      opts.menubar = applyListPatch(opts.menubar, customOpts.menubar);
+    }
+    if (opts.menu) {
+      opts.menu = applyMenuPatch(opts.menu, customOpts.menu);
+    }
     if (!opts.skin) {
       throw new Error("no skin");
     }
     const mce = this._editor = await tinymce.init(opts).then((x) => x[0]);
     this.originalContextMenu = mce.options.get("contextmenu");
     const all = mce.ui.registry.getAll();
-    console.log(all);
     const availableMenuItems = all.menuItems;
     const availableButtons = all.buttons;
     if (typeof opts.toolbar == "string") {
@@ -418,7 +565,7 @@ var tinymceHelpers = class _tinymceHelpers {
     }
     if (opts.menu) {
       for (const [key, value] of Object.entries(opts.menu)) {
-        if (!isNonEmptyString((_b = value.items) == null ? void 0 : _b.trim())) {
+        if (!isNonEmptyString((_a = value.items) == null ? void 0 : _a.trim())) {
           console.error(`Menu "${key}" is missing items`);
           continue;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rg-dev/tinymce-helpers",
-  "version": "1.0.11",
+  "version": "1.0.12",
   "description": "",
   "main": "index.js",
   "scripts": {