@karakuri-ui/react 0.2.3 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (244) hide show
  1. package/README.md +0 -1
  2. package/dist/components/ui/accordion.d.mts +40 -0
  3. package/dist/components/ui/accordion.d.ts +40 -0
  4. package/dist/components/ui/accordion.js +215 -0
  5. package/dist/components/ui/accordion.js.map +1 -0
  6. package/dist/components/ui/accordion.mjs +176 -0
  7. package/dist/components/ui/accordion.mjs.map +1 -0
  8. package/dist/components/ui/alert.d.mts +38 -0
  9. package/dist/components/ui/alert.d.ts +38 -0
  10. package/dist/components/ui/alert.js +217 -0
  11. package/dist/components/ui/alert.js.map +1 -0
  12. package/dist/components/ui/alert.mjs +180 -0
  13. package/dist/components/ui/alert.mjs.map +1 -0
  14. package/dist/components/ui/avatar.d.mts +223 -0
  15. package/dist/components/ui/avatar.d.ts +223 -0
  16. package/dist/components/ui/avatar.js +245 -0
  17. package/dist/components/ui/avatar.js.map +1 -0
  18. package/dist/components/ui/avatar.mjs +204 -0
  19. package/dist/components/ui/avatar.mjs.map +1 -0
  20. package/dist/components/ui/badge.d.mts +31 -0
  21. package/dist/components/ui/badge.d.ts +31 -0
  22. package/dist/components/ui/badge.js +205 -0
  23. package/dist/components/ui/badge.js.map +1 -0
  24. package/dist/components/ui/badge.mjs +170 -0
  25. package/dist/components/ui/badge.mjs.map +1 -0
  26. package/dist/components/ui/breadcrumb.d.mts +46 -0
  27. package/dist/components/ui/breadcrumb.d.ts +46 -0
  28. package/dist/components/ui/breadcrumb.js +201 -0
  29. package/dist/components/ui/breadcrumb.js.map +1 -0
  30. package/dist/components/ui/breadcrumb.mjs +160 -0
  31. package/dist/components/ui/breadcrumb.mjs.map +1 -0
  32. package/dist/components/ui/button-group.d.mts +22 -0
  33. package/dist/components/ui/button-group.d.ts +22 -0
  34. package/dist/components/ui/button-group.js +107 -0
  35. package/dist/components/ui/button-group.js.map +1 -0
  36. package/dist/components/ui/button-group.mjs +72 -0
  37. package/dist/components/ui/button-group.mjs.map +1 -0
  38. package/dist/components/ui/button.d.mts +31 -0
  39. package/dist/components/ui/button.d.ts +31 -0
  40. package/dist/components/ui/button.js +176 -0
  41. package/dist/components/ui/button.js.map +1 -0
  42. package/dist/components/ui/button.mjs +141 -0
  43. package/dist/components/ui/button.mjs.map +1 -0
  44. package/dist/components/ui/card.d.mts +60 -0
  45. package/dist/components/ui/card.d.ts +60 -0
  46. package/dist/components/ui/card.js +361 -0
  47. package/dist/components/ui/card.js.map +1 -0
  48. package/dist/components/ui/card.mjs +319 -0
  49. package/dist/components/ui/card.mjs.map +1 -0
  50. package/dist/{chart.d.mts → components/ui/chart.d.mts} +2 -18
  51. package/dist/{chart.d.ts → components/ui/chart.d.ts} +2 -18
  52. package/dist/{chart.js → components/ui/chart.js} +30 -55
  53. package/dist/components/ui/chart.js.map +1 -0
  54. package/dist/{chart.mjs → components/ui/chart.mjs} +22 -46
  55. package/dist/components/ui/chart.mjs.map +1 -0
  56. package/dist/components/ui/checkbox.d.mts +24 -0
  57. package/dist/components/ui/checkbox.d.ts +24 -0
  58. package/dist/components/ui/checkbox.js +173 -0
  59. package/dist/components/ui/checkbox.js.map +1 -0
  60. package/dist/components/ui/checkbox.mjs +138 -0
  61. package/dist/components/ui/checkbox.mjs.map +1 -0
  62. package/dist/components/ui/divider.d.mts +27 -0
  63. package/dist/components/ui/divider.d.ts +27 -0
  64. package/dist/components/ui/divider.js +147 -0
  65. package/dist/components/ui/divider.js.map +1 -0
  66. package/dist/components/ui/divider.mjs +112 -0
  67. package/dist/components/ui/divider.mjs.map +1 -0
  68. package/dist/components/ui/drawer.d.mts +36 -0
  69. package/dist/components/ui/drawer.d.ts +36 -0
  70. package/dist/components/ui/drawer.js +211 -0
  71. package/dist/components/ui/drawer.js.map +1 -0
  72. package/dist/components/ui/drawer.mjs +165 -0
  73. package/dist/components/ui/drawer.mjs.map +1 -0
  74. package/dist/components/ui/dropdown.d.mts +34 -0
  75. package/dist/components/ui/dropdown.d.ts +34 -0
  76. package/dist/components/ui/dropdown.js +295 -0
  77. package/dist/components/ui/dropdown.js.map +1 -0
  78. package/dist/components/ui/dropdown.mjs +248 -0
  79. package/dist/components/ui/dropdown.mjs.map +1 -0
  80. package/dist/components/ui/field.d.mts +26 -0
  81. package/dist/components/ui/field.d.ts +26 -0
  82. package/dist/components/ui/field.js +141 -0
  83. package/dist/components/ui/field.js.map +1 -0
  84. package/dist/components/ui/field.mjs +103 -0
  85. package/dist/components/ui/field.mjs.map +1 -0
  86. package/dist/components/ui/icon-button.d.mts +20 -0
  87. package/dist/components/ui/icon-button.d.ts +20 -0
  88. package/dist/components/ui/icon-button.js +147 -0
  89. package/dist/components/ui/icon-button.js.map +1 -0
  90. package/dist/components/ui/icon-button.mjs +112 -0
  91. package/dist/components/ui/icon-button.mjs.map +1 -0
  92. package/dist/components/ui/index.d.mts +55 -0
  93. package/dist/components/ui/index.d.ts +55 -0
  94. package/dist/components/ui/index.js +468 -0
  95. package/dist/components/ui/index.js.map +1 -0
  96. package/dist/components/ui/index.mjs +242 -0
  97. package/dist/components/ui/index.mjs.map +1 -0
  98. package/dist/components/ui/input.d.mts +20 -0
  99. package/dist/components/ui/input.d.ts +20 -0
  100. package/dist/components/ui/input.js +250 -0
  101. package/dist/components/ui/input.js.map +1 -0
  102. package/dist/components/ui/input.mjs +215 -0
  103. package/dist/components/ui/input.mjs.map +1 -0
  104. package/dist/components/ui/metric-card.d.mts +38 -0
  105. package/dist/components/ui/metric-card.d.ts +38 -0
  106. package/dist/components/ui/metric-card.js +250 -0
  107. package/dist/components/ui/metric-card.js.map +1 -0
  108. package/dist/components/ui/metric-card.mjs +209 -0
  109. package/dist/components/ui/metric-card.mjs.map +1 -0
  110. package/dist/components/ui/modal.d.mts +47 -0
  111. package/dist/components/ui/modal.d.ts +47 -0
  112. package/dist/components/ui/modal.js +371 -0
  113. package/dist/components/ui/modal.js.map +1 -0
  114. package/dist/components/ui/modal.mjs +313 -0
  115. package/dist/components/ui/modal.mjs.map +1 -0
  116. package/dist/components/ui/navigation-menu.d.mts +120 -0
  117. package/dist/components/ui/navigation-menu.d.ts +120 -0
  118. package/dist/components/ui/navigation-menu.js +521 -0
  119. package/dist/components/ui/navigation-menu.js.map +1 -0
  120. package/dist/components/ui/navigation-menu.mjs +478 -0
  121. package/dist/components/ui/navigation-menu.mjs.map +1 -0
  122. package/dist/components/ui/pagination.d.mts +113 -0
  123. package/dist/components/ui/pagination.d.ts +113 -0
  124. package/dist/components/ui/pagination.js +484 -0
  125. package/dist/components/ui/pagination.js.map +1 -0
  126. package/dist/components/ui/pagination.mjs +438 -0
  127. package/dist/components/ui/pagination.mjs.map +1 -0
  128. package/dist/components/ui/popover.d.mts +29 -0
  129. package/dist/components/ui/popover.d.ts +29 -0
  130. package/dist/components/ui/popover.js +165 -0
  131. package/dist/components/ui/popover.js.map +1 -0
  132. package/dist/components/ui/popover.mjs +124 -0
  133. package/dist/components/ui/popover.mjs.map +1 -0
  134. package/dist/components/ui/progress.d.mts +35 -0
  135. package/dist/components/ui/progress.d.ts +35 -0
  136. package/dist/components/ui/progress.js +194 -0
  137. package/dist/components/ui/progress.js.map +1 -0
  138. package/dist/components/ui/progress.mjs +159 -0
  139. package/dist/components/ui/progress.mjs.map +1 -0
  140. package/dist/components/ui/radio-group.d.mts +35 -0
  141. package/dist/components/ui/radio-group.d.ts +35 -0
  142. package/dist/components/ui/radio-group.js +174 -0
  143. package/dist/components/ui/radio-group.js.map +1 -0
  144. package/dist/components/ui/radio-group.mjs +137 -0
  145. package/dist/components/ui/radio-group.mjs.map +1 -0
  146. package/dist/components/ui/segmented.d.mts +25 -0
  147. package/dist/components/ui/segmented.d.ts +25 -0
  148. package/dist/components/ui/segmented.js +238 -0
  149. package/dist/components/ui/segmented.js.map +1 -0
  150. package/dist/components/ui/segmented.mjs +201 -0
  151. package/dist/components/ui/segmented.mjs.map +1 -0
  152. package/dist/components/ui/select.d.mts +20 -0
  153. package/dist/components/ui/select.d.ts +20 -0
  154. package/dist/components/ui/select.js +308 -0
  155. package/dist/components/ui/select.js.map +1 -0
  156. package/dist/components/ui/select.mjs +267 -0
  157. package/dist/components/ui/select.mjs.map +1 -0
  158. package/dist/components/ui/skeleton.d.mts +26 -0
  159. package/dist/components/ui/skeleton.d.ts +26 -0
  160. package/dist/components/ui/skeleton.js +144 -0
  161. package/dist/components/ui/skeleton.js.map +1 -0
  162. package/dist/components/ui/skeleton.mjs +109 -0
  163. package/dist/components/ui/skeleton.mjs.map +1 -0
  164. package/dist/components/ui/slider.d.mts +38 -0
  165. package/dist/components/ui/slider.d.ts +38 -0
  166. package/dist/components/ui/slider.js +180 -0
  167. package/dist/components/ui/slider.js.map +1 -0
  168. package/dist/components/ui/slider.mjs +145 -0
  169. package/dist/components/ui/slider.mjs.map +1 -0
  170. package/dist/components/ui/spinner.d.mts +23 -0
  171. package/dist/components/ui/spinner.d.ts +23 -0
  172. package/dist/components/ui/spinner.js +471 -0
  173. package/dist/components/ui/spinner.js.map +1 -0
  174. package/dist/components/ui/spinner.mjs +436 -0
  175. package/dist/components/ui/spinner.mjs.map +1 -0
  176. package/dist/components/ui/switch.d.mts +22 -0
  177. package/dist/components/ui/switch.d.ts +22 -0
  178. package/dist/components/ui/switch.js +173 -0
  179. package/dist/components/ui/switch.js.map +1 -0
  180. package/dist/components/ui/switch.mjs +138 -0
  181. package/dist/components/ui/switch.mjs.map +1 -0
  182. package/dist/components/ui/table.d.mts +60 -0
  183. package/dist/components/ui/table.d.ts +60 -0
  184. package/dist/components/ui/table.js +231 -0
  185. package/dist/components/ui/table.js.map +1 -0
  186. package/dist/components/ui/table.mjs +190 -0
  187. package/dist/components/ui/table.mjs.map +1 -0
  188. package/dist/components/ui/tabs.d.mts +31 -0
  189. package/dist/components/ui/tabs.d.ts +31 -0
  190. package/dist/components/ui/tabs.js +233 -0
  191. package/dist/components/ui/tabs.js.map +1 -0
  192. package/dist/components/ui/tabs.mjs +194 -0
  193. package/dist/components/ui/tabs.mjs.map +1 -0
  194. package/dist/components/ui/textarea.d.mts +19 -0
  195. package/dist/components/ui/textarea.d.ts +19 -0
  196. package/dist/components/ui/textarea.js +181 -0
  197. package/dist/components/ui/textarea.js.map +1 -0
  198. package/dist/components/ui/textarea.mjs +146 -0
  199. package/dist/components/ui/textarea.mjs.map +1 -0
  200. package/dist/components/ui/toast.d.mts +93 -0
  201. package/dist/components/ui/toast.d.ts +93 -0
  202. package/dist/components/ui/toast.js +429 -0
  203. package/dist/components/ui/toast.js.map +1 -0
  204. package/dist/components/ui/toast.mjs +393 -0
  205. package/dist/components/ui/toast.mjs.map +1 -0
  206. package/dist/components/ui/toggle-group.d.mts +42 -0
  207. package/dist/components/ui/toggle-group.d.ts +42 -0
  208. package/dist/components/ui/toggle-group.js +183 -0
  209. package/dist/components/ui/toggle-group.js.map +1 -0
  210. package/dist/components/ui/toggle-group.mjs +146 -0
  211. package/dist/components/ui/toggle-group.mjs.map +1 -0
  212. package/dist/components/ui/toggle.d.mts +19 -0
  213. package/dist/components/ui/toggle.d.ts +19 -0
  214. package/dist/components/ui/toggle.js +194 -0
  215. package/dist/components/ui/toggle.js.map +1 -0
  216. package/dist/components/ui/toggle.mjs +159 -0
  217. package/dist/components/ui/toggle.mjs.map +1 -0
  218. package/dist/components/ui/tooltip.d.mts +26 -0
  219. package/dist/components/ui/tooltip.d.ts +26 -0
  220. package/dist/components/ui/tooltip.js +128 -0
  221. package/dist/components/ui/tooltip.js.map +1 -0
  222. package/dist/components/ui/tooltip.mjs +88 -0
  223. package/dist/components/ui/tooltip.mjs.map +1 -0
  224. package/dist/lib/code-generator.d.mts +60 -0
  225. package/dist/lib/code-generator.d.ts +60 -0
  226. package/dist/lib/code-generator.js +224 -0
  227. package/dist/lib/code-generator.js.map +1 -0
  228. package/dist/lib/code-generator.mjs +159 -0
  229. package/dist/lib/code-generator.mjs.map +1 -0
  230. package/dist/lib/utils.d.mts +10 -0
  231. package/dist/lib/utils.d.ts +10 -0
  232. package/dist/lib/utils.js +33 -0
  233. package/dist/lib/utils.js.map +1 -0
  234. package/dist/lib/utils.mjs +9 -0
  235. package/dist/lib/utils.mjs.map +1 -0
  236. package/package.json +11 -11
  237. package/dist/chart.js.map +0 -1
  238. package/dist/chart.mjs.map +0 -1
  239. package/dist/index.d.mts +0 -1636
  240. package/dist/index.d.ts +0 -1636
  241. package/dist/index.js +0 -7291
  242. package/dist/index.js.map +0 -1
  243. package/dist/index.mjs +0 -7048
  244. package/dist/index.mjs.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/ui/card.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// ── Context for size propagation ──\ntype CardSize = 'sm' | 'default' | 'lg'\ntype CardDirection = 'vertical' | 'horizontal'\n\nconst CardContext = React.createContext<{ size: CardSize; direction: CardDirection }>({\n size: 'default',\n direction: 'vertical',\n})\n\nfunction useCard() {\n return React.useContext(CardContext)\n}\n\n// ── Card (Root) ──\nconst cardVariants = cva(\n 'flex overflow-hidden transition-all duration-normal',\n {\n variants: {\n variant: {\n default: 'bg-background-paper border border-border-subtle shadow-sm',\n outline: 'bg-background-paper border border-border',\n ghost: 'bg-transparent',\n },\n size: {\n sm: '',\n default: '',\n lg: '',\n },\n radius: {\n sm: 'rounded-sm', // 2px\n base: 'rounded', // 4px\n md: 'rounded-md', // 6px\n lg: 'rounded-lg', // 8px\n xl: 'rounded-xl', // 12px\n '2xl': 'rounded-2xl', // 16px\n },\n direction: {\n vertical: 'flex-col',\n horizontal: 'flex-row',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n radius: 'xl',\n direction: 'vertical',\n },\n }\n)\n\nexport type CardVariant = 'default' | 'outline' | 'ghost'\nexport type CardRadius = 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl'\n\nexport interface CardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof cardVariants> {\n /** Visual style */\n variant?: CardVariant\n /** Content padding scale */\n size?: CardSize\n /** Border radius */\n radius?: CardRadius\n /** Layout direction */\n direction?: CardDirection\n /** Enable hover effect for interactive cards */\n interactive?: boolean\n /** Render as child element (Slot pattern) */\n asChild?: boolean\n}\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n ({\n className,\n variant = 'default',\n size = 'default',\n radius = 'xl',\n direction = 'vertical',\n interactive = false,\n asChild = false,\n children,\n ...props\n }, ref) => {\n const Comp = asChild ? Slot : 'div'\n\n // Horizontal: separate CardImage from rest, wrap rest in flex-col\n let content = children\n if (direction === 'horizontal') {\n const childArray = React.Children.toArray(children)\n const imageChildren: React.ReactNode[] = []\n const otherChildren: React.ReactNode[] = []\n\n childArray.forEach((child) => {\n if (React.isValidElement(child) && child.type === CardImage) {\n imageChildren.push(child)\n } else {\n otherChildren.push(child)\n }\n })\n\n content = (\n <>\n {imageChildren}\n <div className=\"flex-1 flex flex-col min-w-0\">\n {otherChildren}\n </div>\n </>\n )\n }\n\n return (\n <CardContext.Provider value={{ size, direction }}>\n <Comp\n ref={ref}\n className={cn(\n cardVariants({ variant, size, radius, direction }),\n interactive && 'cursor-pointer hover:shadow-md hover:-translate-y-0.5',\n className\n )}\n {...props}\n >\n {content}\n </Comp>\n </CardContext.Provider>\n )\n }\n)\nCard.displayName = 'Card'\n\n// ── Size-based padding map (responsive: mobile → desktop) ──\nconst sizePaddingMap = {\n sm: 'p-4', // 16px\n default: 'p-4 sm:p-6', // 16px → 24px\n lg: 'p-6 sm:p-8', // 24px → 32px\n} as const\n\nconst sizePaddingXMap = {\n sm: 'px-4', // 16px\n default: 'px-4 sm:px-6', // 16px → 24px\n lg: 'px-6 sm:px-8', // 24px → 32px\n} as const\n\nconst sizePaddingYMap = {\n sm: 'py-3', // 12px\n default: 'py-3 sm:py-4', // 12px → 16px\n lg: 'py-4 sm:py-5', // 16px → 20px\n} as const\n\n// Top padding for CardHeader — optical balance (top >= sides)\nconst sizePaddingTMap = {\n sm: 'pt-5', // 20px\n default: 'pt-5 sm:pt-6', // 20px → 24px\n lg: 'pt-6 sm:pt-8', // 24px → 32px\n} as const\n\n// Inner bottom padding (between sections) — tighter than outer\nconst sizeInnerPbMap = {\n sm: 'pb-3', // 12px\n default: 'pb-3 sm:pb-4', // 12px → 16px\n lg: 'pb-3 sm:pb-4', // 12px → 16px (default와 동일)\n} as const\n\n// Last-child bottom padding for CardContent (when no footer) — match pt\nconst sizeLastPbMap = {\n sm: 'last:pb-5', // 20px\n default: 'last:pb-5 sm:last:pb-6', // 20px → 24px\n lg: 'last:pb-6 sm:last:pb-8', // 24px → 32px\n} as const\n\n// ── CardImage ──\n// Overlay opacity to Tailwind class mapping\nconst overlayOpacityMap: Record<number, string> = {\n 10: 'from-black/10',\n 20: 'from-black/20',\n 30: 'from-black/30',\n 40: 'from-black/40',\n 50: 'from-black/50',\n 60: 'from-black/60',\n 70: 'from-black/70',\n 80: 'from-black/80',\n 90: 'from-black/90',\n}\n\nexport interface CardImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n /** Gradient overlay on image */\n overlay?: boolean\n /** Overlay opacity (10–90). Default: 60 */\n overlayOpacity?: number\n /** Custom class for overlay gradient (overrides overlayOpacity) */\n overlayClassName?: string\n}\n\nconst CardImage = React.forwardRef<HTMLImageElement, CardImageProps>(\n ({ className, overlay = false, overlayOpacity = 60, overlayClassName, alt = '', ...props }, ref) => {\n const { direction } = useCard()\n const isHorizontal = direction === 'horizontal'\n\n // Horizontal: use absolute positioning so the image fills the\n // wrapper height which is determined by the content side via\n // flexbox align-items:stretch (default).\n if (isHorizontal) {\n const opacityClass = overlay\n ? (overlayOpacityMap[overlayOpacity] || 'from-black/60')\n : null\n\n return (\n <div className={cn('relative shrink-0 w-48 overflow-hidden', className)}>\n <img\n ref={ref}\n alt={alt}\n className=\"absolute inset-0 w-full h-full object-cover\"\n {...props}\n />\n {overlay && (\n <div className={cn('absolute inset-0 bg-gradient-to-t to-transparent', overlayClassName || opacityClass)} />\n )}\n </div>\n )\n }\n\n // Vertical\n if (overlay) {\n const opacityClass = overlayOpacityMap[overlayOpacity] || 'from-black/60'\n\n return (\n <div className=\"relative w-full shrink-0 overflow-hidden\">\n <img\n ref={ref}\n alt={alt}\n className={cn('w-full object-cover', className)}\n {...props}\n />\n <div className={cn('absolute inset-0 bg-gradient-to-t to-transparent', overlayClassName || opacityClass)} />\n </div>\n )\n }\n\n return (\n <img\n ref={ref}\n alt={alt}\n className={cn('w-full object-cover shrink-0', className)}\n {...props}\n />\n )\n }\n)\nCardImage.displayName = 'CardImage'\n\n// ── CardHeader ──\nexport interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, children, ...props }, ref) => {\n const { size } = useCard()\n\n // Separate CardAction from other children for proper flex layout\n const childArray = React.Children.toArray(children)\n const actionChildren: React.ReactNode[] = []\n const otherChildren: React.ReactNode[] = []\n\n childArray.forEach((child) => {\n if (React.isValidElement(child) && child.type === CardAction) {\n actionChildren.push(child)\n } else {\n otherChildren.push(child)\n }\n })\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-start gap-3',\n sizePaddingXMap[size],\n sizePaddingTMap[size],\n sizeInnerPbMap[size],\n sizeLastPbMap[size],\n className\n )}\n {...props}\n >\n <div className=\"flex-1 min-w-0 space-y-3\">\n {otherChildren}\n </div>\n {actionChildren}\n </div>\n )\n }\n)\nCardHeader.displayName = 'CardHeader'\n\n// ── CardTitle ──\nexport interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {\n /** Leading icon */\n icon?: React.ReactNode\n}\n\nconst CardTitle = React.forwardRef<HTMLHeadingElement, CardTitleProps>(\n ({ className, icon, children, ...props }, ref) => {\n return (\n <h3\n ref={ref}\n className={cn(\n 'font-semibold text-foreground leading-none tracking-tight',\n icon && 'flex items-center gap-2',\n className\n )}\n {...props}\n >\n {icon && (\n <span className=\"shrink-0 icon-sm [&>svg]:w-full [&>svg]:h-full\" aria-hidden=\"true\">\n {icon}\n </span>\n )}\n {children}\n </h3>\n )\n }\n)\nCardTitle.displayName = 'CardTitle'\n\n// ── CardDescription ──\nexport interface CardDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {}\n\nconst CardDescription = React.forwardRef<HTMLParagraphElement, CardDescriptionProps>(\n ({ className, ...props }, ref) => {\n return (\n <p\n ref={ref}\n className={cn('text-sm text-text-muted', className)}\n {...props}\n />\n )\n }\n)\nCardDescription.displayName = 'CardDescription'\n\n// ── CardAction ──\nexport interface CardActionProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardAction = React.forwardRef<HTMLDivElement, CardActionProps>(\n ({ className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={cn('shrink-0 ml-auto -mr-2 -mt-2', className)}\n {...props}\n />\n )\n }\n)\nCardAction.displayName = 'CardAction'\n\n// ── CardContent ──\nexport interface CardContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ className, ...props }, ref) => {\n const { size } = useCard()\n\n return (\n <div\n ref={ref}\n className={cn(sizePaddingXMap[size], 'pb-0', sizeLastPbMap[size], className)}\n {...props}\n />\n )\n }\n)\nCardContent.displayName = 'CardContent'\n\n// ── CardFooter ──\nexport interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardFooter = React.forwardRef<HTMLDivElement, CardFooterProps>(\n ({ className, ...props }, ref) => {\n const { size } = useCard()\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center gap-2',\n sizePaddingXMap[size],\n sizePaddingYMap[size],\n 'mt-auto',\n className\n )}\n {...props}\n />\n )\n }\n)\nCardFooter.displayName = 'CardFooter'\n\nexport {\n Card,\n CardImage,\n CardHeader,\n CardTitle,\n CardDescription,\n CardAction,\n CardContent,\n CardFooter,\n cardVariants,\n}\n"],"mappings":"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","names":[]}
