@shotstack/shotstack-canvas 1.5.3 → 1.5.4

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.
@@ -998,19 +998,36 @@ async function buildDrawOps(p) {
998
998
  }
999
999
  if (p.background.border && p.background.border.width > 0) {
1000
1000
  const halfBorder = p.background.border.width / 2;
1001
- ops.push({
1002
- op: "RectangleStroke",
1003
- x: bgX + halfBorder,
1004
- y: bgY + halfBorder,
1005
- width: bgWidth - p.background.border.width,
1006
- height: bgHeight - p.background.border.width,
1007
- stroke: {
1008
- width: p.background.border.width,
1009
- color: p.background.border.color,
1010
- opacity: p.background.border.opacity
1011
- },
1012
- borderRadius: Math.max(0, p.background.borderRadius - halfBorder)
1013
- });
1001
+ const borderRadius = p.background.borderRadius;
1002
+ if (borderRadius <= halfBorder) {
1003
+ ops.push({
1004
+ op: "RectangleStroke",
1005
+ x: bgX,
1006
+ y: bgY,
1007
+ width: bgWidth,
1008
+ height: bgHeight,
1009
+ stroke: {
1010
+ width: p.background.border.width,
1011
+ color: p.background.border.color,
1012
+ opacity: p.background.border.opacity
1013
+ },
1014
+ borderRadius
1015
+ });
1016
+ } else {
1017
+ ops.push({
1018
+ op: "RectangleStroke",
1019
+ x: bgX + halfBorder,
1020
+ y: bgY + halfBorder,
1021
+ width: bgWidth - p.background.border.width,
1022
+ height: bgHeight - p.background.border.width,
1023
+ stroke: {
1024
+ width: p.background.border.width,
1025
+ color: p.background.border.color,
1026
+ opacity: p.background.border.opacity
1027
+ },
1028
+ borderRadius: borderRadius - halfBorder
1029
+ });
1030
+ }
1014
1031
  }
1015
1032
  }
1016
1033
  ops.push(...textOps);
@@ -959,19 +959,36 @@ async function buildDrawOps(p) {
959
959
  }
960
960
  if (p.background.border && p.background.border.width > 0) {
961
961
  const halfBorder = p.background.border.width / 2;
962
- ops.push({
963
- op: "RectangleStroke",
964
- x: bgX + halfBorder,
965
- y: bgY + halfBorder,
966
- width: bgWidth - p.background.border.width,
967
- height: bgHeight - p.background.border.width,
968
- stroke: {
969
- width: p.background.border.width,
970
- color: p.background.border.color,
971
- opacity: p.background.border.opacity
972
- },
973
- borderRadius: Math.max(0, p.background.borderRadius - halfBorder)
974
- });
962
+ const borderRadius = p.background.borderRadius;
963
+ if (borderRadius <= halfBorder) {
964
+ ops.push({
965
+ op: "RectangleStroke",
966
+ x: bgX,
967
+ y: bgY,
968
+ width: bgWidth,
969
+ height: bgHeight,
970
+ stroke: {
971
+ width: p.background.border.width,
972
+ color: p.background.border.color,
973
+ opacity: p.background.border.opacity
974
+ },
975
+ borderRadius
976
+ });
977
+ } else {
978
+ ops.push({
979
+ op: "RectangleStroke",
980
+ x: bgX + halfBorder,
981
+ y: bgY + halfBorder,
982
+ width: bgWidth - p.background.border.width,
983
+ height: bgHeight - p.background.border.width,
984
+ stroke: {
985
+ width: p.background.border.width,
986
+ color: p.background.border.color,
987
+ opacity: p.background.border.opacity
988
+ },
989
+ borderRadius: borderRadius - halfBorder
990
+ });
991
+ }
975
992
  }
976
993
  }
977
994
  ops.push(...textOps);
package/dist/entry.web.js CHANGED
@@ -964,19 +964,36 @@ async function buildDrawOps(p) {
964
964
  }
965
965
  if (p.background.border && p.background.border.width > 0) {
966
966
  const halfBorder = p.background.border.width / 2;
967
- ops.push({
968
- op: "RectangleStroke",
969
- x: bgX + halfBorder,
970
- y: bgY + halfBorder,
971
- width: bgWidth - p.background.border.width,
972
- height: bgHeight - p.background.border.width,
973
- stroke: {
974
- width: p.background.border.width,
975
- color: p.background.border.color,
976
- opacity: p.background.border.opacity
977
- },
978
- borderRadius: Math.max(0, p.background.borderRadius - halfBorder)
979
- });
967
+ const borderRadius = p.background.borderRadius;
968
+ if (borderRadius <= halfBorder) {
969
+ ops.push({
970
+ op: "RectangleStroke",
971
+ x: bgX,
972
+ y: bgY,
973
+ width: bgWidth,
974
+ height: bgHeight,
975
+ stroke: {
976
+ width: p.background.border.width,
977
+ color: p.background.border.color,
978
+ opacity: p.background.border.opacity
979
+ },
980
+ borderRadius
981
+ });
982
+ } else {
983
+ ops.push({
984
+ op: "RectangleStroke",
985
+ x: bgX + halfBorder,
986
+ y: bgY + halfBorder,
987
+ width: bgWidth - p.background.border.width,
988
+ height: bgHeight - p.background.border.width,
989
+ stroke: {
990
+ width: p.background.border.width,
991
+ color: p.background.border.color,
992
+ opacity: p.background.border.opacity
993
+ },
994
+ borderRadius: borderRadius - halfBorder
995
+ });
996
+ }
980
997
  }
981
998
  }
982
999
  ops.push(...textOps);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shotstack/shotstack-canvas",
3
- "version": "1.5.3",
3
+ "version": "1.5.4",
4
4
  "description": "Text layout & animation engine (HarfBuzz) for Node & Web - fully self-contained.",
5
5
  "type": "module",
6
6
  "main": "./dist/entry.node.cjs",