@pixldocs/canvas-renderer 0.5.376 → 0.5.378

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10741,12 +10741,10 @@ try {
10741
10741
  });
10742
10742
  ctx.restore();
10743
10743
  };
10744
- const installPillRenders = (controls) => {
10745
- var _a2;
10746
- const CUR_SIZE = 22;
10747
- const HOT = Math.round(CUR_SIZE / 2);
10748
- const makeCursor = (angleDeg) => {
10749
- const svg = `<?xml version="1.0" encoding="UTF-8"?>
10744
+ const CUR_SIZE = 22;
10745
+ const HOT = Math.round(CUR_SIZE / 2);
10746
+ const makeCursor = (angleDeg) => {
10747
+ const svg = `<?xml version="1.0" encoding="UTF-8"?>
10750
10748
  <svg xmlns="http://www.w3.org/2000/svg" width="${CUR_SIZE}" height="${CUR_SIZE}" viewBox="0 0 22 22">
10751
10749
  <g transform="rotate(${angleDeg} 11 11)" fill="none" stroke="#000" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
10752
10750
  <path d="M2.5 11 L19.5 11" stroke="#fff" stroke-width="3.2"/>
@@ -10757,80 +10755,95 @@ try {
10757
10755
  <path d="M17 8.5 L19.5 11 L17 13.5"/>
10758
10756
  </g>
10759
10757
  </svg>`;
10760
- const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10761
- const fallback = angleDeg % 180 === 0 ? "ew-resize" : angleDeg % 180 === 90 ? "ns-resize" : angleDeg === 45 || angleDeg === 225 ? "nwse-resize" : "nesw-resize";
10762
- return `url("data:image/svg+xml;utf8,${encoded}") ${HOT} ${HOT}, ${fallback}`;
10763
- };
10764
- const cursorFor = {
10765
- ml: makeCursor(0),
10766
- mr: makeCursor(0),
10767
- mt: makeCursor(90),
10768
- mb: makeCursor(90),
10769
- tl: makeCursor(45),
10770
- br: makeCursor(45),
10771
- tr: makeCursor(135),
10772
- bl: makeCursor(135)
10773
- };
10774
- const ROTATE_ICON_PATH = "M505.4 122.5l-92.2-62.7c-6.7-4.5-15.6-3.1-20.7 3.1l-69.2 87.4c-5.2 6.6-4.1 16.1 2.5 21.3s16.1 4.1 21.3-2.5l50.4-63.8c2.9 14.6 4.3 29.4 4.3 44.3 0 125.2-101.9 227-227 227-45.8 0-90.5-13.8-128.2-39.6l79-27.8c8-2.5 12.4-11 9.9-18.9s-11-12.4-18.9-9.9c-.3.1-.7.2-1 .4l-105.2 37c-2 .7-3.9 1.8-5.4 3.3-4.2 3.8-6 9.7-4.5 15.2l29.3 107.5c1.8 6.6 7.8 11.1 14.6 11.1 1.4 0 2.7-.2 4-.5 8.1-2.2 12.8-10.5 10.6-18.6l-18-66.4c40.3 24.6 86.6 37.5 133.8 37.5 68.3.2 133.8-27 181.9-75.4 48.4-48.1 75.5-113.7 75.4-181.9 0-14.3-1.2-28.6-3.5-42.8l59.8 40.7c7.1 4.4 16.4 2.2 20.8-4.9 4.1-6.6 2.5-15.4-3.8-20.1z";
10775
- const CUR_R_SIZE = 18;
10776
- const HOT_R = Math.round(CUR_R_SIZE / 2);
10777
- const makeRotateCursor = (angleDeg) => {
10778
- const a = ((angleDeg + 215) % 360 + 360) % 360;
10779
- const halo = `<path d="${ROTATE_ICON_PATH}" fill="#fff" stroke="#fff" stroke-width="40" stroke-linejoin="round"/>`;
10780
- const fg = `<path d="${ROTATE_ICON_PATH}" fill="#0f172a" stroke="#0f172a" stroke-width="6" stroke-linejoin="round"/>`;
10781
- const svg = `<?xml version="1.0" encoding="UTF-8"?>
10758
+ const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10759
+ const fallback = angleDeg % 180 === 0 ? "ew-resize" : angleDeg % 180 === 90 ? "ns-resize" : angleDeg === 45 || angleDeg === 225 ? "nwse-resize" : "nesw-resize";
10760
+ return `url("data:image/svg+xml;utf8,${encoded}") ${HOT} ${HOT}, ${fallback}`;
10761
+ };
10762
+ const cursorFor = {
10763
+ ml: makeCursor(0),
10764
+ mr: makeCursor(0),
10765
+ mt: makeCursor(90),
10766
+ mb: makeCursor(90),
10767
+ tl: makeCursor(45),
10768
+ br: makeCursor(45),
10769
+ tr: makeCursor(135),
10770
+ bl: makeCursor(135)
10771
+ };
10772
+ const ROTATE_ICON_PATH = "M505.4 122.5l-92.2-62.7c-6.7-4.5-15.6-3.1-20.7 3.1l-69.2 87.4c-5.2 6.6-4.1 16.1 2.5 21.3s16.1 4.1 21.3-2.5l50.4-63.8c2.9 14.6 4.3 29.4 4.3 44.3 0 125.2-101.9 227-227 227-45.8 0-90.5-13.8-128.2-39.6l79-27.8c8-2.5 12.4-11 9.9-18.9s-11-12.4-18.9-9.9c-.3.1-.7.2-1 .4l-105.2 37c-2 .7-3.9 1.8-5.4 3.3-4.2 3.8-6 9.7-4.5 15.2l29.3 107.5c1.8 6.6 7.8 11.1 14.6 11.1 1.4 0 2.7-.2 4-.5 8.1-2.2 12.8-10.5 10.6-18.6l-18-66.4c40.3 24.6 86.6 37.5 133.8 37.5 68.3.2 133.8-27 181.9-75.4 48.4-48.1 75.5-113.7 75.4-181.9 0-14.3-1.2-28.6-3.5-42.8l59.8 40.7c7.1 4.4 16.4 2.2 20.8-4.9 4.1-6.6 2.5-15.4-3.8-20.1z";
10773
+ const CUR_R_SIZE = 18;
10774
+ const HOT_R = Math.round(CUR_R_SIZE / 2);
10775
+ const makeRotateCursor = (angleDeg) => {
10776
+ const a = ((angleDeg + 215) % 360 + 360) % 360;
10777
+ const halo = `<path d="${ROTATE_ICON_PATH}" fill="#fff" stroke="#fff" stroke-width="40" stroke-linejoin="round"/>`;
10778
+ const fg = `<path d="${ROTATE_ICON_PATH}" fill="#0f172a" stroke="#0f172a" stroke-width="6" stroke-linejoin="round"/>`;
10779
+ const svg = `<?xml version="1.0" encoding="UTF-8"?>
10782
10780
  <svg xmlns="http://www.w3.org/2000/svg" width="${CUR_R_SIZE}" height="${CUR_R_SIZE}" viewBox="0 0 512 512">
10783
10781
  <g transform="rotate(${a} 256 256)">${halo}${fg}</g>
10784
10782
  </svg>`;
10785
- const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10786
- return `url("data:image/svg+xml;utf8,${encoded}") ${HOT_R} ${HOT_R}, crosshair`;
10787
- };
10788
- const rotateCursorCache = {};
10789
- const getRotateCursor = (fabricObject) => {
10790
- let objAngle = 0;
10791
- try {
10792
- objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10793
- } catch {
10794
- objAngle = 0;
10795
- }
10796
- let a = (objAngle % 360 + 360) % 360;
10797
- a = Math.round(a / 15) * 15;
10798
- if (a === 360) a = 0;
10799
- if (!rotateCursorCache[a]) rotateCursorCache[a] = makeRotateCursor(a);
10800
- return rotateCursorCache[a];
10801
- };
10783
+ const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10784
+ return `url("data:image/svg+xml;utf8,${encoded}") ${HOT_R} ${HOT_R}, crosshair`;
10785
+ };
10786
+ const rotateCursorCache = {};
10787
+ const getRotateCursor = (fabricObject) => {
10788
+ let objAngle = 0;
10789
+ try {
10790
+ objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10791
+ } catch {
10792
+ objAngle = 0;
10793
+ }
10794
+ let a = (objAngle % 360 + 360) % 360;
10795
+ a = Math.round(a / 15) * 15;
10796
+ if (a === 360) a = 0;
10797
+ if (!rotateCursorCache[a]) rotateCursorCache[a] = makeRotateCursor(a);
10798
+ return rotateCursorCache[a];
10799
+ };
10800
+ const baseAngleFor = {
10801
+ ml: 0,
10802
+ mr: 0,
10803
+ mt: 90,
10804
+ mb: 90,
10805
+ tl: 45,
10806
+ br: 45,
10807
+ tr: 135,
10808
+ bl: 135
10809
+ };
10810
+ const cursorCache = {};
10811
+ const getRotatedCursor = (key, fabricObject) => {
10812
+ const base = baseAngleFor[key];
10813
+ if (base === void 0) return cursorFor[key];
10814
+ let objAngle = 0;
10815
+ try {
10816
+ objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10817
+ } catch {
10818
+ objAngle = 0;
10819
+ }
10820
+ let a = ((base + objAngle) % 180 + 180) % 180;
10821
+ a = Math.round(a / 15) * 15;
10822
+ if (a === 180) a = 0;
10823
+ if (!cursorCache[a]) cursorCache[a] = makeCursor(a);
10824
+ return cursorCache[a];
10825
+ };
10826
+ const inferControlKey = (control) => {
10827
+ if (!control) return null;
10828
+ const x = Number(control.x ?? 0);
10829
+ const y = Number(control.y ?? 0);
10830
+ const atLeftRight = Math.abs(Math.abs(x) - 0.5) < 1e-3;
10831
+ const atTopBottom = Math.abs(Math.abs(y) - 0.5) < 1e-3;
10832
+ const atCenterX = Math.abs(x) < 1e-3;
10833
+ const atCenterY = Math.abs(y) < 1e-3;
10834
+ if (atLeftRight && atCenterY) return x < 0 ? "ml" : "mr";
10835
+ if (atCenterX && atTopBottom) return y < 0 ? "mt" : "mb";
10836
+ if (atLeftRight && atTopBottom) return `${y < 0 ? "t" : "b"}${x < 0 ? "l" : "r"}`;
10837
+ return null;
10838
+ };
10839
+ const installPillRenders = (controls) => {
10840
+ var _a2;
10802
10841
  const MOVE_PATHS_2D = [
10803
10842
  new Path2D("M12 3L12.3648 2.65803L12 2.26894L11.6352 2.65803L12 3ZM11.5 9C11.5 9.27614 11.7239 9.5 12 9.5C12.2761 9.5 12.5 9.27614 12.5 9H11.5ZM15.3648 5.85803L12.3648 2.65803L11.6352 3.34197L14.6352 6.54197L15.3648 5.85803ZM11.6352 2.65803L8.63523 5.85803L9.36477 6.54197L12.3648 3.34197L11.6352 2.65803ZM11.5 3V9H12.5V3H11.5Z"),
10804
10843
  new Path2D("M21 12L21.342 12.3648L21.7311 12L21.342 11.6352L21 12ZM15 11.5C14.7239 11.5 14.5 11.7239 14.5 12C14.5 12.2761 14.7239 12.5 15 12.5L15 11.5ZM18.142 15.3648L21.342 12.3648L20.658 11.6352L17.458 14.6352L18.142 15.3648ZM21.342 11.6352L18.142 8.63523L17.458 9.36477L20.658 12.3648L21.342 11.6352ZM21 11.5L15 11.5L15 12.5L21 12.5L21 11.5Z"),
10805
10844
  new Path2D("M12 21L12.3648 21.342L12 21.7311L11.6352 21.342L12 21ZM11.5 15C11.5 14.7239 11.7239 14.5 12 14.5C12.2761 14.5 12.5 14.7239 12.5 15H11.5ZM15.3648 18.142L12.3648 21.342L11.6352 20.658L14.6352 17.458L15.3648 18.142ZM11.6352 21.342L8.63523 18.142L9.36477 17.458L12.3648 20.658L11.6352 21.342ZM11.5 21V15H12.5V21H11.5Z"),
10806
10845
  new Path2D("M3 12L2.65803 12.3648L2.26894 12L2.65803 11.6352L3 12ZM9 11.5C9.27614 11.5 9.5 11.7239 9.5 12C9.5 12.2761 9.27614 12.5 9 12.5L9 11.5ZM5.85803 15.3648L2.65803 12.3648L3.34197 11.6352L6.54197 14.6352L5.85803 15.3648ZM2.65803 11.6352L5.85803 8.63523L6.54197 9.36477L3.34197 12.3648L2.65803 11.6352ZM3 11.5L9 11.5L9 12.5L3 12.5L3 11.5Z")
10807
10846
  ];
10808
- const baseAngleFor = {
10809
- ml: 0,
10810
- mr: 0,
10811
- mt: 90,
10812
- mb: 90,
10813
- tl: 45,
10814
- br: 45,
10815
- tr: 135,
10816
- bl: 135
10817
- };
10818
- const cursorCache = {};
10819
- const getRotatedCursor = (key, fabricObject) => {
10820
- const base = baseAngleFor[key];
10821
- if (base === void 0) return cursorFor[key];
10822
- let objAngle = 0;
10823
- try {
10824
- objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10825
- } catch {
10826
- objAngle = 0;
10827
- }
10828
- let a = ((base + objAngle) % 180 + 180) % 180;
10829
- a = Math.round(a / 15) * 15;
10830
- if (a === 180) a = 0;
10831
- if (!cursorCache[a]) cursorCache[a] = makeCursor(a);
10832
- return cursorCache[a];
10833
- };
10834
10847
  const sides = [
10835
10848
  ["ml", "vertical"],
10836
10849
  ["mr", "vertical"],
@@ -11007,6 +11020,34 @@ try {
11007
11020
  };
11008
11021
  ControlProto.__pixldocsCanvaRenderFallback = true;
11009
11022
  }
11023
+ if (ControlProto && !ControlProto.__pixldocsCanvaCursorFallback) {
11024
+ const originalCursorHandler = ControlProto.cursorStyleHandler;
11025
+ ControlProto.cursorStyleHandler = function(eventData, control, fabricObject) {
11026
+ const actionName = String(this.actionName ?? (control == null ? void 0 : control.actionName) ?? "");
11027
+ const isRotateHandle = actionName === "rotate" || Math.abs(Number(this.x ?? (control == null ? void 0 : control.x) ?? 0)) < 1e-3 && Math.abs(Number(this.y ?? (control == null ? void 0 : control.y) ?? 0) + 0.5) < 1e-3 && Number(this.offsetY ?? (control == null ? void 0 : control.offsetY) ?? 0) < 0;
11028
+ if (isRotateHandle) {
11029
+ const cursor = getRotateCursor(fabricObject);
11030
+ try {
11031
+ const canvas = fabricObject == null ? void 0 : fabricObject.canvas;
11032
+ if (canvas) canvas.__pixldocsGetRotateCursor = getRotateCursor;
11033
+ const upper = canvas == null ? void 0 : canvas.upperCanvasEl;
11034
+ if (upper) upper.style.cursor = cursor;
11035
+ } catch {
11036
+ }
11037
+ return cursor;
11038
+ }
11039
+ const activeCorner = typeof (fabricObject == null ? void 0 : fabricObject.__corner) === "string" ? fabricObject.__corner : null;
11040
+ const key = activeCorner && baseAngleFor[activeCorner] !== void 0 ? activeCorner : inferControlKey(this) ?? inferControlKey(control);
11041
+ if (key && baseAngleFor[key] !== void 0) {
11042
+ return getRotatedCursor(key, fabricObject);
11043
+ }
11044
+ if (typeof originalCursorHandler === "function") {
11045
+ return originalCursorHandler.call(this, eventData, control, fabricObject);
11046
+ }
11047
+ return this.cursorStyle || "default";
11048
+ };
11049
+ ControlProto.__pixldocsCanvaCursorFallback = true;
11050
+ }
11010
11051
  ensureCanvaControlRenders = (obj) => {
11011
11052
  try {
11012
11053
  if (obj && obj.controls) installPillRenders(obj.controls);
@@ -11046,6 +11087,18 @@ try {
11046
11087
  const prev = target && target.__corner;
11047
11088
  const res = origSet.call(this, e, target);
11048
11089
  const next = target && target.__corner;
11090
+ try {
11091
+ const control = next && (target == null ? void 0 : target.controls) ? target.controls[next] : null;
11092
+ const actionName = String((control == null ? void 0 : control.actionName) ?? "");
11093
+ const isRotateHandle = next === "mtr" || actionName === "rotate" || control && Math.abs(Number(control.x ?? 0)) < 1e-3 && Math.abs(Number(control.y ?? 0) + 0.5) < 1e-3 && Number(control.offsetY ?? 0) < 0;
11094
+ const key = typeof next === "string" && baseAngleFor[next] !== void 0 ? next : inferControlKey(control);
11095
+ const cursor = isRotateHandle ? getRotateCursor(target) : key ? getRotatedCursor(key, target) : null;
11096
+ if (cursor) {
11097
+ if (typeof this.setCursor === "function") this.setCursor(cursor);
11098
+ else if (this.upperCanvasEl) this.upperCanvasEl.style.cursor = cursor;
11099
+ }
11100
+ } catch {
11101
+ }
11049
11102
  if (prev !== next) {
11050
11103
  try {
11051
11104
  this.requestRenderAll();
@@ -24728,9 +24781,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
24728
24781
  }
24729
24782
  return svgString;
24730
24783
  }
24731
- const resolvedPackageVersion = "0.5.376";
24784
+ const resolvedPackageVersion = "0.5.378";
24732
24785
  const PACKAGE_VERSION = resolvedPackageVersion;
24733
- const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.376";
24786
+ const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.378";
24734
24787
  const roundParityValue = (value) => {
24735
24788
  if (typeof value !== "number") return value;
24736
24789
  return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25544,7 +25597,7 @@ class PixldocsRenderer {
25544
25597
  await this.waitForCanvasScene(container, cloned, i);
25545
25598
  }
25546
25599
  console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
25547
- const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-BkHsGRzd.cjs"));
25600
+ const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-BShYUaFY.cjs"));
25548
25601
  const prepared = preparePagesForExport(
25549
25602
  cloned.pages,
25550
25603
  canvasWidth,
@@ -27864,7 +27917,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
27864
27917
  if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
27865
27918
  sanitizeSvgTreeForPdf(svgToDraw);
27866
27919
  try {
27867
- const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-BkHsGRzd.cjs"));
27920
+ const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-BShYUaFY.cjs"));
27868
27921
  try {
27869
27922
  await logTextMeasurementDiagnostic(svgToDraw);
27870
27923
  } catch {
@@ -28261,4 +28314,4 @@ exports.setAutoShrinkDebug = setAutoShrinkDebug;
28261
28314
  exports.setBundledAssetPrefixes = setBundledAssetPrefixes;
28262
28315
  exports.warmResolvedTemplateForPreview = warmResolvedTemplateForPreview;
28263
28316
  exports.warmTemplateFromForm = warmTemplateFromForm;
28264
- //# sourceMappingURL=index-UF12OZmE.cjs.map
28317
+ //# sourceMappingURL=index-DHsYlRj5.cjs.map