@tipp/ui 2.5.0 → 2.7.0

package/dist/{chunk-OUJAPQS2.js → chunk-GPULIICW.js}

@@ -1,24 +1,24 @@
+import {
+  Heading
+} from "./chunk-NLHVQJQ2.js";
+import {
+  Box
+} from "./chunk-4Y5BEXVN.js";
+import {
+  Typo
+} from "./chunk-GR4PG6HY.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
 import {
   Button
-} from "./chunk-ZVDAEY5Q.js";
+} from "./chunk-2LCH3PDF.js";
 import {
   Card
 } from "./chunk-RP2RGCAW.js";
-import {
-  Box
-} from "./chunk-4Y5BEXVN.js";
 import {
   DownloadIcon
 } from "./chunk-VOME2TE7.js";
-import {
-  Heading
-} from "./chunk-BESTU2AY.js";
-import {
-  Typo
-} from "./chunk-PMJIFLDT.js";
 
 // src/app/platform/report-card.tsx
 import { useCallback } from "react";
@@ -65,4 +65,4 @@ function ReportCard(props) {
 export {
   ReportCard
 };
-//# sourceMappingURL=chunk-OUJAPQS2.js.map
+//# sourceMappingURL=chunk-GPULIICW.js.map

package/dist/{chunk-K36TPMKL.js → chunk-GPZXD762.js}

@@ -1,3 +1,6 @@
+import {
+  resolveColor
+} from "./chunk-VFQD57ZY.js";
 import {
   __objRest,
   __spreadProps,
@@ -8,11 +11,13 @@ import {
 import {
   Avatar as RadixAvatar
 } from "@radix-ui/themes";
+import { clsx } from "clsx";
 import { useMemo, forwardRef, useCallback } from "react";
 import { jsx } from "react/jsx-runtime";
 var Avatar = forwardRef(
   (props, ref) => {
-    const _a = props, { children, size, variant = "soft" } = _a, rest = __objRest(_a, ["children", "size", "variant"]);
+    const _a = props, { children, size, variant = "soft", color, className } = _a, rest = __objRest(_a, ["children", "size", "variant", "color", "className"]);
+    const { color: radixColor, className: colorClassName } = resolveColor(color);
     const getOriginalSize = useCallback((value) => {
       switch (value) {
         case "small":
@@ -40,7 +45,17 @@ var Avatar = forwardRef(
         return map;
       }
     }, [getOriginalSize, size]);
-    return /* @__PURE__ */ jsx(RadixAvatar, __spreadProps(__spreadValues({}, rest), { ref, size: radixSize, variant, children }));
+    return /* @__PURE__ */ jsx(
+      RadixAvatar,
+      __spreadProps(__spreadValues({}, rest), {
+        className: clsx(colorClassName, className),
+        color: radixColor,
+        ref,
+        size: radixSize,
+        variant,
+        children
+      })
+    );
   }
 );
 Avatar.displayName = "Avatar";
@@ -48,4 +63,4 @@ Avatar.displayName = "Avatar";
 export {
   Avatar
 };
-//# sourceMappingURL=chunk-K36TPMKL.js.map
+//# sourceMappingURL=chunk-GPZXD762.js.map

package/dist/chunk-GPZXD762.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/avatar.tsx"],"sourcesContent":["import {\n  Avatar as RadixAvatar,\n  type AvatarProps as RadixAvatarProps,\n} from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { clsx } from 'clsx';\nimport { useMemo, forwardRef, useCallback } from 'react';\nimport { resolveColor, type UiColor } from '../utils/resolve-color';\n\ntype Size = 'small' | 'medium' | 'large' | 'full';\ntype OriginalSize = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9';\n\nexport type AvatarProps = Omit<RadixAvatarProps, 'size' | 'color'> & {\n  size?: Responsive<Size>;\n  color?: UiColor;\n};\n\nexport const Avatar = forwardRef<HTMLImageElement, AvatarProps>(\n  (props: AvatarProps, ref): React.ReactNode => {\n    const { children, size, variant = 'soft', color, className, ...rest } =\n      props;\n\n    const { color: radixColor, className: colorClassName } =\n      resolveColor(color);\n\n    const getOriginalSize = useCallback((value?: Size): OriginalSize => {\n      switch (value) {\n        case 'small':\n          return '1';\n        case 'medium':\n          return '2';\n        case 'large':\n          return '3';\n        case 'full':\n          return '4';\n        default:\n          return '3';\n      }\n    }, []);\n\n    const radixSize = useMemo<RadixAvatarProps['size']>(() => {\n      if (typeof size === 'string') {\n        return getOriginalSize(size);\n      }\n\n      if (typeof size === 'object') {\n        const map: RadixAvatarProps['size'] = {};\n        let key: keyof typeof size;\n        for (key in size) {\n          map[key] = size[key] && getOriginalSize(size[key]);\n        }\n        return map;\n      }\n    }, [getOriginalSize, size]);\n\n    return (\n      <RadixAvatar\n        {...rest}\n        className={clsx(colorClassName, className)}\n        color={radixColor}\n        ref={ref}\n        size={radixSize}\n        variant={variant}\n      >\n        {children}\n      </RadixAvatar>\n    );\n  }\n);\n\nAvatar.displayName = 'Avatar';\n"],"mappings":";;;;;;;;;;AAAA;AAAA,EACE,UAAU;AAAA,OAEL;AAEP,SAAS,YAAY;AACrB,SAAS,SAAS,YAAY,mBAAmB;AAkD3C;AAvCC,IAAM,SAAS;AAAA,EACpB,CAAC,OAAoB,QAAyB;AAC5C,UACE,YADM,YAAU,MAAM,UAAU,QAAQ,OAAO,UAnBrD,IAoBM,IAD6D,iBAC7D,IAD6D,CAAvD,YAAU,QAAM,WAAkB,SAAO;AAGjD,UAAM,EAAE,OAAO,YAAY,WAAW,eAAe,IACnD,aAAa,KAAK;AAEpB,UAAM,kBAAkB,YAAY,CAAC,UAA+B;AAClE,cAAQ,OAAO;AAAA,QACb,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,CAAC;AAEL,UAAM,YAAY,QAAkC,MAAM;AACxD,UAAI,OAAO,SAAS,UAAU;AAC5B,eAAO,gBAAgB,IAAI;AAAA,MAC7B;AAEA,UAAI,OAAO,SAAS,UAAU;AAC5B,cAAM,MAAgC,CAAC;AACvC,YAAI;AACJ,aAAK,OAAO,MAAM;AAChB,cAAI,GAAG,IAAI,KAAK,GAAG,KAAK,gBAAgB,KAAK,GAAG,CAAC;AAAA,QACnD;AACA,eAAO;AAAA,MACT;AAAA,IACF,GAAG,CAAC,iBAAiB,IAAI,CAAC;AAE1B,WACE;AAAA,MAAC;AAAA,uCACK,OADL;AAAA,QAEC,WAAW,KAAK,gBAAgB,SAAS;AAAA,QACzC,OAAO;AAAA,QACP;AAAA,QACA,MAAM;AAAA,QACN;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;","names":[]}

package/dist/{chunk-PMJIFLDT.js → chunk-GR4PG6HY.js}

@@ -1,6 +1,9 @@
 import {
   mapWithResponsive
 } from "./chunk-LDBWASUA.js";
+import {
+  resolveColor
+} from "./chunk-VFQD57ZY.js";
 import {
   __objRest,
   __spreadProps,
@@ -9,11 +12,16 @@ import {
 
 // src/atoms/typo.tsx
 import { Text as RadixText } from "@radix-ui/themes";
+import { clsx } from "clsx";
 import { useMemo, forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 var Typo = forwardRef(
   (props, ref) => {
-    const _a = props, { size, variant, children } = _a, rest = __objRest(_a, ["size", "variant", "children"]);
+    const _a = props, { size, variant, children, color, className } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className"]);
+    const { color: radixColor, className: colorClassName } = useMemo(
+      () => resolveColor(color),
+      [color]
+    );
     const radixSize = useMemo(() => {
       if (size !== void 0) return size;
       if (variant === void 0) return "2";
@@ -32,7 +40,16 @@ var Typo = forwardRef(
         }
       });
     }, [size, variant]);
-    return /* @__PURE__ */ jsx(RadixText, __spreadProps(__spreadValues({}, rest), { ref, size: radixSize, children }));
+    return /* @__PURE__ */ jsx(
+      RadixText,
+      __spreadProps(__spreadValues({}, rest), {
+        className: clsx(colorClassName, className),
+        color: radixColor,
+        ref,
+        size: radixSize,
+        children
+      })
+    );
   }
 );
 Typo.displayName = "Typo";
@@ -40,4 +57,4 @@ Typo.displayName = "Typo";
 export {
   Typo
 };
-//# sourceMappingURL=chunk-PMJIFLDT.js.map
+//# sourceMappingURL=chunk-GR4PG6HY.js.map

package/dist/chunk-GR4PG6HY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/typo.tsx"],"sourcesContent":["import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\n\nexport type TypoProps = DistributiveOmit<RadixTextProps, 'color'> & {\n  variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n  color?: UiColor;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n  (props: TypoProps, ref): React.ReactNode => {\n    const { size, variant, children, color, className, ...rest } = props;\n\n    const { color: radixColor, className: colorClassName } = useMemo(\n      () => resolveColor(color),\n      [color]\n    );\n\n    const radixSize = useMemo<RadixTextProps['size']>(() => {\n      if (size !== undefined) return size;\n\n      if (variant === undefined) return '2';\n\n      return mapWithResponsive({\n        value: variant,\n        mapFn: (variantValue?: 'body' | 'caption' | 'subtitle') => {\n          switch (variantValue) {\n            case 'caption':\n              return '1';\n            case 'subtitle':\n              return '3';\n            case 'body':\n            default:\n              return '2';\n          }\n        },\n      });\n    }, [size, variant]);\n\n    return (\n      <RadixText\n        {...rest}\n        className={clsx(colorClassName, className)}\n        color={radixColor}\n        ref={ref}\n        size={radixSize}\n      >\n        {children}\n      </RadixText>\n    );\n  }\n);\n\nTypo.displayName = 'Typo';\n"],"mappings":";;;;;;;;;;;;;AAEA,SAAS,QAAQ,iBAAiB;AAClC,SAAS,YAAY;AACrB,SAAgB,SAAS,kBAAkB;AA4CrC;AA/BC,IAAM,OAAO;AAAA,EAClB,CAAC,OAAkB,QAAyB;AAC1C,UAA+D,YAAvD,QAAM,SAAS,UAAU,OAAO,UAnB5C,IAmBmE,IAAT,iBAAS,IAAT,CAA9C,QAAM,WAAS,YAAU,SAAO;AAExC,UAAM,EAAE,OAAO,YAAY,WAAW,eAAe,IAAI;AAAA,MACvD,MAAM,aAAa,KAAK;AAAA,MACxB,CAAC,KAAK;AAAA,IACR;AAEA,UAAM,YAAY,QAAgC,MAAM;AACtD,UAAI,SAAS,OAAW,QAAO;AAE/B,UAAI,YAAY,OAAW,QAAO;AAElC,aAAO,kBAAkB;AAAA,QACvB,OAAO;AAAA,QACP,OAAO,CAAC,iBAAmD;AACzD,kBAAQ,cAAc;AAAA,YACpB,KAAK;AACH,qBAAO;AAAA,YACT,KAAK;AACH,qBAAO;AAAA,YACT,KAAK;AAAA,YACL;AACE,qBAAO;AAAA,UACX;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,WACE;AAAA,MAAC;AAAA,uCACK,OADL;AAAA,QAEC,WAAW,KAAK,gBAAgB,SAAS;AAAA,QACzC,OAAO;AAAA,QACP;AAAA,QACA,MAAM;AAAA,QAEL;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;","names":[]}

package/dist/{chunk-7PF6I4RN.js → chunk-GRDRXD53.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-NWJSLIQ3.js";
 import {
   Select
-} from "./chunk-X2GMDZ7M.js";
+} from "./chunk-YXMB4MCM.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
@@ -57,4 +57,4 @@ function TimeSelect(_a) {
 export {
   TimeSelect
 };
-//# sourceMappingURL=chunk-7PF6I4RN.js.map
+//# sourceMappingURL=chunk-GRDRXD53.js.map

package/dist/{chunk-TJKS6CLU.js → chunk-GREYLAMY.js}

@@ -1,15 +1,15 @@
 import {
   DynamicFormEditorFieldEditorPanel
-} from "./chunk-D4JZHM4J.js";
+} from "./chunk-MP5KZULQ.js";
 import {
   DynamicFormEditorFieldListPanel
-} from "./chunk-PXPGCDNA.js";
+} from "./chunk-2O7NVLVP.js";
 import {
   DynamicFormEditorIssuesPanel
-} from "./chunk-KCCYHT23.js";
+} from "./chunk-7JW5Z2TL.js";
 import {
   DynamicFormEditorPreviewPanel
-} from "./chunk-JZVK4NDF.js";
+} from "./chunk-7PBLFV5L.js";
 import {
   createDefaultField,
   createUniqueFieldName,
@@ -27,7 +27,7 @@ import {
 } from "./chunk-25HMMI7R.js";
 import {
   Button
-} from "./chunk-ZVDAEY5Q.js";
+} from "./chunk-2LCH3PDF.js";
 import {
   __spreadProps,
   __spreadValues
@@ -227,4 +227,4 @@ function DynamicFormEditor(props) {
 export {
   DynamicFormEditor
 };
-//# sourceMappingURL=chunk-TJKS6CLU.js.map
+//# sourceMappingURL=chunk-GREYLAMY.js.map

package/dist/{chunk-VREM33BW.js → chunk-GYSRHZRS.js}

@@ -3,22 +3,22 @@ import {
 } from "./chunk-GMKRNFH5.js";
 import {
   Progress
-} from "./chunk-365QMK4D.js";
+} from "./chunk-TNNF5Q62.js";
 import {
   Grid
 } from "./chunk-EGEQY3KT.js";
 import {
-  Flex
-} from "./chunk-25HMMI7R.js";
+  Heading
+} from "./chunk-NLHVQJQ2.js";
 import {
   Box
 } from "./chunk-4Y5BEXVN.js";
-import {
-  Heading
-} from "./chunk-BESTU2AY.js";
 import {
   Typo
-} from "./chunk-PMJIFLDT.js";
+} from "./chunk-GR4PG6HY.js";
+import {
+  Flex
+} from "./chunk-25HMMI7R.js";
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-header.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -54,4 +54,4 @@ var review_question_header_default = ReviewQuestionHeader;
 export {
   review_question_header_default
 };
-//# sourceMappingURL=chunk-VREM33BW.js.map
+//# sourceMappingURL=chunk-GYSRHZRS.js.map

package/dist/{chunk-2TYR2RDO.js → chunk-H3GQHGFA.js}

@@ -4,22 +4,22 @@ import {
 import {
   Grid
 } from "./chunk-EGEQY3KT.js";
+import {
+  Heading
+} from "./chunk-NLHVQJQ2.js";
 import {
   IconButton
-} from "./chunk-XK6VEVOK.js";
+} from "./chunk-7RJYF5L3.js";
 import {
   Box
 } from "./chunk-4Y5BEXVN.js";
+import {
+  Typo
+} from "./chunk-GR4PG6HY.js";
 import {
   ChevronLeftIcon,
   ChevronRightIcon
 } from "./chunk-VOME2TE7.js";
-import {
-  Heading
-} from "./chunk-BESTU2AY.js";
-import {
-  Typo
-} from "./chunk-PMJIFLDT.js";
 
 // src/molecules/curriculumV2/curriculum-sub-nav.tsx
 import { useCallback } from "react";
@@ -97,4 +97,4 @@ function CurriculumSubNav() {
 export {
   CurriculumSubNav
 };
-//# sourceMappingURL=chunk-2TYR2RDO.js.map
+//# sourceMappingURL=chunk-H3GQHGFA.js.map

package/dist/{chunk-KMVSJT6Y.js → chunk-HH6LML5K.js}

@@ -1,27 +1,27 @@
 import {
   ReviewQuestionContentHeader
-} from "./chunk-R3WM6HV6.js";
+} from "./chunk-VD5ZDFCM.js";
 import {
   RadioButtonCard
-} from "./chunk-CSKNBWPB.js";
+} from "./chunk-EZN5PMTC.js";
 import {
   Grid
 } from "./chunk-EGEQY3KT.js";