@@ -0,0 +1,319 @@
1
+ "use client";
2
+ import * as React from "react";
3
+ import { Slot } from "@radix-ui/react-slot";
4
+ import { cva } from "class-variance-authority";
5
+ import { cn } from "../../lib/utils";
6
+ const CardContext = React.createContext({
7
+ size: "default",
8
+ direction: "vertical"
9
+ });
10
+ function useCard() {
11
+ return React.useContext(CardContext);
12
+ }
13
+ const cardVariants = cva(
14
+ "flex overflow-hidden transition-all duration-normal",
15
+ {
16
+ variants: {
17
+ variant: {
18
+ default: "bg-background-paper border border-border-subtle shadow-sm",
19
+ outline: "bg-background-paper border border-border",
20
+ ghost: "bg-transparent"
21
+ },
22
+ size: {
23
+ sm: "",
24
+ default: "",
25
+ lg: ""
26
+ },
27
+ radius: {
28
+ sm: "rounded-sm",
29
+ // 2px
30
+ base: "rounded",
31
+ // 4px
32
+ md: "rounded-md",
33
+ // 6px
34
+ lg: "rounded-lg",
35
+ // 8px
36
+ xl: "rounded-xl",
37
+ // 12px
38
+ "2xl": "rounded-2xl"
39
+ // 16px
40
+ },
41
+ direction: {
42
+ vertical: "flex-col",
43
+ horizontal: "flex-row"
44
+ }
45
+ },
46
+ defaultVariants: {
47
+ variant: "default",
48
+ size: "default",
49
+ radius: "xl",
50
+ direction: "vertical"
51
+ }
52
+ }
53
+ );
54
+ const Card = React.forwardRef(
55
+ ({
56
+ className,
57
+ variant = "default",
58
+ size = "default",
59
+ radius = "xl",
60
+ direction = "vertical",
61
+ interactive = false,
62
+ asChild = false,
63
+ children,
64
+ ...props
65
+ }, ref) => {
66
+ const Comp = asChild ? Slot : "div";
67
+ let content = children;
68
+ if (direction === "horizontal") {
69
+ const childArray = React.Children.toArray(children);
70
+ const imageChildren = [];
71
+ const otherChildren = [];
72
+ childArray.forEach((child) => {
73
+ if (React.isValidElement(child) && child.type === CardImage) {
74
+ imageChildren.push(child);
75
+ } else {
76
+ otherChildren.push(child);
77
+ }
78
+ });
79
+ content = /* @__PURE__ */ React.createElement(React.Fragment, null, imageChildren, /* @__PURE__ */ React.createElement("div", { className: "flex-1 flex flex-col min-w-0" }, otherChildren));
80
+ }
81
+ return /* @__PURE__ */ React.createElement(CardContext.Provider, { value: { size, direction } }, /* @__PURE__ */ React.createElement(
82
+ Comp,
83
+ {
84
+ ref,
85
+ className: cn(
86
+ cardVariants({ variant, size, radius, direction }),
87
+ interactive && "cursor-pointer hover:shadow-md hover:-translate-y-0.5",
88
+ className
89
+ ),
90
+ ...props
91
+ },
92
+ content
93
+ ));
94
+ }
95
+ );
96
+ Card.displayName = "Card";
97
+ const sizePaddingMap = {
98
+ sm: "p-4",
99
+ // 16px
100
+ default: "p-4 sm:p-6",
101
+ // 16px → 24px
102
+ lg: "p-6 sm:p-8"
103
+ // 24px → 32px
104
+ };
105
+ const sizePaddingXMap = {
106
+ sm: "px-4",
107
+ // 16px
108
+ default: "px-4 sm:px-6",
109
+ // 16px → 24px
110
+ lg: "px-6 sm:px-8"
111
+ // 24px → 32px
112
+ };
113
+ const sizePaddingYMap = {
114
+ sm: "py-3",
115
+ // 12px
116
+ default: "py-3 sm:py-4",
117
+ // 12px → 16px
118
+ lg: "py-4 sm:py-5"
119
+ // 16px → 20px
120
+ };
121
+ const sizePaddingTMap = {
122
+ sm: "pt-5",
123
+ // 20px
124
+ default: "pt-5 sm:pt-6",
125
+ // 20px → 24px
126
+ lg: "pt-6 sm:pt-8"
127
+ // 24px → 32px
128
+ };
129
+ const sizeInnerPbMap = {
130
+ sm: "pb-3",
131
+ // 12px
132
+ default: "pb-3 sm:pb-4",
133
+ // 12px → 16px
134
+ lg: "pb-3 sm:pb-4"
135
+ // 12px → 16px (default와 동일)
136
+ };
137
+ const sizeLastPbMap = {
138
+ sm: "last:pb-5",
139
+ // 20px
140
+ default: "last:pb-5 sm:last:pb-6",
141
+ // 20px → 24px
142
+ lg: "last:pb-6 sm:last:pb-8"
143
+ // 24px → 32px
144
+ };
145
+ const overlayOpacityMap = {
146
+ 10: "from-black/10",
147
+ 20: "from-black/20",
148
+ 30: "from-black/30",
149
+ 40: "from-black/40",
150
+ 50: "from-black/50",
151
+ 60: "from-black/60",
152
+ 70: "from-black/70",
153
+ 80: "from-black/80",
154
+ 90: "from-black/90"
155
+ };
156
+ const CardImage = React.forwardRef(
157
+ ({ className, overlay = false, overlayOpacity = 60, overlayClassName, alt = "", ...props }, ref) => {
158
+ const { direction } = useCard();
159
+ const isHorizontal = direction === "horizontal";
160
+ if (isHorizontal) {
161
+ const opacityClass = overlay ? overlayOpacityMap[overlayOpacity] || "from-black/60" : null;
162
+ return /* @__PURE__ */ React.createElement("div", { className: cn("relative shrink-0 w-48 overflow-hidden", className) }, /* @__PURE__ */ React.createElement(
163
+ "img",
164
+ {
165
+ ref,
166
+ alt,
167
+ className: "absolute inset-0 w-full h-full object-cover",
168
+ ...props
169
+ }
170
+ ), overlay && /* @__PURE__ */ React.createElement("div", { className: cn("absolute inset-0 bg-gradient-to-t to-transparent", overlayClassName || opacityClass) }));
171
+ }
172
+ if (overlay) {
173
+ const opacityClass = overlayOpacityMap[overlayOpacity] || "from-black/60";
174
+ return /* @__PURE__ */ React.createElement("div", { className: "relative w-full shrink-0 overflow-hidden" }, /* @__PURE__ */ React.createElement(
175
+ "img",
176
+ {
177
+ ref,
178
+ alt,
179
+ className: cn("w-full object-cover", className),
180
+ ...props
181
+ }
182
+ ), /* @__PURE__ */ React.createElement("div", { className: cn("absolute inset-0 bg-gradient-to-t to-transparent", overlayClassName || opacityClass) }));
183
+ }
184
+ return /* @__PURE__ */ React.createElement(
185
+ "img",
186
+ {
187
+ ref,
188
+ alt,
189
+ className: cn("w-full object-cover shrink-0", className),
190
+ ...props
191
+ }
192
+ );
193
+ }
194
+ );
195
+ CardImage.displayName = "CardImage";
196
+ const CardHeader = React.forwardRef(
197
+ ({ className, children, ...props }, ref) => {
198
+ const { size } = useCard();
199
+ const childArray = React.Children.toArray(children);
200
+ const actionChildren = [];
201
+ const otherChildren = [];
202
+ childArray.forEach((child) => {
203
+ if (React.isValidElement(child) && child.type === CardAction) {
204
+ actionChildren.push(child);
205
+ } else {
206
+ otherChildren.push(child);
207
+ }
208
+ });
209
+ return /* @__PURE__ */ React.createElement(
210
+ "div",
211
+ {
212
+ ref,
213
+ className: cn(
214
+ "flex items-start gap-3",
215
+ sizePaddingXMap[size],
216
+ sizePaddingTMap[size],
217
+ sizeInnerPbMap[size],
218
+ sizeLastPbMap[size],
219
+ className
220
+ ),
221
+ ...props
222
+ },
223
+ /* @__PURE__ */ React.createElement("div", { className: "flex-1 min-w-0 space-y-3" }, otherChildren),
224
+ actionChildren
225
+ );
226
+ }
227
+ );
228
+ CardHeader.displayName = "CardHeader";
229
+ const CardTitle = React.forwardRef(
230
+ ({ className, icon, children, ...props }, ref) => {
231
+ return /* @__PURE__ */ React.createElement(
232
+ "h3",
233
+ {
234
+ ref,
235
+ className: cn(
236
+ "font-semibold text-foreground leading-none tracking-tight",
237
+ icon && "flex items-center gap-2",
238
+ className
239
+ ),
240
+ ...props
241
+ },
242
+ icon && /* @__PURE__ */ React.createElement("span", { className: "shrink-0 icon-sm [&>svg]:w-full [&>svg]:h-full", "aria-hidden": "true" }, icon),
243
+ children
244
+ );
245
+ }
246
+ );
247
+ CardTitle.displayName = "CardTitle";
248
+ const CardDescription = React.forwardRef(
249
+ ({ className, ...props }, ref) => {
250
+ return /* @__PURE__ */ React.createElement(
251
+ "p",
252
+ {
253
+ ref,
254
+ className: cn("text-sm text-text-muted", className),
255
+ ...props
256
+ }
257
+ );
258
+ }
259
+ );
260
+ CardDescription.displayName = "CardDescription";
261
+ const CardAction = React.forwardRef(
262
+ ({ className, ...props }, ref) => {
263
+ return /* @__PURE__ */ React.createElement(
264
+ "div",
265
+ {
266
+ ref,
267
+ className: cn("shrink-0 ml-auto -mr-2 -mt-2", className),
268
+ ...props
269
+ }
270
+ );
271
+ }
272
+ );
273
+ CardAction.displayName = "CardAction";
274
+ const CardContent = React.forwardRef(
275
+ ({ className, ...props }, ref) => {
276
+ const { size } = useCard();
277
+ return /* @__PURE__ */ React.createElement(
278
+ "div",
279
+ {
280
+ ref,
281
+ className: cn(sizePaddingXMap[size], "pb-0", sizeLastPbMap[size], className),
282
+ ...props
283
+ }
284
+ );
285
+ }
286
+ );
287
+ CardContent.displayName = "CardContent";
288
+ const CardFooter = React.forwardRef(
289
+ ({ className, ...props }, ref) => {
290
+ const { size } = useCard();
291
+ return /* @__PURE__ */ React.createElement(
292
+ "div",
293
+ {
294
+ ref,
295
+ className: cn(
296
+ "flex items-center gap-2",
297
+ sizePaddingXMap[size],
298
+ sizePaddingYMap[size],
299
+ "mt-auto",
300
+ className
301
+ ),
302
+ ...props
303
+ }
304
+ );
305
+ }
306
+ );
307
+ CardFooter.displayName = "CardFooter";
308
+ export {
309
+ Card,
310
+ CardAction,
311
+ CardContent,
312
+ CardDescription,
313
+ CardFooter,
314
+ CardHeader,
315
+ CardImage,
316
+ CardTitle,
317
+ cardVariants
318
+ };
319
+ //# sourceMappingURL=card.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/ui/card.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// ── Context for size propagation ──\ntype CardSize = 'sm' | 'default' | 'lg'\ntype CardDirection = 'vertical' | 'horizontal'\n\nconst CardContext = React.createContext<{ size: CardSize; direction: CardDirection }>({\n size: 'default',\n direction: 'vertical',\n})\n\nfunction useCard() {\n return React.useContext(CardContext)\n}\n\n// ── Card (Root) ──\nconst cardVariants = cva(\n 'flex overflow-hidden transition-all duration-normal',\n {\n variants: {\n variant: {\n default: 'bg-background-paper border border-border-subtle shadow-sm',\n outline: 'bg-background-paper border border-border',\n ghost: 'bg-transparent',\n },\n size: {\n sm: '',\n default: '',\n lg: '',\n },\n radius: {\n sm: 'rounded-sm', // 2px\n base: 'rounded', // 4px\n md: 'rounded-md', // 6px\n lg: 'rounded-lg', // 8px\n xl: 'rounded-xl', // 12px\n '2xl': 'rounded-2xl', // 16px\n },\n direction: {\n vertical: 'flex-col',\n horizontal: 'flex-row',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n radius: 'xl',\n direction: 'vertical',\n },\n }\n)\n\nexport type CardVariant = 'default' | 'outline' | 'ghost'\nexport type CardRadius = 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl'\n\nexport interface CardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof cardVariants> {\n /** Visual style */\n variant?: CardVariant\n /** Content padding scale */\n size?: CardSize\n /** Border radius */\n radius?: CardRadius\n /** Layout direction */\n direction?: CardDirection\n /** Enable hover effect for interactive cards */\n interactive?: boolean\n /** Render as child element (Slot pattern) */\n asChild?: boolean\n}\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n ({\n className,\n variant = 'default',\n size = 'default',\n radius = 'xl',\n direction = 'vertical',\n interactive = false,\n asChild = false,\n children,\n ...props\n }, ref) => {\n const Comp = asChild ? Slot : 'div'\n\n // Horizontal: separate CardImage from rest, wrap rest in flex-col\n let content = children\n if (direction === 'horizontal') {\n const childArray = React.Children.toArray(children)\n const imageChildren: React.ReactNode[] = []\n const otherChildren: React.ReactNode[] = []\n\n childArray.forEach((child) => {\n if (React.isValidElement(child) && child.type === CardImage) {\n imageChildren.push(child)\n } else {\n otherChildren.push(child)\n }\n })\n\n content = (\n <>\n {imageChildren}\n <div className=\"flex-1 flex flex-col min-w-0\">\n {otherChildren}\n </div>\n </>\n )\n }\n\n return (\n <CardContext.Provider value={{ size, direction }}>\n <Comp\n ref={ref}\n className={cn(\n cardVariants({ variant, size, radius, direction }),\n interactive && 'cursor-pointer hover:shadow-md hover:-translate-y-0.5',\n className\n )}\n {...props}\n >\n {content}\n </Comp>\n </CardContext.Provider>\n )\n }\n)\nCard.displayName = 'Card'\n\n// ── Size-based padding map (responsive: mobile → desktop) ──\nconst sizePaddingMap = {\n sm: 'p-4', // 16px\n default: 'p-4 sm:p-6', // 16px → 24px\n lg: 'p-6 sm:p-8', // 24px → 32px\n} as const\n\nconst sizePaddingXMap = {\n sm: 'px-4', // 16px\n default: 'px-4 sm:px-6', // 16px → 24px\n lg: 'px-6 sm:px-8', // 24px → 32px\n} as const\n\nconst sizePaddingYMap = {\n sm: 'py-3', // 12px\n default: 'py-3 sm:py-4', // 12px → 16px\n lg: 'py-4 sm:py-5', // 16px → 20px\n} as const\n\n// Top padding for CardHeader — optical balance (top >= sides)\nconst sizePaddingTMap = {\n sm: 'pt-5', // 20px\n default: 'pt-5 sm:pt-6', // 20px → 24px\n lg: 'pt-6 sm:pt-8', // 24px → 32px\n} as const\n\n// Inner bottom padding (between sections) — tighter than outer\nconst sizeInnerPbMap = {\n sm: 'pb-3', // 12px\n default: 'pb-3 sm:pb-4', // 12px → 16px\n lg: 'pb-3 sm:pb-4', // 12px → 16px (default와 동일)\n} as const\n\n// Last-child bottom padding for CardContent (when no footer) — match pt\nconst sizeLastPbMap = {\n sm: 'last:pb-5', // 20px\n default: 'last:pb-5 sm:last:pb-6', // 20px → 24px\n lg: 'last:pb-6 sm:last:pb-8', // 24px → 32px\n} as const\n\n// ── CardImage ──\n// Overlay opacity to Tailwind class mapping\nconst overlayOpacityMap: Record<number, string> = {\n 10: 'from-black/10',\n 20: 'from-black/20',\n 30: 'from-black/30',\n 40: 'from-black/40',\n 50: 'from-black/50',\n 60: 'from-black/60',\n 70: 'from-black/70',\n 80: 'from-black/80',\n 90: 'from-black/90',\n}\n\nexport interface CardImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n /** Gradient overlay on image */\n overlay?: boolean\n /** Overlay opacity (10–90). Default: 60 */\n overlayOpacity?: number\n /** Custom class for overlay gradient (overrides overlayOpacity) */\n overlayClassName?: string\n}\n\nconst CardImage = React.forwardRef<HTMLImageElement, CardImageProps>(\n ({ className, overlay = false, overlayOpacity = 60, overlayClassName, alt = '', ...props }, ref) => {\n const { direction } = useCard()\n const isHorizontal = direction === 'horizontal'\n\n // Horizontal: use absolute positioning so the image fills the\n // wrapper height which is determined by the content side via\n // flexbox align-items:stretch (default).\n if (isHorizontal) {\n const opacityClass = overlay\n ? (overlayOpacityMap[overlayOpacity] || 'from-black/60')\n : null\n\n return (\n <div className={cn('relative shrink-0 w-48 overflow-hidden', className)}>\n <img\n ref={ref}\n alt={alt}\n className=\"absolute inset-0 w-full h-full object-cover\"\n {...props}\n />\n {overlay && (\n <div className={cn('absolute inset-0 bg-gradient-to-t to-transparent', overlayClassName || opacityClass)} />\n )}\n </div>\n )\n }\n\n // Vertical\n if (overlay) {\n const opacityClass = overlayOpacityMap[overlayOpacity] || 'from-black/60'\n\n return (\n <div className=\"relative w-full shrink-0 overflow-hidden\">\n <img\n ref={ref}\n alt={alt}\n className={cn('w-full object-cover', className)}\n {...props}\n />\n <div className={cn('absolute inset-0 bg-gradient-to-t to-transparent', overlayClassName || opacityClass)} />\n </div>\n )\n }\n\n return (\n <img\n ref={ref}\n alt={alt}\n className={cn('w-full object-cover shrink-0', className)}\n {...props}\n />\n )\n }\n)\nCardImage.displayName = 'CardImage'\n\n// ── CardHeader ──\nexport interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, children, ...props }, ref) => {\n const { size } = useCard()\n\n // Separate CardAction from other children for proper flex layout\n const childArray = React.Children.toArray(children)\n const actionChildren: React.ReactNode[] = []\n const otherChildren: React.ReactNode[] = []\n\n childArray.forEach((child) => {\n if (React.isValidElement(child) && child.type === CardAction) {\n actionChildren.push(child)\n } else {\n otherChildren.push(child)\n }\n })\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-start gap-3',\n sizePaddingXMap[size],\n sizePaddingTMap[size],\n sizeInnerPbMap[size],\n sizeLastPbMap[size],\n className\n )}\n {...props}\n >\n <div className=\"flex-1 min-w-0 space-y-3\">\n {otherChildren}\n </div>\n {actionChildren}\n </div>\n )\n }\n)\nCardHeader.displayName = 'CardHeader'\n\n// ── CardTitle ──\nexport interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {\n /** Leading icon */\n icon?: React.ReactNode\n}\n\nconst CardTitle = React.forwardRef<HTMLHeadingElement, CardTitleProps>(\n ({ className, icon, children, ...props }, ref) => {\n return (\n <h3\n ref={ref}\n className={cn(\n 'font-semibold text-foreground leading-none tracking-tight',\n icon && 'flex items-center gap-2',\n className\n )}\n {...props}\n >\n {icon && (\n <span className=\"shrink-0 icon-sm [&>svg]:w-full [&>svg]:h-full\" aria-hidden=\"true\">\n {icon}\n </span>\n )}\n {children}\n </h3>\n )\n }\n)\nCardTitle.displayName = 'CardTitle'\n\n// ── CardDescription ──\nexport interface CardDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {}\n\nconst CardDescription = React.forwardRef<HTMLParagraphElement, CardDescriptionProps>(\n ({ className, ...props }, ref) => {\n return (\n <p\n ref={ref}\n className={cn('text-sm text-text-muted', className)}\n {...props}\n />\n )\n }\n)\nCardDescription.displayName = 'CardDescription'\n\n// ── CardAction ──\nexport interface CardActionProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardAction = React.forwardRef<HTMLDivElement, CardActionProps>(\n ({ className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={cn('shrink-0 ml-auto -mr-2 -mt-2', className)}\n {...props}\n />\n )\n }\n)\nCardAction.displayName = 'CardAction'\n\n// ── CardContent ──\nexport interface CardContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ className, ...props }, ref) => {\n const { size } = useCard()\n\n return (\n <div\n ref={ref}\n className={cn(sizePaddingXMap[size], 'pb-0', sizeLastPbMap[size], className)}\n {...props}\n />\n )\n }\n)\nCardContent.displayName = 'CardContent'\n\n// ── CardFooter ──\nexport interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardFooter = React.forwardRef<HTMLDivElement, CardFooterProps>(\n ({ className, ...props }, ref) => {\n const { size } = useCard()\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center gap-2',\n sizePaddingXMap[size],\n sizePaddingYMap[size],\n 'mt-auto',\n className\n )}\n {...props}\n />\n )\n }\n)\nCardFooter.displayName = 'CardFooter'\n\nexport {\n Card,\n CardImage,\n CardHeader,\n CardTitle,\n CardDescription,\n CardAction,\n CardContent,\n CardFooter,\n cardVariants,\n}\n"],"mappings":"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","names":[]}
@@ -26,7 +26,7 @@ type ChartContextProps = {
26
26
  setActiveDataKey: (key: string | null) => void;
27
27
  };
