@tipp/ui 2.3.16 → 2.3.18

package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-body.cjs

@@ -766,13 +766,58 @@ var CircleChatIcon = React16.forwardRef(
 );
 CircleChatIcon.displayName = "CircleChatIcon";
 
+// src/icons/circle-file.tsx
+var React17 = __toESM(require("react"), 1);
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var CircleFileIcon = React17.forwardRef(
+  (_a, forwardedRef) => {
+    var _b = _a, { color = "currentColor" } = _b, props = __objRest(_b, ["color"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+      "svg",
+      __spreadProps(__spreadValues({
+        fill: "none",
+        height: "16",
+        viewBox: "0 0 16 16",
+        width: "16",
+        xmlns: "http://www.w3.org/2000/svg"
+      }, props), {
+        ref: forwardedRef,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { fill: color, height: "16", rx: "8", width: "16" }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            "rect",
+            {
+              fill: "white",
+              fillOpacity: "0.01",
+              height: "12",
+              transform: "translate(2 2)",
+              width: "12"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            "path",
+            {
+              clipRule: "evenodd",
+              d: "M4.39998 4.00005C4.39998 3.77914 4.57906 3.60005 4.79998 3.60005H9.26861C9.37469 3.60005 9.47643 3.64219 9.55145 3.71721L11.4829 5.64858C11.5578 5.72359 11.6 5.82534 11.6 5.93142V12C11.6 12.2209 11.4209 12.4 11.2 12.4H4.79998C4.57906 12.4 4.39998 12.2209 4.39998 12V4.00005ZM4.79998 2.80005C4.13723 2.80005 3.59998 3.3373 3.59998 4.00005V12C3.59998 12.6628 4.13723 13.2 4.79998 13.2H11.2C11.8627 13.2 12.4 12.6628 12.4 12V5.93142C12.4 5.61316 12.2736 5.30794 12.0485 5.08289L10.1171 3.15152C9.89209 2.92648 9.58686 2.80005 9.26861 2.80005H4.79998ZM5.59998 5.20005C5.37906 5.20005 5.19998 5.37914 5.19998 5.60005C5.19998 5.82096 5.37906 6.00005 5.59998 6.00005H7.99998C8.22089 6.00005 8.39998 5.82096 8.39998 5.60005C8.39998 5.37914 8.22089 5.20005 7.99998 5.20005H5.59998ZM5.59998 7.60005C5.37906 7.60005 5.19998 7.77914 5.19998 8.00005C5.19998 8.22096 5.37906 8.40005 5.59998 8.40005H10.4C10.6209 8.40005 10.8 8.22096 10.8 8.00005C10.8 7.77914 10.6209 7.60005 10.4 7.60005H5.59998ZM5.59998 10C5.37906 10 5.19998 10.1792 5.19998 10.4C5.19998 10.6209 5.37906 10.8 5.59998 10.8H10.4C10.6209 10.8 10.8 10.6209 10.8 10.4C10.8 10.1792 10.6209 10 10.4 10H5.59998Z",
+              fill: "white",
+              fillRule: "evenodd"
+            }
+          )
+        ]
+      })
+    );
+  }
+);
+CircleFileIcon.displayName = "CircleFileIcon";
+
 // src/utils/curriculum.utils.ts
 var CurriculumListIcons = {
   pencil: CirclePencilIcon,
   video: CirclePlayIcon,
   quote: CircleQuoteIcon,
   check: CircleCheckIcon,
-  star: CircleSatisfactionIcon
+  star: CircleSatisfactionIcon,
+  file: CircleFileIcon
 };
 var getCurriculumIcon = ({
   type,
@@ -793,6 +838,8 @@ var getCurriculumIcon = ({
       return CircleSatisfactionIcon;
     case "aiTraining":
       return CircleChatIcon;
+    case "fileDownload":
+      return CircleFileIcon;
     case "review":
     default:
       return CirclePencilIcon;
@@ -810,7 +857,7 @@ var getCurriculumQuestionIconColor = (type) => {
 };
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-comp.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function ReviewQuestionContentHeader({
   type,
   title,
@@ -818,9 +865,9 @@ function ReviewQuestionContentHeader({
   icon
 }) {
   const Icon = getCurriculumIcon({ type, icon });
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_themes.Box, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_themes4.Flex, { gap: "2", mb: "3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_themes.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_themes.Box, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_themes4.Flex, { gap: "2", mb: "3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         Icon,
         {
           color: getCurriculumQuestionIconColor(type),
@@ -828,14 +875,14 @@ function ReviewQuestionContentHeader({
           width: "16"
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Typo, { color: "gray", weight: "bold", children: title })
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typo, { color: "gray", weight: "bold", children: title })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Typo, { as: "p", color: "gray", children: question })
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typo, { as: "p", color: "gray", children: question })
   ] });
 }
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-radio.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var correctAnswerStyle = {
   backgroundColor: "var(--green-a2)"
 };
@@ -852,8 +899,8 @@ function ReviewQuestionRadio(props) {
     if (isWrong) return "red";
     return void 0;
   }, [isCorrect, isWrong]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_themes5.Grid, { height: "100%", rows: "auto 1fr", width: "100%", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Card, { mb: "4", size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_themes5.Grid, { height: "100%", rows: "auto 1fr", width: "100%", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Card, { mb: "4", size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       ReviewQuestionContentHeader,
       {
         icon: question.icon,
@@ -862,8 +909,8 @@ function ReviewQuestionRadio(props) {
         type: question.type
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_themes5.Grid, { height: "100%", rows: "1fr auto", width: "100%", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes.Box, { position: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_themes5.Grid, { height: "100%", rows: "1fr auto", width: "100%", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes.Box, { position: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         RadioButtonCard.Root,
         {
           color: radioColor,
@@ -875,7 +922,7 @@ function ReviewQuestionRadio(props) {
             position: "absolute"
           },
           value: answer,
-          children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes4.Flex, { direction: "column", gap: "2", width: "100%", children: question.options.map((option, i) => {
+          children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes4.Flex, { direction: "column", gap: "2", width: "100%", children: question.options.map((option, i) => {
             const isThisOptionCorrect = isCheckAnswer && i === question.correctAnswer;
             const isThisOptionSelected = isCheckAnswer && i === Number(answer);
             const isThisOptionWrong = isCheckAnswer && isThisOptionSelected && i !== question.correctAnswer;
@@ -883,15 +930,15 @@ function ReviewQuestionRadio(props) {
               if (isThisOptionCorrect) return correctAnswerStyle;
               return {};
             })();
-            return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
               RadioButtonCard.Item,
               {
                 style,
                 value: i.toString(),
-                children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_themes.Box, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typo, { as: "p", children: option.label }),
-                  isThisOptionCorrect ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typo, { color: "green", children: "\uC815\uB2F5\uC785\uB2C8\uB2E4" }) : null,
-                  isThisOptionWrong ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typo, { color: "red", children: "\uC815\uB2F5\uC774 \uC544\uB2D9\uB2C8\uB2E4" }) : null
+                children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_themes.Box, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typo, { as: "p", children: option.label }),
+                  isThisOptionCorrect ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typo, { color: "green", children: "\uC815\uB2F5\uC785\uB2C8\uB2E4" }) : null,
+                  isThisOptionWrong ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typo, { color: "red", children: "\uC815\uB2F5\uC774 \uC544\uB2D9\uB2C8\uB2E4" }) : null
                 ] })
               },
               `${option.label}-${i}`
@@ -899,7 +946,7 @@ function ReviewQuestionRadio(props) {
           }) })
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes4.Flex, { justify: "end", mt: "2", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Button, { onClick: checkAnswer, children: "\uC815\uB2F5 \uD655\uC778" }) })
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes4.Flex, { justify: "end", mt: "2", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { onClick: checkAnswer, children: "\uC815\uB2F5 \uD655\uC778" }) })
     ] })
   ] });
 }