+import {
+  Box
+} from "./chunk-4Y5BEXVN.js";
+import {
+  Typo
+} from "./chunk-GR4PG6HY.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
 import {
   Button
-} from "./chunk-ZVDAEY5Q.js";
+} from "./chunk-2LCH3PDF.js";
 import {
   Card
 } from "./chunk-RP2RGCAW.js";
-import {
-  Box
-} from "./chunk-4Y5BEXVN.js";
-import {
-  Typo
-} from "./chunk-PMJIFLDT.js";
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-radio.tsx
 import { useCallback, useMemo, useState } from "react";
@@ -98,4 +98,4 @@ var review_question_radio_default = ReviewQuestionRadio;
 export {
   review_question_radio_default
 };
-//# sourceMappingURL=chunk-KMVSJT6Y.js.map
+//# sourceMappingURL=chunk-HH6LML5K.js.map

package/dist/{chunk-HQATHJBN.js → chunk-IA74OBFY.js}

@@ -1,6 +1,9 @@
 import {
   IconButton
-} from "./chunk-XK6VEVOK.js";
+} from "./chunk-7RJYF5L3.js";
+import {
+  Typo
+} from "./chunk-GR4PG6HY.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
@@ -11,8 +14,8 @@ import {
   DoubleArrowRightIcon
 } from "./chunk-VOME2TE7.js";
 import {
-  Typo
-} from "./chunk-PMJIFLDT.js";
+  resolveColor
+} from "./chunk-VFQD57ZY.js";
 import {
   __spreadProps,
   __spreadValues
@@ -82,47 +85,61 @@ function Pagination(props) {
   const moveButtonProps = {
     variant: "ghost",
     size: "large",
-    style: { borderRadius: "50%" }
+    // 숫자 페이지 버튼(40x40)과 동일한 크기·사각(8px) hover 영역으로 통일한다.
+    // (size 'large'는 48x48이라 숫자 버튼보다 커서 width/height를 명시로 덮어쓴다.)
+    style: { width: "40px", height: "40px", borderRadius: "8px" }
   };
-  return /* @__PURE__ */ jsxs(Flex, { align: "center", className: "tipp-pagination", children: [
-    /* @__PURE__ */ jsx(
-      IconButton,
-      __spreadProps(__spreadValues({
-        disabled: !doublePrev,
-        onClick: onClickDoublePrev
-      }, moveButtonProps), {
-        children: /* @__PURE__ */ jsx(DoubleArrowLeftIcon, __spreadValues({}, iconSize))
-      })
-    ),
-    /* @__PURE__ */ jsx(IconButton, __spreadProps(__spreadValues({ disabled: !prev, onClick: onClickPrev }, moveButtonProps), { children: /* @__PURE__ */ jsx(ChevronLeftIcon, __spreadValues({}, iconSize)) })),
-    /* @__PURE__ */ jsx(Flex, { gap: "1", children: visibleItems.map((item) => {
-      return /* @__PURE__ */ jsx(
-        "button",
-        {
-          className: `page-button ${item === page ? "active" : ""}`,
-          onClick: () => {
-            goToPage(item);
-          },
-          type: "button",
-          children: /* @__PURE__ */ jsx(Typo, { variant: "body", children: item })
-        },
-        item
-      );
-    }) }),
-    /* @__PURE__ */ jsx(IconButton, __spreadProps(__spreadValues({ disabled: !next, onClick: onClickNext }, moveButtonProps), { children: /* @__PURE__ */ jsx(ChevronRightIcon, __spreadValues({}, iconSize)) })),
-    /* @__PURE__ */ jsx(
-      IconButton,
-      __spreadProps(__spreadValues({
-        disabled: !doubleNext,
-        onClick: onClickDoubleNext
-      }, moveButtonProps), {
-        children: /* @__PURE__ */ jsx(DoubleArrowRightIcon, __spreadValues({}, iconSize))
-      })
-    )
-  ] });
+  const { color: resolvedColor, className: colorClassName } = resolveColor(
+    props.color
+  );
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      align: "center",
+      gap: "1",
+      className: colorClassName ? `tipp-pagination ${colorClassName}` : "tipp-pagination",
+      "data-accent-color": resolvedColor,
+      children: [
+        /* @__PURE__ */ jsx(
+          IconButton,
+          __spreadProps(__spreadValues({
+            disabled: !doublePrev,
+            onClick: onClickDoublePrev
+          }, moveButtonProps), {
+            children: /* @__PURE__ */ jsx(DoubleArrowLeftIcon, __spreadValues({}, iconSize))
+          })
+        ),
+        /* @__PURE__ */ jsx(IconButton, __spreadProps(__spreadValues({ disabled: !prev, onClick: onClickPrev }, moveButtonProps), { children: /* @__PURE__ */ jsx(ChevronLeftIcon, __spreadValues({}, iconSize)) })),
+        /* @__PURE__ */ jsx(Flex, { gap: "1", children: visibleItems.map((item) => {
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              className: `page-button ${item === page ? "active" : ""}`,
+              onClick: () => {
+                goToPage(item);
+              },
+              type: "button",
+              children: /* @__PURE__ */ jsx(Typo, { variant: "body", children: item })
+            },
+            item
+          );
+        }) }),
+        /* @__PURE__ */ jsx(IconButton, __spreadProps(__spreadValues({ disabled: !next, onClick: onClickNext }, moveButtonProps), { children: /* @__PURE__ */ jsx(ChevronRightIcon, __spreadValues({}, iconSize)) })),
+        /* @__PURE__ */ jsx(
+          IconButton,
+          __spreadProps(__spreadValues({
+            disabled: !doubleNext,
+            onClick: onClickDoubleNext
+          }, moveButtonProps), {
+            children: /* @__PURE__ */ jsx(DoubleArrowRightIcon, __spreadValues({}, iconSize))
+          })
+        )
+      ]
+    }
+  );
 }
 
 export {
   Pagination
 };
