@tipp/ui 2.4.0 → 2.6.0

package/dist/atoms/index.d.cts

@@ -1,17 +1,32 @@
-export { AlertDialog, AspectRatio, Blockquote, BlockquoteProps, Box, BoxProps, Callout, CheckboxCards, Code, CodeProps, Container, ContainerProps, DataList, Em, EmProps, Flex, FlexProps, Grid, GridProps, HoverCard, Inset, InsetProps, Kbd, KbdProps, Popover, Progress, ProgressProps, Quote, QuoteProps, Radio, RadioCards, RadioGroup, RadioProps, Button as RadixButton, ButtonProps as RadixButtonProps, Heading as RadixHeading, ScrollArea, ScrollAreaProps, Section, SectionProps, SegmentedControl, Separator, SeparatorProps, Skeleton, SkeletonProps, Spinner, SpinnerProps, Strong, StrongProps, Switch, SwitchProps, TabNav, Tabs } from '@radix-ui/themes';
+export { AlertDialog } from './alert-dialog.cjs';
+export { AspectRatio, Box, BoxProps, Container, ContainerProps, Em, EmProps, Flex, FlexProps, Grid, GridProps, Inset, InsetProps, Kbd, KbdProps, Quote, QuoteProps, Button as RadixButton, ButtonProps as RadixButtonProps, Heading as RadixHeading, ScrollArea, ScrollAreaProps, Section, SectionProps, SegmentedControl, Separator, SeparatorProps, Skeleton, SkeletonProps, Spinner, SpinnerProps, Strong, StrongProps } from '@radix-ui/themes';
 export { Avatar, AvatarProps } from './avatar.cjs';
 export { Badge, BadgeProps } from './badge.cjs';
+export { Blockquote, BlockquoteProps } from './blockquote.cjs';
 export { Button } from './button.cjs';
 export { ButtonProps } from './button.type.cjs';
+export { Callout } from './call-out.cjs';
 export { Card, CardProps } from './card.cjs';
 export { Checkbox, CheckboxProps } from './check-box.cjs';
+export { CheckboxCards } from './check-box-card.cjs';
 export { CheckboxGroup } from './check-box-group.cjs';
+export { Code, CodeProps } from './code.cjs';
+export { DataList } from './data-list.cjs';
 export { Dialog } from './dialog.cjs';
 export { DropdownMenu } from './dropdown-menu.cjs';
 export { Heading, HeadingProps } from './heading.cjs';
+export { HoverCard } from './hover-card.cjs';
 export { IconButton, IconButtonProps } from './icon-button.cjs';
 export { Link, LinkProps } from './link.cjs';
-export { ContentProps, Select, SelectRootProps } from './select.cjs';
+export { Popover } from './popover.cjs';
+export { Progress, ProgressProps } from './progress.cjs';
+export { Radio, RadioProps } from './radio.cjs';
+export { RadioCards } from './radio-cards.cjs';
+export { RadioGroup } from './radio-group.cjs';
+export { ContentProps, Select, SelectRootProps, TriggerProps } from './select.cjs';
+export { Switch, SwitchProps } from './switch.cjs';
+export { TabNav } from './tab-nav.cjs';
+export { Tabs } from './tabs.cjs';
 export { TextArea, TextAreaProps } from './text-area.cjs';
 export { Typo, TypoProps } from './typo.cjs';
 export { RootProps, SlotProps, TextField } from './text-field.cjs';
@@ -28,6 +43,7 @@ export { BulletText, BulletTextProps } from './bullet-text.cjs';
 export { List, ListItemProps, ListRootProps, useList } from './list.cjs';
 export { Responsive } from '@radix-ui/themes/props';
 import 'react';
+import '../utils/resolve-color.cjs';
 import '@radix-ui/react-dialog';
 import 'sonner';
 import '@radix-ui/react-form';

package/dist/atoms/index.d.ts

