email-builder-utils 1.1.30 → 1.1.34

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.
Files changed (8) hide show
  1. package/dist/utils/convertJsonToHtml.d.ts.map +1 -1
  2. package/dist/utils/convertJsonToHtml.js +29 -1
  3. package/dist/utils/index.d.ts +2 -0
  4. package/dist/utils/index.d.ts.map +1 -1
  5. package/dist/utils/index.js +2 -0
  6. package/dist/utils/jsonToHTML.d.ts.map +1 -1
  7. package/dist/utils/jsonToHTML.js +96 -196
  8. package/package.json +1 -1
package/dist/utils/convertJsonToHtml.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"convertJsonToHtml.d.ts","sourceRoot":"","sources":["../../src/utils/convertJsonToHtml.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,GAAU,UAAU,GAAG,oBAgFpD,CAAC"}
1
+ {"version":3,"file":"convertJsonToHtml.d.ts","sourceRoot":"","sources":["../../src/utils/convertJsonToHtml.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,GAAU,UAAU,GAAG,oBA4GpD,CAAC"}
package/dist/utils/convertJsonToHtml.js CHANGED
@@ -18,7 +18,7 @@ const convertJsonToHtml = async (jsonData) => {
18
18
  <meta charset="UTF-8" />
19
19
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
20
20
  <meta name="x-apple-disable-message-reformatting" />
21
- <style>
21
+ <style>
22
22
  .responsive-table {
23
23
  width: 100%;
24
24
  max-width: 600px;
@@ -34,6 +34,34 @@ const convertJsonToHtml = async (jsonData) => {
34
34
  max-width: 100% !important;
35
35
  }
36
36
  }
37
+ .hide-mobile {
38
+ display: block !important;
39
+ mso-hide: all !important; /* Hide in Outlook */
40
+ }
41
+
42
+ .hide-desktop {
43
+ display: block !important;
44
+ mso-hide: all !important; /* Hide in Outlook */
45
+ }
46
+
47
+ @media only screen and (max-width: 600px) {
48
+ .hide-mobile {
49
+ display: none !important;
50
+ max-height: 0 !important;
51
+ overflow: hidden !important;
52
+ mso-hide: all !important;
53
+ }
54
+ }
55
+
56
+ @media only screen and (min-width: 601px) {
57
+ .hide-desktop {
58
+ display: none !important;
59
+ max-height: 0 !important;
60
+ overflow: hidden !important;
61
+ mso-hide: all !important;
62
+ }
63
+ }
64
+
37
65
  </style>
38
66
  </head>
39
67
  <body>
package/dist/utils/index.d.ts CHANGED
@@ -1,3 +1,5 @@
1
1
  export * from "./convertJsonToHtml";
2
2
  export * from "./generateUniqueId";
3
+ export * from "./common";
4
+ export * from "./jsonToHTML";
3
5
  //# sourceMappingURL=index.d.ts.map
package/dist/utils/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC"}
package/dist/utils/index.js CHANGED
@@ -16,3 +16,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  __exportStar(require("./convertJsonToHtml"), exports);
18
18
  __exportStar(require("./generateUniqueId"), exports);
19
+ __exportStar(require("./common"), exports);
20
+ __exportStar(require("./jsonToHTML"), exports);
package/dist/utils/jsonToHTML.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"jsonToHTML.d.ts","sourceRoot":"","sources":["../../src/utils/jsonToHTML.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAUrC,UAAU,cAAc;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAC1B,aAAa,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,UAAU,UAAU;IAClB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE;QACJ,KAAK,EAAE,cAAc,CAAC;QACtB,KAAK,EAAE,GAAG,CAAC;QACX,WAAW,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;KAC7B,CAAC;CACH;AAYD,eAAO,MAAM,gBAAgB,kDAAkD,CAAC;AA2DhF,wBAAsB,aAAa,CACjC,SAAS,EAAE,UAAU,EACrB,QAAQ,EAAE,GAAG,EACb,aAAa,EAAE,MAAM,mBAwBtB;AAuiBD,wBAAsB,iBAAiB,CAAC,SAAS,EAAE,GAAG,EAAE,aAAa,EAAE,MAAM,mBAyL5E"}
1
+ {"version":3,"file":"jsonToHTML.d.ts","sourceRoot":"","sources":["../../src/utils/jsonToHTML.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAUrC,UAAU,cAAc;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAC1B,aAAa,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,UAAU,UAAU;IAClB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE;QACJ,KAAK,EAAE,cAAc,CAAC;QACtB,KAAK,EAAE,GAAG,CAAC;QACX,WAAW,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;KAC7B,CAAC;CACH;AAYD,eAAO,MAAM,gBAAgB,kDAAkD,CAAC;AAyFhF,wBAAsB,aAAa,CACjC,SAAS,EAAE,UAAU,EACrB,QAAQ,EAAE,GAAG,EACb,aAAa,EAAE,MAAM,mBAwBtB;AAikBD,wBAAsB,iBAAiB,CAAC,SAAS,EAAE,GAAG,EAAE,aAAa,EAAE,MAAM,mBAyL5E"}
package/dist/utils/jsonToHTML.js CHANGED
@@ -40,19 +40,53 @@ function buildStyles(style, { pxChanges, perChanges }) {
40
40
  Object.entries(style).forEach(([key, value]) => {
41
41
  if (key === "customCss")
42
42
  return;
43
+ const INVALID_KEYS = [
44
+ "columns",
45
+ "cellWidths",
46
+ "cellWidth",
47
+ "childWidth",
48
+ "visibility",
49
+ "hideOnMobile",
50
+ "hideOnDesktop"
51
+ ];
52
+ if (INVALID_KEYS.includes(key))
53
+ return;
54
+ // Prevent null/undefined/"" from leaking into CSS
43
55
  if (value === undefined || value === null || value === "")
44
56
  return;
57
+ // FIX 1 — SANITIZE padding objects
45
58
  if ((key === "padding" || key === "buttonPadding") &&
46
59
  typeof value === "object") {
47
- const padding = value;
48
- value = `${padding.top}px ${padding.right}px ${padding.bottom}px ${padding.left}px`;
60
+ const pad = value;
61
+ const safePad = {
62
+ top: Number.isFinite(pad.top) ? pad.top : 0,
63
+ right: Number.isFinite(pad.right) ? pad.right : 0,
64
+ bottom: Number.isFinite(pad.bottom) ? pad.bottom : 0,
65
+ left: Number.isFinite(pad.left) ? pad.left : 0,
66
+ };
67
+ value = `${safePad.top}px ${safePad.right}px ${safePad.bottom}px ${safePad.left}px`;
49
68
  }
50
69
  const cssKey = key.replace(/([A-Z])/g, "-$1").toLowerCase();
70
+ // FIX 2 — Sanitize invalid px/per values
51
71
  if (pxChanges.includes(key)) {
52
- stylesObj[cssKey] = typeof value === "number" ? `${value}px` : value;
72
+ if (typeof value === "number") {
73
+ stylesObj[cssKey] = `${value}px`;
74
+ }
75
+ else if (typeof value === "string" && value.includes("null")) {
76
+ // Skip invalid styles
77
+ return;
78
+ }
79
+ else {
80
+ stylesObj[cssKey] = value;
81
+ }
53
82
  }
54
83
  else if (perChanges.includes(key)) {
55
- stylesObj[cssKey] = typeof value === "number" ? `${value}%` : value;
84
+ if (typeof value === "number") {
85
+ stylesObj[cssKey] = `${value}%`;
86
+ }
87
+ else {
88
+ stylesObj[cssKey] = value;
89
+ }
56
90
  }
57
91
  else {
58
92
  stylesObj[cssKey] = value;
@@ -346,90 +380,104 @@ async function convertGridBlock(blockData, rootData, cellWidthInPx) {
346
380
  const { columns = 1, cellWidths = [], responsive = true } = props;
347
381
  const { columnGap = 0, ...restStyle } = style;
348
382
  const gridVisibilityClass = (0, common_1.getVisibilityClass)(props);
383
+ // FIX: avoid table-layout:fixed – causes shrink in many clients
349
384
  const tableStyles = buildStyles(restStyle, {
350
385
  perChanges: [],
351
386
  pxChanges: allPxAttributes,
352
387
  });
353
388
  const total = childrenIds.length;
354
389
  const visualRows = Math.ceil(total / columns);
355
- // Fix: Calculate visible cells per row to adjust widths
356
390
  let html = `
357
391
  <!--[if mso]>
358
- <table border="0" cellpadding="0" cellspacing="${columnGap}" width="100%"
359
- style="${exports.tableCommonStyle}border-collapse: separate;border-spacing:${columnGap}px;" class="${gridVisibilityClass}">
392
+ <table border="0" cellpadding="0" cellspacing="${columnGap}" width="100%"
393
+ style="border-collapse:separate;border-spacing:${columnGap}px;"
394
+ class="${gridVisibilityClass}">
360
395
  <![endif]-->
361
- <table border="0" cellpadding="0" cellspacing="${columnGap}" width="100%" role="presentation"
362
- style="${exports.tableCommonStyle} ${tableStyles}border-collapse: separate;border-spacing:${columnGap}px;" class="${gridVisibilityClass}">
396
+ <table border="0" cellpadding="0" cellspacing="${columnGap}" width="100%"
397
+ role="presentation"
398
+ style="border-collapse:separate;border-spacing:${columnGap}px; ${tableStyles}"
399
+ class="${gridVisibilityClass}">
363
400
  `;
364
401
  for (let r = 0; r < visualRows; r++) {
365
402
  html += "<tr>";
366
- let visibleCellsInRow = 0;
367
- const rowCellVisibility = [];
403
+ // COUNT visible cells only
404
+ let visibleCells = 0;
405
+ const rowIds = [];
368
406
  for (let c = 0; c < columns; c++) {
369
407
  const idx = r * columns + c;
370
- const childId = childrenIds[idx];
371
- if (childId) {
372
- const child = rootData[childId];
373
- const { props: childProps = {} } = child.data || {};
374
- const isVisible = !childProps.hideOnDesktop;
375
- rowCellVisibility.push(isVisible);
376
- if (isVisible)
377
- visibleCellsInRow++;
378
- }
379
- else {
380
- rowCellVisibility.push(false);
408
+ const id = childrenIds[idx] ?? null;
409
+ rowIds.push(id);
410
+ if (id) {
411
+ const child = rootData[id];
412
+ const isHidden = child?.data?.props?.hideOnDesktop;
413
+ if (!isHidden)
414
+ visibleCells++;
381
415
  }
382
416
  }
383
- const widthPerVisibleCell = visibleCellsInRow > 0 ? 100 / visibleCellsInRow : 100 / columns;
417
+ // FIX: fallback safe-width
418
+ const safeWidth = visibleCells > 0 ? 100 / visibleCells : 100 / columns;
384
419
  for (let c = 0; c < columns; c++) {
385
420
  const idx = r * columns + c;
386
- const childId = childrenIds[idx];
387
- const widthPercent = cellWidths[c] ?? widthPerVisibleCell;
388
- if (childId) {
389
- const child = rootData[childId];
390
- const { style: cellStyle = {}, props: childProps = {} } = child.data || {};
421
+ const id = rowIds[c];
422
+ let widthPercent = cellWidths[c] ?? safeWidth;
423
+ // FIX: never exceed reasonable width
424
+ if (widthPercent <= 0 || widthPercent > 100) {
425
+ widthPercent = safeWidth;
426
+ }
427
+ if (id) {
428
+ const child = rootData[id];
429
+ const { style: cellStyle = {}, props: childProps = {} } = child.data;
391
430
  const verticalAlign = cellStyle.verticalAlign || "top";
392
- const { html: childHtml, styles } = await convertGridCellBlock(child, rootData, widthPercent, cellWidthInPx);
393
- const cellVisibilityClass = (0, common_1.getVisibilityClass)(childProps);
394
- if (!childProps.hideOnDesktop) {
431
+ const childVisible = !childProps.hideOnDesktop;
432
+ const visibilityClass = (0, common_1.getVisibilityClass)(childProps);
433
+ // Only render if visible
434
+ if (childVisible) {
435
+ const { html: childHtml, styles } = await convertGridCellBlock(child, rootData, widthPercent, cellWidthInPx);
395
436
  html += `
396
- <td
397
- width="${widthPercent}%"
398
- class="${[responsive ? "stack-column" : "", cellVisibilityClass]
399
- .filter(Boolean)
400
- .join(" ")}"
401
- style="vertical-align:${verticalAlign}; word-break:break-word; ${styles}"
402
- >
403
- ${childHtml}
404
- </td>`;
437
+ <td
438
+ width="${Math.round(widthPercent)}%"
439
+ class="${[
440
+ responsive ? "stack-column" : "",
441
+ visibilityClass,
442
+ ].filter(Boolean).join(" ")}"
443
+ style="vertical-align:${verticalAlign};word-break:break-word;${styles}"
444
+ >
445
+ ${childHtml}
446
+ </td>`;
405
447
  }
406
448
  }
407
449
  else {
408
- html += `<td width="${widthPercent}%" ${responsive ? 'class="stack-column"' : ""} style=""></td>`;
450
+ // SAFE empty cell (keeps layout stable)
451
+ html += `
452
+ <td width="${Math.round(widthPercent)}%"
453
+ ${responsive ? 'class="stack-column"' : ""}
454
+ style="vertical-align:top;">
455
+ </td>`;
409
456
  }
410
457
  }
411
458
  html += "</tr>";
412
459
  }
413
- html += `</table><!--[if mso]></table><![endif]-->`;
460
+ html += "</table><!--[if mso]></table><![endif]-->";
414
461
  return html;
415
462
  }
416
463
  async function convertGridCellBlock(blockData, rootData, cellWidthPercent, parentCellWidthPx) {
417
464
  const { style = {}, childrenIds = [], props = {} } = blockData.data;
465
+ const visibilityClass = (0, common_1.getVisibilityClass)(props);
418
466
  const styles = buildStyles(style, {
419
467
  perChanges: [],
420
468
  pxChanges: allPxAttributes,
421
469
  });
422
- const innerHtmlParts = [];
470
+ const parts = [];
471
+ // FIX: do NOT re-calc px based on parent → causes shrinking
472
+ const safeCellWidthPx = Math.max(parentCellWidthPx, 20);
423
473
  for (const childId of childrenIds) {
424
474
  const child = rootData[childId];
425
475
  if (child) {
426
- const cellWidthPx = parentCellWidthPx * (cellWidthPercent / 100);
427
- innerHtmlParts.push(await convertToHtml(child, rootData, cellWidthPx));
476
+ parts.push(await convertToHtml(child, rootData, safeCellWidthPx));
428
477
  }
429
478
  }
430
- const cellContent = innerHtmlParts.join("");
431
479
  return {
432
- html: cellContent,
480
+ html: parts.join(""),
433
481
  styles,
434
482
  };
435
483
  }
@@ -499,7 +547,7 @@ async function convertVideoBlock(blockData, cellWidthInPx) {
499
547
  coordsize="${innerContainerWidth},${calculatedHeight}"
500
548
  href="${videoLink}"
501
549
  style="width:${innerContainerWidth}px;height:${calculatedHeight}px;">
502
- <v:rect fill="t" style="position:absolute;width:${innerContainerWidth}px;height:${calculatedHeight}px; stroked="t"
550
+ <v:rect fill="t" style="position:absolute;width:${innerContainerWidth}px;height:${calculatedHeight}px;" stroked="t"
503
551
  strokeweight="${borderWidth}px"
504
552
  strokecolor="${borderColor}"
505
553
  ${borderRadius > 0 ? `arcsize="${Math.min(borderRadius / calculatedHeight, 1).toFixed(2)}"` : ""}
@@ -623,154 +671,6 @@ function computeArcSize(borderRadius, widthPx) {
623
671
  const px = parseFloat(s.replace("px", "")) || 0;
624
672
  return Math.min(px / widthPx, 1).toFixed(2);
625
673
  }
626
- // ---------- Updated convertShapeBlock function ----------
627
- // async function convertShapeBlock(blockData: IBlockData) {
628
- // const { style, props } = blockData.data;
629
- // const { shape, text, imageUrl } = props as any;
630
- // const {
631
- // width = "100",
632
- // height = "150",
633
- // padding = {},
634
- // backgroundColor = "#2F80ED",
635
- // borderRadius,
636
- // borderWidth = 0,
637
- // borderStyle = "solid",
638
- // borderColor = "transparent",
639
- // customCss,
640
- // shapeColor,
641
- // alignment = "left",
642
- // msoBakeImageWithText,
643
- // color = "#000000",
644
- // fontSize = 14,
645
- // verticalAlign = "center",
646
- // } = style || {};
647
- // const borderRadiusMap: Record<string, string> = {
648
- // rectangle: "0",
649
- // rounded: "10px",
650
- // circle: "50%",
651
- // oval: "50%",
652
- // };
653
- // let resolvedBorderRadius = borderRadius || borderRadiusMap[shape] || "0";
654
- // let resolvedWidthPx =
655
- // typeof width === "number"
656
- // ? width
657
- // : parseInt(width.toString().replace("px", ""), 10) || 100;
658
- // let resolvedHeightPx =
659
- // typeof height === "number"
660
- // ? height
661
- // : parseInt(height.toString().replace("px", ""), 10) || 150;
662
- // // --- Shape specific constraints ---
663
- // if (shape === "circle") {
664
- // const side = Math.min(resolvedWidthPx, resolvedHeightPx);
665
- // resolvedWidthPx = side;
666
- // resolvedHeightPx = side;
667
- // resolvedBorderRadius = "50%";
668
- // } else if (shape === "oval") {
669
- // resolvedBorderRadius = "50% / 50%";
670
- // }
671
- // const finalBackgroundColor = shapeColor || backgroundColor;
672
- // const alignmentStyles = {
673
- // left: "margin-right:auto;margin-left:0;",
674
- // center: "margin-left:auto;margin-right:auto;",
675
- // right: "margin-left:auto;margin-right:0;",
676
- // };
677
- // const alignmentStyle =
678
- // alignmentStyles[alignment as keyof typeof alignmentStyles] || "";
679
- // const verticalAlignStyles = {
680
- // top: "align-items:flex-start;padding-top:8px;",
681
- // center: "align-items:center;",
682
- // bottom: "align-items:flex-end;padding-bottom:8px;",
683
- // };
684
- // const verticalAlignStyle =
685
- // verticalAlignStyles[verticalAlign as keyof typeof verticalAlignStyles] ||
686
- // verticalAlignStyles.center;
687
- // // Text styling (safe across clients)
688
- // const textSizeStyle = `font-size:${fontSize}px;line-height:1.3;word-break:break-word;overflow-wrap:break-word;text-align:center;color:${color};`;
689
- // // ============================
690
- // // Modern HTML (non-MSO)
691
- // // ============================
692
- // let nonMsoContent = "";
693
- // if (imageUrl && text) {
694
- // nonMsoContent = `
695
- // <div style="display:inline-block;width:${resolvedWidthPx}px;height:${resolvedHeightPx}px;
696
- // border:${borderWidth}px ${borderStyle} ${borderColor};
697
- // border-radius:${resolvedBorderRadius};
698
- // background:${finalBackgroundColor} url('${imageUrl}') center/cover no-repeat;
699
- // overflow:hidden;${alignmentStyle}${customCss || ""}">
700
- // <div style="width:100%;height:100%;display:flex;${verticalAlignStyle}justify-content:center;overflow:hidden;">
701
- // <div style="${textSizeStyle}padding:6px;max-width:90%;-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;">
702
- // ${text}
703
- // </div>
704
- // </div>
705
- // </div>`;
706
- // } else if (imageUrl) {
707
- // nonMsoContent = `
708
- // <div style="display:inline-block;width:${resolvedWidthPx}px;height:${resolvedHeightPx}px;
709
- // border:${borderWidth}px ${borderStyle} ${borderColor};
710
- // border-radius:${resolvedBorderRadius};
711
- // overflow:hidden;${alignmentStyle}${customCss || ""}">
712
- // <img src="${imageUrl}" alt="${text || "shape image"}"
713
- // width="${resolvedWidthPx}" height="${resolvedHeightPx}"
714
- // style="width:100%;height:100%;object-fit:cover;border-radius:${resolvedBorderRadius};display:block;" />
715
- // </div>`;
716
- // } else {
717
- // const circlePadding =
718
- // shape === "circle" ? Math.round(resolvedHeightPx * 0.15) : 8;
719
- // nonMsoContent = `
720
- // <div style="display:inline-block;width:${resolvedWidthPx}px;height:${resolvedHeightPx}px;
721
- // background:${finalBackgroundColor};
722
- // border:${borderWidth}px ${borderStyle} ${borderColor};
723
- // border-radius:${resolvedBorderRadius};
724
- // overflow:hidden;${alignmentStyle}${customCss || ""}">
725
- // <div style="width:100%;height:100%;display:flex;${verticalAlignStyle}justify-content:center;padding:${circlePadding}px;box-sizing:border-box;">
726
- // <div style="${textSizeStyle}max-width:90%;overflow:hidden;">
727
- // ${text || ""}
728
- // </div>
729
- // </div>
730
- // </div>`;
731
- // }
732
- // // ============================
733
- // // Outlook (VML) version
734
- // // ============================
735
- // const outlookContent = await appendOutlookForShape(
736
- // nonMsoContent,
737
- // resolvedWidthPx,
738
- // resolvedWidthPx,
739
- // {
740
- // shape,
741
- // imageUrl,
742
- // backgroundColor,
743
- // shapeColor,
744
- // borderWidth,
745
- // borderColor,
746
- // borderRadius: resolvedBorderRadius,
747
- // heightPx: resolvedHeightPx,
748
- // text,
749
- // textColor: color,
750
- // textSize: fontSize,
751
- // verticalAlign,
752
- // alignment,
753
- // padding,
754
- // msoBakeImageWithText,
755
- // }
756
- // );
757
- // // ============================
758
- // // Final combined block
759
- // // ============================
760
- // return `
761
- // <table width="100%" style="border-collapse:collapse;table-layout:fixed;">
762
- // <tr>
763
- // <td style="padding:${padding.top || 0}px ${padding.right || 0}px ${
764
- // padding.bottom || 0
765
- // }px ${padding.left || 0}px;text-align:${alignment};">
766
- // ${outlookContent}
767
- // <!--[if !mso]><!-->
768
- // ${nonMsoContent}
769
- // <!--<![endif]-->
770
- // </td>
771
- // </tr>
772
- // </table>`;
773
- // }
774
674
  async function convertShapeBlock(blockData) {
775
675
  const { style, props } = blockData.data;
776
676
  const { shape, text, imageUrl } = props;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "email-builder-utils",
3
- "version": "1.1.30",
3
+ "version": "1.1.34",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "files": [