-//# sourceMappingURL=chunk-HQATHJBN.js.map
+//# sourceMappingURL=chunk-IA74OBFY.js.map

package/dist/chunk-IA74OBFY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/pagination.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react';\nimport {\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  DoubleArrowLeftIcon,\n  DoubleArrowRightIcon,\n} from '../icon';\nimport type { IconButtonProps } from './icon-button';\nimport { IconButton } from './icon-button';\nimport { Flex } from './flex';\nimport { Typo } from './typo';\nimport { resolveColor, type UiColor } from '../utils/resolve-color';\n\nexport interface PaginationProps {\n  /** 현재 선택된 페이지, 1부터 시작. 지정 시 controlled 모드로 동작한다. */\n  page?: number;\n  /** 기본 선택 페이지, page보다 낮은 우선 순위를 갖는다 */\n  defaultPage?: number;\n  /** 선택한 페이지 변경 이벤트 cb */\n  onChange?: (page: number) => void;\n  /** 전체 페이지의 수 */\n  count?: number;\n  /** 표시할 페이지 버튼의 개수 */\n  siblingCount?: number;\n  /** 선택된 페이지 강조에 사용할 accent color. black 등 커스텀 color 지원. */\n  color?: UiColor;\n}\n\nexport function Pagination(props: PaginationProps): React.ReactNode {\n  const { onChange, count = 0, siblingCount = 2 } = props;\n\n  const isControlled = props.page !== undefined;\n  const [internalPage, setInternalPage] = useState(props.defaultPage || 1);\n  const page = isControlled ? (props.page as number) : internalPage;\n\n  const goToPage = useCallback(\n    (next: number) => {\n      if (!isControlled) {\n        setInternalPage(next);\n      }\n      onChange?.(next);\n    },\n    [isControlled, onChange]\n  );\n\n  const visibleItems = useMemo(() => {\n    let start = Math.max(1, page - siblingCount);\n    let end = Math.min(count, page + siblingCount);\n    if (page - siblingCount <= 0 && end < count) {\n      end = Math.min(count, end + Math.abs(page - siblingCount) + 1);\n    } else if (page + siblingCount > count && start > 1) {\n      start = Math.max(1, start - (page + siblingCount - count));\n    }\n\n    return Array.from({ length: end - start + 1 }, (_, i) => i + start);\n  }, [count, page, siblingCount]);\n\n  const prev = useMemo<number | undefined>(() => {\n    const p = page - 1;\n    return p < 1 ? undefined : p;\n  }, [page]);\n\n  const next = useMemo<number | undefined>(() => {\n    const n = page + 1;\n    return n > count ? undefined : n;\n  }, [count, page]);\n\n  const onClickPrev = useCallback(() => {\n    if (prev) goToPage(prev);\n  }, [prev, goToPage]);\n\n  const onClickNext = useCallback(() => {\n    if (next) goToPage(next);\n  }, [next, goToPage]);\n\n  const doublePrev = useMemo<number | undefined>(() => {\n    if (!visibleItems.length) return;\n    return Math.max(0, visibleItems[0] - 1);\n  }, [visibleItems]);\n\n  const onClickDoublePrev = useCallback(() => {\n    if (doublePrev) goToPage(doublePrev);\n  }, [doublePrev, goToPage]);\n\n  const doubleNext = useMemo<number | undefined>(() => {\n    if (!visibleItems.length) return;\n    const n = visibleItems[visibleItems.length - 1] + 1;\n    if (n > count) return;\n    return Math.min(count, n);\n  }, [count, visibleItems]);\n\n  const onClickDoubleNext = useCallback(() => {\n    if (doubleNext) goToPage(doubleNext);\n  }, [doubleNext, goToPage]);\n\n  const iconSize = {\n    height: 24,\n    width: 24,\n  };\n\n  const moveButtonProps: IconButtonProps = {\n    variant: 'ghost',\n    size: 'large',\n    // 숫자 페이지 버튼(40x40)과 동일한 크기·사각(8px) hover 영역으로 통일한다.\n    // (size 'large'는 48x48이라 숫자 버튼보다 커서 width/height를 명시로 덮어쓴다.)\n    style: { width: '40px', height: '40px', borderRadius: '8px' },\n  };\n\n  const { color: resolvedColor, className: colorClassName } = resolveColor(\n    props.color\n  );\n\n  return (\n    <Flex\n      align=\"center\"\n      // 화살표·숫자 버튼 모든 인접 간격을 숫자 그룹과 동일한 4px(gap \"1\")로 통일한다.\n      gap=\"1\"\n      className={\n        colorClassName\n          ? `tipp-pagination ${colorClassName}`\n          : 'tipp-pagination'\n      }\n      data-accent-color={resolvedColor}\n    >\n      <IconButton\n        disabled={!doublePrev}\n        onClick={onClickDoublePrev}\n        {...moveButtonProps}\n      >\n        <DoubleArrowLeftIcon {...iconSize} />\n      </IconButton>\n      <IconButton disabled={!prev} onClick={onClickPrev} {...moveButtonProps}>\n        <ChevronLeftIcon {...iconSize} />\n      </IconButton>\n      <Flex gap=\"1\">\n        {visibleItems.map((item) => {\n          return (\n            <button\n              className={`page-button ${item === page ? 'active' : ''}`}\n              key={item}\n              onClick={() => {\n                goToPage(item);\n              }}\n              type=\"button\"\n            >\n              <Typo variant=\"body\">{item}</Typo>\n            </button>\n          );\n        })}\n      </Flex>\n      <IconButton disabled={!next} onClick={onClickNext} {...moveButtonProps}>\n        <ChevronRightIcon {...iconSize} />\n      </IconButton>\n      <IconButton\n        disabled={!doubleNext}\n        onClick={onClickDoubleNext}\n        {...moveButtonProps}\n      >\n        <DoubleArrowRightIcon {...iconSize} />\n      </IconButton>\n    </Flex>\n  );\n}\n"],"mappings":"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","names":["next"]}

