@pixldocs/canvas-renderer 0.5.349 → 0.5.350
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-D53PnA7c.cjs} +125 -113
- package/dist/index-D53PnA7c.cjs.map +1 -0
- package/dist/{index-wt6naIdE.js → index-kSwmRnZP.js} +125 -113
- package/dist/index-kSwmRnZP.js.map +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/{vectorPdfExport-eaaea4kH.cjs → vectorPdfExport-CsJ_SHet.cjs} +4 -4
- package/dist/{vectorPdfExport-eaaea4kH.cjs.map → vectorPdfExport-CsJ_SHet.cjs.map} +1 -1
- package/dist/{vectorPdfExport-B8sTK3Ew.js → vectorPdfExport-Do4oLw96.js} +4 -4
- package/dist/{vectorPdfExport-B8sTK3Ew.js.map → vectorPdfExport-Do4oLw96.js.map} +1 -1
- package/package.json +1 -1
- package/dist/index-CwQ8bAR_.cjs.map +0 -1
- package/dist/index-wt6naIdE.js.map +0 -1
|
@@ -10518,6 +10518,102 @@ function bakeEdgeFade(source, fade) {
|
|
|
10518
10518
|
}
|
|
10519
10519
|
return canvas;
|
|
10520
10520
|
}
|
|
10521
|
+
const normalizeSignedAngle = (angle) => (angle % 360 + 540) % 360 - 180;
|
|
10522
|
+
const rotatedTopLeftToCenter = (left, top, width, height, angleDeg = 0) => {
|
|
10523
|
+
const angle = angleDeg * Math.PI / 180;
|
|
10524
|
+
const cos = Math.cos(angle);
|
|
10525
|
+
const sin = Math.sin(angle);
|
|
10526
|
+
return {
|
|
10527
|
+
x: left + width / 2 * cos - height / 2 * sin,
|
|
10528
|
+
y: top + width / 2 * sin + height / 2 * cos
|
|
10529
|
+
};
|
|
10530
|
+
};
|
|
10531
|
+
const centerToRotatedTopLeft = (centerX, centerY, width, height, angleDeg = 0) => {
|
|
10532
|
+
const angle = angleDeg * Math.PI / 180;
|
|
10533
|
+
const cos = Math.cos(angle);
|
|
10534
|
+
const sin = Math.sin(angle);
|
|
10535
|
+
return {
|
|
10536
|
+
left: centerX - width / 2 * cos + height / 2 * sin,
|
|
10537
|
+
top: centerY - width / 2 * sin - height / 2 * cos
|
|
10538
|
+
};
|
|
10539
|
+
};
|
|
10540
|
+
const getGroupTransformFrame = (group, pageChildren, options) => {
|
|
10541
|
+
const bounds = getNodeBounds(group, pageChildren);
|
|
10542
|
+
const width = Math.max(1, Number(group.width ?? bounds.width) || bounds.width || 1);
|
|
10543
|
+
const height = Math.max(1, Number(group.height ?? bounds.height) || bounds.height || 1);
|
|
10544
|
+
return {
|
|
10545
|
+
left: Number(group.left ?? bounds.left ?? 0) || 0,
|
|
10546
|
+
top: Number(group.top ?? bounds.top ?? 0) || 0,
|
|
10547
|
+
width,
|
|
10548
|
+
height,
|
|
10549
|
+
angle: Number(group.angle ?? 0) || 0
|
|
10550
|
+
};
|
|
10551
|
+
};
|
|
10552
|
+
const getGroupLocalToParentMatrix = (group, pageChildren, options) => {
|
|
10553
|
+
const frame = getGroupTransformFrame(group, pageChildren);
|
|
10554
|
+
const rad = frame.angle * Math.PI / 180;
|
|
10555
|
+
const cos = Math.cos(rad);
|
|
10556
|
+
const sin = Math.sin(rad);
|
|
10557
|
+
return [
|
|
10558
|
+
cos,
|
|
10559
|
+
sin,
|
|
10560
|
+
-sin,
|
|
10561
|
+
cos,
|
|
10562
|
+
frame.left,
|
|
10563
|
+
frame.top
|
|
10564
|
+
];
|
|
10565
|
+
};
|
|
10566
|
+
const getAncestorGroupTransform = (nodeId, pageChildren, fabric2, options) => {
|
|
10567
|
+
let matrix = [1, 0, 0, 1, 0, 0];
|
|
10568
|
+
let angle = 0;
|
|
10569
|
+
const chain = [];
|
|
10570
|
+
let currentId = nodeId;
|
|
10571
|
+
for (let guard = 0; guard < 32; guard++) {
|
|
10572
|
+
const parent = findParentGroup(pageChildren, currentId);
|
|
10573
|
+
if (!parent) break;
|
|
10574
|
+
chain.unshift(parent);
|
|
10575
|
+
currentId = parent.id;
|
|
10576
|
+
}
|
|
10577
|
+
for (const group of chain) {
|
|
10578
|
+
matrix = fabric2.util.multiplyTransformMatrices(
|
|
10579
|
+
matrix,
|
|
10580
|
+
getGroupLocalToParentMatrix(group, pageChildren)
|
|
10581
|
+
);
|
|
10582
|
+
angle += Number(group.angle ?? 0) || 0;
|
|
10583
|
+
}
|
|
10584
|
+
return { matrix, angle: normalizeSignedAngle(angle) };
|
|
10585
|
+
};
|
|
10586
|
+
const getElementFabricPlacement$1 = (element, pageChildren, fabric2, options) => {
|
|
10587
|
+
if (!pageChildren.length) {
|
|
10588
|
+
return { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
|
|
10589
|
+
}
|
|
10590
|
+
const ancestor = getAncestorGroupTransform(element.id, pageChildren, fabric2);
|
|
10591
|
+
const point = fabric2.util.transformPoint(
|
|
10592
|
+
new fabric2.Point(element.left ?? 0, element.top ?? 0),
|
|
10593
|
+
ancestor.matrix
|
|
10594
|
+
);
|
|
10595
|
+
return {
|
|
10596
|
+
left: point.x,
|
|
10597
|
+
top: point.y,
|
|
10598
|
+
angle: normalizeSignedAngle(ancestor.angle + Number(element.angle ?? 0))
|
|
10599
|
+
};
|
|
10600
|
+
};
|
|
10601
|
+
const getGroupAbsoluteTransformFrame$1 = (group, pageChildren, fabric2, options) => {
|
|
10602
|
+
const frame = getGroupTransformFrame(group, pageChildren);
|
|
10603
|
+
const ancestor = getAncestorGroupTransform(group.id, pageChildren, fabric2);
|
|
10604
|
+
const centerLocal = rotatedTopLeftToCenter(frame.left, frame.top, frame.width, frame.height, frame.angle);
|
|
10605
|
+
const center = fabric2.util.transformPoint(new fabric2.Point(centerLocal.x, centerLocal.y), ancestor.matrix);
|
|
10606
|
+
const topLeft = fabric2.util.transformPoint(new fabric2.Point(frame.left, frame.top), ancestor.matrix);
|
|
10607
|
+
return {
|
|
10608
|
+
left: topLeft.x,
|
|
10609
|
+
top: topLeft.y,
|
|
10610
|
+
width: frame.width,
|
|
10611
|
+
height: frame.height,
|
|
10612
|
+
centerX: center.x,
|
|
10613
|
+
centerY: center.y,
|
|
10614
|
+
angle: normalizeSignedAngle(ancestor.angle + frame.angle)
|
|
10615
|
+
};
|
|
10616
|
+
};
|
|
10521
10617
|
const SELECTION_PRIMARY = "hsl(217, 91%, 60%)";
|
|
10522
10618
|
const SELECTION_BORDER_SCALE = 2;
|
|
10523
10619
|
let ensureCanvaControlRenders = () => {
|
|
@@ -10971,12 +11067,18 @@ try {
|
|
|
10971
11067
|
} catch (e) {
|
|
10972
11068
|
}
|
|
10973
11069
|
};
|
|
10974
|
-
const
|
|
10975
|
-
|
|
10976
|
-
|
|
10977
|
-
|
|
10978
|
-
|
|
10979
|
-
|
|
11070
|
+
const wrapControlsFactory = (key) => {
|
|
11071
|
+
if (typeof cu[key] !== "function") return;
|
|
11072
|
+
const descriptor = Object.getOwnPropertyDescriptor(cu, key);
|
|
11073
|
+
if (descriptor && descriptor.writable === false && !descriptor.set) return;
|
|
11074
|
+
const original = cu[key].bind(cu);
|
|
11075
|
+
try {
|
|
11076
|
+
cu[key] = () => installPillRenders(original());
|
|
11077
|
+
} catch {
|
|
11078
|
+
}
|
|
11079
|
+
};
|
|
11080
|
+
wrapControlsFactory("createObjectDefaultControls");
|
|
11081
|
+
wrapControlsFactory("createTextboxDefaultControls");
|
|
10980
11082
|
const wrapClassCreateControls = (Klass) => {
|
|
10981
11083
|
if (!Klass || typeof Klass.createControls !== "function") return;
|
|
10982
11084
|
const orig = Klass.createControls.bind(Klass);
|
|
@@ -11217,104 +11319,8 @@ const bakeTextboxScaleIntoTypography = (obj, sourceElement) => {
|
|
|
11217
11319
|
};
|
|
11218
11320
|
return updates;
|
|
11219
11321
|
};
|
|
11220
|
-
const
|
|
11221
|
-
|
|
11222
|
-
const cos = Math.cos(angle);
|
|
11223
|
-
const sin = Math.sin(angle);
|
|
11224
|
-
return {
|
|
11225
|
-
x: left + width / 2 * cos - height / 2 * sin,
|
|
11226
|
-
y: top + width / 2 * sin + height / 2 * cos
|
|
11227
|
-
};
|
|
11228
|
-
};
|
|
11229
|
-
const normalizeSignedAngle = (angle) => (angle % 360 + 540) % 360 - 180;
|
|
11230
|
-
const getGroupTransformFrame = (group, pageChildren, options) => {
|
|
11231
|
-
const bounds = getNodeBounds(group, pageChildren);
|
|
11232
|
-
const width = Math.max(1, Number(group.width ?? bounds.width) || bounds.width || 1);
|
|
11233
|
-
const height = Math.max(1, Number(group.height ?? bounds.height) || bounds.height || 1);
|
|
11234
|
-
return {
|
|
11235
|
-
left: Number(group.left ?? bounds.left ?? 0) || 0,
|
|
11236
|
-
top: Number(group.top ?? bounds.top ?? 0) || 0,
|
|
11237
|
-
width,
|
|
11238
|
-
height,
|
|
11239
|
-
angle: Number(group.angle ?? 0) || 0
|
|
11240
|
-
};
|
|
11241
|
-
};
|
|
11242
|
-
const getGroupLocalToParentMatrix = (group, pageChildren, options) => {
|
|
11243
|
-
const frame = getGroupTransformFrame(group, pageChildren);
|
|
11244
|
-
const rad = frame.angle * Math.PI / 180;
|
|
11245
|
-
const cos = Math.cos(rad);
|
|
11246
|
-
const sin = Math.sin(rad);
|
|
11247
|
-
const centerX = frame.left + frame.width / 2;
|
|
11248
|
-
const centerY = frame.top + frame.height / 2;
|
|
11249
|
-
return [
|
|
11250
|
-
cos,
|
|
11251
|
-
sin,
|
|
11252
|
-
-sin,
|
|
11253
|
-
cos,
|
|
11254
|
-
centerX - cos * frame.width / 2 + sin * frame.height / 2,
|
|
11255
|
-
centerY - sin * frame.width / 2 - cos * frame.height / 2
|
|
11256
|
-
];
|
|
11257
|
-
};
|
|
11258
|
-
const getAncestorGroupTransform = (nodeId, pageChildren, options) => {
|
|
11259
|
-
let matrix = [1, 0, 0, 1, 0, 0];
|
|
11260
|
-
let angle = 0;
|
|
11261
|
-
const chain = [];
|
|
11262
|
-
let currentId = nodeId;
|
|
11263
|
-
for (let guard = 0; guard < 32; guard++) {
|
|
11264
|
-
const parent = findParentGroup(pageChildren, currentId);
|
|
11265
|
-
if (!parent) break;
|
|
11266
|
-
chain.unshift(parent);
|
|
11267
|
-
currentId = parent.id;
|
|
11268
|
-
}
|
|
11269
|
-
for (const group of chain) {
|
|
11270
|
-
matrix = fabric__namespace.util.multiplyTransformMatrices(
|
|
11271
|
-
matrix,
|
|
11272
|
-
getGroupLocalToParentMatrix(group, pageChildren)
|
|
11273
|
-
);
|
|
11274
|
-
angle += Number(group.angle ?? 0) || 0;
|
|
11275
|
-
}
|
|
11276
|
-
return { matrix, angle: normalizeSignedAngle(angle) };
|
|
11277
|
-
};
|
|
11278
|
-
const getElementFabricPlacement = (element, pageChildren, options) => {
|
|
11279
|
-
if (!pageChildren.length) {
|
|
11280
|
-
return { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
|
|
11281
|
-
}
|
|
11282
|
-
const ancestor = getAncestorGroupTransform(element.id, pageChildren);
|
|
11283
|
-
const point = fabric__namespace.util.transformPoint(
|
|
11284
|
-
new fabric__namespace.Point(element.left ?? 0, element.top ?? 0),
|
|
11285
|
-
ancestor.matrix
|
|
11286
|
-
);
|
|
11287
|
-
return {
|
|
11288
|
-
left: point.x,
|
|
11289
|
-
top: point.y,
|
|
11290
|
-
angle: normalizeSignedAngle(ancestor.angle + Number(element.angle ?? 0))
|
|
11291
|
-
};
|
|
11292
|
-
};
|
|
11293
|
-
const centerToRotatedTopLeft = (centerX, centerY, width, height, angleDeg = 0) => {
|
|
11294
|
-
const angle = angleDeg * Math.PI / 180;
|
|
11295
|
-
const cos = Math.cos(angle);
|
|
11296
|
-
const sin = Math.sin(angle);
|
|
11297
|
-
return {
|
|
11298
|
-
left: centerX - width / 2 * cos + height / 2 * sin,
|
|
11299
|
-
top: centerY - width / 2 * sin - height / 2 * cos
|
|
11300
|
-
};
|
|
11301
|
-
};
|
|
11302
|
-
const getGroupAbsoluteTransformFrame = (group, pageChildren, options) => {
|
|
11303
|
-
const frame = getGroupTransformFrame(group, pageChildren);
|
|
11304
|
-
const ancestor = getAncestorGroupTransform(group.id, pageChildren);
|
|
11305
|
-
const centerLocal = rotatedTopLeftToCenter(frame.left, frame.top, frame.width, frame.height, frame.angle);
|
|
11306
|
-
const center = fabric__namespace.util.transformPoint(new fabric__namespace.Point(centerLocal.x, centerLocal.y), ancestor.matrix);
|
|
11307
|
-
const topLeft = fabric__namespace.util.transformPoint(new fabric__namespace.Point(frame.left, frame.top), ancestor.matrix);
|
|
11308
|
-
return {
|
|
11309
|
-
left: topLeft.x,
|
|
11310
|
-
top: topLeft.y,
|
|
11311
|
-
width: frame.width,
|
|
11312
|
-
height: frame.height,
|
|
11313
|
-
centerX: center.x,
|
|
11314
|
-
centerY: center.y,
|
|
11315
|
-
angle: normalizeSignedAngle(ancestor.angle + frame.angle)
|
|
11316
|
-
};
|
|
11317
|
-
};
|
|
11322
|
+
const getElementFabricPlacement = (element, pageChildren, options) => getElementFabricPlacement$1(element, pageChildren, fabric__namespace);
|
|
11323
|
+
const getGroupAbsoluteTransformFrame = (group, pageChildren, options) => getGroupAbsoluteTransformFrame$1(group, pageChildren, fabric__namespace);
|
|
11318
11324
|
function applyWarpAwareSelectionBorders(selection) {
|
|
11319
11325
|
var _a2;
|
|
11320
11326
|
if (selection.__pixldocsOrigASHasBorders !== void 0) {
|
|
@@ -12442,7 +12448,6 @@ const PageCanvas = react.forwardRef(
|
|
|
12442
12448
|
fabricCanvas.__fontCleanup = fontCleanup;
|
|
12443
12449
|
fabricCanvas.__isUserTransforming = false;
|
|
12444
12450
|
fabricCanvas.on("mouse:down", () => {
|
|
12445
|
-
groupSelectionTransformStartRef.current = null;
|
|
12446
12451
|
activeSelectionMoveStartRef.current = null;
|
|
12447
12452
|
activeSelectionResizeHandleRef.current = null;
|
|
12448
12453
|
const active = fabricCanvas.getActiveObject();
|
|
@@ -12958,7 +12963,7 @@ const PageCanvas = react.forwardRef(
|
|
|
12958
12963
|
const groupFrame = isGroup(groupNode) ? getGroupAbsoluteTransformFrame(groupNode, pageChildren2) : null;
|
|
12959
12964
|
const groupAbs = groupFrame ?? getAbsoluteBounds(groupNode, pageChildren2);
|
|
12960
12965
|
const rect = active.getBoundingRect();
|
|
12961
|
-
const center =
|
|
12966
|
+
const center = active.getCenterPoint();
|
|
12962
12967
|
groupSelectionTransformStartRef.current = {
|
|
12963
12968
|
groupId,
|
|
12964
12969
|
selection: active,
|
|
@@ -14940,7 +14945,14 @@ const PageCanvas = react.forwardRef(
|
|
|
14940
14945
|
const node = findNodeById(pageChildren2, id);
|
|
14941
14946
|
return !!(node && isGroup(node));
|
|
14942
14947
|
});
|
|
14943
|
-
const activeSelectionHadTransform = activeObj instanceof fabric__namespace.ActiveSelection && (Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01 ||
|
|
14948
|
+
const activeSelectionHadTransform = activeObj instanceof fabric__namespace.ActiveSelection && (Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01 || (() => {
|
|
14949
|
+
var _a3;
|
|
14950
|
+
const normAngle = (angle) => (angle % 360 + 360) % 360;
|
|
14951
|
+
const startAngle = ((_a3 = groupSelectionTransformStartRef.current) == null ? void 0 : _a3.selection) === activeObj ? groupSelectionTransformStartRef.current.selectionAngle : 0;
|
|
14952
|
+
const currentAngle = normAngle(activeObj.angle ?? 0);
|
|
14953
|
+
const diff = Math.abs(currentAngle - normAngle(startAngle));
|
|
14954
|
+
return Math.min(diff, 360 - diff) > 1;
|
|
14955
|
+
})());
|
|
14944
14956
|
if (!anyCropGroup && activeSelectionDelta && !activeSelectionHadTransform && selectedLogicalGroupIds.length > 0) {
|
|
14945
14957
|
const selectedStoreIds = useEditorStore.getState().canvas.selectedIds ?? [];
|
|
14946
14958
|
const groupMemberIds = /* @__PURE__ */ new Set();
|
|
@@ -15055,7 +15067,7 @@ const PageCanvas = react.forwardRef(
|
|
|
15055
15067
|
const storedGroupAngle = normalizeAngle(Number(groupToMove.angle ?? 0));
|
|
15056
15068
|
const effectiveStartAngle = transformStart ? startSelAngle : storedGroupAngle;
|
|
15057
15069
|
const angleDelta = shortestAngleDelta(currentSelAngle, effectiveStartAngle);
|
|
15058
|
-
const hadRotation = isActiveSelection && activeObj && angleDelta >
|
|
15070
|
+
const hadRotation = isActiveSelection && activeObj && angleDelta > 1;
|
|
15059
15071
|
if (activeGroupSelectionId === groupToMove.id && hadRotation && !hadScale && !activeSelectionResizeHandle && activeObj instanceof fabric__namespace.ActiveSelection) {
|
|
15060
15072
|
const { updateNode: updateNodeStore, commitHistory: commitHistoryStore, getCurrentElements } = useEditorStore.getState();
|
|
15061
15073
|
const center = activeObj.getCenterPoint();
|
|
@@ -24850,9 +24862,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
|
|
|
24850
24862
|
}
|
|
24851
24863
|
return svgString;
|
|
24852
24864
|
}
|
|
24853
|
-
const resolvedPackageVersion = "0.5.
|
|
24865
|
+
const resolvedPackageVersion = "0.5.350";
|
|
24854
24866
|
const PACKAGE_VERSION = resolvedPackageVersion;
|
|
24855
|
-
const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.
|
|
24867
|
+
const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.350";
|
|
24856
24868
|
const roundParityValue = (value) => {
|
|
24857
24869
|
if (typeof value !== "number") return value;
|
|
24858
24870
|
return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
|
|
@@ -25666,7 +25678,7 @@ class PixldocsRenderer {
|
|
|
25666
25678
|
await this.waitForCanvasScene(container, cloned, i);
|
|
25667
25679
|
}
|
|
25668
25680
|
console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
|
|
25669
|
-
const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-
|
|
25681
|
+
const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-CsJ_SHet.cjs"));
|
|
25670
25682
|
const prepared = preparePagesForExport(
|
|
25671
25683
|
cloned.pages,
|
|
25672
25684
|
canvasWidth,
|
|
@@ -27986,7 +27998,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
|
|
|
27986
27998
|
if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
|
|
27987
27999
|
sanitizeSvgTreeForPdf(svgToDraw);
|
|
27988
28000
|
try {
|
|
27989
|
-
const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-
|
|
28001
|
+
const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-CsJ_SHet.cjs"));
|
|
27990
28002
|
try {
|
|
27991
28003
|
await logTextMeasurementDiagnostic(svgToDraw);
|
|
27992
28004
|
} catch {
|
|
@@ -28383,4 +28395,4 @@ exports.setAutoShrinkDebug = setAutoShrinkDebug;
|
|
|
28383
28395
|
exports.setBundledAssetPrefixes = setBundledAssetPrefixes;
|
|
28384
28396
|
exports.warmResolvedTemplateForPreview = warmResolvedTemplateForPreview;
|
|
28385
28397
|
exports.warmTemplateFromForm = warmTemplateFromForm;
|
|
28386
|
-
//# sourceMappingURL=index-
|
|
28398
|
+
//# sourceMappingURL=index-D53PnA7c.cjs.map
|