@@ -908,7 +955,7 @@ var review_question_radio_default = ReviewQuestionRadio;
 // src/atoms/text-area.tsx
 var import_themes9 = require("@radix-ui/themes");
 var import_react6 = require("react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var TextArea = (0, import_react6.forwardRef)(
   (props, ref) => {
     const _a = props, { error, style, className } = _a, rest = __objRest(_a, ["error", "style", "className"]);
@@ -920,7 +967,7 @@ var TextArea = (0, import_react6.forwardRef)(
       return __spreadValues(__spreadValues({}, style || {}), errorStyle);
     }, [error, style]);
     const classNameStr = error ? `error ${className}` : className;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       import_themes9.TextArea,
       __spreadProps(__spreadValues({}, rest), {
         className: classNameStr,
@@ -936,12 +983,12 @@ TextArea.displayName = "TextArea";
 var import_themes10 = require("@radix-ui/themes");
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-text.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function ReviewQuestionText(props) {
   const { question, answer, onChange } = props;
   const minLengthNotMet = question.minLength && answer.length < question.minLength;
   const remainingLength = question.minLength && answer.length < question.minLength ? question.minLength - answer.length : 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     Card,
     {
       size: "2",
@@ -949,9 +996,9 @@ function ReviewQuestionText(props) {
         width: "100%",
         height: "100%"
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_themes5.Grid, { height: "100%", rows: "1fr auto", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_themes5.Grid, { height: "100%", rows: "auto 1fr", width: "100%", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_themes5.Grid, { height: "100%", rows: "1fr auto", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_themes5.Grid, { height: "100%", rows: "auto 1fr", width: "100%", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             ReviewQuestionContentHeader,
             {
               icon: question.icon,
@@ -960,7 +1007,7 @@ function ReviewQuestionText(props) {
               type: question.type
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             TextArea,
             {
               mt: "2",
@@ -972,17 +1019,17 @@ function ReviewQuestionText(props) {
             }
           )
         ] }),
-        minLengthNotMet ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_themes.Box, { mt: "2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typo, { align: "right", as: "p", color: "red", variant: "caption", children: `${remainingLength}\uC790 \uB354 \uC791\uC131\uD574\uC8FC\uC138\uC694.` }),
-          question.minLengthInfoMessage ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+        minLengthNotMet ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_themes.Box, { mt: "2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Typo, { align: "right", as: "p", color: "red", variant: "caption", children: `${remainingLength}\uC790 \uB354 \uC791\uC131\uD574\uC8FC\uC138\uC694.` }),
+          question.minLengthInfoMessage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
             import_themes10.Callout.Root,
             {
               color: "iris",
               mt: "2",
               style: { alignItems: "center" },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_themes10.Callout.Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_icons.BellIcon, {}) }),
-                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_themes10.Callout.Text, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typo, { as: "p", variant: "caption", children: question.minLengthInfoMessage }) })
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes10.Callout.Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_icons.BellIcon, {}) }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes10.Callout.Text, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Typo, { as: "p", variant: "caption", children: question.minLengthInfoMessage }) })
               ]
             }
           ) : null