@@ -1,17 +1,32 @@
-export { AlertDialog, AspectRatio, Blockquote, BlockquoteProps, Box, BoxProps, Callout, CheckboxCards, Code, CodeProps, Container, ContainerProps, DataList, Em, EmProps, Flex, FlexProps, Grid, GridProps, HoverCard, Inset, InsetProps, Kbd, KbdProps, Popover, Progress, ProgressProps, Quote, QuoteProps, Radio, RadioCards, RadioGroup, RadioProps, Button as RadixButton, ButtonProps as RadixButtonProps, Heading as RadixHeading, ScrollArea, ScrollAreaProps, Section, SectionProps, SegmentedControl, Separator, SeparatorProps, Skeleton, SkeletonProps, Spinner, SpinnerProps, Strong, StrongProps, Switch, SwitchProps, TabNav, Tabs } from '@radix-ui/themes';
+export { AlertDialog } from './alert-dialog.js';
+export { AspectRatio, Box, BoxProps, Container, ContainerProps, Em, EmProps, Flex, FlexProps, Grid, GridProps, Inset, InsetProps, Kbd, KbdProps, Quote, QuoteProps, Button as RadixButton, ButtonProps as RadixButtonProps, Heading as RadixHeading, ScrollArea, ScrollAreaProps, Section, SectionProps, SegmentedControl, Separator, SeparatorProps, Skeleton, SkeletonProps, Spinner, SpinnerProps, Strong, StrongProps } from '@radix-ui/themes';
 export { Avatar, AvatarProps } from './avatar.js';
 export { Badge, BadgeProps } from './badge.js';
+export { Blockquote, BlockquoteProps } from './blockquote.js';
 export { Button } from './button.js';
 export { ButtonProps } from './button.type.js';
+export { Callout } from './call-out.js';
 export { Card, CardProps } from './card.js';
 export { Checkbox, CheckboxProps } from './check-box.js';
+export { CheckboxCards } from './check-box-card.js';
 export { CheckboxGroup } from './check-box-group.js';
+export { Code, CodeProps } from './code.js';
+export { DataList } from './data-list.js';
 export { Dialog } from './dialog.js';
 export { DropdownMenu } from './dropdown-menu.js';
 export { Heading, HeadingProps } from './heading.js';
+export { HoverCard } from './hover-card.js';
 export { IconButton, IconButtonProps } from './icon-button.js';
 export { Link, LinkProps } from './link.js';
-export { ContentProps, Select, SelectRootProps } from './select.js';
+export { Popover } from './popover.js';
+export { Progress, ProgressProps } from './progress.js';
+export { Radio, RadioProps } from './radio.js';
+export { RadioCards } from './radio-cards.js';
+export { RadioGroup } from './radio-group.js';
+export { ContentProps, Select, SelectRootProps, TriggerProps } from './select.js';
+export { Switch, SwitchProps } from './switch.js';
+export { TabNav } from './tab-nav.js';
+export { Tabs } from './tabs.js';
 export { TextArea, TextAreaProps } from './text-area.js';
 export { Typo, TypoProps } from './typo.js';
 export { RootProps, SlotProps, TextField } from './text-field.js';
@@ -28,6 +43,7 @@ export { BulletText, BulletTextProps } from './bullet-text.js';
 export { List, ListItemProps, ListRootProps, useList } from './list.js';
 export { Responsive } from '@radix-ui/themes/props';
 import 'react';
+import '../utils/resolve-color.js';
 import '@radix-ui/react-dialog';
 import 'sonner';
 import '@radix-ui/react-form';

package/dist/atoms/index.js

@@ -2,16 +2,7 @@ import "../chunk-HBF6IIVZ.js";
 import {
   Form,
   FormItem
-} from "../chunk-QDC3LFHS.js";
-import {
-  Switch
-} from "../chunk-OYM4XCHQ.js";
-import {
-  TabNav
-} from "../chunk-YJ7ZFOYL.js";
-import {
-  Tabs
-} from "../chunk-5ZITU5L7.js";
+} from "../chunk-MMLVZWMD.js";
 import {
   TextArea
 } from "../chunk-5XYPLDI5.js";
@@ -22,18 +13,9 @@ import {
   ToastContainer,
   toast
 } from "../chunk-LNPFV5BJ.js";
-import {
-  ScrollArea
-} from "../chunk-MUPK4L3U.js";
-import {
-  Section
-} from "../chunk-MUNMDHRF.js";
-import {
-  SegmentedControl
-} from "../chunk-TVDKGMBI.js";
 import {
   Select
-} from "../chunk-X2GMDZ7M.js";
+} from "../chunk-YXMB4MCM.js";
 import {
   Separator
 } from "../chunk-HYITAA4J.js";
