@pixldocs/canvas-renderer 0.5.349 → 0.5.351
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-CwQ8bAR_.cjs → index-CG3kYo0Z.cjs} +129 -114
- package/dist/index-CG3kYo0Z.cjs.map +1 -0
- package/dist/{index-wt6naIdE.js → index-Ugo_-WGu.js} +129 -114
- package/dist/index-Ugo_-WGu.js.map +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/{vectorPdfExport-B8sTK3Ew.js → vectorPdfExport-C4JUR8dI.js} +4 -4
- package/dist/{vectorPdfExport-B8sTK3Ew.js.map → vectorPdfExport-C4JUR8dI.js.map} +1 -1
- package/dist/{vectorPdfExport-eaaea4kH.cjs → vectorPdfExport-CmEq_yn3.cjs} +4 -4
- package/dist/{vectorPdfExport-eaaea4kH.cjs.map → vectorPdfExport-CmEq_yn3.cjs.map} +1 -1
- package/package.json +1 -1
- package/dist/index-CwQ8bAR_.cjs.map +0 -1
- package/dist/index-wt6naIdE.js.map +0 -1
|
@@ -10500,6 +10500,105 @@ function bakeEdgeFade(source, fade) {
|
|
|
10500
10500
|
}
|
|
10501
10501
|
return canvas;
|
|
10502
10502
|
}
|
|
10503
|
+
const normalizeSignedAngle = (angle) => (angle % 360 + 540) % 360 - 180;
|
|
10504
|
+
const rotatedTopLeftToCenter = (left, top, width, height, angleDeg = 0) => {
|
|
10505
|
+
const angle = angleDeg * Math.PI / 180;
|
|
10506
|
+
const cos = Math.cos(angle);
|
|
10507
|
+
const sin = Math.sin(angle);
|
|
10508
|
+
return {
|
|
10509
|
+
x: left + width / 2 * cos - height / 2 * sin,
|
|
10510
|
+
y: top + width / 2 * sin + height / 2 * cos
|
|
10511
|
+
};
|
|
10512
|
+
};
|
|
10513
|
+
const centerToRotatedTopLeft = (centerX, centerY, width, height, angleDeg = 0) => {
|
|
10514
|
+
const angle = angleDeg * Math.PI / 180;
|
|
10515
|
+
const cos = Math.cos(angle);
|
|
10516
|
+
const sin = Math.sin(angle);
|
|
10517
|
+
return {
|
|
10518
|
+
left: centerX - width / 2 * cos + height / 2 * sin,
|
|
10519
|
+
top: centerY - width / 2 * sin - height / 2 * cos
|
|
10520
|
+
};
|
|
10521
|
+
};
|
|
10522
|
+
const getGroupTransformFrame = (group, pageChildren, options) => {
|
|
10523
|
+
const bounds = getNodeBounds(group, pageChildren);
|
|
10524
|
+
const width = Math.max(1, Number(group.width ?? bounds.width) || bounds.width || 1);
|
|
10525
|
+
const height = Math.max(1, Number(group.height ?? bounds.height) || bounds.height || 1);
|
|
10526
|
+
return {
|
|
10527
|
+
left: Number(group.left ?? bounds.left ?? 0) || 0,
|
|
10528
|
+
top: Number(group.top ?? bounds.top ?? 0) || 0,
|
|
10529
|
+
width,
|
|
10530
|
+
height,
|
|
10531
|
+
angle: Number(group.angle ?? 0) || 0
|
|
10532
|
+
};
|
|
10533
|
+
};
|
|
10534
|
+
const getGroupLocalToParentMatrix = (group, pageChildren, options) => {
|
|
10535
|
+
const frame = getGroupTransformFrame(group, pageChildren);
|
|
10536
|
+
const rad = frame.angle * Math.PI / 180;
|
|
10537
|
+
const cos = Math.cos(rad);
|
|
10538
|
+
const sin = Math.sin(rad);
|
|
10539
|
+
return [
|
|
10540
|
+
cos,
|
|
10541
|
+
sin,
|
|
10542
|
+
-sin,
|
|
10543
|
+
cos,
|
|
10544
|
+
frame.left,
|
|
10545
|
+
frame.top
|
|
10546
|
+
];
|
|
10547
|
+
};
|
|
10548
|
+
const getAncestorGroupTransform = (nodeId, pageChildren, fabric2, options) => {
|
|
10549
|
+
let matrix = [1, 0, 0, 1, 0, 0];
|
|
10550
|
+
let angle = 0;
|
|
10551
|
+
const chain = [];
|
|
10552
|
+
let currentId = nodeId;
|
|
10553
|
+
for (let guard = 0; guard < 32; guard++) {
|
|
10554
|
+
const parent = findParentGroup(pageChildren, currentId);
|
|
10555
|
+
if (!parent) break;
|
|
10556
|
+
chain.unshift(parent);
|
|
10557
|
+
currentId = parent.id;
|
|
10558
|
+
}
|
|
10559
|
+
for (const group of chain) {
|
|
10560
|
+
matrix = fabric2.util.multiplyTransformMatrices(
|
|
10561
|
+
matrix,
|
|
10562
|
+
getGroupLocalToParentMatrix(group, pageChildren)
|
|
10563
|
+
);
|
|
10564
|
+
angle += Number(group.angle ?? 0) || 0;
|
|
10565
|
+
}
|
|
10566
|
+
return { matrix, angle: normalizeSignedAngle(angle) };
|
|
10567
|
+
};
|
|
10568
|
+
const getElementFabricPlacement$1 = (element, pageChildren, fabric2, options) => {
|
|
10569
|
+
if (!pageChildren.length) {
|
|
10570
|
+
return { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
|
|
10571
|
+
}
|
|
10572
|
+
const ancestor = getAncestorGroupTransform(element.id, pageChildren, fabric2);
|
|
10573
|
+
const point = fabric2.util.transformPoint(
|
|
10574
|
+
new fabric2.Point(element.left ?? 0, element.top ?? 0),
|
|
10575
|
+
ancestor.matrix
|
|
10576
|
+
);
|
|
10577
|
+
return {
|
|
10578
|
+
left: point.x,
|
|
10579
|
+
top: point.y,
|
|
10580
|
+
angle: normalizeSignedAngle(ancestor.angle + Number(element.angle ?? 0))
|
|
10581
|
+
};
|
|
10582
|
+
};
|
|
10583
|
+
const getGroupAbsoluteTransformFrame$1 = (group, pageChildren, fabric2, options) => {
|
|
10584
|
+
const frame = getGroupTransformFrame(group, pageChildren);
|
|
10585
|
+
const ancestor = getAncestorGroupTransform(group.id, pageChildren, fabric2);
|
|
10586
|
+
const centerLocal = rotatedTopLeftToCenter(frame.left, frame.top, frame.width, frame.height, frame.angle);
|
|
10587
|
+
const center = fabric2.util.transformPoint(new fabric2.Point(centerLocal.x, centerLocal.y), ancestor.matrix);
|
|
10588
|
+
const topLeft = fabric2.util.transformPoint(new fabric2.Point(frame.left, frame.top), ancestor.matrix);
|
|
10589
|
+
return {
|
|
10590
|
+
left: topLeft.x,
|
|
10591
|
+
top: topLeft.y,
|
|
10592
|
+
width: frame.width,
|
|
10593
|
+
height: frame.height,
|
|
10594
|
+
centerX: center.x,
|
|
10595
|
+
centerY: center.y,
|
|
10596
|
+
angle: normalizeSignedAngle(ancestor.angle + frame.angle)
|
|
10597
|
+
};
|
|
10598
|
+
};
|
|
10599
|
+
function preserveLogicalGroupTagDuringMove(selection, groupId) {
|
|
10600
|
+
selection.__pixldocsGroupSelection = groupId;
|
|
10601
|
+
}
|
|
10503
10602
|
const SELECTION_PRIMARY = "hsl(217, 91%, 60%)";
|
|
10504
10603
|
const SELECTION_BORDER_SCALE = 2;
|
|
10505
10604
|
let ensureCanvaControlRenders = () => {
|
|
@@ -10953,12 +11052,18 @@ try {
|
|
|
10953
11052
|
} catch (e) {
|
|
10954
11053
|
}
|
|
10955
11054
|
};
|
|
10956
|
-
const
|
|
10957
|
-
|
|
10958
|
-
|
|
10959
|
-
|
|
10960
|
-
|
|
10961
|
-
|
|
11055
|
+
const wrapControlsFactory = (key) => {
|
|
11056
|
+
if (typeof cu[key] !== "function") return;
|
|
11057
|
+
const descriptor = Object.getOwnPropertyDescriptor(cu, key);
|
|
11058
|
+
if (descriptor && descriptor.writable === false && !descriptor.set) return;
|
|
11059
|
+
const original = cu[key].bind(cu);
|
|
11060
|
+
try {
|
|
11061
|
+
cu[key] = () => installPillRenders(original());
|
|
11062
|
+
} catch {
|
|
11063
|
+
}
|
|
11064
|
+
};
|
|
11065
|
+
wrapControlsFactory("createObjectDefaultControls");
|
|
11066
|
+
wrapControlsFactory("createTextboxDefaultControls");
|
|
10962
11067
|
const wrapClassCreateControls = (Klass) => {
|
|
10963
11068
|
if (!Klass || typeof Klass.createControls !== "function") return;
|
|
10964
11069
|
const orig = Klass.createControls.bind(Klass);
|
|
@@ -11199,104 +11304,8 @@ const bakeTextboxScaleIntoTypography = (obj, sourceElement) => {
|
|
|
11199
11304
|
};
|
|
11200
11305
|
return updates;
|
|
11201
11306
|
};
|
|
11202
|
-
const
|
|
11203
|
-
|
|
11204
|
-
const cos = Math.cos(angle);
|
|
11205
|
-
const sin = Math.sin(angle);
|
|
11206
|
-
return {
|
|
11207
|
-
x: left + width / 2 * cos - height / 2 * sin,
|
|
11208
|
-
y: top + width / 2 * sin + height / 2 * cos
|
|
11209
|
-
};
|
|
11210
|
-
};
|
|
11211
|
-
const normalizeSignedAngle = (angle) => (angle % 360 + 540) % 360 - 180;
|
|
11212
|
-
const getGroupTransformFrame = (group, pageChildren, options) => {
|
|
11213
|
-
const bounds = getNodeBounds(group, pageChildren);
|
|
11214
|
-
const width = Math.max(1, Number(group.width ?? bounds.width) || bounds.width || 1);
|
|
11215
|
-
const height = Math.max(1, Number(group.height ?? bounds.height) || bounds.height || 1);
|
|
11216
|
-
return {
|
|
11217
|
-
left: Number(group.left ?? bounds.left ?? 0) || 0,
|
|
11218
|
-
top: Number(group.top ?? bounds.top ?? 0) || 0,
|
|
11219
|
-
width,
|
|
11220
|
-
height,
|
|
11221
|
-
angle: Number(group.angle ?? 0) || 0
|
|
11222
|
-
};
|
|
11223
|
-
};
|
|
11224
|
-
const getGroupLocalToParentMatrix = (group, pageChildren, options) => {
|
|
11225
|
-
const frame = getGroupTransformFrame(group, pageChildren);
|
|
11226
|
-
const rad = frame.angle * Math.PI / 180;
|
|
11227
|
-
const cos = Math.cos(rad);
|
|
11228
|
-
const sin = Math.sin(rad);
|
|
11229
|
-
const centerX = frame.left + frame.width / 2;
|
|
11230
|
-
const centerY = frame.top + frame.height / 2;
|
|
11231
|
-
return [
|
|
11232
|
-
cos,
|
|
11233
|
-
sin,
|
|
11234
|
-
-sin,
|
|
11235
|
-
cos,
|
|
11236
|
-
centerX - cos * frame.width / 2 + sin * frame.height / 2,
|
|
11237
|
-
centerY - sin * frame.width / 2 - cos * frame.height / 2
|
|
11238
|
-
];
|
|
11239
|
-
};
|
|
11240
|
-
const getAncestorGroupTransform = (nodeId, pageChildren, options) => {
|
|
11241
|
-
let matrix = [1, 0, 0, 1, 0, 0];
|
|
11242
|
-
let angle = 0;
|
|
11243
|
-
const chain = [];
|
|
11244
|
-
let currentId = nodeId;
|
|
11245
|
-
for (let guard = 0; guard < 32; guard++) {
|
|
11246
|
-
const parent = findParentGroup(pageChildren, currentId);
|
|
11247
|
-
if (!parent) break;
|
|
11248
|
-
chain.unshift(parent);
|
|
11249
|
-
currentId = parent.id;
|
|
11250
|
-
}
|
|
11251
|
-
for (const group of chain) {
|
|
11252
|
-
matrix = fabric.util.multiplyTransformMatrices(
|
|
11253
|
-
matrix,
|
|
11254
|
-
getGroupLocalToParentMatrix(group, pageChildren)
|
|
11255
|
-
);
|
|
11256
|
-
angle += Number(group.angle ?? 0) || 0;
|
|
11257
|
-
}
|
|
11258
|
-
return { matrix, angle: normalizeSignedAngle(angle) };
|
|
11259
|
-
};
|
|
11260
|
-
const getElementFabricPlacement = (element, pageChildren, options) => {
|
|
11261
|
-
if (!pageChildren.length) {
|
|
11262
|
-
return { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
|
|
11263
|
-
}
|
|
11264
|
-
const ancestor = getAncestorGroupTransform(element.id, pageChildren);
|
|
11265
|
-
const point = fabric.util.transformPoint(
|
|
11266
|
-
new fabric.Point(element.left ?? 0, element.top ?? 0),
|
|
11267
|
-
ancestor.matrix
|
|
11268
|
-
);
|
|
11269
|
-
return {
|
|
11270
|
-
left: point.x,
|
|
11271
|
-
top: point.y,
|
|
11272
|
-
angle: normalizeSignedAngle(ancestor.angle + Number(element.angle ?? 0))
|
|
11273
|
-
};
|
|
11274
|
-
};
|
|
11275
|
-
const centerToRotatedTopLeft = (centerX, centerY, width, height, angleDeg = 0) => {
|
|
11276
|
-
const angle = angleDeg * Math.PI / 180;
|
|
11277
|
-
const cos = Math.cos(angle);
|
|
11278
|
-
const sin = Math.sin(angle);
|
|
11279
|
-
return {
|
|
11280
|
-
left: centerX - width / 2 * cos + height / 2 * sin,
|
|
11281
|
-
top: centerY - width / 2 * sin - height / 2 * cos
|
|
11282
|
-
};
|
|
11283
|
-
};
|
|
11284
|
-
const getGroupAbsoluteTransformFrame = (group, pageChildren, options) => {
|
|
11285
|
-
const frame = getGroupTransformFrame(group, pageChildren);
|
|
11286
|
-
const ancestor = getAncestorGroupTransform(group.id, pageChildren);
|
|
11287
|
-
const centerLocal = rotatedTopLeftToCenter(frame.left, frame.top, frame.width, frame.height, frame.angle);
|
|
11288
|
-
const center = fabric.util.transformPoint(new fabric.Point(centerLocal.x, centerLocal.y), ancestor.matrix);
|
|
11289
|
-
const topLeft = fabric.util.transformPoint(new fabric.Point(frame.left, frame.top), ancestor.matrix);
|
|
11290
|
-
return {
|
|
11291
|
-
left: topLeft.x,
|
|
11292
|
-
top: topLeft.y,
|
|
11293
|
-
width: frame.width,
|
|
11294
|
-
height: frame.height,
|
|
11295
|
-
centerX: center.x,
|
|
11296
|
-
centerY: center.y,
|
|
11297
|
-
angle: normalizeSignedAngle(ancestor.angle + frame.angle)
|
|
11298
|
-
};
|
|
11299
|
-
};
|
|
11307
|
+
const getElementFabricPlacement = (element, pageChildren, options) => getElementFabricPlacement$1(element, pageChildren, fabric);
|
|
11308
|
+
const getGroupAbsoluteTransformFrame = (group, pageChildren, options) => getGroupAbsoluteTransformFrame$1(group, pageChildren, fabric);
|
|
11300
11309
|
function applyWarpAwareSelectionBorders(selection) {
|
|
11301
11310
|
var _a2;
|
|
11302
11311
|
if (selection.__pixldocsOrigASHasBorders !== void 0) {
|
|
@@ -12424,7 +12433,6 @@ const PageCanvas = forwardRef(
|
|
|
12424
12433
|
fabricCanvas.__fontCleanup = fontCleanup;
|
|
12425
12434
|
fabricCanvas.__isUserTransforming = false;
|
|
12426
12435
|
fabricCanvas.on("mouse:down", () => {
|
|
12427
|
-
groupSelectionTransformStartRef.current = null;
|
|
12428
12436
|
activeSelectionMoveStartRef.current = null;
|
|
12429
12437
|
activeSelectionResizeHandleRef.current = null;
|
|
12430
12438
|
const active = fabricCanvas.getActiveObject();
|
|
@@ -12940,7 +12948,7 @@ const PageCanvas = forwardRef(
|
|
|
12940
12948
|
const groupFrame = isGroup(groupNode) ? getGroupAbsoluteTransformFrame(groupNode, pageChildren2) : null;
|
|
12941
12949
|
const groupAbs = groupFrame ?? getAbsoluteBounds(groupNode, pageChildren2);
|
|
12942
12950
|
const rect = active.getBoundingRect();
|
|
12943
|
-
const center =
|
|
12951
|
+
const center = active.getCenterPoint();
|
|
12944
12952
|
groupSelectionTransformStartRef.current = {
|
|
12945
12953
|
groupId,
|
|
12946
12954
|
selection: active,
|
|
@@ -14519,7 +14527,7 @@ const PageCanvas = forwardRef(
|
|
|
14519
14527
|
setDrilledGroupBounds(null);
|
|
14520
14528
|
drilledGroupIdRef.current = null;
|
|
14521
14529
|
if (activeDuringMove instanceof fabric.ActiveSelection && groupIdToKeep) {
|
|
14522
|
-
|
|
14530
|
+
preserveLogicalGroupTagDuringMove(activeDuringMove, groupIdToKeep);
|
|
14523
14531
|
}
|
|
14524
14532
|
}
|
|
14525
14533
|
if (e.target) e.target.__pixldocsDragMoved = true;
|
|
@@ -14922,7 +14930,14 @@ const PageCanvas = forwardRef(
|
|
|
14922
14930
|
const node = findNodeById(pageChildren2, id);
|
|
14923
14931
|
return !!(node && isGroup(node));
|
|
14924
14932
|
});
|
|
14925
|
-
const activeSelectionHadTransform = activeObj instanceof fabric.ActiveSelection && (Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01 ||
|
|
14933
|
+
const activeSelectionHadTransform = activeObj instanceof fabric.ActiveSelection && (Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01 || (() => {
|
|
14934
|
+
var _a3;
|
|
14935
|
+
const normAngle = (angle) => (angle % 360 + 360) % 360;
|
|
14936
|
+
const startAngle = ((_a3 = groupSelectionTransformStartRef.current) == null ? void 0 : _a3.selection) === activeObj ? groupSelectionTransformStartRef.current.selectionAngle : 0;
|
|
14937
|
+
const currentAngle = normAngle(activeObj.angle ?? 0);
|
|
14938
|
+
const diff = Math.abs(currentAngle - normAngle(startAngle));
|
|
14939
|
+
return Math.min(diff, 360 - diff) > 1;
|
|
14940
|
+
})());
|
|
14926
14941
|
if (!anyCropGroup && activeSelectionDelta && !activeSelectionHadTransform && selectedLogicalGroupIds.length > 0) {
|
|
14927
14942
|
const selectedStoreIds = useEditorStore.getState().canvas.selectedIds ?? [];
|
|
14928
14943
|
const groupMemberIds = /* @__PURE__ */ new Set();
|
|
@@ -15037,7 +15052,7 @@ const PageCanvas = forwardRef(
|
|
|
15037
15052
|
const storedGroupAngle = normalizeAngle(Number(groupToMove.angle ?? 0));
|
|
15038
15053
|
const effectiveStartAngle = transformStart ? startSelAngle : storedGroupAngle;
|
|
15039
15054
|
const angleDelta = shortestAngleDelta(currentSelAngle, effectiveStartAngle);
|
|
15040
|
-
const hadRotation = isActiveSelection && activeObj && angleDelta >
|
|
15055
|
+
const hadRotation = isActiveSelection && activeObj && angleDelta > 1;
|
|
15041
15056
|
if (activeGroupSelectionId === groupToMove.id && hadRotation && !hadScale && !activeSelectionResizeHandle && activeObj instanceof fabric.ActiveSelection) {
|
|
15042
15057
|
const { updateNode: updateNodeStore, commitHistory: commitHistoryStore, getCurrentElements } = useEditorStore.getState();
|
|
15043
15058
|
const center = activeObj.getCenterPoint();
|
|
@@ -24832,9 +24847,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
|
|
|
24832
24847
|
}
|
|
24833
24848
|
return svgString;
|
|
24834
24849
|
}
|
|
24835
|
-
const resolvedPackageVersion = "0.5.
|
|
24850
|
+
const resolvedPackageVersion = "0.5.351";
|
|
24836
24851
|
const PACKAGE_VERSION = resolvedPackageVersion;
|
|
24837
|
-
const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.
|
|
24852
|
+
const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.351";
|
|
24838
24853
|
const roundParityValue = (value) => {
|
|
24839
24854
|
if (typeof value !== "number") return value;
|
|
24840
24855
|
return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
|
|
@@ -25648,7 +25663,7 @@ class PixldocsRenderer {
|
|
|
25648
25663
|
await this.waitForCanvasScene(container, cloned, i);
|
|
25649
25664
|
}
|
|
25650
25665
|
console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
|
|
25651
|
-
const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-
|
|
25666
|
+
const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-C4JUR8dI.js");
|
|
25652
25667
|
const prepared = preparePagesForExport(
|
|
25653
25668
|
cloned.pages,
|
|
25654
25669
|
canvasWidth,
|
|
@@ -27968,7 +27983,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
|
|
|
27968
27983
|
if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
|
|
27969
27984
|
sanitizeSvgTreeForPdf(svgToDraw);
|
|
27970
27985
|
try {
|
|
27971
|
-
const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-
|
|
27986
|
+
const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-C4JUR8dI.js");
|
|
27972
27987
|
try {
|
|
27973
27988
|
await logTextMeasurementDiagnostic(svgToDraw);
|
|
27974
27989
|
} catch {
|
|
@@ -28368,4 +28383,4 @@ export {
|
|
|
28368
28383
|
buildTeaserBlurFlatKeys as y,
|
|
28369
28384
|
collectFontDescriptorsFromConfig as z
|
|
28370
28385
|
};
|
|
28371
|
-
//# sourceMappingURL=index-
|
|
28386
|
+
//# sourceMappingURL=index-Ugo_-WGu.js.map
|