@edu-tosel/design 1.0.77 → 1.0.78

package/card/template/ProgressCard/Large.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { widthSizes } from "../../../asset/sizes";
 import SVG from "../../../asset/SVG";
 import { cn } from "../../../util";
 import CardDesign from "../../design/Card.design";
@@ -31,12 +32,9 @@ export default function ProgressCardLG({ titles, checks, displays, theme, }) {
         positions: "absolute top-12 right-12",
         displays: "flex flex-col items-end gap-y-3",
     };
-    const occupied = [
-        checks.map((value) => !!value).length,
-        displays.length,
-    ].join("/");
+    const occupied = Math.round((checks.filter((value) => !!value).length / displays.length) * 100);
     return (_jsxs(CardDesign, { option: {
             width: "2xl",
             height: "2xs",
-        }, children: [_jsx("div", { className: cn(progressBox), children: displays.map(({ title }, index) => (_jsxs("div", { className: cn(stepBox(checks[index])), children: [_jsx("div", { children: title }), _jsx(SVG.Operation.Checked, { flag: checks[index], size: 25, theme: theme })] }, title))) }), _jsxs("div", { className: cn(titleBox), children: [_jsx("div", { className: `text-xl leading-none font-pretendard-bold ${text[theme ?? "green"]}`, children: titles.title }), _jsx("div", { className: "text-base leading-none", children: titles.subtitle })] }), _jsx("div", { className: "absolute bottom-0 left-0 bg-gray-light w-full h-2.5", children: _jsx("div", { className: `h-full w-${occupied} ${bg[theme ?? "green"]}` }) })] }));
+        }, children: [_jsx("div", { className: cn(progressBox), children: displays.map(({ title }, index) => (_jsxs("div", { className: cn(stepBox(checks[index])), children: [_jsx("div", { children: title }), _jsx(SVG.Operation.Checked, { flag: checks[index], size: 25, theme: theme })] }, title))) }), _jsxs("div", { className: cn(titleBox), children: [_jsx("div", { className: `text-xl leading-none font-pretendard-bold ${text[theme ?? "green"]}`, children: titles.title }), _jsx("div", { className: "text-base leading-none", children: titles.subtitle })] }), _jsx("div", { className: "absolute bottom-0 left-0 bg-gray-light w-full h-2.5", children: _jsx("div", { className: `h-full ${widthSizes[occupied]} ${bg[theme ?? "green"]}` }) })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edu-tosel/design",
-  "version": "1.0.77",
+  "version": "1.0.78",
   "description": "UI components for International TOSEL Committee",
   "keywords": [
     "jsx",

package/tailwind.config.ts

@@ -56,9 +56,10 @@ export default {
         "red-crimson": "#760023",
         "red-velvet": "#AC647A",
         "green-dark": "#105652",
-        "green-light": "#DFE6E5",
+        "green-light": "#DFE5E4",
         "blue-sky": "#44C5F3",
         "blue-navy": "#173A8B",
+        "blue-navy-light": "#E1E4EB",
         "blue-pastel": "#CED6E6",
         "violet-light": "#9979F6",
         "gray-light": "#F0F0F0",

package/version.txt

@@ -1 +1 @@
-1.0.77
+1.0.78