@@ -47,36 +29,38 @@ import {
   Strong
 } from "../chunk-74DX4CU7.js";
 import {
-  List,
-  useList
-} from "../chunk-X4OCUESK.js";
+  Switch
+} from "../chunk-KNIIDDYM.js";
 import {
-  Pagination
-} from "../chunk-SE5TPTP2.js";
+  TabNav
+} from "../chunk-6TU647KJ.js";
 import {
-  Popover
-} from "../chunk-5AVBYDPB.js";
+  Tabs
+} from "../chunk-CGDBUDY3.js";
 import {
   Progress
-} from "../chunk-365QMK4D.js";
+} from "../chunk-TNNF5Q62.js";
 import {
   Quote
 } from "../chunk-YO3BQW6S.js";
 import {
   RadioCards
-} from "../chunk-6IVCARWS.js";
+} from "../chunk-DX3DLP5Z.js";
 import {
   RadioGroup
-} from "../chunk-6DJOIRMF.js";
+} from "../chunk-SA7AYYQS.js";
 import {
   Radio
-} from "../chunk-FPD73OHW.js";
+} from "../chunk-3TOUVBIB.js";
 import {
-  Grid
-} from "../chunk-EGEQY3KT.js";
+  ScrollArea
+} from "../chunk-MUPK4L3U.js";
 import {
-  HoverCard
-} from "../chunk-O3T3TM3V.js";
+  Section
+} from "../chunk-MUNMDHRF.js";
+import {
+  SegmentedControl
+} from "../chunk-IT7ZTP7F.js";
 import {
   Inset
 } from "../chunk-XQOL7UBI.js";
@@ -85,62 +69,48 @@ import {
 } from "../chunk-TULWX7D6.js";
 import {
   Link
-} from "../chunk-DHZVOXFM.js";
+} from "../chunk-BI6TW3ZO.js";
 import {
-  DataList
-} from "../chunk-VTJZMOSP.js";
-import {
-  Dialog
-} from "../chunk-B5CKZFDM.js";
-import {
-  Heading
-} from "../chunk-BESTU2AY.js";
+  List,
+  useList
+} from "../chunk-OPYRV6XJ.js";
 import {
-  Content,
-  Drawer,
-  Root,
-  Trigger
-} from "../chunk-EEAHZCIK.js";
-import "../chunk-645GPOW2.js";
-import "../chunk-U7N2PWMO.js";
+  Pagination
+} from "../chunk-IA74OBFY.js";
 import {
-  IconButton
-} from "../chunk-XK6VEVOK.js";
-import "../chunk-HF6GNDPV.js";
+  Popover
+} from "../chunk-RMW3MQF5.js";
 import {
   DropdownMenu
-} from "../chunk-SMLC2O3V.js";
+} from "../chunk-T73HHR3I.js";
 import {
   EllipsisTooltip
-} from "../chunk-Y4U24VXI.js";
+} from "../chunk-Q3M6GFHY.js";
 import {
   Tooltip
-} from "../chunk-3NUQAVE6.js";
+} from "../chunk-2M3UFZUD.js";
 import "../chunk-PT57HCAI.js";
 import {
   Em
 } from "../chunk-2DZ2Y3JI.js";
 import {
   FieldErrorWrapper
-} from "../chunk-ZOPYFDLO.js";
-import {
-  Callout
-} from "../chunk-B6XJN6EC.js";
+} from "../chunk-GAA3RTRW.js";
 import {
-  Card
-} from "../chunk-RP2RGCAW.js";
+  Grid
+} from "../chunk-EGEQY3KT.js";
 import {
-  CheckboxCards
-} from "../chunk-MIMJ7LON.js";
+  HoverCard
+} from "../chunk-24PX34TH.js";
 import {
   CheckboxGroup
-} from "../chunk-W7X7KSJP.js";
+} from "../chunk-WG5OK3YN.js";
 import {
   Checkbox
-} from "../chunk-VYCYVN3L.js";
+} from "../chunk-ZCGH6TJ3.js";
 import {
   Code
-} from "../chunk-OHMOP5PV.js";
+} from "../chunk-UFWDQGOK.js";
 import {
   Collapse
 } from "../chunk-NFDQJVFA.js";
