bpmn-js 18.13.2 → 18.15.0

package/dist/bpmn-navigated-viewer.development.js

@@ -1,5 +1,5 @@
 /*!
- * bpmn-js - bpmn-navigated-viewer v18.13.2
+ * bpmn-js - bpmn-navigated-viewer v18.15.0
  *
  * Copyright (c) 2014-present, camunda Services GmbH
  *
@@ -8,7 +8,7 @@
  *
  * Source Code: https://github.com/bpmn-io/bpmn-js
  *
- * Date: 2026-03-23
+ * Date: 2026-04-22
  */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -2646,7 +2646,7 @@
    *
    * @param {Object} [element] element to bind the id to
    *
-   * @return {String} id
+   * @return {string} id
    */
   Ids.prototype.next = function(element) {
     return this._seed(element || true);
@@ -2657,7 +2657,7 @@
    *
    * @param {Object} [element] element to bind the id to
    *
-   * @return {String} id
+   * @return {string} id
    */
   Ids.prototype.nextPrefixed = function(prefix, element) {
     var id;
@@ -2676,8 +2676,8 @@
   /**
    * Manually claim an existing id.
    *
-   * @param {String} id
-   * @param {String} [element] element the id is claimed by
+   * @param {string} id
+   * @param {any} [element] element the id is claimed by
    */
   Ids.prototype.claim = function(id, element) {
     this._seed.set(id, element || true);
@@ -2686,8 +2686,8 @@
   /**
    * Returns true if the given id has already been assigned.
    *
-   * @param  {String} id
-   * @return {Boolean}
+   * @param  {string} id
+   * @return {boolean}
    */
   Ids.prototype.assigned = function(id) {
     return this._seed.get(id) || false;
@@ -2696,7 +2696,7 @@
   /**
    * Unclaim an id.
    *
-   * @param  {String} id the id to unclaim
+   * @param  {string} id the id to unclaim
    */
   Ids.prototype.unclaim = function(id) {
     delete this._seed.hats[id];
@@ -5149,47 +5149,105 @@
     }
   }
 
+  /** @type {CanvasRenderingContext2D | null} */
+  var _canvasContext = null;
+
   /**
-   * @param {string} text
-   * @param {SVGTextElement} fakeText
+   * @return {CanvasRenderingContext2D | null}
+   */
+  function getCanvasContext() {
+    if (!_canvasContext) {
+      _canvasContext = document.createElement('canvas').getContext('2d');
+    }
+
+    return _canvasContext;
+  }
+
+  /**
+   * Build a CSS font string from a style object for use with the canvas
+   * measureText API.
    *
-   * @return {import('../util/Types').Dimensions}
+   * @param {Record<string, number | string>} style
+   *
+   * @return {string}
    */
-  function getTextBBox(text, fakeText) {
+  function buildFont(style) {
+    var parts = [];
 
-    fakeText.textContent = text;
+    if (style.fontStyle) {
+      parts.push(style.fontStyle);
+    }
 
-    var textBBox;
+    if (style.fontVariant) {
+      parts.push(style.fontVariant);
+    }
 
-    try {
-      var bbox,
-          emptyLine = text === '';
+    if (style.fontWeight) {
+      parts.push(style.fontWeight);
+    }
 
-      // add dummy text, when line is empty to
-      // determine correct height
-      fakeText.textContent = emptyLine ? 'dummy' : text;
+    if (style.fontStretch) {
+      parts.push(style.fontStretch);
+    }
 
-      textBBox = fakeText.getBBox();
+    parts.push(buildLength(style.fontSize) || '12px');
+    parts.push(style.fontFamily || 'sans-serif');
 
-      // take text rendering related horizontal
-      // padding into account
-      bbox = {
-        width: textBBox.width + textBBox.x * 2,
-        height: textBBox.height
-      };
+    return parts.join(' ');
+  }
 
-      if (emptyLine) {
+  /**
+   * Coerce a CSS length to a string with units, since canvas APIs
+   * silently reject unitless lengths and keep the previous value.
+   *
+   * @param {number | string | undefined} value
+   *
+   * @return {string | undefined}
+   */
+  function buildLength(value) {
+    if (value == null) {
+      return undefined;
+    }
 
-        // correct width
-        bbox.width = 0;
-      }
+    if (typeof value === 'number' || /^-?\d+(\.\d+)?$/.test(value)) {
+      return value + 'px';
+    }
 
-      return bbox;
-    } catch (e) {
-      console.log(e);
+    return value;
+  }
+
+  /**
+   * @param {string} text
+   * @param {Record<string, number | string>} style
+   *
+   * @return {import('../util/Types').Dimensions}
+   */
+  function getTextBBox(text, style) {
+    var ctx = getCanvasContext();
 
+    if (!ctx) {
       return { width: 0, height: 0 };
     }
+
+    ctx.font = buildFont(style);
+
+    if ('letterSpacing' in ctx) {
+      ctx.letterSpacing = buildLength(style.letterSpacing) || '0px';
+    }
+
+    var emptyLine = text === '';
+
+    // strip trailing whitespace so measurement matches the browser's
+    // native rendering used by direct editing
+    var measurable = emptyLine ? 'dummy' : text.replace(/\s+$/, '');
+    var metrics = ctx.measureText(measurable);
+
+    return {
+      width: emptyLine ? 0 : metrics.width,
+      height: 'fontBoundingBoxAscent' in metrics
+        ? metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent
+        : metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent
+    };
   }
 
 
@@ -5200,11 +5258,11 @@
    *
    * @param {string[]} lines
    * @param {number} maxWidth
-   * @param {SVGTextElement} fakeText
+   * @param {Record<string, number | string>} style
    *
    * @return {LineDescriptor} the line descriptor
    */
-  function layoutNext(lines, maxWidth, fakeText) {
+  function layoutNext(lines, maxWidth, style) {
 
     var originalLine = lines.shift(),
         fitLine = originalLine;
@@ -5212,7 +5270,7 @@
     var textBBox;
 
     for (;;) {
-      textBBox = getTextBBox(fitLine, fakeText);
+      textBBox = getTextBBox(fitLine, style);
 
       textBBox.width = fitLine ? textBBox.width : 0;
 
@@ -5319,33 +5377,6 @@
   }
 
 
-  /**
-   * @return {SVGSVGElement}
-   */
-  function getHelperSvg() {
-    var helperSvg = document.getElementById('helper-svg');
-
-    if (!helperSvg) {
-      helperSvg = create$1('svg');
-
-      attr$1(helperSvg, {
-        id: 'helper-svg'
-      });
-
-      assign(helperSvg, {
-        visibility: 'hidden',
-        position: 'fixed',
-        width: 0,
-        height: 0
-      });
-
-      document.body.appendChild(helperSvg);
-    }
-
-    return helperSvg;
-  }
-
-
   /**
    * Creates a new label utility
    *
@@ -5412,17 +5443,8 @@
 
     var maxWidth = box.width - padding.left - padding.right;
 
-    // ensure correct rendering by attaching helper text node to invisible SVG
-    var helperText = create$1('text');
-    attr$1(helperText, { x: 0, y: 0 });
-    attr$1(helperText, style);
-
-    var helperSvg = getHelperSvg();
-
-    append(helperSvg, helperText);
-
     while (lines.length) {
-      layouted.push(layoutNext(lines, maxWidth, helperText));
+      layouted.push(layoutNext(lines, maxWidth, style));
     }
 
     if (align.vertical === 'middle') {
@@ -5485,8 +5507,6 @@
       append(textElement, tspan);
     });
 
-    remove$2(helperText);
-
     var dimensions = {
       width: maxLineWidth,
       height: totalHeight