@tipp/ui 2.1.2 → 2.1.4

package/dist/molecules/index.cjs

@@ -59,6 +59,11 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/molecules/index.ts
 var molecules_exports = {};
 __export(molecules_exports, {
+  CurriculumContents: () => CurriculumContents,
+  CurriculumProvider: () => CurriculumProvider,
+  CurriculumSidebar: () => CurriculumSidebar,
+  CurriculumSubNav: () => CurriculumSubNav,
+  CurriculumV2Layout: () => CurriculumV2Layout,
   DatePicker: () => DatePicker,
   DatePickerButton: () => DatePickerButton,
   DotNavigation: () => DotNavigation,
@@ -72,7 +77,8 @@ __export(molecules_exports, {
   Stepper: () => Stepper,
   TagSelector: () => TagSelector,
   TimeSelect: () => TimeSelect,
-  createColumnHelper: () => import_react_table2.createColumnHelper
+  createColumnHelper: () => import_react_table2.createColumnHelper,
+  useCurriculumContext: () => useCurriculumContext
 });
 module.exports = __toCommonJS(molecules_exports);
 
@@ -341,6 +347,14 @@ var import_jsx_runtime7 = require("react/jsx-runtime");
 var PortalContext = (0, import_react7.createContext)(
   null
 );
+var usePortalContainer = () => {
+  try {
+    const state = (0, import_react7.useContext)(PortalContext);
+    return state;
+  } catch (error) {
+    throw new Error("PortalProvider not found");
+  }
+};
 
 // src/atoms/heading.tsx
 var import_themes16 = require("@radix-ui/themes");
@@ -399,12 +413,93 @@ var import_themes18 = require("@radix-ui/themes");
 
 // src/atoms/dialog.tsx
 var import_jsx_runtime9 = require("react/jsx-runtime");
+var preventDefault = (e) => {
+  e.preventDefault();
+};
+function Content2(props) {
+  const _a = props, {
+    children,
+    style = {},
+    width,
+    maxWidth,
+    minWidth,
+    maxHeight,
+    height,
+    minHeight,
+    title,
+    buttons,
+    hideCloseButton,
+    className
+  } = _a, rest = __objRest(_a, [
+    "children",
+    "style",
+    "width",
+    "maxWidth",
+    "minWidth",
+    "maxHeight",
+    "height",
+    "minHeight",
+    "title",
+    "buttons",
+    "hideCloseButton",
+    "className"
+  ]);
+  const { dialogContainerRef } = usePortalContainer();
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Portal, { container: dialogContainerRef.current, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_themes19.Theme, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Overlay, { className: "DialogOverlay", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    RadixDialog.Content,
+    __spreadProps(__spreadValues({
+      className: `DialogContent ${className || ""}`,
+      onPointerDownOutside: preventDefault,
+      style: __spreadValues({
+        width,
+        maxWidth,
+        minWidth,
+        maxHeight,
+        height,
+        minHeight
+      }, style)
+    }, rest), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_themes19.Flex, { gap: "2", justify: "between", width: "100%", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Title, { asChild: true, children: typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Heading2, { mb: "2", variant: "heading3", children: title }) : title }),
+          !hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Close, { asChild: true, className: "DialogClose", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_themes18.IconButton, { color: "gray", variant: "ghost", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_icons.Cross1Icon, {}) }) })
+        ] }),
+        children,
+        buttons ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_themes19.Flex, { gap: "3", justify: "end", mt: "3", width: "100%", children: buttons }) : null
+      ]
+    })
+  ) }) }) });
+}
+function Close2(_a) {
+  var _b = _a, {
+    children
+  } = _b, rest = __objRest(_b, [
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Close, __spreadProps(__spreadValues({ asChild: true }, rest), { children }));
+}
+function Trigger2(_a) {
+  var _b = _a, {
+    children
+  } = _b, rest = __objRest(_b, [
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Trigger, __spreadProps(__spreadValues({ asChild: true }, rest), { children }));
+}
+var Dialog = {
+  Root: RadixDialog.Root,
+  Trigger: Trigger2,
+  Content: Content2,
+  Close: Close2,
+  Description: RadixDialog.Description,
+  Title: RadixDialog.Title
+};
 
 // src/atoms/dropdown-menu.tsx
 var import_themes20 = require("@radix-ui/themes");
 var import_react9 = require("react");
 var import_jsx_runtime10 = require("react/jsx-runtime");
-var Content2 = (0, import_react9.forwardRef)((props, ref) => {
+var Content3 = (0, import_react9.forwardRef)((props, ref) => {
   const _a = props, { isNavigation, className } = _a, rest = __objRest(_a, ["isNavigation", "className"]);
   const contentClassName = (0, import_react9.useMemo)(() => {
     const cls = isNavigation ? "dropdown-navigation" : "";
@@ -419,9 +514,9 @@ var Content2 = (0, import_react9.forwardRef)((props, ref) => {
     })
   );
 });
-Content2.displayName = "DropdownMenu.Content";
+Content3.displayName = "DropdownMenu.Content";
 var DropdownMenu = __spreadProps(__spreadValues({}, import_themes20.DropdownMenu), {
-  Content: Content2
+  Content: Content3
 });
 
 // src/atoms/em.tsx
@@ -498,7 +593,7 @@ var import_jsx_runtime12 = require("react/jsx-runtime");
 var SelectContext = (0, import_react11.createContext)({
   error: false
 });
-var Content3 = (0, import_react11.forwardRef)((props, ref) => {
+var Content4 = (0, import_react11.forwardRef)((props, ref) => {
   const _a = props, { className, isNavigation } = _a, rest = __objRest(_a, ["className", "isNavigation"]);
   const { error } = (0, import_react11.useContext)(SelectContext);
   const cls = (0, import_react11.useMemo)(() => {
@@ -516,8 +611,8 @@ var Content3 = (0, import_react11.forwardRef)((props, ref) => {
     })
   );
 });
-Content3.displayName = "Select.Content";
-var Trigger2 = (0, import_react11.forwardRef)(
+Content4.displayName = "Select.Content";
+var Trigger3 = (0, import_react11.forwardRef)(
   (props, ref) => {
     const _a = props, { className } = _a, rest = __objRest(_a, ["className"]);
     const { error } = (0, import_react11.useContext)(SelectContext);
@@ -528,7 +623,7 @@ var Trigger2 = (0, import_react11.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_themes38.Select.Trigger, __spreadProps(__spreadValues({}, rest), { className: cls, ref }));
   }
 );
-Trigger2.displayName = "Select.Trigger";
+Trigger3.displayName = "Select.Trigger";
 function Root3(props) {
   const _a = props, { error } = _a, rest = __objRest(_a, ["error"]);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectContext.Provider, { value: { error }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_themes38.Select.Root, __spreadValues({}, rest)) });
@@ -536,8 +631,8 @@ function Root3(props) {
 Root3.displayName = "Select.Root";
 var Select = __spreadProps(__spreadValues({}, import_themes38.Select), {
   Root: Root3,
-  Trigger: Trigger2,
-  Content: Content3
+  Trigger: Trigger3,
+  Content: Content4
 });
 
 // src/atoms/separator.tsx
@@ -1212,7 +1307,7 @@ var import_react17 = require("react");
 var import_jsx_runtime31 = require("react/jsx-runtime");
 
 // src/atoms/drawer.tsx
-var Dialog = __toESM(require("@radix-ui/react-dialog"), 1);
+var Dialog2 = __toESM(require("@radix-ui/react-dialog"), 1);
 var import_themes50 = require("@radix-ui/themes");
 
 // src/icons/close-panel-arrow.tsx
@@ -2234,7 +2329,7 @@ function TagSelector(props) {
     /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
       import_themes29.Popover.Content,
       {
-        onOpenAutoFocus: preventDefault,
+        onOpenAutoFocus: preventDefault2,
         onTouchMove: stopPropagationTouch,
         onWheel: stopPropagationWheel,
         sticky: "always",
@@ -2290,7 +2385,7 @@ var stopPropagationTouch = (e) => {
 var stopPropagationWheel = (e) => {
   e.stopPropagation();
 };
-var preventDefault = (e) => {
+var preventDefault2 = (e) => {
   e.preventDefault();
 };
 
@@ -2716,8 +2811,1485 @@ function GhostPost(props) {
     })
   );
 }
+
+// src/molecules/curriculumV2/curriculum-context.tsx
+var import_react29 = require("react");
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var CurriculumContext = (0, import_react29.createContext)(
+  void 0
+);
+function CurriculumProvider(props) {
+  var _a;
+  const {
+    children,
+    curriculum,
+    onReviewSubmit,
+    onReviewValueChange,
+    curriculumReviewAnswers,
+    tempCurriculumReviewAnswers,
+    curriculumCompleteMap
+  } = props;
+  const sidebarRef = (0, import_react29.useRef)(null);
+  const scrollNavItem = (0, import_react29.useCallback)((index) => {
+    var _a2;
+    const element = (_a2 = sidebarRef.current) == null ? void 0 : _a2.querySelector(
+      `[data-curriculum-item-index="${index}"]`
+    );
+    if (element) {
+      element.scrollIntoView({ behavior: "smooth", block: "start" });
+    }
+  }, []);
+  const list = curriculum.contents.list;
+  const selectableIndexes = (0, import_react29.useMemo)(
+    () => list.map((item, i) => item.type !== "sectionTitle" ? i : null).filter((i) => i !== null),
+    [list]
+  );
+  const [selectedIndexState, setSelectedIndexState] = (0, import_react29.useState)(
+    (_a = selectableIndexes[0]) != null ? _a : 0
+  );
+  const setSelectedIndex = (0, import_react29.useCallback)(
+    (idx) => {
+      if (selectableIndexes.includes(idx)) {
+        setSelectedIndexState(idx);
+      } else {
+        const next = selectableIndexes.find((i) => i > idx);
+        const prev = [...selectableIndexes].reverse().find((i) => i < idx);
+        if (next !== void 0) setSelectedIndexState(next);
+        else if (prev !== void 0) setSelectedIndexState(prev);
+      }
+    },
+    [selectableIndexes]
+  );
+  const selectablePos = (0, import_react29.useMemo)(
+    () => selectableIndexes.indexOf(selectedIndexState),
+    [selectableIndexes, selectedIndexState]
+  );
+  const hasPrev = selectablePos > 0;
+  const hasNext = selectablePos < selectableIndexes.length - 1;
+  const selectPrev = (0, import_react29.useCallback)(
+    (cb) => {
+      setSelectedIndexState((cur) => {
+        let prevIndex = cur;
+        const pos = selectableIndexes.indexOf(cur);
+        if (pos > 0) {
+          prevIndex = selectableIndexes[pos - 1];
+        }
+        if (cb) cb(prevIndex);
+        return prevIndex;
+      });
+    },
+    [selectableIndexes]
+  );
+  const selectNext = (0, import_react29.useCallback)(
+    (cb) => {
+      setSelectedIndexState((cur) => {
+        let nextIndex = cur;
+        const pos = selectableIndexes.indexOf(cur);
+        if (pos < selectableIndexes.length - 1) {
+          nextIndex = selectableIndexes[pos + 1];
+        }
+        if (cb) cb(nextIndex);
+        return nextIndex;
+      });
+    },
+    [selectableIndexes]
+  );
+  const selectedId = (0, import_react29.useMemo)(
+    () => {
+      var _a2, _b;
+      return (_b = (_a2 = list[selectedIndexState]) == null ? void 0 : _a2.uuid) != null ? _b : "";
+    },
+    [list, selectedIndexState]
+  );
+  const selectedSectionTitle = (0, import_react29.useMemo)(() => {
+    var _a2;
+    const prevItems = list.slice(0, selectedIndexState).reverse();
+    return (_a2 = prevItems.find((item) => item.type === "sectionTitle")) != null ? _a2 : null;
+  }, [list, selectedIndexState]);
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(CurriculumContext.Provider, { value: {
+    curriculum,
+    scrollNavItem,
+    selectedIndex: selectedIndexState,
+    setSelectedIndex,
+    selectedId,
+    hasPrev,
+    hasNext,
+    selectPrev,
+    selectNext,
+    selectedSectionTitle,
+    selectedItem: list[selectedIndexState],
+    scrollAreaRef: sidebarRef,
+    onReviewSubmit,
+    onReviewValueChange,
+    curriculumReviewAnswers,
+    tempCurriculumReviewAnswers,
+    curriculumCompleteMap
+  }, children });
+}
+function useCurriculumContext() {
+  const ctx = (0, import_react29.useContext)(CurriculumContext);
+  if (!ctx)
+    throw new Error(
+      "useCurriculumContext must be used within CurriculumProvider"
+    );
+  return ctx;
+}
+
+// src/molecules/curriculumV2/curriculum-sub-nav.tsx
+var import_react30 = require("react");
+var import_jsx_runtime54 = require("react/jsx-runtime");
+function CurriculumSubNav() {
+  const {
+    selectedItem,
+    selectedSectionTitle,
+    hasPrev,
+    hasNext,
+    selectPrev,
+    selectNext,
+    scrollNavItem
+  } = useCurriculumContext();
+  const onClickPrev = (0, import_react30.useCallback)(() => {
+    selectPrev((moveIndex) => {
+      scrollNavItem(moveIndex.toString());
+    });
+  }, [selectPrev, scrollNavItem]);
+  const onClickNext = (0, import_react30.useCallback)(() => {
+    selectNext((moveIndex) => {
+      scrollNavItem(moveIndex.toString());
+    });
+  }, [selectNext, scrollNavItem]);
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
+    import_themes23.Grid,
+    {
+      align: "center",
+      columns: { initial: "32px 1fr 32px", md: "48px 1fr 48px" },
+      pb: { initial: "2", md: "3" },
+      px: { initial: "1", md: "2" },
+      py: "2",
+      rows: "auto",
+      children: [
+        hasPrev ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+          import_themes18.IconButton,
+          {
+            color: "gray",
+            onClick: onClickPrev,
+            size: { initial: "3", md: "4" },
+            variant: "ghost",
+            children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_icons2.ChevronLeftIcon, { height: "16px", width: "16px" })
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes6.Box, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_themes6.Box, { width: "100%", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Heading2, { style: { textOverflow: "ellipsis" }, variant: "heading4", children: selectedItem.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Typo, { as: "p", color: "gray", style: { textOverflow: "ellipsis" }, children: selectedSectionTitle == null ? void 0 : selectedSectionTitle.title })
+        ] }),
+        hasNext ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+          import_themes18.IconButton,
+          {
+            color: "gray",
+            onClick: onClickNext,
+            size: { initial: "3", md: "4" },
+            variant: "ghost",
+            children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_icons2.ChevronRightIcon, { height: "16px", width: "16px" })
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes6.Box, {})
+      ]
+    }
+  );
+}
+
+// src/molecules/curriculumV2/CurriculumContents/curriculum-video.tsx
+var import_react31 = require("react");
+var import_jsx_runtime55 = require("react/jsx-runtime");
+function CurriculumVideo(props) {
+  const { item } = props;
+  const { url } = item;
+  const [isLoading, setIsLoading] = (0, import_react31.useState)(true);
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+    import_themes22.Flex,
+    {
+      align: "center",
+      justify: "center",
+      style: {
+        width: "100%",
+        height: "100%",
+        backgroundColor: "black",
+        position: "relative"
+      },
+      children: [
+        isLoading ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          import_themes22.Flex,
+          {
+            align: "center",
+            height: "100%",
+            justify: "center",
+            position: "absolute",
+            style: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              zIndex: 1,
+              color: "white"
+            },
+            width: "100%",
+            children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes49.Spinner, { size: "3", style: { width: 48, height: 48 } })
+          }
+        ) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          "iframe",
+          {
+            allowFullScreen: true,
+            onLoad: () => {
+              setIsLoading(false);
+            },
+            src: `${url}?theme=light`,
+            style: { width: "100%", height: "100%", border: "none" },
+            title: "Curriculum Video",
+            onError: () => {
+              setIsLoading(false);
+            }
+          }
+        )
+      ]
+    }
+  );
+}
+var curriculum_video_default = CurriculumVideo;
+
+// src/molecules/curriculumV2/CurriculumContents/curriculum-review.tsx
+var import_react34 = require("react");
+var import_react_icons8 = require("@radix-ui/react-icons");
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/curriculum-review-context.tsx
+var import_react32 = require("react");
+var import_formik = require("formik");
+var import_lodash_es = require("lodash-es");
+var Yup = __toESM(require("yup"), 1);
+var import_jsx_runtime56 = require("react/jsx-runtime");
+var CurriculumReviewContext = (0, import_react32.createContext)(void 0);
+function getInitialAnswers(defaultValues, questions) {
+  return questions.reduce((acc, q) => {
+    var _a;
+    acc[q.uuid] = (_a = defaultValues[q.uuid]) != null ? _a : "";
+    return acc;
+  }, {});
+}
+function createAnswersYupSchema(questions) {
+  const shape = {};
+  questions.forEach((q) => {
+    let schema = Yup.string().defined();
+    if (q.required) {
+      if (q.type === "question_text" || q.type === "question_satisfaction_text") {
+        schema = schema.required(`${q.title}\uC740(\uB294) \uD544\uC218 \uC785\uB825 \uD56D\uBAA9\uC785\uB2C8\uB2E4.`).trim();
+        if (q.minLength) {
+          schema = schema.min(
+            q.minLength,
+            `${q.title}\uC740(\uB294) \uCD5C\uC18C ${q.minLength}\uC790 \uC774\uC0C1 \uC785\uB825\uD574\uC57C \uD569\uB2C8\uB2E4.`
+          );
+        }
+      } else {
+        schema = schema.required(`${q.title}\uC744(\uB97C) \uC120\uD0DD\uD574 \uC8FC\uC138\uC694.`).min(1, `${q.title}\uC744(\uB97C) \uC120\uD0DD\uD574 \uC8FC\uC138\uC694.`);
+      }
+    }
+    shape[q.uuid] = schema;
+  });
+  return Yup.object().shape(shape);
+}
+function CurriculumReviewProvider({
+  reviewContents: _reviewContents,
+  sectionTitle,
+  children,
+  onClickEndReview,
+  onSubmit,
+  defaultValues,
+  curriculum,
+  onReviewValueChange,
+  done
+}) {
+  const fixedReviewContents = (0, import_react32.useMemo)(() => {
+    const result = (0, import_lodash_es.cloneDeep)(_reviewContents);
+    result.questions = result.questions.map((question) => {
+      if (question.type === "question_satisfaction_option") {
+        return __spreadValues(__spreadValues({}, curriculum.contents.satisfactionOptionMeta), question);
+      }
+      if (question.type === "question_satisfaction_text") {
+        return __spreadValues(__spreadValues({}, curriculum.contents.satisfactionTextMeta), question);
+      }
+      return question;
+    });
+    return result;
+  }, [
+    curriculum.contents.satisfactionOptionMeta,
+    curriculum.contents.satisfactionTextMeta,
+    _reviewContents
+  ]);
+  const [step, setStep] = (0, import_react32.useState)(0);
+  const answersYupSchema = (0, import_react32.useMemo)(
+    () => createAnswersYupSchema(fixedReviewContents.questions),
+    [fixedReviewContents.questions]
+  );
+  const formik = (0, import_formik.useFormik)({
+    initialValues: {
+      answers: getInitialAnswers(defaultValues != null ? defaultValues : {}, fixedReviewContents.questions)
+    },
+    validationSchema: Yup.object({
+      answers: answersYupSchema
+    }),
+    onSubmit: (values) => {
+      const result = onSubmit(values.answers);
+      return result.then((isSuccess) => {
+        if (isSuccess) {
+          setStep((prev) => prev + 1);
+        }
+        return isSuccess;
+      });
+    },
+    enableReinitialize: true,
+    validateOnMount: true,
+    validateOnChange: true
+  });
+  const questions = fixedReviewContents.questions;
+  const handleStart = (0, import_react32.useCallback)(() => {
+    setStep(1);
+  }, []);
+  const handleNext = (0, import_react32.useCallback)(() => {
+    if (step < questions.length) {
+      setStep(step + 1);
+    } else {
+      formik.handleSubmit();
+      setStep(questions.length + 1);
+    }
+  }, [step, questions.length, formik]);
+  const handlePrev = (0, import_react32.useCallback)(() => {
+    if (step > 1) {
+      setStep(step - 1);
+    }
+  }, [step]);
+  const onClickReviewMyAnswer = (0, import_react32.useCallback)(() => {
+    setStep(1);
+  }, []);
+  const handleSubmit = (0, import_react32.useCallback)(() => {
+    formik.handleSubmit();
+  }, [formik]);
+  const currentQuestion = (0, import_react32.useMemo)(() => {
+    return step > 0 && step <= questions.length ? questions[step - 1] : void 0;
+  }, [step, questions]);
+  const currentAnswer = (0, import_react32.useMemo)(() => {
+    return currentQuestion ? formik.values.answers[currentQuestion.uuid] : "";
+  }, [currentQuestion, formik.values.answers]);
+  const currentError = (0, import_react32.useMemo)(() => {
+    return currentQuestion && formik.errors.answers && formik.errors.answers[currentQuestion.uuid];
+  }, [currentQuestion, formik.errors.answers]);
+  const handleAnswerChange = (0, import_react32.useCallback)(
+    (value) => {
+      if (currentQuestion) {
+        void formik.setFieldValue(`answers.${currentQuestion.uuid}`, value);
+      }
+    },
+    [currentQuestion, formik]
+  );
+  (0, import_react32.useEffect)(() => {
+    if (currentQuestion) {
+      onReviewValueChange({
+        reviewId: currentQuestion.uuid,
+        answer: formik.values.answers
+      });
+    }
+  }, [currentQuestion == null ? void 0 : currentQuestion.uuid, currentAnswer, onReviewValueChange]);
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+    CurriculumReviewContext.Provider,
+    {
+      value: {
+        reviewContents: fixedReviewContents,
+        formik,
+        curriculum,
+        sectionTitle,
+        onClickEndReview,
+        step,
+        setStep,
+        handleStart,
+        handleNext,
+        handlePrev,
+        onClickReviewMyAnswer,
+        handleSubmit,
+        currentQuestion,
+        currentAnswer,
+        currentError,
+        handleAnswerChange,
+        done
+      },
+      children
+    }
+  );
+}
+function useCurriculumReviewContext() {
+  const context = (0, import_react32.useContext)(CurriculumReviewContext);
+  if (!context) {
+    throw new Error(
+      "useCurriculumReviewContext must be used within a CurriculumReviewProvider"
+    );
+  }
+  return context;
+}
+
+// src/molecules/curriculumV2/curriculum.utils.ts
+var CurriculumListIcons = {
+  pencil: CirclePencilIcon,
+  video: CirclePlayIcon,
+  quote: CircleQuoteIcon,
+  check: CircleCheckIcon,
+  star: CircleSatisfactionIcon
+};
+var getCurriculumIcon = ({
+  type,
+  icon
+}) => {
+  if (icon && Object.prototype.hasOwnProperty.call(CurriculumListIcons, icon)) {
+    return CurriculumListIcons[icon];
+  }
+  switch (type) {
+    case "video":
+      return CirclePlayIcon;
+    case "question_text":
+      return CircleQuoteIcon;
+    case "question_radio":
+      return CircleCheckIcon;
+    case "question_satisfaction_option":
+    case "question_satisfaction_text":
+      return CircleSatisfactionIcon;
+    case "review":
+    default:
+      return CirclePencilIcon;
+  }
+};
+var getCurriculumIconColor = ({
+  done = false,
+  selected = false
+}) => {
+  if (selected) {
+    return "#D5AE39";
+  }
+  if (done) {
+    return "#30A46C";
+  }
+  return "#D9D9E0";
+};
+var getCurriculumQuestionIconColor = (type) => {
+  switch (type) {
+    case "question_text":
+      return "#D5AE39";
+    case "question_radio":
+      return "#30A46C";
+    default:
+      return "#D9D9E0";
+  }
+};
+var getCurriculumQuestionTypeDescription = (type) => {
+  switch (type) {
+    case "question_text":
+      return "\uC8FC\uAD00\uC2DD";
+    case "question_radio":
+      return "\uAC1D\uAD00\uC2DD";
+    default:
+      return "";
+  }
+};
+var getCurriculumContentSubTypeText = (type) => {
+  switch (type) {
+    case "video":
+      return "\uC601\uC0C1";
+    case "review":
+      return "\uB9AC\uBDF0";
+    default:
+      return "";
+  }
+};
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/start-review.tsx
+var import_jsx_runtime57 = require("react/jsx-runtime");
+var renderPreviewContent = (args) => {
+  const { question } = args;
+  const Icon = getCurriculumIcon({
+    type: question.type,
+    icon: question.icon
+  });
+  const getDescription = () => {
+    return [
+      getCurriculumQuestionTypeDescription(question.type),
+      question.duration ? `${question.duration}\uBD84` : ""
+    ].filter(Boolean).join(" | ");
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
+    import_themes23.Grid,
+    {
+      columns: "16px 1fr",
+      gap: "2",
+      px: "4",
+      py: "2",
+      width: "100%",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes6.Box, { mt: "1", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Icon, { color: getCurriculumQuestionIconColor(question.type) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes6.Box, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { as: "p", color: "gray", weight: "bold", children: question.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { color: "gray", children: getDescription() })
+        ] })
+      ]
+    },
+    question.uuid
+  );
+};
+var renderReviewContent = (args) => {
+  const { question, answer } = args;
+  const Icon = getCurriculumIcon({
+    type: question.type,
+    icon: question.icon
+  });
+  const color = getCurriculumQuestionIconColor(question.type);
+  const badgeColor = ["question_radio", "question_satisfaction_option"].includes(question.type) ? "accent" : "neutral";
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
+    import_themes23.Grid,
+    {
+      columns: "16px 1fr",
+      gap: "2",
+      px: "4",
+      py: "2",
+      width: "100%",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes6.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Icon, { color }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes6.Box, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { as: "p", color: "gray", mb: "2", weight: "bold", children: question.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Badge, { color: badgeColor, size: "large", style: { whiteSpace: "break-spaces" }, children: answer })
+        ] })
+      ]
+    },
+    question.uuid
+  );
+};
+function StartReview({ onStart }) {
+  const { curriculum, reviewContents, sectionTitle, done, formik } = useCurriculumReviewContext();
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    import_themes22.Flex,
+    {
+      align: "center",
+      direction: "column",
+      height: "100%",
+      justify: "center",
+      width: "100%",
+      children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
+        import_themes22.Flex,
+        {
+          align: "center",
+          direction: "column",
+          height: "100%",
+          justify: "center",
+          maxWidth: "650px",
+          pb: "6",
+          pt: "4",
+          px: "4",
+          width: "100%",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { color: "gray", children: curriculum.title }),
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Heading2, { variant: "heading3", children: reviewContents.title }),
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes39.Separator, { my: "4", style: { width: 100 } }),
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(Typo, { align: "left", as: "p", color: "gray", mb: "4", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { as: "span", weight: "bold", children: sectionTitle }),
+              /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { children: reviewContents.description })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes6.Box, { mb: "5", overflowY: "auto", width: "100%", children: reviewContents.questions.map((question) => {
+              if (done) {
+                return renderReviewContent({ question, answer: formik.values.answers[question.uuid] });
+              }
+              return renderPreviewContent({ question });
+            }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Button, { color: "yellow", onClick: onStart, variant: done ? "outline" : "solid", children: done ? "\uB098\uC758 \uC751\uB2F5 \uC218\uC815\uD558\uAE30" : reviewContents.buttonTitle })
+          ]
+        }
+      )
+    }
+  );
+}
+var start_review_default = StartReview;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-layout.tsx
+var import_jsx_runtime58 = require("react/jsx-runtime");
+function AlignCenter(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+    import_themes22.Flex,
+    __spreadValues({
+      align: "center",
+      height: "100%",
+      justify: "center",
+      width: "100%"
+    }, props)
+  );
+}
+function ReviewQuestionLayout({
+  Header,
+  Body,
+  Footer
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
+    import_themes23.Grid,
+    {
+      align: "center",
+      columns: "1fr",
+      height: "100%",
+      justify: "center",
+      rows: {
+        initial: "92px 1px 1fr 1px 56px",
+        md: "112px 1px 1fr 1px 56px"
+      },
+      width: "100%",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(AlignCenter, { pb: "3", pt: "4", px: "4", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes6.Box, { maxWidth: "650px", width: "100%", children: Header }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes39.Separator, { size: "4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+          AlignCenter,
+          {
+            p: "3",
+            style: { backgroundColor: "var(--gray-2)", zIndex: 0 },
+            children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes6.Box, { height: "100%", maxWidth: "650px", width: "100%", children: Body })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes39.Separator, { size: "4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(AlignCenter, { px: "4", py: "3", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes6.Box, { maxWidth: "650px", width: "100%", children: Footer }) })
+      ]
+    }
+  );
+}
+var review_question_layout_default = ReviewQuestionLayout;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-header.tsx
+var import_jsx_runtime59 = require("react/jsx-runtime");
+function ReviewQuestionHeader({
+  index,
+  total
+}) {
+  const { reviewContents } = useCurriculumReviewContext();
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes6.Box, { height: "100%", width: "100%", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes23.Grid, { columns: "1fr 40px", width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+      Heading2,
+      {
+        mb: "3",
+        truncate: true,
+        variant: { initial: "heading5", md: "heading3" },
+        children: reviewContents.title
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes22.Flex, { justify: "between", mb: "2", width: "100%", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Typo, { color: "gray", size: { initial: "1", md: "2" }, children: "\uC9C4\uD589 \uC0C1\uD669" }),
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(Typo, { color: "gray", size: { initial: "1", md: "2" }, children: [
+        index + 1,
+        " / ",
+        total,
+        " \uC644\uB8CC"
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes30.Progress, { color: "iris", max: total, value: index + 1 })
+  ] });
+}
+var review_question_header_default = ReviewQuestionHeader;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-footer.tsx
+var import_jsx_runtime60 = require("react/jsx-runtime");
+function ReviewQuestionFooter({
+  index,
+  onNext,
+  onPrev,
+  isLast,
+  isNextButtonDisabled,
+  onSubmit,
+  isLoading
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_themes23.Grid, { columns: "1fr 1fr", gap: "3", children: [
+    index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(Button, { onClick: onPrev, variant: "outline", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react_icons2.ChevronLeftIcon, {}),
+      "\uC774\uC804\uC73C\uB85C"
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_themes6.Box, {}),
+    isLast ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(Button, { disabled: isNextButtonDisabled, loading: isLoading, onClick: onSubmit, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react_icons2.PaperPlaneIcon, {}),
+      "\uC81C\uCD9C\uD558\uAE30"
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+      Button,
+      {
+        disabled: isNextButtonDisabled,
+        onClick: onNext,
+        variant: "surface",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react_icons2.ChevronRightIcon, {}),
+          "\uB2E4\uC74C\uC73C\uB85C"
+        ]
+      }
+    )
+  ] });
+}
+var review_question_footer_default = ReviewQuestionFooter;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-radio.tsx
+var import_react33 = require("react");
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-comp.tsx
+var import_jsx_runtime61 = require("react/jsx-runtime");
+function ReviewQuestionContentHeader({
+  type,
+  title,
+  question,
+  icon
+}) {
+  const Icon = getCurriculumIcon({ type, icon });
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes6.Box, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes22.Flex, { gap: "2", mb: "3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes6.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        Icon,
+        {
+          color: getCurriculumQuestionIconColor(type),
+          height: "16",
+          width: "16"
+        }
+      ) }),
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Typo, { color: "gray", weight: "bold", children: title })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Typo, { as: "p", color: "gray", children: question })
+  ] });
+}
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-radio.tsx
+var import_jsx_runtime62 = require("react/jsx-runtime");
+var correctAnswerStyle = {
+  backgroundColor: "var(--green-a2)"
+};
+function ReviewQuestionRadio(props) {
+  const { question, answer, onChange } = props;
+  const [isCheckAnswer, setIsCheckAnswer] = (0, import_react33.useState)(false);
+  const checkAnswer = (0, import_react33.useCallback)(() => {
+    setIsCheckAnswer(true);
+  }, []);
+  const isCorrect = isCheckAnswer && Number(answer) === question.correctAnswer;
+  const isWrong = isCheckAnswer && Number(answer) !== question.correctAnswer;
+  const radioColor = (0, import_react33.useMemo)(() => {
+    if (isCorrect) return "green";
+    if (isWrong) return "red";
+    return void 0;
+  }, [isCorrect, isWrong]);
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes23.Grid, { height: "100%", rows: "auto 1fr", width: "100%", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Card, { mb: "4", size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      ReviewQuestionContentHeader,
+      {
+        icon: question.icon,
+        question: question.question,
+        title: question.title,
+        type: question.type
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes23.Grid, { height: "100%", rows: "1fr auto", width: "100%", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes6.Box, { position: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+        RadioButtonCard.Root,
+        {
+          color: radioColor,
+          onValueChange: onChange,
+          style: {
+            width: "100%",
+            height: "100%",
+            overflowY: "auto",
+            position: "absolute"
+          },
+          value: answer,
+          children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes22.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;
+            const style = (() => {
+              if (isThisOptionCorrect) return correctAnswerStyle;
+              return {};
+            })();
+            return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+              RadioButtonCard.Item,
+              {
+                style,
+                value: i.toString(),
+                children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes6.Box, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Typo, { as: "p", children: option }),
+                  isThisOptionCorrect ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Typo, { color: "green", children: "\uC815\uB2F5\uC785\uB2C8\uB2E4" }) : null,
+                  isThisOptionWrong ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Typo, { color: "red", children: "\uC815\uB2F5\uC774 \uC544\uB2D9\uB2C8\uB2E4" }) : null
+                ] })
+              },
+              `${option}-${i}`
+            );
+          }) })
+        }
+      ) }),
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes22.Flex, { justify: "end", mt: "2", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Button, { onClick: checkAnswer, children: "\uC815\uB2F5 \uD655\uC778" }) })
+    ] })
+  ] });
+}
+var review_question_radio_default = ReviewQuestionRadio;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-text.tsx
+var import_jsx_runtime63 = 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_runtime63.jsx)(
+    Card,
+    {
+      size: "2",
+      style: {
+        width: "100%",
+        height: "100%"
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_themes23.Grid, { height: "100%", rows: "1fr auto", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_themes23.Grid, { height: "100%", rows: "auto 1fr", width: "100%", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+            ReviewQuestionContentHeader,
+            {
+              icon: question.icon,
+              question: question.question,
+              title: question.title,
+              type: question.type
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+            TextArea,
+            {
+              mt: "2",
+              onChange: (e) => {
+                onChange(e.target.value);
+              },
+              placeholder: question.placeholder,
+              value: answer
+            }
+          )
+        ] }),
+        minLengthNotMet ? /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_themes6.Box, { mt: "2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime63.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_runtime63.jsxs)(
+            import_themes8.Callout.Root,
+            {
+              color: "iris",
+              mt: "2",
+              style: { alignItems: "center" },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes8.Callout.Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react_icons2.BellIcon, {}) }),
+                /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes8.Callout.Text, { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Typo, { as: "p", variant: "caption", children: question.minLengthInfoMessage }) })
+              ]
+            }
+          ) : null
+        ] }) : null
+      ] })
+    }
+  );
+}
+var review_question_text_default = ReviewQuestionText;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-satisfaction-option.tsx
+var import_jsx_runtime64 = require("react/jsx-runtime");
+function ReviewQuestionSatisfisRadio(props) {
+  var _a, _b, _c;
+  const { question, answer, onChange } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_jsx_runtime64.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Card, { size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+      ReviewQuestionContentHeader,
+      {
+        icon: question.icon,
+        question: (_a = question.question) != null ? _a : "\uC774\uBC88 \uD559\uC2B5\uC5D0 \uB300\uD55C \uC804\uBC18\uC801\uC778 \uB9CC\uC871\uB3C4\uB97C \uC54C\uB824\uC8FC\uC138\uC694.",
+        title: (_b = question.title) != null ? _b : "\uB9CC\uC871\uB3C4 \uC870\uC0AC",
+        type: question.type
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_themes34.RadioGroup.Root, { color: "iris", mt: "3", onValueChange: onChange, value: answer, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_themes22.Flex, { direction: "column", gap: "2", children: (_c = question.options) == null ? void 0 : _c.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_themes34.RadioGroup.Item, { value: index.toString(), children: option }, option)) }) })
+  ] });
+}
+var review_question_satisfaction_option_default = ReviewQuestionSatisfisRadio;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-satisfaction-text.tsx
+var import_jsx_runtime65 = require("react/jsx-runtime");
+function ReviewQuestionSatisfisText(props) {
+  var _a, _b;
+  const { question, answer, onChange } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Card, { size: "2", style: { height: "100%", width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_themes23.Grid, { height: "100%", rows: "auto 1fr", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+      ReviewQuestionContentHeader,
+      {
+        icon: question.icon,
+        question: (_a = question.question) != null ? _a : "\uC774\uBC88 \uD559\uC2B5\uC5D0 \uB300\uD574 \uCD94\uAC00\uB85C \uB0A8\uAE38 \uC758\uACAC\uC774 \uC788\uB2E4\uBA74 \uACF5\uC720\uD574\uC8FC\uC138\uC694.",
+        title: (_b = question.title) != null ? _b : "\uB9CC\uC871\uB3C4 \uC870\uC0AC",
+        type: question.type
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+      TextArea,
+      {
+        mt: "2",
+        onChange: (e) => {
+          onChange(e.target.value);
+        },
+        placeholder: question.placeholder,
+        style: {
+          height: "100%"
+        },
+        value: answer
+      }
+    )
+  ] }) });
+}
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-body.tsx
+var import_jsx_runtime66 = require("react/jsx-runtime");
+function ReviewQuestionBody(props) {
+  const { question, answer, error, onChange } = props;
+  if (question.type === "question_radio") {
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      review_question_radio_default,
+      {
+        answer,
+        error,
+        onChange,
+        question
+      }
+    );
+  }
+  if (question.type === "question_text") {
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      review_question_text_default,
+      {
+        answer,
+        error,
+        onChange,
+        question
+      }
+    );
+  }
+  if (question.type === "question_satisfaction_option") {
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      review_question_satisfaction_option_default,
+      {
+        answer,
+        error,
+        onChange,
+        question
+      }
+    );
+  }
+  if (question.type === "question_satisfaction_text") {
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      ReviewQuestionSatisfisText,
+      {
+        answer,
+        error,
+        onChange,
+        question
+      }
+    );
+  }
+  return null;
+}
+var review_question_body_default = ReviewQuestionBody;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/index.tsx
+var import_jsx_runtime67 = require("react/jsx-runtime");
+function ReviewQuestion({
+  question,
+  index,
+  total,
+  answer,
+  error,
+  onChange,
+  onNext,
+  onPrev,
+  isLast,
+  isNextDisabled,
+  onSubmit,
+  isLoading
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+    review_question_layout_default,
+    {
+      Body: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+        review_question_body_default,
+        {
+          answer,
+          error,
+          onChange,
+          question
+        }
+      ),
+      Footer: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+        review_question_footer_default,
+        {
+          index,
+          isLast,
+          isLoading,
+          isNextButtonDisabled: isNextDisabled,
+          onNext,
+          onPrev,
+          onSubmit
+        }
+      ),
+      Header: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(review_question_header_default, { index, total })
+    }
+  );
+}
+var ReviewQuestion_default = ReviewQuestion;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/complete-review.tsx
+var import_jsx_runtime68 = require("react/jsx-runtime");
+var THANKS_IMAGE_S3_URL = "https://tipp-coaching-live.s3.ap-northeast-2.amazonaws.com/images/curriculum_review_thanks.svg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIASOOL4XO3GOVQNAOJ%2F20250714%2Fap-northeast-2%2Fs3%2Faws4_request&X-Amz-Date=20250714T093714Z&X-Amz-Expires=300&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEBIaDmFwLW5vcnRoZWFzdC0yIkgwRgIhAJ10MFU1RlFJLaHJ4kVZqyg%2BSX6kK4pjSkArYit6T%2BzpAiEAy4LV4JIm785N1F9VASx1Ls4wU3RtmgYcMuB1mUfPyzkq%2BwIIKxABGgwxNjg0NjgyMDAzNzQiDI0CpGgsmaeigKbrmirYApQQ0L0GayygZ%2F8kNQ6PUGp3zrc8ylTEX1DLE5swaftDANtxXV18k%2F5%2FNI75G3%2BTGxnGBXH0MvacVyA9jzk9OBTkKxAhPqzseR%2FcTBlZT4mkk4wXvCPVXFWSCI4HZQp3XVoPhe5kaMOxemg%2F4Kd7dCaQ%2FydoPQ4E1mDYQCx8OjyOOynE%2FBPV7G87sbKISZMmW5kNy1k90H%2FYFG%2Fpm1bSZJsX8jIgPXrb2oqYF%2BoAFIl%2BlOzqW3hBqg5%2FZqYfoNgLcsozYib9oMSvSr6wumQhHZ%2B3HYy0I5gfSHRiVRNqxNMLPJrZJtkywwcdmzU7Zhmegw94zxvWHH1ETDtRswZtrNelQVBa7FgegJjUKQXrtuCNxIWSeWxgQtiPe5HFkuDIbJNkyXf6oS3xXEMbv9vvd9iZb1buG1Xl7hDformtZly84vl2qCy9liEpOBd5gh9tsksrbwgZ3zSEMLuf08MGOqwC%2BA4a%2FOrYGP9PnS7f8umahffDcnIB4JfOgOKso%2Fn5wrWMUSbRKFTvX0RezzSFOVfg8GYVlAkyDnFXFTxLWNGbfn4IV19luZryQVnUPxOea%2BD%2Fy1h3VAV3UcpZpqdWbdww%2FDF1%2BqudKNF0omu6blFw2K1Xut%2F6PB8jRtnjOSNx%2BFPQXfSN5F1uzorCprt95%2FfP82hTj%2BQ9zycuLVcCDRdlbKJ45wL1%2FY7ARNNDH5tJMTtSj68%2BWm86u%2FlM0pYoVcsBvhDyZpmYXhDfvFi0tWyjxSa4MaowYQ9lbqXruHwoNTKwpowFxREPNRRqMtXVJVk3b%2Bj8cEdVs36KAH2UHQ2ysDPnbmtXR6VpgoT%2Br2OY1fh4PxwrOO%2Bn3WrweSoltLLR717spz1bdsZbBo3f&X-Amz-Signature=b7869ae5c99b73679e63c71b9c9b0857ab0fb9e529032aa6ed569bd11dbd6382&X-Amz-SignedHeaders=host&response-content-disposition=inline";
+function CompleteReview(props) {
+  var _a, _b, _c;
+  const { onClickReviewMyAnswer } = props;
+  const { reviewContents, sectionTitle, curriculum, onClickEndReview: onClickNextContents } = useCurriculumReviewContext();
+  const { reviewMeta } = curriculum.contents;
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+    import_themes22.Flex,
+    {
+      align: "center",
+      direction: "column",
+      height: "100%",
+      justify: "between",
+      maxHeight: "550px",
+      maxWidth: "650px",
+      px: "4",
+      py: "6",
+      width: "100%",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_themes22.Flex, { align: "center", direction: "column", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Heading2, { mb: "6", variant: "heading5", weight: "regular", children: (_a = reviewMeta == null ? void 0 : reviewMeta.endReviewTopTitle) != null ? _a : "\uC751\uB2F5\uC744 \uC131\uACF5\uC801\uC73C\uB85C \uC81C\uCD9C\uD588\uC2B5\uB2C8\uB2E4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+            "img",
+            {
+              alt: "complete-review",
+              height: 141,
+              src: THANKS_IMAGE_S3_URL,
+              width: 118
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typo, { color: "gray", mt: "6", variant: "caption", children: sectionTitle }),
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Heading2, { variant: "heading5", children: reviewContents.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typo, { align: "center", color: "gray", mt: "6", children: (_b = reviewMeta == null ? void 0 : reviewMeta.endReviewDescription) != null ? _b : `\uC774\uBC88 \uD559\uC2B5\uC774 \uB9AC\uB354\uC2ED\uC5D0 \uB3C4\uC6C0\uC774 \uB418\uC5C8\uAE30\uB97C \uBC14\uB78D\uB2C8\uB2E4.
+ \uC55E\uC73C\uB85C \uC788\uC744 \uB9AC\uB354\uB2D8\uC758 \uC131\uC7A5\uC744 \uAE30\uB300\uD569\uB2C8\uB2E4.` })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_themes23.Grid, { columns: { initial: "1fr", md: "2" }, gap: "3", width: "100%", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(Button, { onClick: onClickReviewMyAnswer, variant: "outline", children: [
+            (_c = reviewMeta == null ? void 0 : reviewMeta.endReviewBackButtonTitle) != null ? _c : "\uB098\uC758 \uC751\uB2F5 \uB2E4\uC2DC \uBCF4\uAE30",
+            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react_icons2.ResetIcon, {})
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(Button, { onClick: onClickNextContents, children: [
+            "\uCEE4\uB9AC\uD058\uB7FC\uC73C\uB85C \uB3CC\uC544\uAC00\uAE30",
+            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react_icons2.HomeIcon, {})
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+var complete_review_default = CompleteReview;
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/index.tsx
+var import_jsx_runtime69 = require("react/jsx-runtime");
+function CurriculumReviewStepsInner() {
+  const {
+    formik,
+    step,
+    handleStart,
+    handleNext,
+    handlePrev,
+    onClickReviewMyAnswer,
+    handleSubmit,
+    currentQuestion,
+    currentAnswer,
+    currentError,
+    reviewContents,
+    handleAnswerChange
+  } = useCurriculumReviewContext();
+  const { questions } = reviewContents;
+  if (step === 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(start_review_default, { onStart: handleStart });
+  }
+  if (step > 0 && step <= questions.length && currentQuestion) {
+    return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+      ReviewQuestion_default,
+      {
+        answer: currentAnswer,
+        error: currentError,
+        index: step - 1,
+        isLast: step === questions.length,
+        isLoading: formik.isSubmitting,
+        isNextDisabled: currentError !== void 0,
+        onChange: handleAnswerChange,
+        onNext: handleNext,
+        onPrev: handlePrev,
+        onSubmit: handleSubmit,
+        question: currentQuestion,
+        total: questions.length
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(complete_review_default, { onClickReviewMyAnswer });
+}
+function CurriculumReviewSteps({
+  contents,
+  title,
+  onClickEndReview,
+  onSubmit,
+  defaultValues,
+  curriculum,
+  onReviewValueChange,
+  mode,
+  done
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+    CurriculumReviewProvider,
+    {
+      curriculum,
+      defaultValues,
+      done,
+      mode,
+      onClickEndReview,
+      onReviewValueChange,
+      onSubmit,
+      reviewContents: contents,
+      sectionTitle: title,
+      children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(CurriculumReviewStepsInner, {})
+    }
+  );
+}
+var CurriculumReviewSteps_default = CurriculumReviewSteps;
+
+// src/molecules/curriculumV2/CurriculumContents/curriculum-review.tsx
+var import_jsx_runtime70 = require("react/jsx-runtime");
+function CurriculumReview(props) {
+  const { item, sectionTitle } = props;
+  const { description, buttonTitle } = item;
+  const { curriculum, onReviewSubmit: _onReviewSubmit, onReviewValueChange, curriculumReviewAnswers, tempCurriculumReviewAnswers, curriculumCompleteMap } = useCurriculumContext();
+  const [open, setOpen] = (0, import_react34.useState)(false);
+  const onReviewSubmit = (0, import_react34.useCallback)((values) => {
+    return _onReviewSubmit({ reviewId: item.uuid, answer: values });
+  }, [item.uuid, _onReviewSubmit]);
+  const onClickEndReview = (0, import_react34.useCallback)(() => {
+    setOpen(false);
+  }, []);
+  const mode = (0, import_react34.useMemo)(() => {
+    return item.questions.every((question) => curriculumReviewAnswers[question.uuid] && curriculumReviewAnswers[question.uuid] !== "") ? "edit" : "create";
+  }, [curriculumReviewAnswers, item.questions]);
+  const defaultValues = (0, import_react34.useMemo)(() => {
+    const allAnswers = __spreadValues(__spreadValues({}, curriculumReviewAnswers), tempCurriculumReviewAnswers);
+    return item.questions.reduce((acc, question) => {
+      acc[question.uuid] = allAnswers[question.uuid] || "";
+      return acc;
+    }, {});
+  }, [curriculumReviewAnswers, item.questions, tempCurriculumReviewAnswers]);
+  const done = (0, import_react34.useMemo)(() => {
+    return Boolean(curriculumCompleteMap[item.uuid]);
+  }, [curriculumCompleteMap, item.uuid]);
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Dialog.Root, { onOpenChange: setOpen, open, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+      import_themes22.Flex,
+      {
+        align: "center",
+        direction: "column",
+        height: "100%",
+        justify: "center",
+        px: "3",
+        py: "3",
+        width: "100%",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typo, { color: "gray", weight: "bold", children: curriculum.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typo, { align: "center", as: "p", color: "gray", children: description }),
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Dialog.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Button, { mt: "3", style: { width: 232 }, variant: done ? "outline" : "solid", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typo, { truncate: true, children: done ? "\uB098\uC758 \uC751\uB2F5 \uB2E4\uC2DC\uBCF4\uAE30" : buttonTitle }) }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+      Dialog.Content,
+      {
+        height: "100%",
+        hideCloseButton: true,
+        style: { borderRadius: 0, padding: 0 },
+        title: "",
+        width: "100%",
+        children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+          import_themes22.Flex,
+          {
+            align: "center",
+            height: "100%",
+            justify: "center",
+            pb: "3",
+            position: "relative",
+            width: "100%",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+                CurriculumReviewSteps_default,
+                {
+                  contents: item,
+                  curriculum,
+                  defaultValues,
+                  done,
+                  mode,
+                  onClickEndReview,
+                  onReviewValueChange,
+                  onSubmit: onReviewSubmit,
+                  title: sectionTitle
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_themes6.Box, { position: "absolute", right: "16px", top: "16px", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_themes18.IconButton, { color: "gray", variant: "ghost", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_themes6.Box, { display: { initial: "none", md: "block" }, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react_icons8.Cross1Icon, { height: 20, width: 20 }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_themes6.Box, { display: { initial: "block", md: "none" }, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react_icons8.Cross1Icon, { height: 16, width: 16 }) })
+              ] }) }) })
+            ]
+          }
+        )
+      }
+    )
+  ] });
+}
+var curriculum_review_default = CurriculumReview;
+
+// src/molecules/curriculumV2/CurriculumContents/index.tsx
+var import_jsx_runtime71 = require("react/jsx-runtime");
+function CurriculumContents() {
+  const { selectedItem, selectedSectionTitle } = useCurriculumContext();
+  switch (selectedItem.type) {
+    case "video":
+      return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(curriculum_video_default, { item: selectedItem });
+    case "review":
+      return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+        curriculum_review_default,
+        {
+          item: selectedItem,
+          sectionTitle: selectedSectionTitle == null ? void 0 : selectedSectionTitle.title
+        }
+      );
+    default:
+      return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+        import_themes22.Flex,
+        {
+          align: "center",
+          direction: "column",
+          gap: "2",
+          height: "100%",
+          justify: "center",
+          width: "100%",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_react_icons2.InfoCircledIcon, { height: 24, width: 24 }),
+            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Typo, { children: "\uCEE8\uD150\uCE20\uB97C \uB85C\uB529 \uD560 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Typo, { align: "center", color: "gray", variant: "caption", children: `[debug info]
+            ${JSON.stringify(selectedItem)}` })
+          ]
+        }
+      );
+  }
+}
+
+// src/molecules/curriculumV2/CurriculumSidebar/Items/section-title.tsx
+var import_jsx_runtime72 = require("react/jsx-runtime");
+function SectionTitle(props) {
+  const { title, duration } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_themes23.Grid, { align: "center", columns: "1fr auto", px: "3", py: "2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Typo, { color: "gray", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(Typo, { color: "gray", variant: "caption", children: [
+      duration,
+      "\uBD84"
+    ] })
+  ] });
+}
+var section_title_default = SectionTitle;
+
+// src/molecules/curriculumV2/CurriculumSidebar/Items/curriculum-sidebar-item-wrapper.tsx
+var import_jsx_runtime73 = require("react/jsx-runtime");
+function CurriculumSidebarItemWrapper({
+  children,
+  isSelected,
+  onClick,
+  index
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
+    import_themes23.Grid,
+    {
+      align: "center",
+      columns: "auto 1fr",
+      "data-curriculum-item-index": index,
+      gap: "2",
+      onClick,
+      position: "relative",
+      px: "3",
+      py: "2",
+      style: {
+        backgroundColor: isSelected ? "var(--yellow-a2)" : void 0,
+        cursor: onClick ? "pointer" : void 0
+      },
+      children: [
+        isSelected ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+          import_themes39.Separator,
+          {
+            color: "yellow",
+            orientation: "vertical",
+            size: "4",
+            style: { width: "3px", position: "absolute", left: 0 }
+          }
+        ) : null,
+        children
+      ]
+    }
+  );
+}
+var curriculum_sidebar_item_wrapper_default = CurriculumSidebarItemWrapper;
+
+// src/molecules/curriculumV2/CurriculumSidebar/Items/curriculum-item-title.tsx
+var import_jsx_runtime74 = require("react/jsx-runtime");
+function CurriculumItemTitle({
+  title,
+  subText,
+  duration
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_themes22.Flex, { direction: "column", gap: "1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(Typo, { color: "gray", weight: "bold", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(Typo, { color: "gray", variant: "caption", children: [
+      subText,
+      duration ? ` | ${duration}\uBD84` : ""
+    ] })
+  ] });
+}
+var curriculum_item_title_default = CurriculumItemTitle;
+
+// src/molecules/curriculumV2/CurriculumSidebar/Items/section-item.tsx
+var import_jsx_runtime75 = require("react/jsx-runtime");
+function SectionCommonItem({
+  title,
+  duration,
+  icon,
+  type,
+  color = "gray"
+}) {
+  const IconComp = getCurriculumIcon({ type, icon });
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(IconComp, { color }),
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(curriculum_item_title_default, { duration, subText: getCurriculumContentSubTypeText(type), title })
+  ] });
+}
+var section_item_default = SectionCommonItem;
+
+// src/molecules/curriculumV2/CurriculumSidebar/sidebar-item.tsx
+var import_jsx_runtime76 = require("react/jsx-runtime");
+function SidebarItem({ item, selectedIndex, setSelectedIndex, index, done }) {
+  if (item.type === "sectionTitle") {
+    return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(section_title_default, __spreadValues({}, item), item.uuid);
+  }
+  const isSelected = selectedIndex === index;
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+    curriculum_sidebar_item_wrapper_default,
+    {
+      index,
+      isSelected,
+      onClick: () => {
+        setSelectedIndex(index);
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+        section_item_default,
+        __spreadProps(__spreadValues({}, item), {
+          color: getCurriculumIconColor({
+            done,
+            selected: isSelected
+          })
+        })
+      )
+    },
+    item.uuid
+  );
+}
+var sidebar_item_default = SidebarItem;
+
+// src/molecules/curriculumV2/CurriculumSidebar/index.tsx
+var import_jsx_runtime77 = require("react/jsx-runtime");
+var TAB_LIST = [
+  {
+    label: "\uAC15\uC758 \uBAA9\uCC28",
+    value: "curriculum"
+  }
+];
+function CurriculumSidebar() {
+  const { curriculum, selectedIndex, setSelectedIndex, scrollAreaRef, curriculumCompleteMap } = useCurriculumContext();
+  const list = curriculum.contents.list;
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_themes44.Tabs.Root, { asChild: true, defaultValue: TAB_LIST[0].value, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_themes23.Grid, { height: "100%", overflowY: "auto", rows: "auto 1fr ", width: "100%", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_themes44.Tabs.List, { style: { padding: "0 var(--space-3)" }, children: TAB_LIST.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_themes44.Tabs.Trigger, { value: tab.value, children: tab.label }, tab.value)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      import_themes6.Box,
+      {
+        height: "100%",
+        overflowY: "auto",
+        position: "relative",
+        ref: scrollAreaRef,
+        width: "100%",
+        children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
+          import_themes44.Tabs.Content,
+          {
+            style: {
+              position: "absolute",
+              height: "100%",
+              width: "100%"
+            },
+            value: TAB_LIST[0].value,
+            children: [
+              list.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(sidebar_item_default, { done: curriculumCompleteMap[item.uuid], index, item, selectedIndex, setSelectedIndex }, item.uuid)),
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_themes6.Box, { height: "150px" })
+            ]
+          }
+        )
+      }
+    )
+  ] }) });
+}
+
+// src/molecules/curriculumV2/curriculum-v2-layout.tsx
+var import_jsx_runtime78 = require("react/jsx-runtime");
+function CurriculumV2Layout(props) {
+  const { NavBar, Contents, SideBar, SideNav, style } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_themes23.Grid, { align: "center", height: "100%", rows: "auto 1px 1fr", style, width: "100%", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+      import_themes22.Flex,
+      {
+        align: "center",
+        height: { initial: "40px", md: "64px" },
+        width: "100%",
+        children: NavBar
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_themes39.Separator, { size: "4" }),
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+      import_themes22.Flex,
+      {
+        align: "center",
+        height: "100%",
+        justify: "center",
+        overflow: "hidden",
+        width: "100%",
+        children: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
+          import_themes23.Grid,
+          {
+            columns: { initial: "1", md: "1fr 340px" },
+            height: "100%",
+            maxWidth: "1100px",
+            rows: { initial: "auto 1fr", md: "auto" },
+            width: "100%",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_themes6.Box, { height: "100%", width: "100%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_themes2.AspectRatio, { ratio: 16 / 9, children: Contents }),
+                SideNav
+              ] }),
+              SideBar
+            ]
+          }
+        )
+      }
+    )
+  ] });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  CurriculumContents,
+  CurriculumProvider,
+  CurriculumSidebar,
+  CurriculumSubNav,
+  CurriculumV2Layout,
   DatePicker,
   DatePickerButton,
   DotNavigation,
@@ -2731,6 +4303,7 @@ function GhostPost(props) {
   Stepper,
   TagSelector,
   TimeSelect,
-  createColumnHelper
+  createColumnHelper,
+  useCurriculumContext
 });
 //# sourceMappingURL=index.cjs.map