package/dist/{chunk-J62KAMQL.js → chunk-IM6E52L2.js}

@@ -3,28 +3,28 @@ import {
 } from "./chunk-MUPK4L3U.js";
 import {
   Popover
-} from "./chunk-5AVBYDPB.js";
+} from "./chunk-RMW3MQF5.js";
 import {
   Grid
 } from "./chunk-EGEQY3KT.js";
+import {
+  Typo
+} from "./chunk-GR4PG6HY.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
 import {
   Button
-} from "./chunk-ZVDAEY5Q.js";
+} from "./chunk-2LCH3PDF.js";
+import {
+  CheckIcon
+} from "./chunk-VOME2TE7.js";
 import {
   AutoSizingInput
 } from "./chunk-6SYFG6YY.js";
 import {
   Badge
-} from "./chunk-KTSEZC6A.js";
-import {
-  CheckIcon
-} from "./chunk-VOME2TE7.js";
-import {
-  Typo
-} from "./chunk-PMJIFLDT.js";
+} from "./chunk-BK74U562.js";
 
 // src/molecules/tag-selector.tsx
 import {
@@ -360,4 +360,4 @@ var preventDefault = (e) => {
 export {
   TagSelector
 };
-//# sourceMappingURL=chunk-J62KAMQL.js.map
+//# sourceMappingURL=chunk-IM6E52L2.js.map

package/dist/{chunk-TVDKGMBI.js → chunk-IT7ZTP7F.js}

@@ -4,4 +4,4 @@ import { SegmentedControl } from "@radix-ui/themes";
 export {
   SegmentedControl
 };
-//# sourceMappingURL=chunk-TVDKGMBI.js.map
+//# sourceMappingURL=chunk-IT7ZTP7F.js.map

package/dist/chunk-IT7ZTP7F.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/segmented-control.tsx"],"sourcesContent":["// SegmentedControl은 Radix가 의도적으로 중립(gray/surface) 디자인으로 만들어 accent 변수를\n// 전혀 쓰지 않는다. 따라서 black 등 accent override가 무효과(no-op)라 color를 노출하지 않고\n// 순수 re-export를 유지한다. (color가 필요하면 Radix 차원의 디자인 변경이 선행돼야 함)\nexport { SegmentedControl } from '@radix-ui/themes';\n"],"mappings":";AAGA,SAAS,wBAAwB;","names":[]}

package/dist/{chunk-5LRFDSG2.js → chunk-J7N2IZQW.js}

@@ -1,15 +1,15 @@
+import {
+  Typo
+} from "./chunk-GR4PG6HY.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
-import {
-  Avatar
-} from "./chunk-K36TPMKL.js";
 import {
   CheckIcon
 } from "./chunk-VOME2TE7.js";
 import {
-  Typo
-} from "./chunk-PMJIFLDT.js";
+  Avatar
+} from "./chunk-GPZXD762.js";
 
 // src/molecules/stepper.tsx
 import { createContext, Children, useContext, useMemo } from "react";
@@ -166,4 +166,4 @@ var Stepper = {
 export {
   Stepper
 };
-//# sourceMappingURL=chunk-5LRFDSG2.js.map
+//# sourceMappingURL=chunk-J7N2IZQW.js.map

package/dist/{chunk-EEAHZCIK.js → chunk-JCUG2XKB.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-U7N2PWMO.js";
 import {
   IconButton
-} from "./chunk-XK6VEVOK.js";
+} from "./chunk-7RJYF5L3.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
@@ -91,4 +91,4 @@ export {
   Trigger2 as Trigger,
   Drawer
 };
-//# sourceMappingURL=chunk-EEAHZCIK.js.map
+//# sourceMappingURL=chunk-JCUG2XKB.js.map

package/dist/chunk-JETG3WEI.js

@@ -0,0 +1,39 @@
+import {
+  resolveColor
+} from "./chunk-VFQD57ZY.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-CRTRMMJ7.js";
+
+// src/atoms/check-box-card.tsx
+import { CheckboxCards as RadixCheckboxCards } from "@radix-ui/themes";
+import { clsx } from "clsx";
+import { forwardRef, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+var Root = forwardRef((props, ref) => {
+  const _a = props, { color, className } = _a, rest = __objRest(_a, ["color", "className"]);
+  const { color: radixColor, className: colorClassName } = useMemo(
+    () => resolveColor(color),
+    [color]
+  );
+  const appliedColor = colorClassName ? void 0 : radixColor;
+  return /* @__PURE__ */ jsx(
+    RadixCheckboxCards.Root,
+    __spreadProps(__spreadValues({}, rest), {
+      className: clsx(colorClassName, className),
+      color: appliedColor,
+      ref
+    })
+  );
+});
+Root.displayName = "CheckboxCards.Root";
+var CheckboxCards = __spreadProps(__spreadValues({}, RadixCheckboxCards), {
+  Root
+});
+
+export {
+  CheckboxCards
+};
+//# sourceMappingURL=chunk-JETG3WEI.js.map

package/dist/chunk-JETG3WEI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/check-box-card.tsx"],"sourcesContent":["import { CheckboxCards as RadixCheckboxCards } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, useMemo } from 'react';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\n\ntype CheckboxCardsRootProps = DistributiveOmit<\n  React.ComponentPropsWithoutRef<typeof RadixCheckboxCards.Root>,\n  'color'\n> & {\n  color?: UiColor;\n};\n\nconst Root = forwardRef<\n  React.ElementRef<typeof RadixCheckboxCards.Root>,\n  CheckboxCardsRootProps\n>((props, ref) => {\n  const { color, className, ...rest } = props;\n\n  const { color: radixColor, className: colorClassName } = useMemo(\n    () => resolveColor(color),\n    [color]\n  );\n\n  // custom color(black)는 className의 변수 override만 사용한다. fallback color를 함께 넘기면\n  // CheckboxCards가 그 color를 자식 Item으로 전파하고, 각 Item이 자기 `data-accent-color`로\n  // gray를 다시 적용해 조상 className override를 자식 스코프에서 덮어버린다.\n  const appliedColor = colorClassName ? undefined : radixColor;\n\n  return (\n    <RadixCheckboxCards.Root\n      {...rest}\n      className={clsx(colorClassName, className)}\n      color={appliedColor}\n      ref={ref}\n    />\n  );\n});\n\nRoot.displayName = 'CheckboxCards.Root';\n\nexport const CheckboxCards: Omit<typeof RadixCheckboxCards, 'Root'> & {\n  Root: typeof Root;\n} = {\n  ...RadixCheckboxCards,\n  Root,\n};\n\n"],"mappings":";;;;;;;;;;AAAA,SAAS,iBAAiB,0BAA0B;AACpD,SAAS,YAAY;AACrB,SAAgB,YAAY,eAAe;AA+BvC;AAjBJ,IAAM,OAAO,WAGX,CAAC,OAAO,QAAQ;AAChB,QAAsC,YAA9B,SAAO,UApBjB,IAoBwC,IAAT,iBAAS,IAAT,CAArB,SAAO;AAEf,QAAM,EAAE,OAAO,YAAY,WAAW,eAAe,IAAI;AAAA,IACvD,MAAM,aAAa,KAAK;AAAA,IACxB,CAAC,KAAK;AAAA,EACR;AAKA,QAAM,eAAe,iBAAiB,SAAY;AAElD,SACE;AAAA,IAAC,mBAAmB;AAAA,IAAnB,iCACK,OADL;AAAA,MAEC,WAAW,KAAK,gBAAgB,SAAS;AAAA,MACzC,OAAO;AAAA,MACP;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,KAAK,cAAc;AAEZ,IAAM,gBAET,iCACC,qBADD;AAAA,EAEF;AACF;","names":[]}

package/dist/{chunk-4LUFF5LX.js → chunk-JNEGSY5N.js}

@@ -1,12 +1,12 @@
 import {
   sidebar_item_default
-} from "./chunk-NVQSH733.js";
+} from "./chunk-NFMEBYNY.js";
 import {
   useCurriculumContext
 } from "./chunk-WA5A2GB4.js";
 import {
   Tabs
-} from "./chunk-5ZITU5L7.js";
+} from "./chunk-CGDBUDY3.js";
 import {
   Grid
 } from "./chunk-EGEQY3KT.js";
@@ -95,4 +95,4 @@ function CurriculumSidebar() {
 export {
   CurriculumSidebar
 };
-//# sourceMappingURL=chunk-4LUFF5LX.js.map
+//# sourceMappingURL=chunk-JNEGSY5N.js.map

package/dist/{chunk-CQSM6JCO.js → chunk-K3Q4XLCN.js}

@@ -4,15 +4,15 @@ import {
 import {
   Grid
 } from "./chunk-EGEQY3KT.js";
+import {
+  Box
+} from "./chunk-4Y5BEXVN.js";
 import {
   Flex
 } from "./chunk-25HMMI7R.js";
 import {
   AspectRatio
 } from "./chunk-EAXUQEO5.js";
-import {
-  Box
-} from "./chunk-4Y5BEXVN.js";
 
 // src/molecules/curriculumV2/curriculum-v2-layout.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -62,4 +62,4 @@ function CurriculumV2Layout(props) {
 export {
   CurriculumV2Layout
 };
-//# sourceMappingURL=chunk-CQSM6JCO.js.map
+//# sourceMappingURL=chunk-K3Q4XLCN.js.map