28
28
  declare function useChart(): ChartContextProps;
29
- declare function ChartContainer({ id, className, children, config, hoverFade, ...props }: React.ComponentProps<'div'> & {
29
+ declare function Chart({ id, className, children, config, hoverFade, ...props }: React.ComponentProps<'div'> & {
30
30
  config: ChartConfig;
31
31
  /** Enable hover-to-highlight: hovered bar group stays full opacity, others fade. */
32
32
  hoverFade?: boolean;
@@ -143,21 +143,5 @@ type ChartPieProps = Omit<React.ComponentProps<typeof RechartsPrimitive.Pie>, 'l
143
143
  cornerRadius?: number;
144
144
  };
145
145
  declare function ChartPie({ variant, label: labelMode, labelContent, activeShape: showActiveShape, innerRadius, paddingAngle, cornerRadius, startAngle, endAngle, ...props }: ChartPieProps): React.JSX.Element;
146
- declare const Chart: typeof ChartContainer & {
147
- Bar: typeof ChartBar;
148
- Line: typeof ChartLine;
149
- Area: typeof ChartArea;
150
- Pie: typeof ChartPie;
151
- Tooltip: typeof ChartTooltip;
152
- TooltipContent: typeof ChartTooltipContent;
153
- Legend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
154
- LegendContent: typeof ChartLegendContent;
155
- XAxis: typeof ChartXAxis;
156
- YAxis: typeof ChartYAxis;
157
- Style: ({ id, config }: {
158
- id: string;
159
- config: ChartConfig;
160
- }) => React.JSX.Element;
161
- };
162
146
 
163
- export { Chart, ChartArea, type ChartAreaType, type ChartAreaVariant, ChartBar, type ChartBarRadius, type ChartBarVariant, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartLine, type ChartLineType, type ChartLineVariant, ChartPie, type ChartPieLabel, type ChartPieLabelContent, type ChartPieVariant, ChartStyle, ChartTooltip, ChartTooltipContent, ChartXAxis, ChartYAxis, useChart };
147
+ export { Chart, ChartArea, type ChartAreaType, type ChartAreaVariant, ChartBar, type ChartBarRadius, type ChartBarVariant, type ChartConfig, ChartLegend, ChartLegendContent, ChartLine, type ChartLineType, type ChartLineVariant, ChartPie, type ChartPieLabel, type ChartPieLabelContent, type ChartPieVariant, ChartStyle, ChartTooltip, ChartTooltipContent, ChartXAxis, ChartYAxis, useChart };
@@ -26,7 +26,7 @@ type ChartContextProps = {
26
26
  setActiveDataKey: (key: string | null) => void;
27
27
  };
28
28
  declare function useChart(): ChartContextProps;
29
- declare function ChartContainer({ id, className, children, config, hoverFade, ...props }: React.ComponentProps<'div'> & {
29
+ declare function Chart({ id, className, children, config, hoverFade, ...props }: React.ComponentProps<'div'> & {
30
30
  config: ChartConfig;
31
31
  /** Enable hover-to-highlight: hovered bar group stays full opacity, others fade. */
32
32
  hoverFade?: boolean;
@@ -143,21 +143,5 @@ type ChartPieProps = Omit<React.ComponentProps<typeof RechartsPrimitive.Pie>, 'l
143
143
  cornerRadius?: number;
144
144
  };
145
145
  declare function ChartPie({ variant, label: labelMode, labelContent, activeShape: showActiveShape, innerRadius, paddingAngle, cornerRadius, startAngle, endAngle, ...props }: ChartPieProps): React.JSX.Element;
146
- declare const Chart: typeof ChartContainer & {
147
- Bar: typeof ChartBar;
148
- Line: typeof ChartLine;
149
- Area: typeof ChartArea;
150
- Pie: typeof ChartPie;
151
- Tooltip: typeof ChartTooltip;
152
- TooltipContent: typeof ChartTooltipContent;
153
- Legend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
154
- LegendContent: typeof ChartLegendContent;
155
- XAxis: typeof ChartXAxis;
156
- YAxis: typeof ChartYAxis;
157
- Style: ({ id, config }: {
158
- id: string;
159
- config: ChartConfig;
160
- }) => React.JSX.Element;
161
- };
162
146
 
163
- export { Chart, ChartArea, type ChartAreaType, type ChartAreaVariant, ChartBar, type ChartBarRadius, type ChartBarVariant, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartLine, type ChartLineType, type ChartLineVariant, ChartPie, type ChartPieLabel, type ChartPieLabelContent, type ChartPieVariant, ChartStyle, ChartTooltip, ChartTooltipContent, ChartXAxis, ChartYAxis, useChart };
147
+ export { Chart, ChartArea, type ChartAreaType, type ChartAreaVariant, ChartBar, type ChartBarRadius, type ChartBarVariant, type ChartConfig, ChartLegend, ChartLegendContent, ChartLine, type ChartLineType, type ChartLineVariant, ChartPie, type ChartPieLabel, type ChartPieLabelContent, type ChartPieVariant, ChartStyle, ChartTooltip, ChartTooltipContent, ChartXAxis, ChartYAxis, useChart };