@innovastudio/contentbuilder 1.5.221 → 1.5.223

package/package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "name": "@innovastudio/contentbuilder",
-  "version": "1.5.221",
+  "version": "1.5.223",
   "description": "",
   "main": "public/contentbuilder/contentbuilder.esm.js",
   "types": "index.d.ts",

package/public/contentbuilder/contentbuilder.css

@@ -4977,6 +4977,12 @@ i.bi, i.icon {
   display: inline-flex;
 }
 
+/* As a flex box an icon ignores Bootstrap Icons' own vertical-align (on its ::before) and sits
+   higher than the text beside it in the editor. Put the same offset on the icon itself. */
+.is-container i.bi {
+  vertical-align: -0.125em;
+}
+
 /* block tool */
 /*
 .is-block-tool {

package/public/contentbuilder/contentbuilder.esm.js

@@ -5591,6 +5591,10 @@ class ToolbarKeys {
    */
   _hold(container, control) {
     if (!control) return;
+
+    // Where the control was: if the command removes what it sat on, the caret
+    // goes to what took its place
+    const spot = (control.closest('.row, [data-cb-block]') || control).getBoundingClientRect();
     setTimeout(() => {
       // Not bailing when the container has gone: deleting the last column
       // takes the strip with it, and that is exactly when the focus needs
@@ -5648,8 +5652,10 @@ class ToolbarKeys {
         // A tick later again: emptying an area makes the editor put its
         // own button there, and that has not happened yet.
         setTimeout(() => {
-          const somewhere = this._somewhereUsable();
-          if (somewhere) somewhere.focus();
+          const somewhere = this._somewhereUsable(spot);
+          if (somewhere) somewhere.focus({
+            preventScroll: true
+          });
         }, 30);
       }
     }, 0);
@@ -5720,7 +5726,9 @@ class ToolbarKeys {
     // the trip to the toolbar after one button. Stay on it, so the next format
     // is a key away, and leave deliberately with Escape. Anything that claims
     // the focus for itself, a panel or a dialog, is left to do so.
+    // A mouse click (detail > 0) is left alone, so the mouse works as it always did.
     tool.addEventListener('click', e => {
+      if (e.detail > 0) return;
       const control = this._controlFrom(e, tool, BUTTONS);
       if (control) this._hold(tool, control);
     });
@@ -5862,13 +5870,26 @@ class ToolbarKeys {
    * go dead with the focus stuck on a strip. Falls back through what the editor
    * still calls active, then to the first column on the page.
    */
-  currentColumn() {
+  currentColumn(near) {
     // It has to be able to hold the focus. A locked column is still the active
     // one but cannot take it, and focusing it silently does nothing.
     const usable = el => el && el.isConnected && (el.isContentEditable || el.hasAttribute('tabindex')) ? el : null;
     const active = usable(this.builder.util.cellSelected()) || usable(this.builder.activeCol);
     if (active) return active;
     const rows = this.builder.doc.querySelectorAll(`${this.builder.opts.container} > *`);
+
+    // Near a place on screen (where a removed row was): the column that took its
+    // place, or the last one before it
+    if (near) {
+      let before = null;
+      for (const row of rows) {
+        const cell = ToolbarKeys.cells(row).find(usable);
+        if (!cell) continue;
+        if (cell.getBoundingClientRect().top >= near.top - 1) return cell;
+        before = cell;
+      }
+      if (before) return before;
+    }
     for (const row of rows) {
       const cell = ToolbarKeys.cells(row).find(usable);
       if (cell) return cell;
@@ -5882,8 +5903,8 @@ class ToolbarKeys {
    * editing away: in both the focus would otherwise land on the body, where no
    * key reaches the editor at all.
    */
-  _somewhereUsable() {
-    const column = this.currentColumn();
+  _somewhereUsable(near) {
+    const column = this.currentColumn(near);
     if (column) return column;
     const doc = this.builder.doc;
 
@@ -7056,6 +7077,18 @@ class Util {
     // A toolbar button that opens a dialog often moves the focus first, so the
     // strip fills this in from the button actually used (toolbarkeys.js).
 
+    // Opened from a control inside the content iframe: this page never saw
+    // that mouse click, so the browser would ring the dialog's first control
+    // as if the keyboard had been used. Carry the opener's own state over.
+    let focusOpts;
+    if (opener && opener.tagName === 'IFRAME') {
+      try {
+        const inner = opener.contentDocument.activeElement;
+        if (!(inner && inner.matches(':focus-visible'))) focusOpts = {
+          focusVisible: false
+        };
+      } catch (e) {/* another origin */}
+    }
     if (overflowHidden) document.body.style.overflow = 'hidden';
     const handleKeyDown = e => {
       if (e.keyCode === 27) {
@@ -7073,11 +7106,11 @@ class Util {
     modal.addEventListener('keydown', handleKeyDown);
     let content = modal.querySelector('.is-tab-content.active');
     if (content) {
-      content.focus();
+      content.focus(focusOpts);
       this.builder.tabs.setupTabKey(content);
     } else {
       this.setupTabKeys(modal);
-      modal.focus();
+      modal.focus(focusOpts);
     }
 
     // Land on a control rather than on the dialog itself: focus on the dialog
@@ -7097,7 +7130,7 @@ class Util {
       const settled = modal.contains(held) && held !== modal && held.tagName !== 'IFRAME' && !held.classList.contains('is-tab-content');
       if (settled) return;
       const first = ToolbarKeys.firstControl(modal);
-      if (first) first.focus();
+      if (first) first.focus(focusOpts);
     }, 0);
 
     // A dialog whose content is an iframe, the asset picker, is a trap without
@@ -9126,6 +9159,7 @@ class Util {
    * Placeholders substituted by export():
    *   [%CONTENT%]  the content HTML
    *   [%PLUGINS%]  runtime plugin registry (see getPluginRegistry)
+   *   [%PLUGINFOLDER%] runtime plugin folder (see getPluginFolder)
    *   [%PATH%]     base URL for runtime/asset references
    */
   getPageTemplate(framework) {
@@ -9163,7 +9197,8 @@ class Util {
     // Registers available plugins (not yet loaded).
     // Scripts and styles are fetched only when the plugin is actually used in content.
     const runtime = new ContentBuilderRuntime({
-        plugins: [%PLUGINS%]
+        plugins: [%PLUGINS%],
+        pluginFolder: [%PLUGINFOLDER%]
     });
     runtime.init();
     runtime.renderPageCss('.container');
@@ -9213,7 +9248,8 @@ class Util {
     // Registers available plugins (not yet loaded).
     // Scripts and styles are fetched only when the plugin is actually used in content.
     const runtime = new ContentBuilderRuntime({
-        plugins: [%PLUGINS%]
+        plugins: [%PLUGINS%],
+        pluginFolder: [%PLUGINFOLDER%]
     });
     runtime.init();
 </script>
@@ -9266,7 +9302,8 @@ class Util {
     // Registers available plugins (not yet loaded).
     // Scripts and styles are fetched only when the plugin is actually used in content.
     const runtime = new ContentBuilderRuntime({
-        plugins: [%PLUGINS%]
+        plugins: [%PLUGINS%],
+        pluginFolder: [%PLUGINFOLDER%]
     });
     runtime.init();
 </script>
@@ -9324,7 +9361,8 @@ class Util {
     // Registers available plugins (not yet loaded).
     // Scripts and styles are fetched only when the plugin is actually used in content.
     const runtime = new ContentBuilderRuntime({
-        plugins: [%PLUGINS%]
+        plugins: [%PLUGINS%],
+        pluginFolder: [%PLUGINFOLDER%]
     });
     runtime.init();
 </script>
@@ -9376,7 +9414,8 @@ class Util {
     // Registers available plugins (not yet loaded).
     // Scripts and styles are fetched only when the plugin is actually used in content.
     const runtime = new ContentBuilderRuntime({
-        plugins: [%PLUGINS%]
+        plugins: [%PLUGINS%],
+        pluginFolder: [%PLUGINFOLDER%]
     });
     runtime.init();
 </script>
@@ -9430,6 +9469,27 @@ class Util {
     });
     return JSON.stringify(registry, null, 4);
   }
+
+  /*
+   * The runtime's plugin folder (pluginFolder in blank.html), as a JS string.
+   * Plugins used in the content load from it without being registered, so an
+   * exported page keeps them. A URL under the content frame's base becomes a
+   * [%PATH%] token, like the registry's URLs.
+   */
+  getPluginFolder() {
+    const win = this.builder.win;
+    let folder = '';
+    try {
+      folder = win.builderRuntime.settings.pluginFolder || '';
+    } catch (e) {/* no runtime in the content frame */}
+    let base = '';
+    try {
+      const href = win.location.href;
+      base = href.substring(0, href.lastIndexOf('/'));
+    } catch (e) {/* cross-origin content frame */}
+    if (base && folder.startsWith(base + '/')) folder = '[%PATH%]' + folder.substring(base.length);
+    return JSON.stringify(folder);
+  }
   getElementPosition(element) {
     const iframe = this.builder.iframe;
     let top, left;
@@ -9641,6 +9701,46 @@ class Util {
         }      
         `;
   }
+
+  // Place a small tool (link/button tool) above its target. When the target sits at the
+  // top edge with no room above, put the tool beside it (right, then left), so it never
+  // lands on the element tool below the element. Below is the last resort.
+  // vTarget (optional, e.g. a selected icon inside a link) sets the vertical position.
+  // The tool must be displayed before this (its size is measured).
+  placeToolAbove(tool, target, vTarget) {
+    const hr = target.getBoundingClientRect();
+    const vr = (vTarget || target).getBoundingClientRect();
+    tool.style.top = vr.top + this.builder.win.pageYOffset - tool.offsetHeight - 3 + 'px';
+    tool.style.left = hr.left + target.offsetWidth * this.builder.opts.zoom - tool.offsetWidth + 'px';
+
+    // Measured, not computed: the tool can carry margins and a scale.
+    const t = tool.getBoundingClientRect();
+    if (t.top >= 0) return;
+    const moveTo = (left, top) => {
+      const c = tool.getBoundingClientRect();
+      tool.style.left = parseFloat(tool.style.left) + left - c.left + 'px';
+      tool.style.top = parseFloat(tool.style.top) + top - c.top + 'px';
+    };
+
+    // Horizontal room, kept clear of the row tool when it sits beside the target.
+    let minX = 0;
+    let maxX = this.builder.doc.documentElement.clientWidth;
+    const row = target.closest('.row');
+    const rowTool = row && row.querySelector(':scope > .is-row-tool');
+    if (rowTool && rowTool.offsetParent) {
+      const r = rowTool.getBoundingClientRect();
+      if (r.left >= hr.right) maxX = Math.min(maxX, r.left);else if (r.right <= hr.left) minX = Math.max(minX, r.right);
+    }
+    const gap = 8;
+    const sideTop = vr.top + vr.height / 2 - t.height / 2;
+    if (hr.right + gap + t.width <= maxX) {
+      moveTo(hr.right + gap, sideTop);
+    } else if (hr.left - gap - t.width >= minX) {
+      moveTo(hr.left - gap - t.width, sideTop);
+    } else {
+      moveTo(t.left, vr.bottom + gap);
+    }
+  }
 }
 class Dom {
   constructor(builder) {
@@ -32502,15 +32602,8 @@ class Hyperlink {
     }
     // /Button Stuff
 
-    let left, top;
-    top = link.getBoundingClientRect().top + this.builder.win.pageYOffset;
-    if (this.builder.activeIcon) top = this.builder.activeIcon.getBoundingClientRect().top + this.builder.win.pageYOffset;
-    left = link.getBoundingClientRect().left;
-    linkTool.style.display = 'flex';
-    const w = linkTool.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
-    const h = linkTool.offsetHeight;
-    linkTool.style.top = top - h - 3 + 'px';
-    linkTool.style.left = left + link.offsetWidth * this.builder.opts.zoom - w + 'px';
+    linkTool.style.display = 'flex'; //to get the size, the tool must not be hidden (display:none)
+    this.builder.util.placeToolAbove(linkTool, link, this.builder.activeIcon);
     const handleLinkButtonClick = e => {
       const clrPicker = document.querySelector('.pop-picker.active') || document.querySelector('.pickgradientcolor.active');
       let elm = e.target;
@@ -32809,13 +32902,8 @@ class Button {
     // selecting the button, so the pencil is a second route to the same
     // panel and is left out.
     buttonTool.querySelector('.button-edit').style.display = this.builder.opts.onButtonEdit ? 'none' : '';
-    let top = activeButton.getBoundingClientRect().top + this.builder.win.pageYOffset;
-    let left = activeButton.getBoundingClientRect().left;
-    buttonTool.style.display = 'flex';
-    const w = buttonTool.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
-    const h = buttonTool.offsetHeight;
-    buttonTool.style.top = top - h - 3 + 'px';
-    buttonTool.style.left = left + activeButton.offsetWidth * this.builder.opts.zoom - w + 'px';
+    buttonTool.style.display = 'flex'; //to get the size, the tool must not be hidden (display:none)
+    this.builder.util.placeToolAbove(buttonTool, activeButton);
   }
   hideTool() {
     if (this.buttonTool) this.buttonTool.style.display = '';
@@ -34012,7 +34100,10 @@ class Plugin {
     const handlePluginClick = e => {
       const clrPicker = document.querySelector('.pop-picker.active') || document.querySelector('.pickgradientcolor.active');
       let elm = e.target;
-      let elmRemoved = !document.contains(elm); // e.g. when deleting a card in card list plugin
+
+      // isConnected, not document.contains(): in iframe mode the click is in
+      // the content document, which this document never contains.
+      let elmRemoved = !elm.isConnected; // e.g. when deleting a card in card list plugin
 
       if (this.builder.doc.activeElement) {
         if (this.builder.doc.activeElement.closest('.is-modal')) {
@@ -34210,7 +34301,9 @@ class Plugin {
     const plugin = e.target.closest('[data-cb-type]');
     if (plugin) {
       this.builder.activePlugin = plugin;
-      if (!this.builder.isContentBox) {
+
+      // With a control panel, plugin settings open there instead.
+      if (!this.builder.controlPanel) {
         this.renderTool();
         this.pluginTool.style.display = 'flex';
         let _toolwidth = this.pluginTool.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
@@ -36486,6 +36579,10 @@ class Element {
       customcode = true;
       subblock = elm.closest('.is-subblock');
     }
+    if (elm.closest('[data-cb-code]')) {
+      // Independent code element: the whole block is the element
+      customcode = true;
+    }
     if (!customcode && !noedit && !_protected || subblock) {
       //previously this is commented: && !noedit && !_protected
 
@@ -58147,6 +58244,136 @@ function coverValue(cover, def) {
   return true;
 }
 
+/*
+  normalizer.js — the clean-output guarantee.
+
+  Runs after every mutation. It never changes the visible text; it only
+  reduces markup to the minimal equivalent form:
+
+    <strong>a</strong><strong>b</strong>       -> <strong>ab</strong>
+    <strong><strong>x</strong></strong>        -> <strong>x</strong>
+    <span style="color:red"><span style="font-size:18px">x</span></span>
+                                               -> one span, two properties
+    <span>x</span>                             -> x
+    <em></em>                                  -> (removed)
+
+  Because it preserves text content exactly, character-offset selection
+  bookmarks taken before normalization remain valid after it.
+*/
+const INLINE_TAGS = new Set(['SPAN', 'STRONG', 'B', 'EM', 'I', 'U', 'S', 'STRIKE', 'DEL', 'INS', 'SUB', 'SUP', 'CODE', 'MARK', 'A', 'SMALL', 'BIG', 'FONT', 'ABBR', 'Q', 'CITE', 'DFN', 'KBD', 'SAMP', 'VAR', 'TIME']);
+
+/* Identity signature: two inline elements with equal signatures are
+   interchangeable and can be merged. */
+function sig(el) {
+  const attrs = [];
+  for (const a of el.attributes) {
+    attrs.push(a.name === 'style' ? 'style=' + el.style.cssText : a.name + '=' + a.value);
+  }
+  return el.tagName + '|' + attrs.sort().join(';');
+}
+function isEmptyInline(el) {
+  if (el.textContent !== '' || el.querySelector(KEEPERS)) return false;
+  // An empty inline that carries a class typically renders its content via CSS
+  // rather than text — an icon font (<i class="bi bi-alarm">, <span
+  // class="material-icons">…</span>, fa-*, glyphicon). It is NOT truly empty,
+  // so never drop it. Bare leftover marks (<em></em>, <i></i>) have no class
+  // and are still removed.
+  if (el.getAttribute('class')) return false;
+  return true;
+}
+
+/* Does the page's CSS style this attribute-less span? A design can colour or
+   size "the span in this heading" from a stylesheet (.hero h1 span {...});
+   unwrapping it then changes how the text looks, which this file promises
+   never to do. Compared against the parent for inherited properties and
+   against the initial value for the rest. Without a live view (detached, or
+   a headless test) it is treated as unstyled, as before. */
+const INHERITED = ['color', 'fontSize', 'fontWeight', 'fontStyle', 'fontFamily', 'letterSpacing', 'textTransform', 'lineHeight'];
+function styledByCss(el) {
+  const parent = el.parentElement;
+  const win = el.ownerDocument && el.ownerDocument.defaultView;
+  if (!parent || !win || !el.isConnected || typeof win.getComputedStyle !== 'function') return false;
+  const cs = win.getComputedStyle(el);
+  const ps = win.getComputedStyle(parent);
+  for (const p of INHERITED) if (cs[p] !== ps[p]) return true;
+  if (cs.display && cs.display !== 'inline') return true;
+  if (cs.backgroundImage && cs.backgroundImage !== 'none') return true;
+  if (cs.backgroundColor && !/^(transparent|rgba\(0, 0, 0, 0\))$/.test(cs.backgroundColor)) return true;
+  if (cs.textDecorationLine && cs.textDecorationLine !== 'none') return true;
+  return false;
+}
+
+/* One bottom-up cleanup pass. Returns true if anything changed. */
+function pass(scope) {
+  let changed = false;
+  const els = Array.prototype.slice.call(scope.querySelectorAll('*')).reverse();
+  for (const el of els) {
+    if (!el.isConnected && !scope.contains(el)) continue;
+    if (el.closest && el.closest('[contenteditable="false"]')) continue;
+    if (!INLINE_TAGS.has(el.tagName)) continue;
+
+    /* 1. Drop empty inline elements */
+    if (isEmptyInline(el)) {
+      el.remove();
+      changed = true;
+      continue;
+    }
+
+    /* 2. Unwrap attribute-less spans (unless the page's CSS styles them) */
+    if (el.tagName === 'SPAN' && el.attributes.length === 0 && !styledByCss(el)) {
+      unwrap(el);
+      changed = true;
+      continue;
+    }
+
+    /* 3. Unwrap when an identical ancestor already covers this element */
+    let anc = el.parentNode;
+    let redundant = false;
+    while (isEl$1(anc) && anc !== scope && INLINE_TAGS.has(anc.tagName)) {
+      if (sig(anc) === sig(el)) {
+        redundant = true;
+        break;
+      }
+      anc = anc.parentNode;
+    }
+    if (redundant) {
+      unwrap(el);
+      changed = true;
+      continue;
+    }
+
+    /* 4. Merge with an identical previous sibling */
+    const prev = el.previousSibling;
+    if (isEl$1(prev) && sig(prev) === sig(el)) {
+      while (el.firstChild) prev.appendChild(el.firstChild);
+      el.remove();
+      changed = true;
+      continue;
+    }
+
+    /* 5. Collapse span-in-span single-child chains into one span.
+       The inner (more specific) properties win on conflict. */
+    if (el.tagName === 'SPAN' && el.childNodes.length === 1 && isEl$1(el.firstChild) && el.firstChild.tagName === 'SPAN') {
+      const inner = el.firstChild;
+      for (let i = 0; i < inner.style.length; i++) {
+        const prop = inner.style[i];
+        el.style.setProperty(prop, inner.style.getPropertyValue(prop));
+      }
+      inner.classList.forEach(c => el.classList.add(c));
+      if (!el.getAttribute('style')) el.removeAttribute('style');
+      unwrap(inner);
+      changed = true;
+    }
+  }
+  return changed;
+}
+function normalize(scope) {
+  let guard = 0;
+  while (pass(scope) && guard++ < 6) {/* repeat until stable */}
+  scope.normalize(); /* merge adjacent text nodes */
+  return scope;
+}
+
 /*
   formatter.js — inline formatting engine.
 
@@ -58413,7 +58640,9 @@ function strip(el, def) {
     unwrap(el);
     return;
   }
-  if (el.tagName === 'SPAN' && el.attributes.length === 0) unwrap(el);
+  /* Left bare: unwrap, unless the page's CSS styles it (a design's
+     ".hero h1 span" colour), which must survive clearing a size from it. */
+  if (el.tagName === 'SPAN' && el.attributes.length === 0 && !styledByCss(el)) unwrap(el);
 }
 
 /* Apply a style across a (non-collapsed) range. */
@@ -58478,115 +58707,6 @@ function removeStyle(root, range, def, opts) {
   return texts;
 }
 
-/*
-  normalizer.js — the clean-output guarantee.
-
-  Runs after every mutation. It never changes the visible text; it only
-  reduces markup to the minimal equivalent form:
-
-    <strong>a</strong><strong>b</strong>       -> <strong>ab</strong>
-    <strong><strong>x</strong></strong>        -> <strong>x</strong>
-    <span style="color:red"><span style="font-size:18px">x</span></span>
-                                               -> one span, two properties
-    <span>x</span>                             -> x
-    <em></em>                                  -> (removed)
-
-  Because it preserves text content exactly, character-offset selection
-  bookmarks taken before normalization remain valid after it.
-*/
-const INLINE_TAGS = new Set(['SPAN', 'STRONG', 'B', 'EM', 'I', 'U', 'S', 'STRIKE', 'DEL', 'INS', 'SUB', 'SUP', 'CODE', 'MARK', 'A', 'SMALL', 'BIG', 'FONT', 'ABBR', 'Q', 'CITE', 'DFN', 'KBD', 'SAMP', 'VAR', 'TIME']);
-
-/* Identity signature: two inline elements with equal signatures are
-   interchangeable and can be merged. */
-function sig(el) {
-  const attrs = [];
-  for (const a of el.attributes) {
-    attrs.push(a.name === 'style' ? 'style=' + el.style.cssText : a.name + '=' + a.value);
-  }
-  return el.tagName + '|' + attrs.sort().join(';');
-}
-function isEmptyInline(el) {
-  if (el.textContent !== '' || el.querySelector(KEEPERS)) return false;
-  // An empty inline that carries a class typically renders its content via CSS
-  // rather than text — an icon font (<i class="bi bi-alarm">, <span
-  // class="material-icons">…</span>, fa-*, glyphicon). It is NOT truly empty,
-  // so never drop it. Bare leftover marks (<em></em>, <i></i>) have no class
-  // and are still removed.
-  if (el.getAttribute('class')) return false;
-  return true;
-}
-
-/* One bottom-up cleanup pass. Returns true if anything changed. */
-function pass(scope) {
-  let changed = false;
-  const els = Array.prototype.slice.call(scope.querySelectorAll('*')).reverse();
-  for (const el of els) {
-    if (!el.isConnected && !scope.contains(el)) continue;
-    if (el.closest && el.closest('[contenteditable="false"]')) continue;
-    if (!INLINE_TAGS.has(el.tagName)) continue;
-
-    /* 1. Drop empty inline elements */
-    if (isEmptyInline(el)) {
-      el.remove();
-      changed = true;
-      continue;
-    }
-
-    /* 2. Unwrap attribute-less spans */
-    if (el.tagName === 'SPAN' && el.attributes.length === 0) {
-      unwrap(el);
-      changed = true;
-      continue;
-    }
-
-    /* 3. Unwrap when an identical ancestor already covers this element */
-    let anc = el.parentNode;
-    let redundant = false;
-    while (isEl$1(anc) && anc !== scope && INLINE_TAGS.has(anc.tagName)) {
-      if (sig(anc) === sig(el)) {
-        redundant = true;
-        break;
-      }
-      anc = anc.parentNode;
-    }
-    if (redundant) {
-      unwrap(el);
-      changed = true;
-      continue;
-    }
-
-    /* 4. Merge with an identical previous sibling */
-    const prev = el.previousSibling;
-    if (isEl$1(prev) && sig(prev) === sig(el)) {
-      while (el.firstChild) prev.appendChild(el.firstChild);
-      el.remove();
-      changed = true;
-      continue;
-    }
-
-    /* 5. Collapse span-in-span single-child chains into one span.
-       The inner (more specific) properties win on conflict. */
-    if (el.tagName === 'SPAN' && el.childNodes.length === 1 && isEl$1(el.firstChild) && el.firstChild.tagName === 'SPAN') {
-      const inner = el.firstChild;
-      for (let i = 0; i < inner.style.length; i++) {
-        const prop = inner.style[i];
-        el.style.setProperty(prop, inner.style.getPropertyValue(prop));
-      }
-      inner.classList.forEach(c => el.classList.add(c));
-      if (!el.getAttribute('style')) el.removeAttribute('style');
-      unwrap(inner);
-      changed = true;
-    }
-  }
-  return changed;
-}
-function normalize(scope) {
-  let guard = 0;
-  while (pass(scope) && guard++ < 6) {/* repeat until stable */}
-  scope.normalize(); /* merge adjacent text nodes */
-  return scope;
-}
-
 /*
   probe.js — non-mutating state inspection (queryCommandState done right).
 
@@ -99057,11 +99177,14 @@ class ContentBuilder {
     this.shortenOutput = false;
     output = pageTemplate.replace('[%CONTENT%]', html);
 
-    // [%PLUGINS%] - runtime plugin registry (must run before [%PATH%],
-    // the registry's URLs are emitted as [%PATH%] tokens)
+    // [%PLUGINS%], [%PLUGINFOLDER%] - runtime plugin registry and folder (must run
+    // before [%PATH%], their URLs are emitted as [%PATH%] tokens)
     if (output.indexOf('[%PLUGINS%]') !== -1) {
       output = output.replaceAll('[%PLUGINS%]', this.util.getPluginRegistry());
     }
+    if (output.indexOf('[%PLUGINFOLDER%]') !== -1) {
+      output = output.replaceAll('[%PLUGINFOLDER%]', this.util.getPluginFolder());
+    }
 
     // Custom
     if (options.replace) {
@@ -101801,6 +101924,9 @@ Please obtain a license at: https://innovastudio.com/contentbox`);
     });
     tmp.querySelectorAll('*').forEach(el => {
       el.removeAttribute('style');
+      // Text direction is the destination's too: Word marks every
+      // paragraph and run dir="RTL"/"LTR" in right-to-left documents.
+      el.removeAttribute('dir');
       if (el.classList && el.classList.length) {
         const kept = Array.prototype.filter.call(el.classList, c => keep.has(c));
         if (kept.length) el.setAttribute('class', kept.join(' '));else el.removeAttribute('class');