@@ -997,12 +1044,12 @@ var review_question_text_default = ReviewQuestionText;
 var import_themes11 = require("@radix-ui/themes");
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-satisfaction-option.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function ReviewQuestionSatisfisRadio(props) {
   var _a, _b, _c;
   const { question, answer, onChange } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Card, { size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Card, { size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       ReviewQuestionContentHeader,
       {
         icon: question.icon,
@@ -1011,18 +1058,18 @@ function ReviewQuestionSatisfisRadio(props) {
         type: question.type
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes11.RadioGroup.Root, { color: "iris", mt: "3", onValueChange: onChange, value: answer, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes4.Flex, { direction: "column", gap: "2", children: (_c = question.options) == null ? void 0 : _c.map((option) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes11.RadioGroup.Item, { value: String(option.value), children: option.label }, option.value)) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_themes11.RadioGroup.Root, { color: "iris", mt: "3", onValueChange: onChange, value: answer, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_themes4.Flex, { direction: "column", gap: "2", children: (_c = question.options) == null ? void 0 : _c.map((option) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_themes11.RadioGroup.Item, { value: String(option.value), children: option.label }, option.value)) }) })
   ] });
 }
 var review_question_satisfaction_option_default = ReviewQuestionSatisfisRadio;
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-satisfaction-text.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function ReviewQuestionSatisfisText(props) {
   var _a, _b;
   const { question, answer, onChange } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Card, { size: "2", style: { height: "100%", width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_themes5.Grid, { height: "100%", rows: "auto 1fr", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Card, { size: "2", style: { height: "100%", width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_themes5.Grid, { height: "100%", rows: "auto 1fr", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       ReviewQuestionContentHeader,
       {
         icon: question.icon,
@@ -1031,7 +1078,7 @@ function ReviewQuestionSatisfisText(props) {
         type: question.type
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       TextArea,
       {
         mt: "2",
@@ -1049,11 +1096,11 @@ function ReviewQuestionSatisfisText(props) {
 }
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-body.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function ReviewQuestionBody(props) {
   const { question, answer, error, onChange } = props;
   if (question.type === "question_radio") {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       review_question_radio_default,
       {
         answer,
@@ -1064,7 +1111,7 @@ function ReviewQuestionBody(props) {
     );
   }
   if (question.type === "question_text") {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       review_question_text_default,
       {
         answer,
@@ -1075,7 +1122,7 @@ function ReviewQuestionBody(props) {
     );
   }
   if (question.type === "question_satisfaction_option") {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       review_question_satisfaction_option_default,
       {
         answer,
@@ -1086,7 +1133,7 @@ function ReviewQuestionBody(props) {
     );
   }
   if (question.type === "question_satisfaction_text") {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       ReviewQuestionSatisfisText,
       {
         answer,