@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.
- package/dist/{index-CXbUNfGV.js → index-CKwhm9vr.js} +129 -76
- package/dist/index-CKwhm9vr.js.map +1 -0
- package/dist/{index-UF12OZmE.cjs → index-DHsYlRj5.cjs} +129 -76
- package/dist/index-DHsYlRj5.cjs.map +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/{vectorPdfExport-BUGumNZN.js → vectorPdfExport-B7K76NIW.js} +4 -4
- package/dist/{vectorPdfExport-BUGumNZN.js.map → vectorPdfExport-B7K76NIW.js.map} +1 -1
- package/dist/{vectorPdfExport-BkHsGRzd.cjs → vectorPdfExport-BShYUaFY.cjs} +4 -4
- package/dist/{vectorPdfExport-BkHsGRzd.cjs.map → vectorPdfExport-BShYUaFY.cjs.map} +1 -1
- package/package.json +1 -1
- package/dist/index-CXbUNfGV.js.map +0 -1
- package/dist/index-UF12OZmE.cjs.map +0 -1
|
@@ -10741,12 +10741,10 @@ try {
|
|
|
10741
10741
|
});
|
|
10742
10742
|
ctx.restore();
|
|
10743
10743
|
};
|
|
10744
|
-
const
|
|
10745
|
-
|
|
10746
|
-
|
|
10747
|
-
const
|
|
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
|
-
|
|
10761
|
-
|
|
10762
|
-
|
|
10763
|
-
|
|
10764
|
-
|
|
10765
|
-
|
|
10766
|
-
|
|
10767
|
-
|
|
10768
|
-
|
|
10769
|
-
|
|
10770
|
-
|
|
10771
|
-
|
|
10772
|
-
|
|
10773
|
-
|
|
10774
|
-
|
|
10775
|
-
|
|
10776
|
-
|
|
10777
|
-
|
|
10778
|
-
|
|
10779
|
-
|
|
10780
|
-
|
|
10781
|
-
|
|
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
|
-
|
|
10786
|
-
|
|
10787
|
-
|
|
10788
|
-
|
|
10789
|
-
|
|
10790
|
-
|
|
10791
|
-
|
|
10792
|
-
|
|
10793
|
-
|
|
10794
|
-
|
|
10795
|
-
|
|
10796
|
-
|
|
10797
|
-
|
|
10798
|
-
|
|
10799
|
-
|
|
10800
|
-
|
|
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.
|
|
24784
|
+
const resolvedPackageVersion = "0.5.378";
|
|
24732
24785
|
const PACKAGE_VERSION = resolvedPackageVersion;
|
|
24733
|
-
const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.
|
|
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-
|
|
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-
|
|
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-
|
|
28317
|
+
//# sourceMappingURL=index-DHsYlRj5.cjs.map
|