@pixldocs/canvas-renderer 0.5.348 → 0.5.349

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.
@@ -11226,6 +11226,95 @@ const rotatedTopLeftToCenter = (left, top, width, height, angleDeg = 0) => {
11226
11226
  y: top + width / 2 * sin + height / 2 * cos
11227
11227
  };
11228
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
+ };
11229
11318
  function applyWarpAwareSelectionBorders(selection) {
11230
11319
  var _a2;
11231
11320
  if (selection.__pixldocsOrigASHasBorders !== void 0) {
@@ -11374,13 +11463,13 @@ const PageCanvas = react.forwardRef(
11374
11463
  ));
11375
11464
  const pageChildren2 = ((_a2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _a2.children) ?? [];
11376
11465
  const groupNode = findNodeById(pageChildren2, groupId);
11377
- const groupAngle = groupNode && isGroup(groupNode) ? Number(groupNode.angle ?? 0) : 0;
11378
- const groupAbs = groupNode && isGroup(groupNode) ? getAbsoluteBounds(groupNode, pageChildren2) : null;
11466
+ const groupFrame = groupNode && isGroup(groupNode) ? getGroupAbsoluteTransformFrame(groupNode, pageChildren2, pageBoundsOptions) : null;
11467
+ const groupAngle = groupFrame ? groupFrame.angle : 0;
11379
11468
  if (Number.isFinite(groupAngle)) {
11380
11469
  selection.set({ angle: groupAngle, scaleX: 1, scaleY: 1, skewX: 0, skewY: 0 });
11381
- if (groupAbs) {
11470
+ if (groupFrame) {
11382
11471
  selection.setPositionByOrigin(
11383
- new fabric__namespace.Point(groupAbs.left + groupAbs.width / 2, groupAbs.top + groupAbs.height / 2),
11472
+ new fabric__namespace.Point(groupFrame.centerX, groupFrame.centerY),
11384
11473
  "center",
11385
11474
  "center"
11386
11475
  );
@@ -12866,9 +12955,10 @@ const PageCanvas = react.forwardRef(
12866
12955
  const pageChildren2 = ((_b2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _b2.children) ?? [];
12867
12956
  const groupNode = findNodeById(pageChildren2, groupId);
12868
12957
  if (!groupNode) return;
12869
- const groupAbs = getAbsoluteBounds(groupNode, pageChildren2);
12958
+ const groupFrame = isGroup(groupNode) ? getGroupAbsoluteTransformFrame(groupNode, pageChildren2) : null;
12959
+ const groupAbs = groupFrame ?? getAbsoluteBounds(groupNode, pageChildren2);
12870
12960
  const rect = active.getBoundingRect();
12871
- const center = active.getCenterPoint();
12961
+ const center = groupFrame ? new fabric__namespace.Point(groupFrame.centerX, groupFrame.centerY) : active.getCenterPoint();
12872
12962
  groupSelectionTransformStartRef.current = {
12873
12963
  groupId,
12874
12964
  selection: active,
@@ -12880,7 +12970,7 @@ const PageCanvas = react.forwardRef(
12880
12970
  groupTop: groupAbs.top,
12881
12971
  groupWidth: groupAbs.width,
12882
12972
  groupHeight: groupAbs.height,
12883
- selectionAngle: ((active.angle ?? 0) % 360 + 360) % 360
12973
+ selectionAngle: (((groupFrame == null ? void 0 : groupFrame.angle) ?? active.angle ?? 0) % 360 + 360) % 360
12884
12974
  };
12885
12975
  };
12886
12976
  const restoreGroupSelectionVisualState = (selection, groupId) => {
@@ -15052,7 +15142,7 @@ const PageCanvas = react.forwardRef(
15052
15142
  const logicalGroupSelectionId = activeObj instanceof fabric__namespace.ActiveSelection ? activeObj.__pixldocsGroupSelection : void 0;
15053
15143
  const isLogicalGroupAS = !!logicalGroupSelectionId && !(activeObj == null ? void 0 : activeObj.__cropGroup) && !(activeObj == null ? void 0 : activeObj.__docuforgeSectionGroup);
15054
15144
  const logicalGroupNodeForBake = logicalGroupSelectionId ? findNodeById(pageChildren2, logicalGroupSelectionId) : null;
15055
- const asAngleForBake = isLogicalGroupAS && activeObj ? normalizeAngle(Number((logicalGroupNodeForBake == null ? void 0 : logicalGroupNodeForBake.angle) ?? activeObj.angle ?? 0)) : 0;
15145
+ const asAngleForBake = isLogicalGroupAS && activeObj ? normalizeAngle(Number(activeObj.angle ?? 0)) : 0;
15056
15146
  const logicalGroupFinalFrame = (() => {
15057
15147
  var _a3;
15058
15148
  if (!isLogicalGroupAS || !logicalGroupSelectionId || !(activeObj instanceof fabric__namespace.ActiveSelection)) return null;
@@ -15060,10 +15150,11 @@ const PageCanvas = react.forwardRef(
15060
15150
  const localWidth = Math.max(1, (activeObj.width ?? (baseline == null ? void 0 : baseline.groupWidth) ?? 1) * Math.abs(activeObj.scaleX ?? 1));
15061
15151
  const localHeight = Math.max(1, (activeObj.height ?? (baseline == null ? void 0 : baseline.groupHeight) ?? 1) * Math.abs(activeObj.scaleY ?? 1));
15062
15152
  const center = activeObj.getCenterPoint();
15153
+ const topLeft = centerToRotatedTopLeft(center.x, center.y, localWidth, localHeight, asAngleForBake);
15063
15154
  return {
15064
15155
  groupId: logicalGroupSelectionId,
15065
- left: center.x - localWidth / 2,
15066
- top: center.y - localHeight / 2,
15156
+ left: topLeft.left,
15157
+ top: topLeft.top,
15067
15158
  width: localWidth,
15068
15159
  height: localHeight,
15069
15160
  centerX: center.x,
@@ -15125,16 +15216,15 @@ const PageCanvas = react.forwardRef(
15125
15216
  modifiedIdsThisRound.add(objId);
15126
15217
  let absoluteLeft;
15127
15218
  let absoluteTop;
15128
- if (isActiveSelection && activeObj) {
15129
- const selectionMatrix = activeObj.calcTransformMatrix();
15130
- const relativePoint = { x: obj.left ?? 0, y: obj.top ?? 0 };
15131
- const absolutePoint = fabric__namespace.util.transformPoint(relativePoint, selectionMatrix);
15132
- absoluteLeft = absolutePoint.x;
15133
- absoluteTop = absolutePoint.y;
15134
- } else {
15135
- absoluteLeft = obj.left ?? 0;
15136
- absoluteTop = obj.top ?? 0;
15137
- }
15219
+ const initialTopLeft = centerToRotatedTopLeft(
15220
+ decomposed.translateX ?? (obj.left ?? 0),
15221
+ decomposed.translateY ?? (obj.top ?? 0),
15222
+ intrinsicWidth * Math.abs(decomposed.scaleX || 1),
15223
+ intrinsicHeight * Math.abs(decomposed.scaleY || 1),
15224
+ decomposed.angle ?? 0
15225
+ );
15226
+ absoluteLeft = initialTopLeft.left;
15227
+ absoluteTop = initialTopLeft.top;
15138
15228
  if (obj instanceof fabric__namespace.Group && obj.__cropGroup) {
15139
15229
  const ct = obj.__cropData;
15140
15230
  if (isActiveSelection && activeObj instanceof fabric__namespace.ActiveSelection) {
@@ -16218,7 +16308,7 @@ const PageCanvas = react.forwardRef(
16218
16308
  const nextHeight = Math.max(minVisiblePlaceholder, Number(resolvedSizeImg.height) || 50);
16219
16309
  const storePosImg = pageChildren ? (() => {
16220
16310
  const node = findNodeById(pageChildren, element.id);
16221
- return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
16311
+ return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
16222
16312
  })() : { left: element.left ?? 0, top: element.top ?? 0 };
16223
16313
  const elementForPlaceholder = { ...element, width: nextWidth, height: nextHeight };
16224
16314
  const placeholder = isCropGroup2 ? createImagePlaceholderForGroup(elementForPlaceholder) : createImagePlaceholder(elementForPlaceholder);
@@ -16281,14 +16371,14 @@ const PageCanvas = react.forwardRef(
16281
16371
  }
16282
16372
  const cropPos = pageChildren ? (() => {
16283
16373
  const node = findNodeById(pageChildren, element.id);
16284
- return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
16285
- })() : { left: element.left ?? 0, top: element.top ?? 0 };
16286
- const cropCenter = rotatedTopLeftToCenter(cropPos.left, cropPos.top, ct.frameW ?? 0, ct.frameH ?? 0, element.angle ?? 0);
16374
+ return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
16375
+ })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
16376
+ const cropCenter = rotatedTopLeftToCenter(cropPos.left, cropPos.top, ct.frameW ?? 0, ct.frameH ?? 0, cropPos.angle ?? element.angle ?? 0);
16287
16377
  const cropCenterX = cropCenter.x;
16288
16378
  const cropCenterY = cropCenter.y;
16289
16379
  if (element.left !== void 0) existingObj.set({ left: cropCenterX });
16290
16380
  if (element.top !== void 0) existingObj.set({ top: cropCenterY });
16291
- if (element.angle !== void 0) existingObj.set({ angle: element.angle });
16381
+ existingObj.set({ angle: cropPos.angle ?? element.angle ?? 0 });
16292
16382
  existingObj.set({
16293
16383
  flipX: element.flipX ?? false,
16294
16384
  flipY: element.flipY ?? false
@@ -16411,8 +16501,8 @@ const PageCanvas = react.forwardRef(
16411
16501
  if (isPlaceholderGroup) {
16412
16502
  const storePosImg = pageChildren ? (() => {
16413
16503
  const node = findNodeById(pageChildren, element.id);
16414
- return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
16415
- })() : { left: element.left ?? 0, top: element.top ?? 0 };
16504
+ return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
16505
+ })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
16416
16506
  const resolvedSizeImg = (pageChildren == null ? void 0 : pageChildren.length) ? getNodeBounds(element, pageChildren) : { width: typeof element.width === "number" ? element.width : 200, height: typeof element.height === "number" ? element.height : 50 };
16417
16507
  const hasExplicitSize = typeof element.width === "number" && Number.isFinite(element.width) && element.width > 0 && typeof element.height === "number" && Number.isFinite(element.height) && element.height > 0;
16418
16508
  const minVisiblePlaceholder = hasExplicitSize ? 1 : 20;
@@ -16426,7 +16516,7 @@ const PageCanvas = react.forwardRef(
16426
16516
  top: storePosImg.top + nextHeight / 2,
16427
16517
  originX: "center",
16428
16518
  originY: "center",
16429
- angle: element.angle ?? 0,
16519
+ angle: storePosImg.angle ?? element.angle ?? 0,
16430
16520
  opacity: isHidden ? 0 : element.opacity ?? 1,
16431
16521
  flipX: element.flipX ?? false,
16432
16522
  flipY: element.flipY ?? false,
@@ -16475,8 +16565,8 @@ const PageCanvas = react.forwardRef(
16475
16565
  const visibilityChanged = previousVisible !== currentVisible;
16476
16566
  const storePosForImg = pageChildren ? (() => {
16477
16567
  const node = findNodeById(pageChildren, element.id);
16478
- return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
16479
- })() : { left: element.left ?? 0, top: element.top ?? 0 };
16568
+ return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
16569
+ })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
16480
16570
  const positionChanged = Math.abs((existingObj.left ?? 0) - storePosForImg.left) > 0.1 || Math.abs((existingObj.top ?? 0) - storePosForImg.top) > 0.1;
16481
16571
  if (visibilityChanged && !positionChanged || visibilityUpdateInProgressRef.current) {
16482
16572
  const isDynamicField = dynamicFieldIds.includes(element.id);
@@ -16518,7 +16608,7 @@ const PageCanvas = react.forwardRef(
16518
16608
  const fabricTop = existingObj.top ?? 0;
16519
16609
  const storePos = pageChildren ? (() => {
16520
16610
  const node = findNodeById(pageChildren, element.id);
16521
- return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
16611
+ return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
16522
16612
  })() : { left: element.left ?? 0, top: element.top ?? 0 };
16523
16613
  const storeLeft = storePos.left;
16524
16614
  const storeTop = storePos.top;
@@ -16645,7 +16735,7 @@ const PageCanvas = react.forwardRef(
16645
16735
  setObjectData(placeholder, element.id);
16646
16736
  const absPosImg = pageTree.length > 0 ? (() => {
16647
16737
  const node = findNodeById(pageTree, element.id);
16648
- return node ? getAbsoluteBounds(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
16738
+ return node && isElement(node) ? getElementFabricPlacement(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
16649
16739
  })() : { left: element.left ?? 0, top: element.top ?? 0 };
16650
16740
  const placeholderWidth = Number((placeholder.width ?? 0) * (placeholder.scaleX ?? 1));
16651
16741
  const placeholderHeight = Number((placeholder.height ?? 0) * (placeholder.scaleY ?? 1));
@@ -16694,7 +16784,7 @@ const PageCanvas = react.forwardRef(
16694
16784
  if (obj) {
16695
16785
  const absPos = pageTree.length > 0 ? (() => {
16696
16786
  const node = findNodeById(pageTree, element.id);
16697
- return node ? getAbsoluteBounds(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
16787
+ return node && isElement(node) ? getElementFabricPlacement(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
16698
16788
  })() : { left: element.left ?? 0, top: element.top ?? 0 };
16699
16789
  obj.set({ left: absPos.left, top: absPos.top });
16700
16790
  obj.setCoords();
@@ -17182,8 +17272,8 @@ const PageCanvas = react.forwardRef(
17182
17272
  const currentPageTree = ((pageChildren == null ? void 0 : pageChildren.length) ? pageChildren : (_a2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _a2.children) ?? [];
17183
17273
  const fabricPos = currentPageTree.length > 0 ? (() => {
17184
17274
  const node = findNodeById(currentPageTree, element.id);
17185
- return node ? getAbsoluteBounds(node, currentPageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
17186
- })() : { left: element.left ?? 0, top: element.top ?? 0 };
17275
+ return node && isElement(node) ? getElementFabricPlacement(node, currentPageTree) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
17276
+ })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
17187
17277
  const resolvedSize = currentPageTree.length > 0 ? getNodeBounds(element, currentPageTree) : { width: typeof element.width === "number" ? element.width : 200, height: typeof element.height === "number" ? element.height : 50 };
17188
17278
  const shouldPreserveSmallSize = typeof element.width === "number" && Number.isFinite(element.width) && element.width > 0 && typeof element.height === "number" && Number.isFinite(element.height) && element.height > 0;
17189
17279
  const minVisible = shouldPreserveSmallSize ? 1 : 20;
@@ -18252,14 +18342,14 @@ const PageCanvas = react.forwardRef(
18252
18342
  const pageTreeForCreate = ((pageChildren == null ? void 0 : pageChildren.length) ? pageChildren : (_f = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _f.children) ?? [];
18253
18343
  const createPos = pageTreeForCreate.length > 0 ? (() => {
18254
18344
  const node = findNodeById(pageTreeForCreate, element.id);
18255
- return node ? getAbsoluteBounds(node, pageTreeForCreate) : { left: element.left ?? 0, top: element.top ?? 0 };
18256
- })() : { left: element.left ?? 0, top: element.top ?? 0 };
18345
+ return node && isElement(node) ? getElementFabricPlacement(node, pageTreeForCreate, pageBoundsOptions) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
18346
+ })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
18257
18347
  img.set({
18258
18348
  left: createPos.left,
18259
18349
  top: createPos.top,
18260
18350
  scaleX: finalScaleX,
18261
18351
  scaleY: finalScaleY,
18262
- angle: element.angle ?? 0,
18352
+ angle: createPos.angle ?? element.angle ?? 0,
18263
18353
  skewX: element.skewX ?? 0,
18264
18354
  skewY: element.skewY ?? 0,
18265
18355
  flipX: element.flipX ?? false,
@@ -18346,8 +18436,8 @@ const PageCanvas = react.forwardRef(
18346
18436
  const pageTreeForCrop = ((pageChildren == null ? void 0 : pageChildren.length) ? pageChildren : (_n = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _n.children) ?? [];
18347
18437
  const createPosForCrop = pageTreeForCrop.length > 0 ? (() => {
18348
18438
  const node = findNodeById(pageTreeForCrop, element.id);
18349
- return node ? getAbsoluteBounds(node, pageTreeForCrop) : { left: element.left ?? 0, top: element.top ?? 0 };
18350
- })() : { left: element.left ?? 0, top: element.top ?? 0 };
18439
+ return node && isElement(node) ? getElementFabricPlacement(node, pageTreeForCrop, pageBoundsOptions) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
18440
+ })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
18351
18441
  const nodeForCreate = pageTreeForCrop.length ? findNodeById(pageTreeForCrop, element.id) : null;
18352
18442
  const createW = nodeForCreate && isElement(nodeForCreate) ? nodeForCreate.width : elementWidth;
18353
18443
  const createH = nodeForCreate && isElement(nodeForCreate) ? nodeForCreate.height : elementHeight;
@@ -18355,8 +18445,9 @@ const PageCanvas = react.forwardRef(
18355
18445
  const createSy = nodeForCreate && isElement(nodeForCreate) ? nodeForCreate.scaleY ?? 1 : element.scaleY ?? 1;
18356
18446
  const frameW = Math.max(1, Number(createW) || 200) * createSx;
18357
18447
  const frameH = Math.max(1, Number(createH) || 50) * createSy;
18358
- const createCenterX = createPosForCrop.left + frameW / 2;
18359
- const createCenterY = createPosForCrop.top + frameH / 2;
18448
+ const createCenter = rotatedTopLeftToCenter(createPosForCrop.left, createPosForCrop.top, frameW, frameH, createPosForCrop.angle ?? element.angle ?? 0);
18449
+ const createCenterX = createCenter.x;
18450
+ const createCenterY = createCenter.y;
18360
18451
  const cropGroup = await createMaskedImageElement({
18361
18452
  image: img,
18362
18453
  frameW,
@@ -18369,7 +18460,7 @@ const PageCanvas = react.forwardRef(
18369
18460
  strokeWidth: 0,
18370
18461
  left: createCenterX,
18371
18462
  top: createCenterY,
18372
- angle: element.angle ?? 0,
18463
+ angle: createPosForCrop.angle ?? element.angle ?? 0,
18373
18464
  opacity: isHidden ? 0 : element.opacity ?? 1,
18374
18465
  selectable: allowSelection && !isHidden,
18375
18466
  evented: canBeEvented && !isHidden,
@@ -24759,9 +24850,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
24759
24850
  }
24760
24851
  return svgString;
24761
24852
  }
24762
- const resolvedPackageVersion = "0.5.348";
24853
+ const resolvedPackageVersion = "0.5.349";
24763
24854
  const PACKAGE_VERSION = resolvedPackageVersion;
24764
- const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.348";
24855
+ const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.349";
24765
24856
  const roundParityValue = (value) => {
24766
24857
  if (typeof value !== "number") return value;
24767
24858
  return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25575,7 +25666,7 @@ class PixldocsRenderer {
25575
25666
  await this.waitForCanvasScene(container, cloned, i);
25576
25667
  }
25577
25668
  console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
25578
- const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-IeTP9Bi1.cjs"));
25669
+ const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-eaaea4kH.cjs"));
25579
25670
  const prepared = preparePagesForExport(
25580
25671
  cloned.pages,
25581
25672
  canvasWidth,
@@ -27895,7 +27986,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
27895
27986
  if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
27896
27987
  sanitizeSvgTreeForPdf(svgToDraw);
27897
27988
  try {
27898
- const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-IeTP9Bi1.cjs"));
27989
+ const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-eaaea4kH.cjs"));
27899
27990
  try {
27900
27991
  await logTextMeasurementDiagnostic(svgToDraw);
27901
27992
  } catch {
@@ -28292,4 +28383,4 @@ exports.setAutoShrinkDebug = setAutoShrinkDebug;
28292
28383
  exports.setBundledAssetPrefixes = setBundledAssetPrefixes;
28293
28384
  exports.warmResolvedTemplateForPreview = warmResolvedTemplateForPreview;
28294
28385
  exports.warmTemplateFromForm = warmTemplateFromForm;
28295
- //# sourceMappingURL=index-CaQvuDpL.cjs.map
28386
+ //# sourceMappingURL=index-CwQ8bAR_.cjs.map