@@ -148,36 +118,57 @@ import {
   Container
 } from "../chunk-Q37G2GS6.js";
 import {
-  AutoSizingInput
-} from "../chunk-6SYFG6YY.js";
+  DataList
+} from "../chunk-ZPUNTAVI.js";
 import {
-  Avatar
-} from "../chunk-K36TPMKL.js";
+  Dialog
+} from "../chunk-PE4EBBU4.js";
 import {
-  Badge
-} from "../chunk-KTSEZC6A.js";
+  Heading
+} from "../chunk-NLHVQJQ2.js";
+import {
+  Content,
+  Drawer,
+  Root,
+  Trigger
+} from "../chunk-JCUG2XKB.js";
+import "../chunk-645GPOW2.js";
+import "../chunk-U7N2PWMO.js";
+import {
+  IconButton
+} from "../chunk-7RJYF5L3.js";
+import "../chunk-HF6GNDPV.js";
 import {
   Blockquote
-} from "../chunk-YGL6SWKN.js";
+} from "../chunk-UFRB2BVD.js";
 import {
   Box
 } from "../chunk-4Y5BEXVN.js";
 import {
   BulletText
-} from "../chunk-Z34HR7RE.js";
+} from "../chunk-C2G3IB7G.js";
 import {
   Typo
-} from "../chunk-PMJIFLDT.js";
+} from "../chunk-GR4PG6HY.js";
 import "../chunk-LDBWASUA.js";
 import {
   Flex
 } from "../chunk-25HMMI7R.js";
 import {
   Button
-} from "../chunk-ZVDAEY5Q.js";
+} from "../chunk-2LCH3PDF.js";
 import "../chunk-LQY4RKWI.js";
 import "../chunk-ZD7MNMED.js";
-import "../chunk-JU7GB6R2.js";
+import {
+  Callout
+} from "../chunk-EIKFXUNC.js";
+import {
+  Card
+} from "../chunk-RP2RGCAW.js";
+import {
+  CheckboxCards
+} from "../chunk-JETG3WEI.js";
+import "../chunk-VOME2TE7.js";
 import "../chunk-JVXATVAC.js";
 import "../chunk-B3VSXNTH.js";
 import "../chunk-ZQE7SP6P.js";
@@ -196,10 +187,21 @@ import "../chunk-ZUYCXCPW.js";
 import "../chunk-YVFNJE4E.js";
 import {
   AlertDialog
-} from "../chunk-J242TTFH.js";
+} from "../chunk-GI4AN2IZ.js";
+import "../chunk-WYWM2HSZ.js";
 import {
   AspectRatio
 } from "../chunk-EAXUQEO5.js";
