@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.
@@ -10723,12 +10723,10 @@ try {
10723
10723
  });
10724
10724
  ctx.restore();
10725
10725
  };
10726
- const installPillRenders = (controls) => {
10727
- var _a2;
10728
- const CUR_SIZE = 22;
10729
- const HOT = Math.round(CUR_SIZE / 2);
10730
- const makeCursor = (angleDeg) => {
10731
- const svg = `<?xml version="1.0" encoding="UTF-8"?>
10726
+ const CUR_SIZE = 22;
10727
+ const HOT = Math.round(CUR_SIZE / 2);
10728
+ const makeCursor = (angleDeg) => {
10729
+ const svg = `<?xml version="1.0" encoding="UTF-8"?>
10732
10730
  <svg xmlns="http://www.w3.org/2000/svg" width="${CUR_SIZE}" height="${CUR_SIZE}" viewBox="0 0 22 22">
10733
10731
  <g transform="rotate(${angleDeg} 11 11)" fill="none" stroke="#000" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
10734
10732
  <path d="M2.5 11 L19.5 11" stroke="#fff" stroke-width="3.2"/>
@@ -10739,80 +10737,95 @@ try {
10739
10737
  <path d="M17 8.5 L19.5 11 L17 13.5"/>
10740
10738
  </g>
10741
10739
  </svg>`;
10742
- const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10743
- const fallback = angleDeg % 180 === 0 ? "ew-resize" : angleDeg % 180 === 90 ? "ns-resize" : angleDeg === 45 || angleDeg === 225 ? "nwse-resize" : "nesw-resize";
10744
- return `url("data:image/svg+xml;utf8,${encoded}") ${HOT} ${HOT}, ${fallback}`;
10745
- };
10746
- const cursorFor = {
10747
- ml: makeCursor(0),
10748
- mr: makeCursor(0),
10749
- mt: makeCursor(90),
10750
- mb: makeCursor(90),
10751
- tl: makeCursor(45),
10752
- br: makeCursor(45),
10753
- tr: makeCursor(135),
10754
- bl: makeCursor(135)
10755
- };
10756
- 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";
10757
- const CUR_R_SIZE = 18;
10758
- const HOT_R = Math.round(CUR_R_SIZE / 2);
10759
- const makeRotateCursor = (angleDeg) => {
10760
- const a = ((angleDeg + 215) % 360 + 360) % 360;
10761
- const halo = `<path d="${ROTATE_ICON_PATH}" fill="#fff" stroke="#fff" stroke-width="40" stroke-linejoin="round"/>`;
10762
- const fg = `<path d="${ROTATE_ICON_PATH}" fill="#0f172a" stroke="#0f172a" stroke-width="6" stroke-linejoin="round"/>`;
10763
- const svg = `<?xml version="1.0" encoding="UTF-8"?>
10740
+ const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10741
+ const fallback = angleDeg % 180 === 0 ? "ew-resize" : angleDeg % 180 === 90 ? "ns-resize" : angleDeg === 45 || angleDeg === 225 ? "nwse-resize" : "nesw-resize";
10742
+ return `url("data:image/svg+xml;utf8,${encoded}") ${HOT} ${HOT}, ${fallback}`;
10743
+ };
10744
+ const cursorFor = {
10745
+ ml: makeCursor(0),
10746
+ mr: makeCursor(0),
10747
+ mt: makeCursor(90),
10748
+ mb: makeCursor(90),
10749
+ tl: makeCursor(45),
10750
+ br: makeCursor(45),
10751
+ tr: makeCursor(135),
10752
+ bl: makeCursor(135)
10753
+ };
10754
+ 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";
10755
+ const CUR_R_SIZE = 18;
10756
+ const HOT_R = Math.round(CUR_R_SIZE / 2);
10757
+ const makeRotateCursor = (angleDeg) => {
10758
+ const a = ((angleDeg + 215) % 360 + 360) % 360;
10759
+ const halo = `<path d="${ROTATE_ICON_PATH}" fill="#fff" stroke="#fff" stroke-width="40" stroke-linejoin="round"/>`;
10760
+ const fg = `<path d="${ROTATE_ICON_PATH}" fill="#0f172a" stroke="#0f172a" stroke-width="6" stroke-linejoin="round"/>`;
10761
+ const svg = `<?xml version="1.0" encoding="UTF-8"?>
10764
10762
  <svg xmlns="http://www.w3.org/2000/svg" width="${CUR_R_SIZE}" height="${CUR_R_SIZE}" viewBox="0 0 512 512">
10765
10763
  <g transform="rotate(${a} 256 256)">${halo}${fg}</g>
10766
10764
  </svg>`;
10767
- const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10768
- return `url("data:image/svg+xml;utf8,${encoded}") ${HOT_R} ${HOT_R}, crosshair`;
10769
- };
10770
- const rotateCursorCache = {};
10771
- const getRotateCursor = (fabricObject) => {
10772
- let objAngle = 0;
10773
- try {
10774
- objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10775
- } catch {
10776
- objAngle = 0;
10777
- }
10778
- let a = (objAngle % 360 + 360) % 360;
10779
- a = Math.round(a / 15) * 15;
10780
- if (a === 360) a = 0;
10781
- if (!rotateCursorCache[a]) rotateCursorCache[a] = makeRotateCursor(a);
10782
- return rotateCursorCache[a];
10783
- };
10765
+ const encoded = encodeURIComponent(svg).replace(/'/g, "%27").replace(/"/g, "%22");
10766
+ return `url("data:image/svg+xml;utf8,${encoded}") ${HOT_R} ${HOT_R}, crosshair`;
10767
+ };
10768
+ const rotateCursorCache = {};
10769
+ const getRotateCursor = (fabricObject) => {
10770
+ let objAngle = 0;
10771
+ try {
10772
+ objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10773
+ } catch {
10774
+ objAngle = 0;
10775
+ }
10776
+ let a = (objAngle % 360 + 360) % 360;
10777
+ a = Math.round(a / 15) * 15;
10778
+ if (a === 360) a = 0;
10779
+ if (!rotateCursorCache[a]) rotateCursorCache[a] = makeRotateCursor(a);
10780
+ return rotateCursorCache[a];
10781
+ };
10782
+ const baseAngleFor = {
10783
+ ml: 0,
10784
+ mr: 0,
10785
+ mt: 90,
10786
+ mb: 90,
10787
+ tl: 45,
10788
+ br: 45,
10789
+ tr: 135,
10790
+ bl: 135
10791
+ };
10792
+ const cursorCache = {};
10793
+ const getRotatedCursor = (key, fabricObject) => {
10794
+ const base = baseAngleFor[key];
10795
+ if (base === void 0) return cursorFor[key];
10796
+ let objAngle = 0;
10797
+ try {
10798
+ objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10799
+ } catch {
10800
+ objAngle = 0;
10801
+ }
10802
+ let a = ((base + objAngle) % 180 + 180) % 180;
10803
+ a = Math.round(a / 15) * 15;
10804
+ if (a === 180) a = 0;
10805
+ if (!cursorCache[a]) cursorCache[a] = makeCursor(a);
10806
+ return cursorCache[a];
10807
+ };
10808
+ const inferControlKey = (control) => {
10809
+ if (!control) return null;
10810
+ const x = Number(control.x ?? 0);
10811
+ const y = Number(control.y ?? 0);
10812
+ const atLeftRight = Math.abs(Math.abs(x) - 0.5) < 1e-3;
10813
+ const atTopBottom = Math.abs(Math.abs(y) - 0.5) < 1e-3;
10814
+ const atCenterX = Math.abs(x) < 1e-3;
10815
+ const atCenterY = Math.abs(y) < 1e-3;
10816
+ if (atLeftRight && atCenterY) return x < 0 ? "ml" : "mr";
10817
+ if (atCenterX && atTopBottom) return y < 0 ? "mt" : "mb";
10818
+ if (atLeftRight && atTopBottom) return `${y < 0 ? "t" : "b"}${x < 0 ? "l" : "r"}`;
10819
+ return null;
10820
+ };
10821
+ const installPillRenders = (controls) => {
10822
+ var _a2;
10784
10823
  const MOVE_PATHS_2D = [
10785
10824
  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"),
10786
10825
  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"),
10787
10826
  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"),
10788
10827
  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")
10789
10828
  ];
10790
- const baseAngleFor = {
10791
- ml: 0,
10792
- mr: 0,
10793
- mt: 90,
10794
- mb: 90,
10795
- tl: 45,
10796
- br: 45,
10797
- tr: 135,
10798
- bl: 135
10799
- };
10800
- const cursorCache = {};
10801
- const getRotatedCursor = (key, fabricObject) => {
10802
- const base = baseAngleFor[key];
10803
- if (base === void 0) return cursorFor[key];
10804
- let objAngle = 0;
10805
- try {
10806
- objAngle = typeof (fabricObject == null ? void 0 : fabricObject.getTotalAngle) === "function" ? fabricObject.getTotalAngle() : (fabricObject == null ? void 0 : fabricObject.angle) ?? 0;
10807
- } catch {
10808
- objAngle = 0;
10809
- }
10810
- let a = ((base + objAngle) % 180 + 180) % 180;
10811
- a = Math.round(a / 15) * 15;
10812
- if (a === 180) a = 0;
10813
- if (!cursorCache[a]) cursorCache[a] = makeCursor(a);
10814
- return cursorCache[a];
10815
- };
10816
10829
  const sides = [
10817
10830
  ["ml", "vertical"],
10818
10831
  ["mr", "vertical"],
@@ -10989,6 +11002,34 @@ try {
10989
11002
  };
10990
11003
  ControlProto.__pixldocsCanvaRenderFallback = true;
10991
11004
  }
11005
+ if (ControlProto && !ControlProto.__pixldocsCanvaCursorFallback) {
11006
+ const originalCursorHandler = ControlProto.cursorStyleHandler;
11007
+ ControlProto.cursorStyleHandler = function(eventData, control, fabricObject) {
11008
+ const actionName = String(this.actionName ?? (control == null ? void 0 : control.actionName) ?? "");
11009
+ 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;
11010
+ if (isRotateHandle) {
11011
+ const cursor = getRotateCursor(fabricObject);
11012
+ try {
11013
+ const canvas = fabricObject == null ? void 0 : fabricObject.canvas;
11014
+ if (canvas) canvas.__pixldocsGetRotateCursor = getRotateCursor;
11015
+ const upper = canvas == null ? void 0 : canvas.upperCanvasEl;
11016
+ if (upper) upper.style.cursor = cursor;
11017
+ } catch {
11018
+ }
11019
+ return cursor;
11020
+ }
11021
+ const activeCorner = typeof (fabricObject == null ? void 0 : fabricObject.__corner) === "string" ? fabricObject.__corner : null;
11022
+ const key = activeCorner && baseAngleFor[activeCorner] !== void 0 ? activeCorner : inferControlKey(this) ?? inferControlKey(control);
11023
+ if (key && baseAngleFor[key] !== void 0) {
11024
+ return getRotatedCursor(key, fabricObject);
11025
+ }
11026
+ if (typeof originalCursorHandler === "function") {
11027
+ return originalCursorHandler.call(this, eventData, control, fabricObject);
11028
+ }
11029
+ return this.cursorStyle || "default";
11030
+ };
11031
+ ControlProto.__pixldocsCanvaCursorFallback = true;
11032
+ }
10992
11033
  ensureCanvaControlRenders = (obj) => {
10993
11034
  try {
10994
11035
  if (obj && obj.controls) installPillRenders(obj.controls);
@@ -11028,6 +11069,18 @@ try {
11028
11069
  const prev = target && target.__corner;
11029
11070
  const res = origSet.call(this, e, target);
11030
11071
  const next = target && target.__corner;
11072
+ try {
11073
+ const control = next && (target == null ? void 0 : target.controls) ? target.controls[next] : null;
11074
+ const actionName = String((control == null ? void 0 : control.actionName) ?? "");
11075
+ 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;
11076
+ const key = typeof next === "string" && baseAngleFor[next] !== void 0 ? next : inferControlKey(control);
11077
+ const cursor = isRotateHandle ? getRotateCursor(target) : key ? getRotatedCursor(key, target) : null;
11078
+ if (cursor) {
11079
+ if (typeof this.setCursor === "function") this.setCursor(cursor);
11080
+ else if (this.upperCanvasEl) this.upperCanvasEl.style.cursor = cursor;
11081
+ }
11082
+ } catch {
11083
+ }
11031
11084
  if (prev !== next) {
11032
11085
  try {
11033
11086
  this.requestRenderAll();
@@ -24710,9 +24763,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
24710
24763
  }
24711
24764
  return svgString;
24712
24765
  }
24713
- const resolvedPackageVersion = "0.5.376";
24766
+ const resolvedPackageVersion = "0.5.378";
24714
24767
  const PACKAGE_VERSION = resolvedPackageVersion;
24715
- const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.376";
24768
+ const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.378";
24716
24769
  const roundParityValue = (value) => {
24717
24770
  if (typeof value !== "number") return value;
24718
24771
  return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25526,7 +25579,7 @@ class PixldocsRenderer {
25526
25579
  await this.waitForCanvasScene(container, cloned, i);
25527
25580
  }
25528
25581
  console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
25529
- const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-BUGumNZN.js");
25582
+ const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-B7K76NIW.js");
25530
25583
  const prepared = preparePagesForExport(
25531
25584
  cloned.pages,
25532
25585
  canvasWidth,
@@ -27846,7 +27899,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
27846
27899
  if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
27847
27900
  sanitizeSvgTreeForPdf(svgToDraw);
27848
27901
  try {
27849
- const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-BUGumNZN.js");
27902
+ const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-B7K76NIW.js");
27850
27903
  try {
27851
27904
  await logTextMeasurementDiagnostic(svgToDraw);
27852
27905
  } catch {
@@ -28246,4 +28299,4 @@ export {
28246
28299
  buildTeaserBlurFlatKeys as y,
28247
28300
  collectFontDescriptorsFromConfig as z
28248
28301
  };
28249
- //# sourceMappingURL=index-CXbUNfGV.js.map
28302
+ //# sourceMappingURL=index-CKwhm9vr.js.map