@blockspoon/cert-badge-renderer 1.0.17 → 1.0.19

package/src/templates/ribbons/RibbonWing3.ts

@@ -1,4 +1,4 @@
-import { ISvgProps } from "../../interface"; 
+import { ISvgProps } from "../../interface/index.js"; 
 
 export function createRibbonWing3({
   mainColor = "#96A6B4",

package/src/templates/ribbons/RibbonWing4.ts

@@ -1,4 +1,4 @@
-import { ISvgProps } from "../../interface"; 
+import { ISvgProps } from "../../interface/index.js"; 
 
 export function createRibbonWing4({
   mainColor = "#96A6B4",

package/src/templates/ribbons/RibbonWing5.ts

@@ -1,4 +1,4 @@
-import { ISvgProps } from "../../interface"; 
+import { ISvgProps } from "../../interface/index.js"; 
 
 export function createRibbonWing5({
   mainColor = "#96A6B4",

package/src/templates/ribbons/RibbonWing6.ts

@@ -1,4 +1,4 @@
-import { ISvgProps } from "../../interface"; 
+import { ISvgProps } from "../../interface/index.js"; 
 
 export function createRibbonWing6({
   mainColor = "#96A6B4",

package/src/templates/ribbons/RibbonWing7.ts

@@ -1,4 +1,4 @@
-import { ISvgProps } from "../../interface"; 
+import { ISvgProps } from "../../interface/index.js"; 
 
 export function createRibbonWing7({
   mainColor = "#96A6B4",

package/src/templates/ribbons/RibbonWing8.ts

@@ -1,4 +1,4 @@
-import { ISvgProps } from "../../interface"; 
+import { ISvgProps } from "../../interface/index.js"; 
 
 export function createRibbonWing8({
   mainColor = "#96A6B4",

package/src/templates/ribbons/RibbonWing9.ts

@@ -1,4 +1,4 @@
-import { ISvgProps } from "../../interface"; 
+import { ISvgProps } from "../../interface/index.js"; 
 
 export function createRibbonWing9({
   mainColor = "#96A6B4",

package/src/templates/ribbons/index.ts

@@ -1,70 +1,70 @@
-import { createRibbonType1 } from "./RibbonType1";
-import { createRibbonType2 } from "./RibbonType2";
-import { createRibbonType4 } from "./RibbonType4";
-import { createRibbonType5 } from "./RibbonType5";
-import { createRibbonType6 } from "./RibbonType6";
-import { createRibbonType7_1 } from "./RibbonType7_1";
-import { createRibbonType7 } from "./RibbonType7";
-import { createRibbonType8 } from "./RibbonType8";
-import { createRibbonType12 } from "./RibbonType12";
-import { createRibbonType13_1 } from "./RibbonType13_1";
-import { createRibbonType13 } from "./RibbonType13";
-import { createRibbonType18_1 } from "./RibbonType18_1";
-import { createRibbonType18 } from "./RibbonType18";
-import { createRibbonType19_1 } from "./RibbonType19_1";
-import { createRibbonType19 } from "./RibbonType19";
-import { createRibbonType21 } from "./RibbonType21";
-import { createRibbonType22 } from "./RibbonType22";
-import { createRibbonType23 } from "./RibbonType23";
-import { createRibbonType23_1 } from "./RibbonType23_1";
-import { createRibbonType24 } from "./RibbonType24";
-import { createRibbonType24_1 } from "./RibbonType24_1";
-import { createRibbonType26 } from "./RibbonType26";
-import { createRibbonType27 } from "./RibbonType27";
-import { createRibbonType27_1 } from "./RibbonType27_1";
-import { createRibbonType34 } from "./RibbonType34";
-import { createRibbonType35_1 } from "./RibbonType35_1";
-import { createRibbonType35 } from "./RibbonType35";
-import { createRibbonType45 } from "./RibbonType45";
-import { createRibbonType46 } from "./RibbonType46";
-import { createRibbonType53 } from "./RibbonType53";
-import { createRibbonType57 } from "./RibbonType57";
-import { createRibbonType61 } from "./RibbonType61";
-import { createRibbonType92 } from "./RibbonType92";
-import { createRibbonType93 } from "./RibbonType93";
-import { createRibbonType93_1 } from "./RibbonType93_1";
-import { createRibbonType96 } from "./RibbonType96";
-import { createRibbonType96_1 } from "./RibbonType96_1";
-import { createRibbonType97 } from "./RibbonType97";
-import { createRibbonType99 } from "./RibbonType99";
-import { createRibbonType101 } from "./RibbonType101";
-import { createRibbonType101_1 } from "./RibbonType101_1";
-import { createRibbonType103 } from "./RibbonType103";
-import { createRibbonType107 } from "./RibbonType107";
-import { createRibbonType109 } from "./RibbonType109";
-import { createRibbonType110 } from "./RibbonType110";
-import { createRibbonType113 } from "./RibbonType113";
-import { createRibbonType115 } from "./RibbonType115";
-import { createRibbonType116_1 } from "./RibbonType116_1";
-import { createRibbonType116 } from "./RibbonType116";
-import { createRibbonType118 } from "./RibbonType118";
+import { createRibbonType1 } from "./RibbonType1.js";
+import { createRibbonType2 } from "./RibbonType2.js";
+import { createRibbonType4 } from "./RibbonType4.js";
+import { createRibbonType5 } from "./RibbonType5.js";
+import { createRibbonType6 } from "./RibbonType6.js";
+import { createRibbonType7_1 } from "./RibbonType7_1.js";
+import { createRibbonType7 } from "./RibbonType7.js";
+import { createRibbonType8 } from "./RibbonType8.js";
+import { createRibbonType12 } from "./RibbonType12.js";
+import { createRibbonType13_1 } from "./RibbonType13_1.js";
+import { createRibbonType13 } from "./RibbonType13.js";
+import { createRibbonType18_1 } from "./RibbonType18_1.js";
+import { createRibbonType18 } from "./RibbonType18.js";
+import { createRibbonType19_1 } from "./RibbonType19_1.js";
+import { createRibbonType19 } from "./RibbonType19.js";
+import { createRibbonType21 } from "./RibbonType21.js";
+import { createRibbonType22 } from "./RibbonType22.js";
+import { createRibbonType23 } from "./RibbonType23.js";
+import { createRibbonType23_1 } from "./RibbonType23_1.js";
+import { createRibbonType24 } from "./RibbonType24.js";
+import { createRibbonType24_1 } from "./RibbonType24_1.js";
+import { createRibbonType26 } from "./RibbonType26.js";
+import { createRibbonType27 } from "./RibbonType27.js";
+import { createRibbonType27_1 } from "./RibbonType27_1.js";
+import { createRibbonType34 } from "./RibbonType34.js";
+import { createRibbonType35_1 } from "./RibbonType35_1.js";
+import { createRibbonType35 } from "./RibbonType35.js";
+import { createRibbonType45 } from "./RibbonType45.js";
+import { createRibbonType46 } from "./RibbonType46.js";
+import { createRibbonType53 } from "./RibbonType53.js";
+import { createRibbonType57 } from "./RibbonType57.js";
+import { createRibbonType61 } from "./RibbonType61.js";
+import { createRibbonType92 } from "./RibbonType92.js";
+import { createRibbonType93 } from "./RibbonType93.js";
+import { createRibbonType93_1 } from "./RibbonType93_1.js";
+import { createRibbonType96 } from "./RibbonType96.js";
+import { createRibbonType96_1 } from "./RibbonType96_1.js";
+import { createRibbonType97 } from "./RibbonType97.js";
+import { createRibbonType99 } from "./RibbonType99.js";
+import { createRibbonType101 } from "./RibbonType101.js";
+import { createRibbonType101_1 } from "./RibbonType101_1.js";
+import { createRibbonType103 } from "./RibbonType103.js";
+import { createRibbonType107 } from "./RibbonType107.js";
+import { createRibbonType109 } from "./RibbonType109.js";
+import { createRibbonType110 } from "./RibbonType110.js";
+import { createRibbonType113 } from "./RibbonType113.js";
+import { createRibbonType115 } from "./RibbonType115.js";
+import { createRibbonType116_1 } from "./RibbonType116_1.js";
+import { createRibbonType116 } from "./RibbonType116.js";
+import { createRibbonType118 } from "./RibbonType118.js";
 
-import { createRibbonWing1 } from "./RibbonWing1";
-import { createRibbonWing2 } from "./RibbonWing2";
-import { createRibbonWing3 } from "./RibbonWing3";
-import { createRibbonWing4 } from "./RibbonWing4";
-import { createRibbonWing5 } from "./RibbonWing5";
-import { createRibbonWing6 } from "./RibbonWing6";
-import { createRibbonWing7 } from "./RibbonWing7";
-import { createRibbonWing8 } from "./RibbonWing8";
-import { createRibbonWing9 } from "./RibbonWing9";
-import { createRibbonWing10 } from "./RibbonWing10";
-import { createRibbonWing11 } from "./RibbonWing11";
-import { createRibbonWing12 } from "./RibbonWing12";
-import { createRibbonWing14 } from "./RibbonWing14";
-import { createRibbonWing104 } from "./RibbonWing104";
-import { createRibbonWing105 } from "./RibbonWing105";
-import { createRibbonWing106 } from "./RibbonWing106";
+import { createRibbonWing1 } from "./RibbonWing1.js";
+import { createRibbonWing2 } from "./RibbonWing2.js";
+import { createRibbonWing3 } from "./RibbonWing3.js";
+import { createRibbonWing4 } from "./RibbonWing4.js";
+import { createRibbonWing5 } from "./RibbonWing5.js";
+import { createRibbonWing6 } from "./RibbonWing6.js";
+import { createRibbonWing7 } from "./RibbonWing7.js";
+import { createRibbonWing8 } from "./RibbonWing8.js";
+import { createRibbonWing9 } from "./RibbonWing9.js";
+import { createRibbonWing10 } from "./RibbonWing10.js";
+import { createRibbonWing11 } from "./RibbonWing11.js";
+import { createRibbonWing12 } from "./RibbonWing12.js";
+import { createRibbonWing14 } from "./RibbonWing14.js";
+import { createRibbonWing104 } from "./RibbonWing104.js";
+import { createRibbonWing105 } from "./RibbonWing105.js";
+import { createRibbonWing106 } from "./RibbonWing106.js";
 
 const Ribbons = {
   // RibbonType Type

package/src/templates/svgTemplate.ts

@@ -1,6 +1,6 @@
-import Badges from "./badges";
-import Ribbons from "./ribbons";
-import Icons from "./icons";
+import Badges from "./badges/index.js";
+import Ribbons from "./ribbons/index.js";
+import Icons from "./icons/index.js";
 
 export interface templateType {
   id: string;

package/src/utils/generateAchievementHTML.ts

@@ -3,16 +3,16 @@ import {
   CERTIFICATE_DESIGN_TYPE,
   CertificateData,
   CertificateOptions,
-} from "../interface";
-import { getBindingValue } from "./getBindingValue";
+} from "../interface/index.js";
+import { getBindingValue } from "./getBindingValue.js";
 import QRCode from "qrcode";
 import {
   badgeTemplates,
   iconTemplates,
   ribbonTemplates,
-} from "../templates/svgTemplate";
-import Certificates from "../templates/certificates";
-import { portraitComponents } from "../constants/componentsDirection";
+} from "../templates/svgTemplate.js";
+import Certificates from "../templates/certificates/index.js";
+import { portraitComponents } from "../constants/componentsDirection.js";
 
 export async function generateAchievementHTML(
   achievementInfo: CertificateData,
@@ -28,6 +28,8 @@ export async function generateAchievementHTML(
     achievementForm = achievementInfo;
   }
 
+  console.log(achievementForm);
+
   // type에 따라 적절한 layout_json 선택
   const elements =
     type === "badge"

package/src/utils/generateDesignHTML.ts

@@ -3,16 +3,16 @@ import {
   CERTIFICATE_DESIGN_TYPE,
   IAchievementDesignItem,
   DesignOptions,
-} from "../interface";
-import { getBindingValue } from "./getBindingValue";
+} from "../interface/index.js";
+import { getBindingValue } from "./getBindingValue.js";
 import QRCode from "qrcode";
 import {
   badgeTemplates,
   iconTemplates,
   ribbonTemplates,
-} from "../templates/svgTemplate";
-import Certificates from "../templates/certificates";
-import { portraitComponents } from "../constants/componentsDirection";
+} from "../templates/svgTemplate.js";
+import Certificates from "../templates/certificates/index.js";
+import { portraitComponents } from "../constants/componentsDirection.js";
 
 export async function generateDesignHTML(
   data: IAchievementDesignItem,

package/src/utils/getBindingValue.ts

@@ -1,6 +1,6 @@
 import { format } from "date-fns";
-import { IAchievementItem } from "../interface";
-import { groupByType } from "../util";
+import { IAchievementItem } from "../interface/index.js";
+import { groupByType } from "../util.js";
 
 // 데이터 타입별 헬퍼 함수
 const getAchievementValue = (

package/test/certificate.html

@@ -1 +1,270 @@
-<div style="position: relative; width: 100%; height: 100%;"></div>
+
+    <!DOCTYPE html>
+    <html lang="ko">
+      <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Certificate</title>
+        <style>
+          @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
+          * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+          }
+          body {
+            font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
+            -webkit-font-smoothing: antialiased;
+            -moz-osx-font-smoothing: grayscale;
+          }
+        </style>
+      </head>
+      <body style="
+          width: 300px;
+          height: 300px;
+          overflow: hidden;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        ">
+        <div
+          style="
+            width: 300px;
+            height: 210.9375px;
+            aspect-ratio: 1.4222222222222223;
+            
+          "
+        >
+        <div style="
+        position: relative;
+        width: 1152px;
+        height: 810px;
+        overflow: hidden;
+        transform: scale(0.2604166666666667);
+        transform-origin: top left;
+        ">
+        
+     <svg
+        width="100%"
+        height="100%"
+        viewBox="0 0 1152 815"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <g clipPath="url(#clip0_2086_1513)">
+          <rect
+            width="1152"
+            height="814"
+            transform="translate(0 0.499512)"
+            fill="white"
+          />
+          <path
+            d="M430.03 910.273L333.39 884.583C344.04 844.493 353.75 804.993 355.46 762.593L355.48 762.193C358.7 695.543 332.72 692.093 309.79 689.053L308.83 688.913C279.63 684.453 262.63 698.453 224.91 736.623C214.08 747.573 202.89 758.903 190.23 770.043C169.06 788.683 143.98 803.103 119.61 810.643C69.31 826.293 8.55 823.693 -61 802.933L-32.39 707.113C17.79 722.093 58.95 724.803 89.93 715.153L90.03 715.123C100.89 711.773 113.65 704.243 124.16 694.983C134.22 686.133 143.73 676.513 153.8 666.323C192.84 626.823 241.42 577.693 323.44 589.983C366.58 595.803 400 613.263 422.78 641.863C447.26 672.613 457.93 713.493 455.39 766.823C453.25 819.273 441.71 866.443 430.06 910.273H430.03Z"
+            fill="#FF8FB1"
+            fill-opacity="0.1"
+          />
+          <path
+            d="M933.331 999.732C909.641 999.732 888.151 994.052 869.981 982.822C847.581 968.992 831.591 947.392 823.741 920.372C816.671 896.052 816.161 866.982 822.241 833.962C822.971 829.992 823.711 826.002 824.451 822.002C832.451 778.822 840.711 734.162 841.711 695.022C842.651 657.952 837.001 631.962 824.421 615.552C811.321 598.472 787.651 588.792 752.051 585.952C729.711 584.172 712.051 590.102 696.481 604.612C670.521 628.802 650.071 677.592 638.901 742.002C629.541 795.952 629.841 842.042 629.841 842.502L529.851 843.562C529.831 841.382 529.381 789.372 540.051 726.802C555.241 637.682 584.891 572.012 628.161 531.592C664.191 497.942 709.771 482.262 759.991 486.262C824.531 491.392 872.911 514.422 903.791 554.692C961.681 630.182 941.021 741.752 922.801 840.192C922.061 844.162 921.331 848.112 920.611 852.042C914.571 884.882 920.721 896.602 922.561 897.742C930.761 902.802 964.311 899.392 996.571 875.072C1010.99 864.202 1023.31 853.012 1035.23 842.202C1056.65 822.762 1076.88 804.402 1104.39 791.772C1136.18 777.172 1170.5 773.552 1212.41 780.382L1196.33 879.082C1151.46 871.772 1138.11 883.882 1102.44 916.262C1089.5 928.012 1074.82 941.323 1056.77 954.932C1030.82 974.492 999.991 988.912 969.961 995.552C957.311 998.342 945.071 999.732 933.361 999.732H933.331Z"
+            fill="yellow"
+            fill-opacity="0.1"
+          />
+          <path
+            d="M1106.29 486.833C1105.97 486.833 1105.66 486.833 1105.35 486.833C1056.71 486.513 1005.97 462.593 954.56 415.723C919.5 383.763 899.22 353.793 898.25 352.443L935.75 321.133L976.2 291.743C998.76 322.673 1060.2 386.623 1106.09 386.833H1106.34C1117.03 386.833 1133.46 383.593 1153.5 356.653L1233.74 416.333C1190.49 474.473 1140.74 486.833 1106.29 486.833Z"
+            fill="#5EB2FF"
+            fill-opacity="0.2"
+          />
+          <path
+            d="M1174.47 231.892C1094.23 222.392 1028.73 175.102 985.061 95.1421C954.141 38.5321 945.001 -15.7279 944.621 -18.0079L1043.3 -34.1879L1043.27 -34.3579C1043.34 -33.9379 1050.64 7.58209 1074.04 49.4221C1101.81 99.0821 1139.56 127.062 1186.22 132.592L1174.46 231.902L1174.47 231.892Z"
+            fill="#FF8FB1"
+            fill-opacity="0.2"
+          />
+          <path
+            d="M-13.4991 483.492L-19.9391 383.702L-20.2891 383.722C-20.1191 383.712 -2.64906 382.252 14.3509 374.552C37.3409 364.142 39.2509 351.692 40.0609 346.382C43.0909 326.572 40.5309 298.902 37.8209 269.612C34.9009 238.032 31.8809 205.382 34.6509 173.122C38.3309 130.222 51.7709 96.7623 75.7409 70.8123C107.911 35.9923 145.721 18.8423 188.011 19.7823C221.441 20.5423 250.801 32.5523 274.401 42.2023C278.941 44.0623 283.231 45.8123 287.261 47.3723C302.921 53.4223 318.391 55.4323 329.711 52.8923C337.041 51.2423 345.461 47.5023 352.291 32.2323C358.271 18.8723 362.561 2.43229 366.711 -13.4577C372.981 -37.4577 379.451 -62.2877 393.111 -82.8977C413.701 -113.988 446.121 -128.438 484.401 -123.578C508.961 -120.458 532.481 -109.138 557.381 -97.1577C624.341 -64.9377 657.981 -55.3877 699.041 -99.0377L771.881 -30.5277C733.811 9.94229 689.871 30.3923 641.111 30.4023C636.321 30.4023 631.491 30.2023 626.601 29.8123C583.361 26.3123 544.911 7.82228 514.021 -7.03771C499.661 -13.9477 483.561 -21.6977 474.381 -23.8777C470.561 -15.4177 466.241 1.15228 463.451 11.8123C458.511 30.7223 452.921 52.1623 443.561 73.0923C425.361 113.762 392.711 141.252 351.621 150.482C312.411 159.292 275.381 150.012 251.221 140.682C246.281 138.772 241.331 136.752 236.541 134.792C190.611 116.002 173.701 112.162 149.201 138.692C128.231 161.392 132.891 211.732 137.401 260.422C140.551 294.422 143.801 329.582 138.921 361.512C131.681 408.892 100.741 446.482 51.7909 467.362C19.7109 481.042 -10.1891 483.312 -13.4991 483.522V483.492Z"
+            fill="#FF1B64"
+            fill-opacity="0.2"
+          />
+          <rect
+            x="230"
+            y="0.499512"
+            width="692"
+            height="639"
+            rx="20"
+            fill="white"
+            fill-opacity="0.7"
+          />
+          <rect
+            x="1018"
+            y="32.4995"
+            width="60"
+            height="60"
+            transform="rotate(90 1018 32.4995)"
+            fill="url(#pattern0_2086_1513)"
+          />
+          <path
+            d="M168.49 209.09V196.5L175.64 209.09L194.87 204.329L180.41 215.729L185.17 224.75L171.9 221.009L153 231.56L164.92 218.789L154.36 210.96L168.49 209.09Z"
+            fill="#FFEE6A"
+          />
+          <path
+            d="M826.099 132.477V123.5L831.222 132.477L845 129.083L834.639 137.212L838.05 143.644L828.542 140.977L815 148.5L823.541 139.394L815.974 133.81L826.099 132.477Z"
+            fill="#FFEE6A"
+          />
+          <path
+            d="M970.848 290.358L973.637 279.948L976.788 291.95L993.82 292.295L979.28 298.502L981.237 307.02L971.04 300.973L953 305.489L965.733 297.584L958.694 288.758L970.848 290.358Z"
+            fill="#FF1B64"
+          />
+          <path
+            d="M343.099 257.477V248.5L348.222 257.477L362 254.083L351.639 262.212L355.05 268.644L345.542 265.977L332 273.5L340.541 264.394L332.974 258.81L343.099 257.477Z"
+            fill="#FFEE6A"
+          />
+          <mask
+            id="mask0_2086_1513"
+            maskUnits="userSpaceOnUse"
+            x="527"
+            y="666"
+            width="98"
+            height="95"
+          >
+            <path
+              fill-rule="evenodd"
+              clip-rule="evenodd"
+              d="M546.636 666.1C536.345 668.805 528.754 678.173 528.754 689.314V729.425H622.865V666.1H624.402V736.3C624.402 749.555 613.656 760.3 600.402 760.3H551.602C538.347 760.3 527.602 749.555 527.602 736.3V666.1H546.636Z"
+              fill="#D9D9D9"
+            />
+          </mask>
+        </g>
+        <defs>
+          <pattern
+            id="pattern0_2086_1513"
+            patternContentUnits="objectBoundingBox"
+            width="1"
+            height="1"
+          ></pattern>
+          <pattern
+            id="pattern1_2086_1513"
+            patternContentUnits="objectBoundingBox"
+            width="1"
+            height="1"
+          >
+            <use transform="translate(-0.131198 -0.126971) scale(0.00353698)" />
+          </pattern>
+          <clipPath id="clip0_2086_1513">
+            <rect
+              width="1152"
+              height="814"
+              fill="white"
+              transform="translate(0 0.499512)"
+            />
+          </clipPath>
+          <image id="image0_2086_1513" width="357" height="357" />
+          <image id="image1_2086_1513" width="360" height="360" />
+        </defs>
+      </svg>
+  <div style="
+      position: absolute;
+      top: 405px;
+      left: 135px;
+      width: 335px;
+      height: 50px;
+      background: transparent;
+      font-size: 28px;
+      font-weight: 700;
+      font-style: normal;
+      text-decoration: none;
+      text-align: center;
+      font-family: Pretendard, sans-serif;
+      color: black;
+      border: none;
+      padding: 0;
+      display: flex;
+      align-items: start;
+      justify-content: center;
+      padding-left: "0";
+      padding-right: "0";
+      word-break: break-word;
+      white-space: pre-wrap;
+    ">미세먼지 그만</div><div style="
+      position: absolute;
+      top: 86px;
+      left: 423px;
+      width: 90px;
+      height: 90px;
+      background: transparent;
+      font-size: 16px;
+      font-weight: 400;
+      font-style: normal;
+      text-decoration: none;
+      text-align: center;
+      font-family: Pretendard, sans-serif;
+      color: black;
+      border: none;
+      padding: 0;
+      display: flex;
+      align-items: start;
+      justify-content: center;
+      padding-left: "0";
+      padding-right: "0";
+      word-break: break-word;
+      white-space: pre-wrap;
+    "><img
+          src="https://ufcglnoegwgklehhpzlj.supabase.co/storage/v1/object/public/blockspoon_images/uploads/club/symbol/8a4656a6-eda5-4356-8240-155e70982e0e"
+          alt="Uploaded"
+          style="
+            width: 100%;
+            height: 100%;
+            max-width: 100%;
+            max-height: 100%;
+            object-fit: contain;
+            align-self: center;
+          "
+        /></div><div style="
+      position: absolute;
+      top: 172px;
+      left: 162px;
+      width: 279px;
+      height: 38px;
+      background: transparent;
+      font-size: 16px;
+      font-weight: 600;
+      font-style: normal;
+      text-decoration: none;
+      text-align: center;
+      font-family: Pretendard, sans-serif;
+      color: black;
+      border: none;
+      padding: 0;
+      display: flex;
+      align-items: start;
+      justify-content: center;
+      padding-left: "0";
+      padding-right: "0";
+      word-break: break-word;
+      white-space: pre-wrap;
+    ">· CERTIFICATE of COMPLETION ·</div><div style="
+      position: absolute;
+      top: 240px;
+      left: 125px;
+      width: 360px;
+      height: 120px;
+      background: transparent;
+      font-size: 48px;
+      font-weight: 700;
+      font-style: normal;
+      text-decoration: none;
+      text-align: center;
+      font-family: Pretendard, sans-serif;
+      color: black;
+      border: none;
+      padding: 0;
+      display: flex;
+      align-items: start;
+      justify-content: center;
+      padding-left: "0";
+      padding-right: "0";
+      word-break: break-word;
+      white-space: pre-wrap;
+    ">OpenApi 테스트 인증서</div>
+        </div>
+        </div>
+      </body>
+    </html>
+  

package/test/test.js

@@ -1,14 +1,10 @@
-const fs = require("fs");
-const {
-  generateAchievementHTML,
-} = require("../dist/utils/generateAchievementHTML");
-const {
-  generateAchievementFile,
-} = require("../dist/utils/generateAchievementFile");
-const fsPromises = require("fs").promises;
-const path = require("path");
-const { generateDesignHTML } = require("../dist/utils/generateDesignHTML");
-const { generateDesignFile } = require("../dist/utils/generateDesignFile");
+import fs from "fs";
+import fsPromises from "fs/promises";
+import path from "path";
+
+import { generateAchievementHTML } from "../dist/utils/generateAchievementHTML.js";
+import { generateDesignHTML } from "../dist/utils/generateDesignHTML.js";
+// const { generateDesignHTML } = require("../dist/utils/generateDesignHTML");
 
 const test_object = {
   statusCode: 200,
@@ -150,7 +146,7 @@ const testCertificateData = {
   achievementInfo: test_object.achievement,
 };
 const testOptions = {
-  type: "certificate",
+  type: "badge",
   size: 300,
   returnType: "base64",
 };
@@ -172,44 +168,47 @@ async function runTests() {
     // console.log("✅ PNG 변환 완료: test/certificate.png");
 
     // // HTML 변환 테스트
-    const htmlOutput = await generateAchievementHTML(testCertificateData.achievementInfo, {
-      type: "badge",
-      size: 300,
-      noSpace: false,
-      mainColor: "#322899",
-      subColor: "#7368E8",
-    });
+    const htmlOutput = await generateAchievementHTML(
+      testCertificateData.achievementInfo,
+      {
+        type: "certificate",
+        size: 300,
+        noSpace: false,
+        mainColor: "#322899",
+        subColor: "#7368E8",
+      }
+    );
     fs.writeFileSync("test/certificate.html", htmlOutput, "utf8");
     // console.log("✅ HTML 변환 완료: test/certificate.html");
 
     // PNG 변환 테스트
-    const pngResult = await generateAchievementFile(
-      testCertificateData.achievementInfo,
-      testOptions
-    );
+    // const pngResult = await generateAchievementFile(
+    //   testCertificateData.achievementInfo,
+    //   testOptions
+    // );
 
-    if (testOptions.returnType === "base64") {
-      console.log("✅ Base64 변환 완료");
-      // base64 문자열에서 data:image/png;base64, 부분 제거
-      const base64Data = pngResult.base64.replace(
-        /^data:image\/png;base64,/,
-        ""
-      );
-      // base64를 버퍼로 변환
-      const buffer = Buffer.from(base64Data, "base64");
-      // 이미지 파일로 저장
-      await fsPromises.writeFile(
-        path.join(__dirname, "certificate_base64.png"),
-        buffer
-      );
-      console.log("✅ Base64 이미지 저장 완료: test/certificate_base64.png");
-    } else {
-      await fsPromises.writeFile(
-        path.join(__dirname, "certificate.png"),
-        pngResult.buffer
-      );
-      console.log("✅ PNG 변환 완료: test/certificate.png");
-    }
+    // if (testOptions.returnType === "base64") {
+    //   console.log("✅ Base64 변환 완료");
+    //   // base64 문자열에서 data:image/png;base64, 부분 제거
+    //   const base64Data = pngResult.base64.replace(
+    //     /^data:image\/png;base64,/,
+    //     ""
+    //   );
+    //   // base64를 버퍼로 변환
+    //   const buffer = Buffer.from(base64Data, "base64");
+    //   // 이미지 파일로 저장
+    //   await fsPromises.writeFile(
+    //     path.join(__dirname, "certificate_base64.png"),
+    //     buffer
+    //   );
+    //   console.log("✅ Base64 이미지 저장 완료: test/certificate_base64.png");
+    // } else {
+    //   await fsPromises.writeFile(
+    //     path.join(__dirname, "certificate.png"),
+    //     pngResult.buffer
+    //   );
+    //   console.log("✅ PNG 변환 완료: test/certificate.png");
+    // }
   } catch (error) {
     console.error("❌ 테스트 실행 중 오류 발생:", error);
   }