+import {
+  AutoSizingInput
+} from "../chunk-6SYFG6YY.js";
+import {
+  Avatar
+} from "../chunk-GPZXD762.js";
+import {
+  Badge
+} from "../chunk-BK74U562.js";
+import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {
   AlertDialog,

package/dist/atoms/link.cjs

@@ -54,11 +54,41 @@ __export(link_exports, {
 });
 module.exports = __toCommonJS(link_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/link.tsx
 var import_themes2 = require("@radix-ui/themes");
 var import_jsx_runtime = require("react/jsx-runtime");
 function Link(props) {
-  const _a = props, { size, children, variant } = _a, rest = __objRest(_a, ["size", "children", "variant"]);
+  const _a = props, { size, children, variant, color, className } = _a, rest = __objRest(_a, ["size", "children", "variant", "color", "className"]);
+  const { color: radixColor, className: colorClassName } = (0, import_react.useMemo)(
+    () => resolveColor(color),
+    [color]
+  );
   const radixSize = (0, import_react.useMemo)(() => {
     switch (variant) {
       case "caption":
@@ -71,7 +101,15 @@ function Link(props) {
         return size;
     }
   }, [size, variant]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Link, __spreadProps(__spreadValues({}, rest), { size: radixSize, children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_themes.Link,
+    __spreadProps(__spreadValues({}, rest), {
+      className: (0, import_clsx.clsx)(colorClassName, className),
+      color: radixColor,
+      size: radixSize,
+      children
+    })
+  );
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/atoms/link.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/atoms/link.tsx"],"sourcesContent":["import {\n  Link as RadixLink,\n  type LinkProps as RadixLinkProps,\n} from '@radix-ui/themes';\nimport { useMemo } from 'react';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\n\nexport type LinkProps = RadixLinkProps & {\n  variant?: 'caption' | 'body' | 'subtitle';\n};\n\nexport function Link(props: LinkProps): React.ReactNode {\n  const { size, children, variant, ...rest } = props;\n  const radixSize = useMemo<RadixLinkProps['size']>(() => {\n    switch (variant) {\n      case 'caption':\n        return '1';\n      case 'body':\n        return '2';\n      case 'subtitle':\n        return '3';\n      default:\n        return size;\n    }\n  }, [size, variant]);\n\n  return (\n    <RadixLink {...rest} size={radixSize}>\n      {children}\n    </RadixLink>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAGO;AACP,mBAAwB;AAExB,IAAAA,iBAAwC;AAsBpC;AAhBG,SAAS,KAAK,OAAmC;AACtD,QAA6C,YAArC,QAAM,UAAU,QAb1B,IAa+C,IAAT,iBAAS,IAAT,CAA5B,QAAM,YAAU;AACxB,QAAM,gBAAY,sBAAgC,MAAM;AACtD,YAAQ,SAAS;AAAA,MACf,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,SACE,4CAAC,cAAAC,MAAA,iCAAc,OAAd,EAAoB,MAAM,WACxB,WACH;AAEJ;","names":["import_themes","RadixLink"]}
+{"version":3,"sources":["../../src/atoms/link.tsx","../../src/utils/resolve-color.ts"],"sourcesContent":["import {\n  Link as RadixLink,\n  type LinkProps as RadixLinkProps,\n} from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { useMemo } from 'react';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\n\nexport type LinkProps = DistributiveOmit<RadixLinkProps, 'color'> & {\n  variant?: 'caption' | 'body' | 'subtitle';\n  color?: UiColor;\n};\n\nexport function Link(props: LinkProps): React.ReactNode {\n  const { size, children, variant, color, className, ...rest } = props;\n\n  const { color: radixColor, className: colorClassName } = useMemo(\n    () => resolveColor(color),\n    [color]\n  );\n\n  const radixSize = useMemo<RadixLinkProps['size']>(() => {\n    switch (variant) {\n      case 'caption':\n        return '1';\n      case 'body':\n        return '2';\n      case 'subtitle':\n        return '3';\n      default:\n        return size;\n    }\n  }, [size, variant]);\n\n  return (\n    <RadixLink\n      {...rest}\n      className={clsx(colorClassName, className)}\n      color={radixColor}\n      size={radixSize}\n    >\n      {children}\n    </RadixLink>\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;AAAA,oBAGO;AACP,kBAAqB;AACrB,mBAAwB;;;ACwBxB,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;;;ADzEA,IAAAA,iBAAwC;AA6BpC;AAtBG,SAAS,KAAK,OAAmC;AACtD,QAA+D,YAAvD,QAAM,UAAU,SAAS,OAAO,UApB1C,IAoBiE,IAAT,iBAAS,IAAT,CAA9C,QAAM,YAAU,WAAS,SAAO;AAExC,QAAM,EAAE,OAAO,YAAY,WAAW,eAAe,QAAI;AAAA,IACvD,MAAM,aAAa,KAAK;AAAA,IACxB,CAAC,KAAK;AAAA,EACR;AAEA,QAAM,gBAAY,sBAAgC,MAAM;AACtD,YAAQ,SAAS;AAAA,MACf,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,SACE;AAAA,IAAC,cAAAC;AAAA,IAAA,iCACK,OADL;AAAA,MAEC,eAAW,kBAAK,gBAAgB,SAAS;AAAA,MACzC,OAAO;AAAA,MACP,MAAM;AAAA,MAEL;AAAA;AAAA,EACH;AAEJ;","names":["import_themes","RadixLink"]}

package/dist/atoms/link.d.cts

@@ -1,8 +1,10 @@
 import { LinkProps as LinkProps$1 } from '@radix-ui/themes';
 export { Heading as RadixHeading } from '@radix-ui/themes';
+import { DistributiveOmit, UiColor } from '../utils/resolve-color.cjs';
 
-type LinkProps = LinkProps$1 & {
+type LinkProps = DistributiveOmit<LinkProps$1, 'color'> & {
     variant?: 'caption' | 'body' | 'subtitle';
+    color?: UiColor;
 };
 declare function Link(props: LinkProps): React.ReactNode;
 

package/dist/atoms/link.d.ts

@@ -1,8 +1,10 @@
 import { LinkProps as LinkProps$1 } from '@radix-ui/themes';
 export { Heading as RadixHeading } from '@radix-ui/themes';
+import { DistributiveOmit, UiColor } from '../utils/resolve-color.js';
 
-type LinkProps = LinkProps$1 & {
+type LinkProps = DistributiveOmit<LinkProps$1, 'color'> & {
     variant?: 'caption' | 'body' | 'subtitle';
+    color?: UiColor;
 };
 declare function Link(props: LinkProps): React.ReactNode;
 

package/dist/atoms/link.js

@@ -1,7 +1,8 @@
 import {
   Heading,
   Link
-} from "../chunk-DHZVOXFM.js";
+} from "../chunk-BI6TW3ZO.js";
+import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {
   Link,

package/dist/atoms/list.cjs

@@ -54,7 +54,7 @@ __export(list_exports, {
 });
 module.exports = __toCommonJS(list_exports);
 var import_react2 = require("react");
-var import_clsx = require("clsx");
+var import_clsx2 = require("clsx");
 
 // src/utils/map-with-responsive.ts
 var mapWithResponsive = (args) => {
@@ -76,11 +76,41 @@ var mapWithResponsive = (args) => {
 
 // src/atoms/typo.tsx
 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/typo.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 var Typo = (0, import_react.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 } = (0, import_react.useMemo)(
+      () => resolveColor(color),
+      [color]
+    );
     const radixSize = (0, import_react.useMemo)(() => {
       if (size !== void 0) return size;
       if (variant === void 0) return "2";
@@ -99,7 +129,16 @@ var Typo = (0, import_react.forwardRef)(
         }
       });
     }, [size, variant]);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, __spreadProps(__spreadValues({}, rest), { ref, size: radixSize, children }));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_themes.Text,
+      __spreadProps(__spreadValues({}, rest), {
+        className: (0, import_clsx.clsx)(colorClassName, className),
+        color: radixColor,
+        ref,
+        size: radixSize,
+        children
+      })
+    );
   }
 );
 Typo.displayName = "Typo";
@@ -125,7 +164,7 @@ function Root(props) {
   ]);
   const Comp = variant === "ol" ? "ol" : "ul";
   const className = (0, import_react2.useMemo)(
-    () => (0, import_clsx.clsx)(
+    () => (0, import_clsx2.clsx)(
       "tipp-list",
       {
         "pre-space-small": preSpace === "small"

package/dist/atoms/list.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/atoms/list.tsx","../../src/utils/map-with-responsive.ts","../../src/atoms/typo.tsx","../../src/atoms/flex.tsx"],"sourcesContent":["import type { Responsive } from '@radix-ui/themes/props';\nimport React, { createContext, useContext, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\nimport { Typo } from './typo';\nimport { Flex } from './flex';\n\nexport interface ListRootProps {\n  variant?: 'ol' | 'ul';\n  size?: Responsive<'small' | 'large'>;\n  children?: React.ReactNode;\n  preSpace?: 'regular' | 'small';\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nfunction Root(props: ListRootProps): React.ReactElement {\n  const {\n    variant,\n    size = 'large',\n    children,\n    preSpace,\n    className: propsClassName,\n    ...rest\n  } = props;\n  const Comp = variant === 'ol' ? 'ol' : 'ul';\n\n  const className = useMemo(\n    () =>\n      clsx(\n        'tipp-list',\n        {\n          'pre-space-small': preSpace === 'small',\n        },\n        propsClassName\n      ),\n    [preSpace, propsClassName]\n  );\n\n  return (\n    <ListContext.Provider value={{ size }}>\n      <Flex asChild direction=\"column\" gap=\"1\" {...rest} className={className}>\n        <Comp>{children}</Comp>\n      </Flex>\n    </ListContext.Provider>\n  );\n}\n\nexport interface ListItemProps {\n  children?: React.ReactNode;\n}\n\nfunction Item(props: ListItemProps): React.ReactElement {\n  const { children } = props;\n  const { size } = useList();\n\n  const variant = useMemo(() => {\n    return mapWithResponsive({\n      value: size,\n      mapFn: (sizeValue) => {\n        return sizeValue === 'small' ? 'caption' : 'body';\n      },\n    });\n  }, [size]);\n\n  return (\n    <Typo asChild variant={variant}>\n      <li>{children}</li>\n    </Typo>\n  );\n}\n\nconst ListContext = createContext<{ size: Responsive<'small' | 'large'> }>({\n  size: 'large',\n});\n\nexport function useList(): { size: Responsive<'small' | 'large'> } {\n  return useContext(ListContext);\n}\n\nexport const List = {\n  Root,\n  Item,\n};\n","import type {  Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args:  {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n  const {value, mapFn} = args;\n  if(typeof value === 'string'){\n    return mapFn(value);\n  };\n  \n  if(typeof value === 'object'){\n    const newObj: Partial<Record<Breakpoint, K>> = {};\n    let key: Breakpoint;\n    for(key in value){\n      newObj[key] = mapFn(value[key]);\n    }\n    return newObj;\n  }\n  return value;\n};\n","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 React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport type TypoProps = RadixTextProps & {\n  variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n  (props: TypoProps, ref): React.ReactNode => {\n    const { size, variant, children, ...rest } = props;\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 {...rest} ref={ref} size={radixSize}>\n        {children}\n      </RadixText>\n    );\n  }\n);\n\nTypo.displayName = 'Typo';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,IAAAA,gBAA0D;AAC1D,kBAAqB;;;ACAd,IAAM,oBAAoB,CAChC,SAC+B;AAC9B,QAAM,EAAC,OAAO,MAAK,IAAI;AACvB,MAAG,OAAO,UAAU,UAAS;AAC3B,WAAO,MAAM,KAAK;AAAA,EACpB;AAAC;AAED,MAAG,OAAO,UAAU,UAAS;AAC3B,UAAM,SAAyC,CAAC;AAChD,QAAI;AACJ,SAAI,OAAO,OAAM;AACf,aAAO,GAAG,IAAI,MAAM,MAAM,GAAG,CAAC;AAAA,IAChC;AACA,WAAO;AAAA,EACT;AACA,SAAO;AACT;;;ACjBA,oBAAkC;AAClC,mBAA2C;AAiCrC;AA1BC,IAAM,WAAO;AAAA,EAClB,CAAC,OAAkB,QAAyB;AAC1C,UAA6C,YAArC,QAAM,SAAS,SAZ3B,IAYiD,IAAT,iBAAS,IAAT,CAA5B,QAAM,WAAS;AAEvB,UAAM,gBAAY,sBAAgC,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,4CAAC,cAAAC,MAAA,iCAAc,OAAd,EAAoB,KAAU,MAAM,WAClC,WACH;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;;;AC3CnB,IAAAC,iBAAqC;;;AH0C7B,IAAAC,sBAAA;AA1BR,SAAS,KAAK,OAA0C;AACtD,QAOI,YANF;AAAA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,WAAW;AAAA,EAtBf,IAwBM,IADC,iBACD,IADC;AAAA,IALH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGF,QAAM,OAAO,YAAY,OAAO,OAAO;AAEvC,QAAM,gBAAY;AAAA,IAChB,UACE;AAAA,MACE;AAAA,MACA;AAAA,QACE,mBAAmB,aAAa;AAAA,MAClC;AAAA,MACA;AAAA,IACF;AAAA,IACF,CAAC,UAAU,cAAc;AAAA,EAC3B;AAEA,SACE,6CAAC,YAAY,UAAZ,EAAqB,OAAO,EAAE,KAAK,GAClC,uDAAC,oDAAK,SAAO,MAAC,WAAU,UAAS,KAAI,OAAQ,OAA5C,EAAkD,WACjD,uDAAC,QAAM,UAAS,IAClB,GACF;AAEJ;AAMA,SAAS,KAAK,OAA0C;AACtD,QAAM,EAAE,SAAS,IAAI;AACrB,QAAM,EAAE,KAAK,IAAI,QAAQ;AAEzB,QAAM,cAAU,uBAAQ,MAAM;AAC5B,WAAO,kBAAkB;AAAA,MACvB,OAAO;AAAA,MACP,OAAO,CAAC,cAAc;AACpB,eAAO,cAAc,UAAU,YAAY;AAAA,MAC7C;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,IAAI,CAAC;AAET,SACE,6CAAC,QAAK,SAAO,MAAC,SACZ,uDAAC,QAAI,UAAS,GAChB;AAEJ;AAEA,IAAM,kBAAc,6BAAuD;AAAA,EACzE,MAAM;AACR,CAAC;AAEM,SAAS,UAAmD;AACjE,aAAO,0BAAW,WAAW;AAC/B;AAEO,IAAM,OAAO;AAAA,EAClB;AAAA,EACA;AACF;","names":["import_react","RadixText","import_themes","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/atoms/list.tsx","../../src/utils/map-with-responsive.ts","../../src/atoms/typo.tsx","../../src/utils/resolve-color.ts","../../src/atoms/flex.tsx"],"sourcesContent":["import type { Responsive } from '@radix-ui/themes/props';\nimport React, { createContext, useContext, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\nimport { Typo } from './typo';\nimport { Flex } from './flex';\n\nexport interface ListRootProps {\n  variant?: 'ol' | 'ul';\n  size?: Responsive<'small' | 'large'>;\n  children?: React.ReactNode;\n  preSpace?: 'regular' | 'small';\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nfunction Root(props: ListRootProps): React.ReactElement {\n  const {\n    variant,\n    size = 'large',\n    children,\n    preSpace,\n    className: propsClassName,\n    ...rest\n  } = props;\n  const Comp = variant === 'ol' ? 'ol' : 'ul';\n\n  const className = useMemo(\n    () =>\n      clsx(\n        'tipp-list',\n        {\n          'pre-space-small': preSpace === 'small',\n        },\n        propsClassName\n      ),\n    [preSpace, propsClassName]\n  );\n\n  return (\n    <ListContext.Provider value={{ size }}>\n      <Flex asChild direction=\"column\" gap=\"1\" {...rest} className={className}>\n        <Comp>{children}</Comp>\n      </Flex>\n    </ListContext.Provider>\n  );\n}\n\nexport interface ListItemProps {\n  children?: React.ReactNode;\n}\n\nfunction Item(props: ListItemProps): React.ReactElement {\n  const { children } = props;\n  const { size } = useList();\n\n  const variant = useMemo(() => {\n    return mapWithResponsive({\n      value: size,\n      mapFn: (sizeValue) => {\n        return sizeValue === 'small' ? 'caption' : 'body';\n      },\n    });\n  }, [size]);\n\n  return (\n    <Typo asChild variant={variant}>\n      <li>{children}</li>\n    </Typo>\n  );\n}\n\nconst ListContext = createContext<{ size: Responsive<'small' | 'large'> }>({\n  size: 'large',\n});\n\nexport function useList(): { size: Responsive<'small' | 'large'> } {\n  return useContext(ListContext);\n}\n\nexport const List = {\n  Root,\n  Item,\n};\n","import type {  Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args:  {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n  const {value, mapFn} = args;\n  if(typeof value === 'string'){\n    return mapFn(value);\n  };\n  \n  if(typeof value === 'object'){\n    const newObj: Partial<Record<Breakpoint, K>> = {};\n    let key: Breakpoint;\n    for(key in value){\n      newObj[key] = mapFn(value[key]);\n    }\n    return newObj;\n  }\n  return value;\n};\n","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","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","export { Flex, type FlexProps } from '@radix-ui/themes';\n"],"mappings":"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","names":["import_react","import_clsx","RadixText","import_themes","import_jsx_runtime"]}

package/dist/atoms/list.js

@@ -1,10 +1,11 @@
 import {
   List,
   useList
-} from "../chunk-X4OCUESK.js";
-import "../chunk-PMJIFLDT.js";
+} from "../chunk-OPYRV6XJ.js";
+import "../chunk-GR4PG6HY.js";
 import "../chunk-LDBWASUA.js";
 import "../chunk-25HMMI7R.js";
+import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {
   List,