@tipp/ui 2.5.0 → 2.7.0

package/dist/atoms/popover.cjs

@@ -1,8 +1,37 @@
 "use strict";
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -20,10 +49,65 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/atoms/popover.tsx
 var popover_exports = {};
 __export(popover_exports, {
-  Popover: () => import_themes.Popover
+  Popover: () => Popover
 });
 module.exports = __toCommonJS(popover_exports);
+var import_themes2 = require("@radix-ui/themes");
+var import_clsx2 = require("clsx");
+var import_react2 = require("react");
+
+// src/utils/resolve-color.ts
+var SEMANTIC_COLOR_MAP = {
+  error: "red",
+  neutral: "gray",
+  success: "green",
+  accent: void 0
+};
+var CUSTOM_COLOR_MAP = {
+  black: { className: "tipp-accent-black", fallbackColor: "gray" }
+};
+var isSemanticColor = (color) => color !== void 0 && color in SEMANTIC_COLOR_MAP;
+var isCustomColor = (color) => color !== void 0 && color in CUSTOM_COLOR_MAP;
+var resolveColor = (color) => {
+  if (isCustomColor(color)) {
+    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];
+    return { color: fallbackColor, className };
+  }
+  if (isSemanticColor(color)) {
+    return { color: SEMANTIC_COLOR_MAP[color] };
+  }
+  return { color };
+};
+
+// src/theme/theme-provider.tsx
+var import_react = require("react");
 var import_themes = require("@radix-ui/themes");
