soccer-jersey-fork 1.0.26 → 1.0.28

package/lib/stories/ReactTeamPage.stories.js

@@ -15,10 +15,8 @@ export const Default = {
         textColor: "#fff",
         collarColor: "red",
         sleeveCuffColor: "yellow",
-        shortColor: "black",
-        customImageConfig: {
-            src: "https://resources.simcups.com/flags/w80/264.png",
-        },
+        shortsColor: "black",
+        image: "https://resources.simcups.com/flags/w80/264.png",
     },
 };
 export const ARS = {
@@ -29,7 +27,7 @@ export const ARS = {
         shirtStyle: "checkered",
         shirtStyleColor: "#dc0001",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const AVL = {
@@ -39,7 +37,7 @@ export const AVL = {
         sleeveColor: "#94bee5",
         shirtStyle: "plain",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const BHA = {
@@ -50,7 +48,7 @@ export const BHA = {
         shirtStyle: "striped-thin",
         shirtStyleColor: "#fff",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const BUR = {
@@ -59,7 +57,7 @@ export const BUR = {
         shirtColor: "#81204c",
         sleeveColor: "#8bd3f5",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const CHE = {
@@ -69,7 +67,7 @@ export const CHE = {
         sleeveColor: "#001489",
         shirtStyle: "plain",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const CRY = {
@@ -80,7 +78,7 @@ export const CRY = {
         shirtStyle: "striped",
         shirtStyleColor: "#ff362b",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const FUL = {
@@ -90,7 +88,7 @@ export const FUL = {
         sleeveColor: "#333",
         shirtStyle: "plain",
         textColor: "#222",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const LEE = {
@@ -100,7 +98,7 @@ export const LEE = {
         sleeveColor: "#ffffff",
         shirtStyle: "plain",
         textColor: "#1d4189",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const LEI = {
@@ -110,7 +108,7 @@ export const LEI = {
         sleeveColor: "#003090",
         shirtStyle: "plain",
         textColor: "#fefefe",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const LIV = {
@@ -120,7 +118,7 @@ export const LIV = {
         sleeveColor: "#e31b23",
         shirtStyle: "plain",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const MCI = {
@@ -139,7 +137,7 @@ export const MUN = {
         sleeveColor: "#c70101",
         shirtStyle: "plain",
         textColor: "#fed500",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const NEW = {
@@ -150,7 +148,7 @@ export const NEW = {
         shirtStyle: "striped",
         shirtStyleColor: "#111",
         textColor: "#00bcf6",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const SHE = {
@@ -172,7 +170,7 @@ export const SOU = {
         shirtStyleColor: "#fff",
         textColor: "#111",
         shirtStyleDirection: "diagonal-left",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const TOT = {
@@ -182,7 +180,7 @@ export const TOT = {
         sleeveColor: "#0a225c",
         shirtStyle: "plain",
         textColor: "#d31145",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const WIG = {
@@ -194,7 +192,7 @@ export const WIG = {
         shirtStyleColor: "#002f68",
         textColor: "#fff",
         textBackgroundColor: "#002f68",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const WHU = {
@@ -204,7 +202,7 @@ export const WHU = {
         sleeveColor: "#59b3e4",
         shirtStyle: "plain",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const WOL = {
@@ -214,7 +212,7 @@ export const WOL = {
         sleeveColor: "#333",
         shirtStyle: "plain",
         textColor: "#222",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const PSG = {
@@ -226,7 +224,7 @@ export const PSG = {
         shirtStyleColor: "#cc1339",
         textColor: "#fff",
         shirtStyleDirection: "vertical",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const ACM = {
@@ -237,7 +235,7 @@ export const ACM = {
         shirtStyle: "striped",
         shirtStyleColor: "#222",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const BAR = {
@@ -248,7 +246,7 @@ export const BAR = {
         shirtStyle: "striped-thick",
         shirtStyleColor: "#84112b",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const FCB = {
@@ -258,7 +256,7 @@ export const FCB = {
         sleeveColor: "#d1122e",
         shirtStyle: "plain",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const JUV = {
@@ -269,7 +267,7 @@ export const JUV = {
         shirtStyle: "striped",
         shirtStyleColor: "#222",
         textColor: "#e1ceaf",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const BVB = {
@@ -282,7 +280,7 @@ export const BVB = {
         shirtStyleDirection: "diagonal-right",
         textColor: "#fff",
         textBackgroundColor: "#333",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const CAG = {
@@ -293,7 +291,7 @@ export const CAG = {
         shirtStyle: "two-color",
         shirtStyleColor: "#1d2c47",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const MON = {
@@ -305,7 +303,7 @@ export const MON = {
         shirtStyleColor: "#e53236",
         shirtStyleDirection: "diagonal-left",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };
 export const INT = {
@@ -316,6 +314,6 @@ export const INT = {
         shirtStyle: "waves",
         shirtStyleColor: "#222",
         textColor: "#fff",
-        shortColor: "black",
+        shortsColor: "black",
     },
 };

package/lib/types/index.d.ts

@@ -12,14 +12,12 @@ export interface DrawSoccerJerseyProps {
     shirtWidth?: number;
     collarColor?: string;
     sleeveCuffColor?: string;
-    customImageConfig?: {
-        src: string;
-        width?: number;
-        height?: number;
-        x?: number;
-        y?: number;
-    };
-    shortColor: string;
+    image?: string;
+    imageWidth?: number;
+    imageHeight?: number;
+    imageX?: number;
+    imageY?: number;
+    shortsColor: string;
     withDefaultBadge?: boolean;
     withShorts?: boolean;
 }

package/lib/utils/draw-soccer-jersey.d.ts

@@ -27,4 +27,4 @@ import { DrawSoccerJerseyProps } from "../types";
  * @return {string} A data URL ready for direct use as src attribute
  *  on <img />
  */
-export default function drawSoccerJersey({ shirtText, textColor, textOutlineColor, textBackgroundColor, shirtColor, sleeveColor, shirtStyle, shirtStyleColor, shirtStyleDirection, isBack, shirtWidth, collarColor, sleeveCuffColor, customImageConfig, shortColor, withDefaultBadge, withShorts, }: DrawSoccerJerseyProps): string;
+export default function drawSoccerJersey({ shirtText, textColor, textOutlineColor, textBackgroundColor, shirtColor, sleeveColor, shirtStyle, shirtStyleColor, shirtStyleDirection, isBack, shirtWidth, collarColor, sleeveCuffColor, shortsColor, image, imageHeight, imageWidth, imageX, imageY, withDefaultBadge, withShorts, }: DrawSoccerJerseyProps): string;

package/lib/utils/draw-soccer-jersey.js

@@ -30,7 +30,7 @@ import { drawHoops, drawSingleBand, drawStriped, drawCheckered, drawTwoColor, dr
  * @return {string} A data URL ready for direct use as src attribute
  *  on <img />
  */
-export default function drawSoccerJersey({ shirtText, textColor, textOutlineColor, textBackgroundColor, shirtColor = "plain", sleeveColor, shirtStyle, shirtStyleColor, shirtStyleDirection, isBack = false, shirtWidth = 200, collarColor, sleeveCuffColor, customImageConfig, shortColor, withDefaultBadge = true, withShorts = true, }) {
+export default function drawSoccerJersey({ shirtText, textColor, textOutlineColor, textBackgroundColor, shirtColor = "plain", sleeveColor, shirtStyle, shirtStyleColor, shirtStyleDirection, isBack = false, shirtWidth = 200, collarColor, sleeveCuffColor, shortsColor, image, imageHeight, imageWidth, imageX, imageY, withDefaultBadge = true, withShorts = true, }) {
     // Colors and Color Optimizations
     const optimizedSleeveColor = lightenDarkenColor(sleeveColor, -10);
     const optimizedShirtColor = lightenDarkenColor(shirtColor, -10);
@@ -98,11 +98,11 @@ export default function drawSoccerJersey({ shirtText, textColor, textOutlineColo
                 .fill("none")
                 .stroke({ color: collarColor, width: 2 });
         }
-        if (customImageConfig) {
+        if (image) {
             page
-                .image(customImageConfig.src)
-                .size(customImageConfig.width || 20, customImageConfig.height || 20)
-                .move(customImageConfig.x || 40, customImageConfig.y || 45);
+                .image(image)
+                .size(imageWidth || 20, imageHeight || 20)
+                .move(imageX || 40, imageY || 45);
         }
         if (withDefaultBadge) {
             page
@@ -174,7 +174,7 @@ export default function drawSoccerJersey({ shirtText, textColor, textOutlineColo
     if (withShorts) {
         page.width(shirtWidth);
         const pathShorts = `m 23 98 c 5 6, 50 6, 56 0 l 2 ${shortsHeight} c 0 5, -27 5, -27.5 0 l -2 -10, -2 10, c 0 5, -27 5, -27.5 0 l 1 -${shortsHeight}`;
-        page.path(pathShorts).fill(shortColor);
+        page.path(pathShorts).fill(shortsColor);
     }
     // +10 is some extra room with the shorts height, so the total should be 150
     page.viewbox(`0 0 102 ${100 + shortsHeight + 10}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "soccer-jersey-fork",
-  "version": "1.0.26",
+  "version": "1.0.28",
   "description": "Generate soccer jerseys in SVG format",
   "main": "lib/index.js",
   "scripts": {