@blocksandarrows/element 0.18.1 → 0.18.2

package/dist/dev/index.js

@@ -2454,7 +2454,7 @@ import {
 } from "@excalidraw/math";
 import {
   ROUGHNESS,
-  isTransparent as isTransparent3,
+  isTransparent as isTransparent4,
   assertNever as assertNever2,
   COLOR_PALETTE,
   LINE_POLYGON_POINT_MERGE_DISTANCE
@@ -2522,7 +2522,8 @@ var pe = 0.275;
 var V = xe + 1e-4;
 function ce(e, t = {}) {
   let { size: u = 16, smoothing: x = 0.5, thinning: h = 0.5, simulatePressure: y = true, easing: n = (r) => r, start: f = {}, end: d = {}, last: D = false } = t, { cap: S = true, easing: j = (r) => r * (2 - r) } = f, { cap: q = true, easing: c = (r) => --r * r * r + 1 } = d;
-  if (e.length === 0 || u <= 0) return [];
+  if (e.length === 0 || u <= 0)
+    return [];
   let p = e[e.length - 1].runningLength, g = f.taper === false ? 0 : f.taper === true ? Math.max(u, p) : f.taper, T = d.taper === false ? 0 : d.taper === true ? Math.max(u, p) : d.taper, te = Math.pow(u * x, 2), _ = [], M = [], H = e.slice(0, 10).reduce((r, i) => {
     let o = i.pressure;
     if (y) {
@@ -2533,21 +2534,24 @@ function ce(e, t = {}) {
   }, e[0].pressure), m = $(u, h, e[e.length - 1].pressure, n), U, X = e[0].vector, z = e[0].point, F = z, O = z, E = F, J = false;
   for (let r = 0; r < e.length; r++) {
     let { pressure: i } = e[r], { point: o, vector: s, distance: W, runningLength: I } = e[r];
-    if (r < e.length - 1 && p - I < 3) continue;
+    if (r < e.length - 1 && p - I < 3)
+      continue;
     if (h) {
       if (y) {
         let v = C(1, W / u), Z = C(1, 1 - v);
         i = C(1, H + (Z - H) * (v * pe));
       }
       m = $(u, h, i, n);
-    } else m = u / 2;
+    } else
+      m = u / 2;
     U === void 0 && (U = m);
     let le = I < g ? j(I / g) : 1, fe = p - I < T ? c((p - I) / T) : 1;
     m = Math.max(0.01, m * Math.min(le, fe));
     let re = (r < e.length - 1 ? e[r + 1] : e[r]).vector, Y = r < e.length - 1 ? B(s, re) : 1, be = B(s, X) < 0 && !J, ne = Y !== null && Y < 0;
     if (be || ne) {
       let v = b(R(X), m);
-      for (let Z = 1 / 13, w = 0; w <= 1; w += Z) O = L(a(o, v), o, V * w), _.push(O), E = L(l(o, v), o, V * -w), M.push(E);
+      for (let Z = 1 / 13, w = 0; w <= 1; w += Z)
+        O = L(a(o, v), o, V * w), _.push(O), E = L(l(o, v), o, V * -w), M.push(E);
       z = O, F = E, ne && (J = true);
       continue;
     }
@@ -2563,45 +2567,55 @@ function ce(e, t = {}) {
   if (e.length === 1) {
     if (!(g || T) || D) {
       let r = ee(P, G(R(a(P, k))), -(U || m)), i = [];
-      for (let o = 1 / 13, s = o; s <= 1; s += o) i.push(L(r, P, V * 2 * s));
+      for (let o = 1 / 13, s = o; s <= 1; s += o)
+        i.push(L(r, P, V * 2 * s));
       return i;
     }
   } else {
-    if (!(g || T && e.length === 1)) if (S) for (let i = 1 / 13, o = i; o <= 1; o += i) {
-      let s = L(M[0], P, V * o);
-      Q.push(s);
-    }
-    else {
-      let i = a(_[0], M[0]), o = b(i, 0.5), s = b(i, 0.51);
-      Q.push(a(P, o), a(P, s), l(P, s), l(P, o));
-    }
+    if (!(g || T && e.length === 1))
+      if (S)
+        for (let i = 1 / 13, o = i; o <= 1; o += i) {
+          let s = L(M[0], P, V * o);
+          Q.push(s);
+        }
+      else {
+        let i = a(_[0], M[0]), o = b(i, 0.5), s = b(i, 0.51);
+        Q.push(a(P, o), a(P, s), l(P, s), l(P, o));
+      }
     let r = R(se(e[e.length - 1].vector));
-    if (T || g && e.length === 1) N.push(k);
+    if (T || g && e.length === 1)
+      N.push(k);
     else if (q) {
       let i = ee(k, r, m);
-      for (let o = 1 / 29, s = o; s < 1; s += o) N.push(L(i, k, V * 3 * s));
-    } else N.push(l(k, b(r, m)), l(k, b(r, m * 0.99)), a(k, b(r, m * 0.99)), a(k, b(r, m)));
+      for (let o = 1 / 29, s = o; s < 1; s += o)
+        N.push(L(i, k, V * 3 * s));
+    } else
+      N.push(l(k, b(r, m)), l(k, b(r, m * 0.99)), a(k, b(r, m * 0.99)), a(k, b(r, m)));
   }
   return _.concat(N, M.reverse(), Q);
 }
 function me(e, t = {}) {
   var q;
   let { streamline: u = 0.5, size: x = 16, last: h = false } = t;
-  if (e.length === 0) return [];
+  if (e.length === 0)
+    return [];
   let y = 0.15 + (1 - u) * 0.85, n = Array.isArray(e[0]) ? e : e.map(({ x: c, y: p, pressure: g = 0.5 }) => [c, p, g]);
   if (n.length === 2) {
     let c = n[1];
     n = n.slice(0, -1);
-    for (let p = 1; p < 5; p++) n.push(K(n[0], c, p / 4));
+    for (let p = 1; p < 5; p++)
+      n.push(K(n[0], c, p / 4));
   }
   n.length === 1 && (n = [...n, [...l(n[0], [1, 1]), ...n[0].slice(2)]]);
   let f = [{ point: [n[0][0], n[0][1]], pressure: n[0][2] >= 0 ? n[0][2] : 0.25, vector: [1, 1], distance: 0, runningLength: 0 }], d = false, D = 0, S = f[0], j = n.length - 1;
   for (let c = 1; c < n.length; c++) {
     let p = h && c === j ? n[c].slice(0, 2) : K(S.point, n[c], y);
-    if (ue(S.point, p)) continue;
+    if (ue(S.point, p))
+      continue;
     let g = ie(p, S.point);
     if (D += g, c < j && !d) {
-      if (D < x) continue;
+      if (D < x)
+        continue;
       d = true;
     }
     S = { point: p, pressure: n[c][2] >= 0 ? n[c][2] : 0.5, vector: G(a(S.point, p)), distance: g, runningLength: D }, f.push(S);
@@ -2626,9 +2640,11 @@ import {
   FRAME_STYLE,
   MIME_TYPES,
   THEME,
+  TEXT_BACKGROUND_PADDING_X,
   distance as distance2,
   getFontString as getFontString3,
   isRTL,
+  isTransparent as isTransparent3,
   getVerticalOffset,
   invariant as invariant9
 } from "@excalidraw/common";
@@ -10088,7 +10104,7 @@ var selectGroup = (groupId, appState, elements) => {
     }
   };
 };
-var selectGroupsForSelectedElements = (function() {
+var selectGroupsForSelectedElements = function() {
   let lastSelectedElements = null;
   let lastElements = null;
   let lastReturnValue = null;
@@ -10175,7 +10191,7 @@ var selectGroupsForSelectedElements = (function() {
     lastReturnValue = null;
   };
   return selectGroupsForSelectedElements2;
-})();
+}();
 var isSelectedViaGroup = (appState, element) => getSelectedGroupForElement(appState, element) != null;
 var getSelectedGroupForElement = (appState, element) => element.groupIds.filter((groupId) => groupId !== appState.editingGroupId).find((groupId) => appState.selectedGroupIds[groupId]);
 var getSelectedGroupIds = (appState) => Object.entries(appState.selectedGroupIds).filter(([groupId, isSelected]) => isSelected).map(([groupId, isSelected]) => groupId);
@@ -10390,7 +10406,7 @@ var getVisibleAndNonSelectedElements = (elements, selectedElements, appState, el
     return !selectedElementsSet.has(element.id) && isVisible;
   });
 };
-var isSomeElementSelected = (function() {
+var isSomeElementSelected = function() {
   let lastElements = null;
   let lastSelectedElementIds = null;
   let isSelected = null;
@@ -10411,7 +10427,7 @@ var isSomeElementSelected = (function() {
     isSelected = null;
   };
   return ret;
-})();
+}();
 var getSelectedElements = (elements, appState, opts) => {
   const addedElements = /* @__PURE__ */ new Set();
   const selectedElements = [];
@@ -11242,6 +11258,21 @@ var drawElementOnCanvas = (element, rc, context, renderConfig) => {
         }
         context.canvas.setAttribute("dir", rtl ? "rtl" : "ltr");
         context.save();
+        if (!isTransparent3(element.backgroundColor)) {
+          const padX = TEXT_BACKGROUND_PADDING_X;
+          context.save();
+          context.translate(-padX, 0);
+          context.fillStyle = element.backgroundColor;
+          if (context.roundRect) {
+            const radius = Math.min(4, element.width / 8, element.height / 8);
+            context.beginPath();
+            context.roundRect(0, 0, element.width + padX * 2, element.height, radius);
+            context.fill();
+          } else {
+            context.fillRect(0, 0, element.width + padX * 2, element.height);
+          }
+          context.restore();
+        }
         context.font = getFontString3(element);
         context.fillStyle = element.strokeColor;
         context.textAlign = element.textAlign;
@@ -11691,7 +11722,7 @@ function getSvgPathFromStroke(points) {
 
 // src/comparisons.ts
 init_define_import_meta_env();
-var hasBackground = (type) => type === "rectangle" || type === "iframe" || type === "embeddable" || type === "ellipse" || type === "diamond" || type === "line" || type === "freedraw";
+var hasBackground = (type) => type === "rectangle" || type === "iframe" || type === "embeddable" || type === "ellipse" || type === "diamond" || type === "line" || type === "freedraw" || type === "text";
 var hasStrokeColor = (type) => type === "rectangle" || type === "ellipse" || type === "diamond" || type === "freedraw" || type === "arrow" || type === "line" || type === "text";
 var hasStrokeWidth = (type) => type === "rectangle" || type === "iframe" || type === "embeddable" || type === "ellipse" || type === "diamond" || type === "freedraw" || type === "arrow" || type === "line";
 var hasStrokeStyle = (type) => type === "rectangle" || type === "iframe" || type === "embeddable" || type === "ellipse" || type === "diamond" || type === "arrow" || type === "line";
@@ -11782,7 +11813,7 @@ var generateRoughOptions = (element, continuousPath = false) => {
     case "diamond":
     case "ellipse": {
       options.fillStyle = element.fillStyle;
-      options.fill = isTransparent3(element.backgroundColor) ? void 0 : element.backgroundColor;
+      options.fill = isTransparent4(element.backgroundColor) ? void 0 : element.backgroundColor;
       if (element.type === "ellipse") {
         options.curveFitting = 1;
       }
@@ -11804,7 +11835,7 @@ var generateRoughOptions = (element, continuousPath = false) => {
   }
 };
 var modifyIframeLikeForRoughOptions = (element, isExporting, embedsValidationStatus) => {
-  if (isIframeLikeElement(element) && (isExporting || isEmbeddableElement(element) && embedsValidationStatus?.get(element.id) !== true) && isTransparent3(element.backgroundColor) && isTransparent3(element.strokeColor)) {
+  if (isIframeLikeElement(element) && (isExporting || isEmbeddableElement(element) && embedsValidationStatus?.get(element.id) !== true) && isTransparent4(element.backgroundColor) && isTransparent4(element.strokeColor)) {
     return {
       ...element,
       roughness: 0,
@@ -11814,8 +11845,8 @@ var modifyIframeLikeForRoughOptions = (element, isExporting, embedsValidationSta
   } else if (isIframeElement(element)) {
     return {
       ...element,
-      strokeColor: isTransparent3(element.strokeColor) ? "#000000" : element.strokeColor,
-      backgroundColor: isTransparent3(element.backgroundColor) ? "#f4f4f6" : element.backgroundColor
+      strokeColor: isTransparent4(element.strokeColor) ? "#000000" : element.strokeColor,
+      backgroundColor: isTransparent4(element.backgroundColor) ? "#f4f4f6" : element.backgroundColor
     };
   }
   return element;
@@ -13932,11 +13963,9 @@ var Store = class {
     const delta = "delta" in params ? params.delta : void 0;
     try {
       switch (action) {
-        // only immediately emits a durable increment
         case CaptureUpdateAction.IMMEDIATELY:
           this.emitDurableIncrement(nextSnapshot, change, delta);
           break;
-        // both never and eventually emit an ephemeral increment
         case CaptureUpdateAction.NEVER:
         case CaptureUpdateAction.EVENTUALLY:
           this.emitEphemeralIncrement(nextSnapshot, change);
@@ -13946,7 +13975,6 @@ var Store = class {
       }
     } finally {
       switch (action) {
-        // both immediately and never update the snapshot, unlike eventually
         case CaptureUpdateAction.IMMEDIATELY:
         case CaptureUpdateAction.NEVER:
           this.snapshot = nextSnapshot;