+var import_clsx = require("clsx");
+var import_jsx_runtime = require("react/jsx-runtime");
+var ThemeAccentContext = (0, import_react.createContext)(void 0);
+
+// src/atoms/popover.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Content = (0, import_react2.forwardRef)((props, ref) => {
+  const _a = props, { className, color } = _a, rest = __objRest(_a, ["className", "color"]);
+  const themeAccent = (0, import_react2.useContext)(ThemeAccentContext);
+  const { className: colorClassName } = (0, import_react2.useMemo)(
+    () => resolveColor(color != null ? color : themeAccent),
+    [color, themeAccent]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_themes2.Popover.Content,
+    __spreadProps(__spreadValues({
+      ref
+    }, rest), {
+      className: (0, import_clsx2.clsx)(colorClassName, className)
+    })
+  );
+});
+Content.displayName = "Popover.Content";
+var Popover = __spreadProps(__spreadValues({}, import_themes2.Popover), {
+  Content
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Popover

package/dist/atoms/popover.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/atoms/popover.tsx"],"sourcesContent":["export { Popover } from '@radix-ui/themes';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAwB;","names":[]}
+{"version":3,"sources":["../../src/atoms/popover.tsx","../../src/utils/resolve-color.ts","../../src/theme/theme-provider.tsx"],"sourcesContent":["import { Popover as RadixPopover } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { forwardRef, useContext, useMemo } from 'react';\nimport { resolveColor, type UiColor } from '../utils/resolve-color';\nimport { ThemeAccentContext } from '../theme/theme-provider';\n\ntype ContentProps = RadixPopover.ContentProps & {\n  /** Portal 내부에 적용할 color. 미지정 시 theme custom accent(black)를 상속한다. */\n  color?: UiColor;\n};\n\nconst Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {\n  const { className, color, ...rest } = props;\n  const themeAccent = useContext(ThemeAccentContext);\n\n  // Content는 Portal(body)로 렌더돼 theme의 className override를 못 받으므로, per-instance color가\n  // 없으면 theme custom accent(black)를 fallback으로 적용해 Portal 안에서도 black을 유지한다.\n  const { className: colorClassName } = useMemo(\n    () => resolveColor(color ?? themeAccent),\n    [color, themeAccent]\n  );\n\n  return (\n    <RadixPopover.Content\n      ref={ref}\n      {...rest}\n      className={clsx(colorClassName, className)}\n    />\n  );\n});\n\nContent.displayName = 'Popover.Content';\n\nexport const Popover = {\n  ...RadixPopover,\n  Content,\n};\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n","import React, { createContext } from 'react';\nimport { Theme } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { resolveColor, type UiColor } from '../utils/resolve-color';\n\ntype ThemeProps = React.ComponentProps<typeof Theme>;\n\n/**\n * 테마 전역 primary가 custom color(black 등)일 때 그 값을 하위로 전달하는 context.\n * Radix는 Portal 컨텐츠(Select 드롭다운 등)에 theme의 accentColor \"값\"(여기선 fallback gray)만\n * 복제하고 `.tipp-accent-black` className은 복제하지 않으므로, Portal 안에서는 accent override가\n * 사라진다. 래핑된 overlay 컴포넌트(Select 등)가 이 context를 최하위 fallback color로 읽어\n * 자기 요소에 className을 직접 부여하면 Portal 내부에서도 black이 유지된다.\n * (custom accent가 아닐 때는 undefined — Radix 네이티브 portal 상속에 맡긴다.)\n */\nexport const ThemeAccentContext = createContext<UiColor | undefined>(undefined);\n\nexport interface ThemeProviderProps extends Omit<ThemeProps, 'accentColor'> {\n  children: React.ReactNode;\n  /**\n   * 전역 primary(accent) color. Radix accent color에 더해 커스텀 `black`을 지원한다.\n   * black이면 Radix에는 fallback `gray`를 넘기고 Theme 루트에 accent override\n   * className을 부여하여 하위 컴포넌트가 color prop 없이도 black을 상속한다.\n   */\n  accentColor?: ThemeProps['accentColor'] | 'black';\n}\n\nexport function ThemeProvider(props: ThemeProviderProps): React.ReactNode {\n  const { accentColor = 'iris', className, ...rest } = props;\n\n  const { color: radixAccent, className: accentClassName } =\n    resolveColor(accentColor);\n\n  // custom accent(className이 생기는 경우 = black)일 때만 Portal 보정용으로 context에 흘린다.\n  const themeAccent = accentClassName ? accentColor : undefined;\n\n  return (\n    <ThemeAccentContext.Provider value={themeAccent}>\n      <Theme\n        accentColor={radixAccent ?? 'iris'}\n        className={clsx(accentClassName, className)}\n        radius=\"medium\"\n        {...rest}\n      />\n    </ThemeAccentContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAAA,iBAAwC;AACxC,IAAAC,eAAqB;AACrB,IAAAC,gBAAgD;;;AC2BhD,IAAM,qBAAoE;AAAA,EACxE,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AACV;AAgBA,IAAM,mBAA2D;AAAA,EAC/D,OAAO,EAAE,WAAW,qBAAqB,eAAe,OAAO;AACjE;AAEA,IAAM,kBAAkB,CAAC,UACvB,UAAU,UAAa,SAAS;AAElC,IAAM,gBAAgB,CAAC,UACrB,UAAU,UAAa,SAAS;AAgB3B,IAAM,eAAe,CAAC,UAAmC;AAC9D,MAAI,cAAc,KAAK,GAAG;AACxB,UAAM,EAAE,WAAW,cAAc,IAAI,iBAAiB,KAAK;AAC3D,WAAO,EAAE,OAAO,eAAe,UAAU;AAAA,EAC3C;AAEA,MAAI,gBAAgB,KAAK,GAAG;AAC1B,WAAO,EAAE,OAAO,mBAAmB,KAAK,EAAE;AAAA,EAC5C;AAEA,SAAO,EAAE,MAAM;AACjB;;;ACrFA,mBAAqC;AACrC,oBAAsB;AACtB,kBAAqB;AAoCf;AAvBC,IAAM,yBAAqB,4BAAmC,MAAS;;;AFQ1E,IAAAC,sBAAA;AAZJ,IAAM,cAAU,0BAAyC,CAAC,OAAO,QAAQ;AACvE,QAAsC,YAA9B,aAAW,MAZrB,IAYwC,IAAT,iBAAS,IAAT,CAArB,aAAW;AACnB,QAAM,kBAAc,0BAAW,kBAAkB;AAIjD,QAAM,EAAE,WAAW,eAAe,QAAI;AAAA,IACpC,MAAM,aAAa,wBAAS,WAAW;AAAA,IACvC,CAAC,OAAO,WAAW;AAAA,EACrB;AAEA,SACE;AAAA,IAAC,eAAAC,QAAa;AAAA,IAAb;AAAA,MACC;AAAA,OACI,OAFL;AAAA,MAGC,eAAW,mBAAK,gBAAgB,SAAS;AAAA;AAAA,EAC3C;AAEJ,CAAC;AAED,QAAQ,cAAc;AAEf,IAAM,UAAU,iCAClB,eAAAA,UADkB;AAAA,EAErB;AACF;","names":["import_themes","import_clsx","import_react","import_jsx_runtime","RadixPopover"]}

package/dist/atoms/popover.d.cts

@@ -1 +1,16 @@
-export { Popover } from '@radix-ui/themes';
+import * as React from 'react';
+import { Popover as Popover$1 } from '@radix-ui/themes';
+import { UiColor } from '../utils/resolve-color.cjs';
+
+declare const Popover: {
+    Content: React.ForwardRefExoticComponent<Popover$1.ContentProps & {
+        /** Portal 내부에 적용할 color. 미지정 시 theme custom accent(black)를 상속한다. */
+        color?: UiColor;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Root: React.FC<Popover$1.RootProps>;
+    Trigger: React.ForwardRefExoticComponent<Popover$1.TriggerProps & React.RefAttributes<HTMLButtonElement>>;
+    Close: React.ForwardRefExoticComponent<Popover$1.CloseProps & React.RefAttributes<HTMLButtonElement>>;
+    Anchor: React.ForwardRefExoticComponent<Popover$1.AnchorProps & React.RefAttributes<HTMLDivElement>>;
+};
+
+export { Popover };

package/dist/atoms/popover.d.ts

@@ -1 +1,16 @@
-export { Popover } from '@radix-ui/themes';
+import * as React from 'react';
+import { Popover as Popover$1 } from '@radix-ui/themes';
+import { UiColor } from '../utils/resolve-color.js';
+
+declare const Popover: {
+    Content: React.ForwardRefExoticComponent<Popover$1.ContentProps & {
+        /** Portal 내부에 적용할 color. 미지정 시 theme custom accent(black)를 상속한다. */
+        color?: UiColor;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Root: React.FC<Popover$1.RootProps>;
+    Trigger: React.ForwardRefExoticComponent<Popover$1.TriggerProps & React.RefAttributes<HTMLButtonElement>>;
+    Close: React.ForwardRefExoticComponent<Popover$1.CloseProps & React.RefAttributes<HTMLButtonElement>>;
+    Anchor: React.ForwardRefExoticComponent<Popover$1.AnchorProps & React.RefAttributes<HTMLDivElement>>;
+};
+
+export { Popover };

package/dist/atoms/popover.js

@@ -1,6 +1,8 @@
 import {
   Popover
-} from "../chunk-5AVBYDPB.js";
+} from "../chunk-RMW3MQF5.js";
+import "../chunk-WYWM2HSZ.js";
+import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {
   Popover

package/dist/atoms/progress.cjs

@@ -1,8 +1,37 @@
 "use strict";
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -20,10 +49,51 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/atoms/progress.tsx
 var progress_exports = {};
 __export(progress_exports, {
-  Progress: () => import_themes.Progress
+  Progress: () => Progress
 });
 module.exports = __toCommonJS(progress_exports);
 var import_themes = require("@radix-ui/themes");
+var import_clsx = require("clsx");
+var import_react = require("react");
+
+// src/utils/resolve-color.ts
+var SEMANTIC_COLOR_MAP = {
+  error: "red",
+  neutral: "gray",
+  success: "green",
+  accent: void 0
+};
+var CUSTOM_COLOR_MAP = {
+  black: { className: "tipp-accent-black", fallbackColor: "gray" }
+};
+var isSemanticColor = (color) => color !== void 0 && color in SEMANTIC_COLOR_MAP;
+var isCustomColor = (color) => color !== void 0 && color in CUSTOM_COLOR_MAP;
+var resolveColor = (color) => {
+  if (isCustomColor(color)) {
+    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];
+    return { color: fallbackColor, className };
+  }
+  if (isSemanticColor(color)) {
+    return { color: SEMANTIC_COLOR_MAP[color] };
+  }
+  return { color };
+};
+
+// src/atoms/progress.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Progress = (0, import_react.forwardRef)((props, ref) => {
+  const _a = props, { color, className } = _a, rest = __objRest(_a, ["color", "className"]);
+  const { color: radixColor, className: colorClassName } = resolveColor(color);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_themes.Progress,
+    __spreadProps(__spreadValues({}, rest), {
+      className: (0, import_clsx.clsx)(colorClassName, className),
+      color: radixColor,
+      ref
+    })
+  );
+});
+Progress.displayName = "Progress";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Progress

package/dist/atoms/progress.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/atoms/progress.tsx"],"sourcesContent":["export { Progress, type ProgressProps } from '@radix-ui/themes';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA6C;","names":[]}
+{"version":3,"sources":["../../src/atoms/progress.tsx","../../src/utils/resolve-color.ts"],"sourcesContent":["import {\n  Progress as RadixProgress,\n  type ProgressProps as RadixProgressProps,\n} from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport React, { forwardRef } from 'react';\nimport { resolveColor, type UiColor } from '../utils/resolve-color';\n\nexport type ProgressProps = Omit<RadixProgressProps, 'color'> & {\n  color?: UiColor;\n};\n\nexport const Progress = forwardRef<\n  React.ComponentRef<typeof RadixProgress>,\n  ProgressProps\n>((props, ref): React.ReactNode => {\n  const { color, className, ...rest } = props;\n\n  const { color: radixColor, className: colorClassName } = resolveColor(color);\n\n  return (\n    <RadixProgress\n      {...rest}\n      className={clsx(colorClassName, className)}\n      color={radixColor}\n      ref={ref}\n    />\n  );\n});\n\nProgress.displayName = 'Progress';\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAGO;AACP,kBAAqB;AACrB,mBAAkC;;;ACwBlC,IAAM,qBAAoE;AAAA,EACxE,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AACV;AAgBA,IAAM,mBAA2D;AAAA,EAC/D,OAAO,EAAE,WAAW,qBAAqB,eAAe,OAAO;AACjE;AAEA,IAAM,kBAAkB,CAAC,UACvB,UAAU,UAAa,SAAS;AAElC,IAAM,gBAAgB,CAAC,UACrB,UAAU,UAAa,SAAS;AAgB3B,IAAM,eAAe,CAAC,UAAmC;AAC9D,MAAI,cAAc,KAAK,GAAG;AACxB,UAAM,EAAE,WAAW,cAAc,IAAI,iBAAiB,KAAK;AAC3D,WAAO,EAAE,OAAO,eAAe,UAAU;AAAA,EAC3C;AAEA,MAAI,gBAAgB,KAAK,GAAG;AAC1B,WAAO,EAAE,OAAO,mBAAmB,KAAK,EAAE;AAAA,EAC5C;AAEA,SAAO,EAAE,MAAM;AACjB;;;ADhEI;AATG,IAAM,eAAW,yBAGtB,CAAC,OAAO,QAAyB;AACjC,QAAsC,YAA9B,SAAO,UAhBjB,IAgBwC,IAAT,iBAAS,IAAT,CAArB,SAAO;AAEf,QAAM,EAAE,OAAO,YAAY,WAAW,eAAe,IAAI,aAAa,KAAK;AAE3E,SACE;AAAA,IAAC,cAAAA;AAAA,IAAA,iCACK,OADL;AAAA,MAEC,eAAW,kBAAK,gBAAgB,SAAS;AAAA,MACzC,OAAO;AAAA,MACP;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,SAAS,cAAc;","names":["RadixProgress"]}

package/dist/atoms/progress.d.cts

@@ -1 +1,12 @@
-export { Progress, ProgressProps } from '@radix-ui/themes';
+import { ProgressProps as ProgressProps$1 } from '@radix-ui/themes';
+import React__default from 'react';
+import { UiColor } from '../utils/resolve-color.cjs';
+
+type ProgressProps = Omit<ProgressProps$1, 'color'> & {
+    color?: UiColor;
+};
+declare const Progress: React__default.ForwardRefExoticComponent<Omit<ProgressProps$1, "color"> & {
+    color?: UiColor;
+} & React__default.RefAttributes<any>>;
+
+export { Progress, type ProgressProps };

package/dist/atoms/progress.d.ts

@@ -1 +1,12 @@
-export { Progress, ProgressProps } from '@radix-ui/themes';
+import { ProgressProps as ProgressProps$1 } from '@radix-ui/themes';
+import React__default from 'react';
+import { UiColor } from '../utils/resolve-color.js';
+
+type ProgressProps = Omit<ProgressProps$1, 'color'> & {
+    color?: UiColor;
+};
+declare const Progress: React__default.ForwardRefExoticComponent<Omit<ProgressProps$1, "color"> & {
+    color?: UiColor;
+} & React__default.RefAttributes<any>>;
+
+export { Progress, type ProgressProps };

package/dist/atoms/progress.js

@@ -1,6 +1,7 @@
 import {
   Progress
-} from "../chunk-365QMK4D.js";
+} from "../chunk-TNNF5Q62.js";
+import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {
   Progress

package/dist/atoms/radio-cards.cjs

@@ -1,8 +1,37 @@
 "use strict";
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -20,10 +49,58 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/atoms/radio-cards.tsx
 var radio_cards_exports = {};
 __export(radio_cards_exports, {
-  RadioCards: () => import_themes.RadioCards
+  RadioCards: () => RadioCards
 });
 module.exports = __toCommonJS(radio_cards_exports);
 var import_themes = require("@radix-ui/themes");
+var import_clsx = require("clsx");
+var import_react = require("react");
+
+// src/utils/resolve-color.ts
+var SEMANTIC_COLOR_MAP = {
+  error: "red",
+  neutral: "gray",
+  success: "green",
+  accent: void 0
+};
+var CUSTOM_COLOR_MAP = {
+  black: { className: "tipp-accent-black", fallbackColor: "gray" }
+};
+var isSemanticColor = (color) => color !== void 0 && color in SEMANTIC_COLOR_MAP;
+var isCustomColor = (color) => color !== void 0 && color in CUSTOM_COLOR_MAP;
+var resolveColor = (color) => {
+  if (isCustomColor(color)) {
+    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];
+    return { color: fallbackColor, className };
+  }
+  if (isSemanticColor(color)) {
+    return { color: SEMANTIC_COLOR_MAP[color] };
+  }
+  return { color };
+};
+
+// src/atoms/radio-cards.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Root = (0, import_react.forwardRef)((props, ref) => {
+  const _a = props, { color, className } = _a, rest = __objRest(_a, ["color", "className"]);
+  const { color: radixColor, className: colorClassName } = (0, import_react.useMemo)(
+    () => resolveColor(color),
+    [color]
+  );
+  const appliedColor = colorClassName ? void 0 : radixColor;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_themes.RadioCards.Root,
+    __spreadProps(__spreadValues({}, rest), {
+      className: (0, import_clsx.clsx)(colorClassName, className),
+      color: appliedColor,
+      ref
+    })
+  );
+});
+Root.displayName = "RadioCards.Root";
+var RadioCards = __spreadProps(__spreadValues({}, import_themes.RadioCards), {
+  Root
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   RadioCards

package/dist/atoms/radio-cards.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/atoms/radio-cards.tsx"],"sourcesContent":["export { RadioCards } from '@radix-ui/themes';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA2B;","names":[]}
+{"version":3,"sources":["../../src/atoms/radio-cards.tsx","../../src/utils/resolve-color.ts"],"sourcesContent":["import { RadioCards as RadixRadioCards } 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 RadioCardsRootProps = DistributiveOmit<\n  React.ComponentPropsWithoutRef<typeof RadixRadioCards.Root>,\n  'color'\n> & {\n  color?: UiColor;\n};\n\nconst Root = forwardRef<\n  React.ElementRef<typeof RadixRadioCards.Root>,\n  RadioCardsRootProps\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  // RadioCards가 그 color를 자식 Item으로 전파하고, 각 Item이 자기 `data-accent-color`로\n  // gray를 다시 적용해 조상 className override를 자식 스코프에서 덮어버린다.\n  const appliedColor = colorClassName ? undefined : radixColor;\n\n  return (\n    <RadixRadioCards.Root\n      {...rest}\n      className={clsx(colorClassName, className)}\n      color={appliedColor}\n      ref={ref}\n    />\n  );\n});\n\nRoot.displayName = 'RadioCards.Root';\n\nexport const RadioCards = {\n  ...RadixRadioCards,\n  Root,\n};\n\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA8C;AAC9C,kBAAqB;AACrB,mBAA2C;;;AC2B3C,IAAM,qBAAoE;AAAA,EACxE,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AACV;AAgBA,IAAM,mBAA2D;AAAA,EAC/D,OAAO,EAAE,WAAW,qBAAqB,eAAe,OAAO;AACjE;AAEA,IAAM,kBAAkB,CAAC,UACvB,UAAU,UAAa,SAAS;AAElC,IAAM,gBAAgB,CAAC,UACrB,UAAU,UAAa,SAAS;AAgB3B,IAAM,eAAe,CAAC,UAAmC;AAC9D,MAAI,cAAc,KAAK,GAAG;AACxB,UAAM,EAAE,WAAW,cAAc,IAAI,iBAAiB,KAAK;AAC3D,WAAO,EAAE,OAAO,eAAe,UAAU;AAAA,EAC3C;AAEA,MAAI,gBAAgB,KAAK,GAAG;AAC1B,WAAO,EAAE,OAAO,mBAAmB,KAAK,EAAE;AAAA,EAC5C;AAEA,SAAO,EAAE,MAAM;AACjB;;;ADpDI;AAjBJ,IAAM,WAAO,yBAGX,CAAC,OAAO,QAAQ;AAChB,QAAsC,YAA9B,SAAO,UApBjB,IAoBwC,IAAT,iBAAS,IAAT,CAArB,SAAO;AAEf,QAAM,EAAE,OAAO,YAAY,WAAW,eAAe,QAAI;AAAA,IACvD,MAAM,aAAa,KAAK;AAAA,IACxB,CAAC,KAAK;AAAA,EACR;AAKA,QAAM,eAAe,iBAAiB,SAAY;AAElD,SACE;AAAA,IAAC,cAAAA,WAAgB;AAAA,IAAhB,iCACK,OADL;AAAA,MAEC,eAAW,kBAAK,gBAAgB,SAAS;AAAA,MACzC,OAAO;AAAA,MACP;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,KAAK,cAAc;AAEZ,IAAM,aAAa,iCACrB,cAAAA,aADqB;AAAA,EAExB;AACF;","names":["RadixRadioCards"]}

package/dist/atoms/radio-cards.d.cts

@@ -1 +1,12 @@
-export { RadioCards } from '@radix-ui/themes';
+import { RadioCards as RadioCards$1 } from '@radix-ui/themes';
+import React__default from 'react';
+import { UiColor } from '../utils/resolve-color.cjs';
+
+declare const RadioCards: {
+    Root: React__default.ForwardRefExoticComponent<Omit<Omit<RadioCards$1.RootProps & React__default.RefAttributes<HTMLDivElement>, "ref">, "color"> & {
+        color?: UiColor;
+    } & React__default.RefAttributes<HTMLDivElement>>;
+    Item: React__default.ForwardRefExoticComponent<RadioCards$1.ItemProps & React__default.RefAttributes<HTMLButtonElement>>;
+};
+
+export { RadioCards };

package/dist/atoms/radio-cards.d.ts

@@ -1 +1,12 @@
-export { RadioCards } from '@radix-ui/themes';
+import { RadioCards as RadioCards$1 } from '@radix-ui/themes';
+import React__default from 'react';
+import { UiColor } from '../utils/resolve-color.js';
+
+declare const RadioCards: {
+    Root: React__default.ForwardRefExoticComponent<Omit<Omit<RadioCards$1.RootProps & React__default.RefAttributes<HTMLDivElement>, "ref">, "color"> & {
+        color?: UiColor;
+    } & React__default.RefAttributes<HTMLDivElement>>;
+    Item: React__default.ForwardRefExoticComponent<RadioCards$1.ItemProps & React__default.RefAttributes<HTMLButtonElement>>;
+};
+
+export { RadioCards };

package/dist/atoms/radio-cards.js

@@ -1,6 +1,7 @@
 import {
   RadioCards
-} from "../chunk-6IVCARWS.js";
+} from "../chunk-DX3DLP5Z.js";
+import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {
   RadioCards

package/dist/atoms/radio-group.cjs

@@ -1,8 +1,37 @@
 "use strict";
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -20,10 +49,58 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/atoms/radio-group.tsx
 var radio_group_exports = {};
 __export(radio_group_exports, {
-  RadioGroup: () => import_themes.RadioGroup
+  RadioGroup: () => RadioGroup
 });
 module.exports = __toCommonJS(radio_group_exports);
 var import_themes = require("@radix-ui/themes");
+var import_clsx = require("clsx");
+var import_react = require("react");
+
+// src/utils/resolve-color.ts
+var SEMANTIC_COLOR_MAP = {
+  error: "red",
+  neutral: "gray",
+  success: "green",
+  accent: void 0
+};
+var CUSTOM_COLOR_MAP = {
+  black: { className: "tipp-accent-black", fallbackColor: "gray" }
+};
+var isSemanticColor = (color) => color !== void 0 && color in SEMANTIC_COLOR_MAP;
+var isCustomColor = (color) => color !== void 0 && color in CUSTOM_COLOR_MAP;
+var resolveColor = (color) => {
+  if (isCustomColor(color)) {
+    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];
+    return { color: fallbackColor, className };
+  }
+  if (isSemanticColor(color)) {
+    return { color: SEMANTIC_COLOR_MAP[color] };
+  }
+  return { color };
+};
+
+// src/atoms/radio-group.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Root = (0, import_react.forwardRef)((props, ref) => {
+  const _a = props, { color, className } = _a, rest = __objRest(_a, ["color", "className"]);
+  const { color: radixColor, className: colorClassName } = (0, import_react.useMemo)(
+    () => resolveColor(color),
+    [color]
+  );
+  const appliedColor = colorClassName ? void 0 : radixColor;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_themes.RadioGroup.Root,
+    __spreadProps(__spreadValues({}, rest), {
+      className: (0, import_clsx.clsx)(colorClassName, className),
+      color: appliedColor,
+      ref
+    })
+  );
+});
+Root.displayName = "RadioGroup.Root";
+var RadioGroup = __spreadProps(__spreadValues({}, import_themes.RadioGroup), {
+  Root
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   RadioGroup

package/dist/atoms/radio-group.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/atoms/radio-group.tsx"],"sourcesContent":["export { RadioGroup } from '@radix-ui/themes';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA2B;","names":[]}
+{"version":3,"sources":["../../src/atoms/radio-group.tsx","../../src/utils/resolve-color.ts"],"sourcesContent":["import { RadioGroup as RadixRadioGroup } 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 RadioGroupRootProps = DistributiveOmit<\n  React.ComponentPropsWithoutRef<typeof RadixRadioGroup.Root>,\n  'color'\n> & {\n  color?: UiColor;\n};\n\nconst Root = forwardRef<\n  React.ElementRef<typeof RadixRadioGroup.Root>,\n  RadioGroupRootProps\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  // RadioGroup이 그 color를 자식 Item으로 전파하고, 각 Item이 자기 `data-accent-color`로\n  // gray를 다시 적용해 조상 className override를 자식 스코프에서 덮어버린다.\n  const appliedColor = colorClassName ? undefined : radixColor;\n\n  return (\n    <RadixRadioGroup.Root\n      {...rest}\n      className={clsx(colorClassName, className)}\n      color={appliedColor}\n      ref={ref}\n    />\n  );\n});\n\nRoot.displayName = 'RadioGroup.Root';\n\nexport const RadioGroup = {\n  ...RadixRadioGroup,\n  Root,\n};\n\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA8C;AAC9C,kBAAqB;AACrB,mBAA2C;;;AC2B3C,IAAM,qBAAoE;AAAA,EACxE,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AACV;AAgBA,IAAM,mBAA2D;AAAA,EAC/D,OAAO,EAAE,WAAW,qBAAqB,eAAe,OAAO;AACjE;AAEA,IAAM,kBAAkB,CAAC,UACvB,UAAU,UAAa,SAAS;AAElC,IAAM,gBAAgB,CAAC,UACrB,UAAU,UAAa,SAAS;AAgB3B,IAAM,eAAe,CAAC,UAAmC;AAC9D,MAAI,cAAc,KAAK,GAAG;AACxB,UAAM,EAAE,WAAW,cAAc,IAAI,iBAAiB,KAAK;AAC3D,WAAO,EAAE,OAAO,eAAe,UAAU;AAAA,EAC3C;AAEA,MAAI,gBAAgB,KAAK,GAAG;AAC1B,WAAO,EAAE,OAAO,mBAAmB,KAAK,EAAE;AAAA,EAC5C;AAEA,SAAO,EAAE,MAAM;AACjB;;;ADpDI;AAjBJ,IAAM,WAAO,yBAGX,CAAC,OAAO,QAAQ;AAChB,QAAsC,YAA9B,SAAO,UApBjB,IAoBwC,IAAT,iBAAS,IAAT,CAArB,SAAO;AAEf,QAAM,EAAE,OAAO,YAAY,WAAW,eAAe,QAAI;AAAA,IACvD,MAAM,aAAa,KAAK;AAAA,IACxB,CAAC,KAAK;AAAA,EACR;AAKA,QAAM,eAAe,iBAAiB,SAAY;AAElD,SACE;AAAA,IAAC,cAAAA,WAAgB;AAAA,IAAhB,iCACK,OADL;AAAA,MAEC,eAAW,kBAAK,gBAAgB,SAAS;AAAA,MACzC,OAAO;AAAA,MACP;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,KAAK,cAAc;AAEZ,IAAM,aAAa,iCACrB,cAAAA,aADqB;AAAA,EAExB;AACF;","names":["RadixRadioGroup"]}

package/dist/atoms/radio-group.d.cts

@@ -1 +1,12 @@
-export { RadioGroup } from '@radix-ui/themes';
+import { RadioGroup as RadioGroup$1 } from '@radix-ui/themes';
+import React__default from 'react';
+import { UiColor } from '../utils/resolve-color.cjs';
+
+declare const RadioGroup: {
+    Root: React__default.ForwardRefExoticComponent<Omit<Omit<RadioGroup$1.RootProps & React__default.RefAttributes<HTMLDivElement>, "ref">, "color"> & {
+        color?: UiColor;
+    } & React__default.RefAttributes<HTMLDivElement>>;
+    Item: React__default.ForwardRefExoticComponent<RadioGroup$1.ItemProps & React__default.RefAttributes<HTMLButtonElement>>;
+};
+
+export { RadioGroup };

package/dist/atoms/radio-group.d.ts

@@ -1 +1,12 @@
-export { RadioGroup } from '@radix-ui/themes';
+import { RadioGroup as RadioGroup$1 } from '@radix-ui/themes';
+import React__default from 'react';
+import { UiColor } from '../utils/resolve-color.js';
+
+declare const RadioGroup: {
+    Root: React__default.ForwardRefExoticComponent<Omit<Omit<RadioGroup$1.RootProps & React__default.RefAttributes<HTMLDivElement>, "ref">, "color"> & {
+        color?: UiColor;
+    } & React__default.RefAttributes<HTMLDivElement>>;
+    Item: React__default.ForwardRefExoticComponent<RadioGroup$1.ItemProps & React__default.RefAttributes<HTMLButtonElement>>;
+};
+
+export { RadioGroup };

package/dist/atoms/radio-group.js

@@ -1,6 +1,7 @@
 import {
   RadioGroup
-} from "../chunk-6DJOIRMF.js";
+} from "../chunk-SA7AYYQS.js";
+import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {
   RadioGroup