@karakuri-ui/react 0.2.4 → 0.3.1
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.
- package/README.md +5 -5
- package/dist/components/ui/accordion.d.mts +1 -10
- package/dist/components/ui/accordion.d.ts +1 -10
- package/dist/components/ui/accordion.js +2 -7
- package/dist/components/ui/accordion.js.map +1 -1
- package/dist/components/ui/accordion.mjs +2 -7
- package/dist/components/ui/accordion.mjs.map +1 -1
- package/dist/components/ui/alert.d.mts +3 -12
- package/dist/components/ui/alert.d.ts +3 -12
- package/dist/components/ui/alert.js +2 -8
- package/dist/components/ui/alert.js.map +1 -1
- package/dist/components/ui/alert.mjs +2 -7
- package/dist/components/ui/alert.mjs.map +1 -1
- package/dist/components/ui/avatar.d.mts +1 -10
- package/dist/components/ui/avatar.d.ts +1 -10
- package/dist/components/ui/avatar.js +3 -8
- package/dist/components/ui/avatar.js.map +1 -1
- package/dist/components/ui/avatar.mjs +3 -8
- package/dist/components/ui/avatar.mjs.map +1 -1
- package/dist/components/ui/breadcrumb.d.mts +1 -12
- package/dist/components/ui/breadcrumb.d.ts +1 -12
- package/dist/components/ui/breadcrumb.js +2 -10
- package/dist/components/ui/breadcrumb.js.map +1 -1
- package/dist/components/ui/breadcrumb.mjs +2 -10
- package/dist/components/ui/breadcrumb.mjs.map +1 -1
- package/dist/components/ui/card.d.mts +1 -18
- package/dist/components/ui/card.d.ts +1 -18
- package/dist/components/ui/card.js +2 -11
- package/dist/components/ui/card.js.map +1 -1
- package/dist/components/ui/card.mjs +2 -11
- package/dist/components/ui/card.mjs.map +1 -1
- package/dist/components/ui/chart.d.mts +2 -18
- package/dist/components/ui/chart.d.ts +2 -18
- package/dist/components/ui/chart.js +2 -17
- package/dist/components/ui/chart.js.map +1 -1
- package/dist/components/ui/chart.mjs +2 -16
- package/dist/components/ui/chart.mjs.map +1 -1
- package/dist/components/ui/drawer.d.mts +2 -17
- package/dist/components/ui/drawer.d.ts +2 -17
- package/dist/components/ui/drawer.js +1 -15
- package/dist/components/ui/drawer.js.map +1 -1
- package/dist/components/ui/drawer.mjs +1 -14
- package/dist/components/ui/drawer.mjs.map +1 -1
- package/dist/components/ui/dropdown.d.mts +1 -26
- package/dist/components/ui/dropdown.d.ts +1 -26
- package/dist/components/ui/dropdown.js +1 -16
- package/dist/components/ui/dropdown.js.map +1 -1
- package/dist/components/ui/dropdown.mjs +1 -16
- package/dist/components/ui/dropdown.mjs.map +1 -1
- package/dist/components/ui/field.d.mts +1 -8
- package/dist/components/ui/field.d.ts +1 -8
- package/dist/components/ui/field.js +2 -7
- package/dist/components/ui/field.js.map +1 -1
- package/dist/components/ui/field.mjs +2 -7
- package/dist/components/ui/field.mjs.map +1 -1
- package/dist/components/ui/index.d.mts +4 -4
- package/dist/components/ui/index.d.ts +4 -4
- package/dist/components/ui/index.js +0 -8
- package/dist/components/ui/index.js.map +1 -1
- package/dist/components/ui/index.mjs +4 -8
- package/dist/components/ui/index.mjs.map +1 -1
- package/dist/components/ui/metric-card.d.mts +1 -16
- package/dist/components/ui/metric-card.d.ts +1 -16
- package/dist/components/ui/metric-card.js +2 -10
- package/dist/components/ui/metric-card.js.map +1 -1
- package/dist/components/ui/metric-card.mjs +2 -10
- package/dist/components/ui/metric-card.mjs.map +1 -1
- package/dist/components/ui/modal.d.mts +2 -32
- package/dist/components/ui/modal.d.ts +2 -32
- package/dist/components/ui/modal.js +2 -27
- package/dist/components/ui/modal.js.map +1 -1
- package/dist/components/ui/modal.mjs +2 -27
- package/dist/components/ui/modal.mjs.map +1 -1
- package/dist/components/ui/navigation-menu.d.mts +1 -20
- package/dist/components/ui/navigation-menu.d.ts +1 -20
- package/dist/components/ui/navigation-menu.js +2 -12
- package/dist/components/ui/navigation-menu.js.map +1 -1
- package/dist/components/ui/navigation-menu.mjs +2 -12
- package/dist/components/ui/navigation-menu.mjs.map +1 -1
- package/dist/components/ui/pagination.d.mts +1 -18
- package/dist/components/ui/pagination.d.ts +1 -18
- package/dist/components/ui/pagination.js +2 -13
- package/dist/components/ui/pagination.js.map +1 -1
- package/dist/components/ui/pagination.mjs +2 -13
- package/dist/components/ui/pagination.mjs.map +1 -1
- package/dist/components/ui/popover.d.mts +3 -15
- package/dist/components/ui/popover.d.ts +3 -15
- package/dist/components/ui/popover.js +1 -11
- package/dist/components/ui/popover.js.map +1 -1
- package/dist/components/ui/popover.mjs +1 -10
- package/dist/components/ui/popover.mjs.map +1 -1
- package/dist/components/ui/radio-group.d.mts +1 -6
- package/dist/components/ui/radio-group.d.ts +1 -6
- package/dist/components/ui/radio-group.js +2 -5
- package/dist/components/ui/radio-group.js.map +1 -1
- package/dist/components/ui/radio-group.mjs +2 -5
- package/dist/components/ui/radio-group.mjs.map +1 -1
- package/dist/components/ui/segmented.d.mts +1 -6
- package/dist/components/ui/segmented.d.ts +1 -6
- package/dist/components/ui/segmented.js +2 -5
- package/dist/components/ui/segmented.js.map +1 -1
- package/dist/components/ui/segmented.mjs +2 -5
- package/dist/components/ui/segmented.mjs.map +1 -1
- package/dist/components/ui/select.d.mts +4 -15
- package/dist/components/ui/select.d.ts +4 -15
- package/dist/components/ui/select.js +5 -14
- package/dist/components/ui/select.js.map +1 -1
- package/dist/components/ui/select.mjs +5 -14
- package/dist/components/ui/select.mjs.map +1 -1
- package/dist/components/ui/table.d.mts +1 -15
- package/dist/components/ui/table.d.ts +1 -15
- package/dist/components/ui/table.js +2 -11
- package/dist/components/ui/table.js.map +1 -1
- package/dist/components/ui/table.mjs +2 -11
- package/dist/components/ui/table.mjs.map +1 -1
- package/dist/components/ui/tabs.d.mts +1 -10
- package/dist/components/ui/tabs.d.ts +1 -10
- package/dist/components/ui/tabs.js +1 -6
- package/dist/components/ui/tabs.js.map +1 -1
- package/dist/components/ui/tabs.mjs +1 -6
- package/dist/components/ui/tabs.mjs.map +1 -1
- package/dist/components/ui/toggle-group.d.mts +1 -6
- package/dist/components/ui/toggle-group.d.ts +1 -6
- package/dist/components/ui/toggle-group.js +2 -5
- package/dist/components/ui/toggle-group.js.map +1 -1
- package/dist/components/ui/toggle-group.mjs +2 -5
- package/dist/components/ui/toggle-group.mjs.map +1 -1
- package/dist/components/ui/tooltip.d.mts +3 -14
- package/dist/components/ui/tooltip.d.ts +3 -14
- package/dist/components/ui/tooltip.js +1 -10
- package/dist/components/ui/tooltip.js.map +1 -1
- package/dist/components/ui/tooltip.mjs +1 -9
- package/dist/components/ui/tooltip.mjs.map +1 -1
- package/dist/lib/code-generator.d.mts +60 -0
- package/dist/lib/code-generator.d.ts +60 -0
- package/dist/lib/code-generator.js +224 -0
- package/dist/lib/code-generator.js.map +1 -0
- package/dist/lib/code-generator.mjs +159 -0
- package/dist/lib/code-generator.mjs.map +1 -0
- package/package.json +4 -2
|
@@ -145,7 +145,7 @@ function getAvatarColor(name, variant = "vivid") {
|
|
|
145
145
|
}
|
|
146
146
|
return avatarColors[(hash >>> 0) % avatarColors.length][variant];
|
|
147
147
|
}
|
|
148
|
-
const
|
|
148
|
+
const Avatar = React.forwardRef(({ className, size, shape, status, children, ...props }, ref) => {
|
|
149
149
|
const resolvedSize = size || "default";
|
|
150
150
|
if (!status) {
|
|
151
151
|
return /* @__PURE__ */ React.createElement(
|
|
@@ -177,7 +177,7 @@ const AvatarRoot = React.forwardRef(({ className, size, shape, status, children,
|
|
|
177
177
|
}
|
|
178
178
|
));
|
|
179
179
|
});
|
|
180
|
-
|
|
180
|
+
Avatar.displayName = "Avatar";
|
|
181
181
|
const AvatarImage = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
182
182
|
AvatarPrimitive.Image,
|
|
183
183
|
{
|
|
@@ -226,16 +226,11 @@ const AvatarGroup = React.forwardRef(
|
|
|
226
226
|
...props
|
|
227
227
|
},
|
|
228
228
|
visibleChildren,
|
|
229
|
-
overflowCount > 0 && /* @__PURE__ */ React.createElement(
|
|
229
|
+
overflowCount > 0 && /* @__PURE__ */ React.createElement(Avatar, { size, shape }, /* @__PURE__ */ React.createElement(AvatarFallback, { size }, "+", overflowCount))
|
|
230
230
|
);
|
|
231
231
|
}
|
|
232
232
|
);
|
|
233
233
|
AvatarGroup.displayName = "AvatarGroup";
|
|
234
|
-
const Avatar = Object.assign(AvatarRoot, {
|
|
235
|
-
Image: AvatarImage,
|
|
236
|
-
Fallback: AvatarFallback,
|
|
237
|
-
Group: AvatarGroup
|
|
238
|
-
});
|
|
239
234
|
// Annotate the CommonJS export names for ESM import in node:
|
|
240
235
|
0 && (module.exports = {
|
|
241
236
|
Avatar,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/ui/avatar.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as AvatarPrimitive from '@radix-ui/react-avatar'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Avatar root variants\nconst avatarVariants = cva(\n 'relative inline-flex items-center justify-center overflow-hidden bg-background-muted select-none',\n {\n variants: {\n size: {\n xs: 'w-6 h-6', // 24px\n sm: 'w-8 h-8', // 32px\n default: 'w-10 h-10', // 40px\n lg: 'w-12 h-12', // 48px\n xl: 'w-16 h-16', // 64px\n '2xl': 'w-20 h-20', // 80px\n },\n shape: {\n circle: 'rounded-full',\n square: 'rounded-xl',\n },\n },\n defaultVariants: { size: 'default', shape: 'circle' },\n }\n)\n\n// Status dot sizes per avatar size\nconst statusDotSizes = {\n xs: 'w-1.5 h-1.5',\n sm: 'w-2 h-2',\n default: 'w-2.5 h-2.5',\n lg: 'w-3 h-3',\n xl: 'w-3.5 h-3.5',\n '2xl': 'w-4 h-4',\n}\n\n// Status dot colors\nconst statusColors = {\n online: 'bg-success',\n offline: 'bg-text-muted',\n busy: 'bg-error',\n away: 'bg-warning',\n}\n\n// Fallback font sizes per avatar size\nconst fallbackFontSizes = {\n xs: 'text-2xs',\n sm: 'text-xs',\n default: 'text-sm',\n lg: 'text-base',\n xl: 'text-xl',\n '2xl': 'text-2xl',\n}\n\n// Negative margin per size for AvatarGroup overlap\nconst groupNegativeMargins = {\n xs: '-space-x-1.5',\n sm: '-space-x-2',\n default: '-space-x-2.5',\n lg: '-space-x-3',\n xl: '-space-x-4',\n '2xl': '-space-x-5',\n}\n\n// Colorized fallback palette (12 colors × 2 variants) — exception 13 in TOKEN-EXCEPTIONS.md\nconst avatarColors = [\n { vivid: { bg: 'bg-[#DC2626]', text: 'text-white' }, soft: { bg: 'bg-[#FEE2E2]', text: 'text-[#DC2626]' } }, // red\n { vivid: { bg: 'bg-[#EA580C]', text: 'text-white' }, soft: { bg: 'bg-[#FFEDD5]', text: 'text-[#EA580C]' } }, // orange\n { vivid: { bg: 'bg-[#D97706]', text: 'text-white' }, soft: { bg: 'bg-[#FEF3C7]', text: 'text-[#B45309]' } }, // amber\n { vivid: { bg: 'bg-[#CA8A04]', text: 'text-white' }, soft: { bg: 'bg-[#FEF9C3]', text: 'text-[#A16207]' } }, // yellow\n { vivid: { bg: 'bg-[#059669]', text: 'text-white' }, soft: { bg: 'bg-[#D1FAE5]', text: 'text-[#047857]' } }, // emerald\n { vivid: { bg: 'bg-[#0D9488]', text: 'text-white' }, soft: { bg: 'bg-[#CCFBF1]', text: 'text-[#0F766E]' } }, // teal\n { vivid: { bg: 'bg-[#0891B2]', text: 'text-white' }, soft: { bg: 'bg-[#CFFAFE]', text: 'text-[#0E7490]' } }, // cyan\n { vivid: { bg: 'bg-[#2563EB]', text: 'text-white' }, soft: { bg: 'bg-[#DBEAFE]', text: 'text-[#1D4ED8]' } }, // blue\n { vivid: { bg: 'bg-[#4F46E5]', text: 'text-white' }, soft: { bg: 'bg-[#E0E7FF]', text: 'text-[#4338CA]' } }, // indigo\n { vivid: { bg: 'bg-[#7C3AED]', text: 'text-white' }, soft: { bg: 'bg-[#EDE9FE]', text: 'text-[#6D28D9]' } }, // violet\n { vivid: { bg: 'bg-[#9333EA]', text: 'text-white' }, soft: { bg: 'bg-[#F3E8FF]', text: 'text-[#7E22CE]' } }, // purple\n { vivid: { bg: 'bg-[#DB2777]', text: 'text-white' }, soft: { bg: 'bg-[#FCE7F3]', text: 'text-[#BE185D]' } }, // pink\n] as const\n\nexport type AvatarColorVariant = 'vivid' | 'soft'\n\n/** Extract initials from a name string (e.g. \"John Doe\" → \"JD\", \"김민수\" → \"김민\") */\nfunction getAvatarInitials(name: string, maxChars = 2): string {\n const trimmed = name.trim()\n if (!trimmed) return ''\n\n // CJK: use first character(s) directly\n const cjkRegex = /[\\u3000-\\u9fff\\uac00-\\ud7af\\uff00-\\uffef]/\n if (cjkRegex.test(trimmed.charAt(0))) {\n return trimmed.slice(0, maxChars)\n }\n\n // Split on spaces, hyphens, underscores, dots\n const parts = trimmed.split(/[\\s\\-_.]+/).filter(Boolean)\n if (parts.length === 1) {\n return parts[0].charAt(0).toUpperCase()\n }\n\n // First + last part initials\n return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0))\n .toUpperCase()\n .slice(0, maxChars)\n}\n\n/** Hash a name string to a deterministic avatar color pair (djb2 xor variant) */\nfunction getAvatarColor(name: string, variant: AvatarColorVariant = 'vivid') {\n let hash = 5381\n for (let i = 0; i < name.length; i++) {\n hash = ((hash << 5) + hash) ^ name.charCodeAt(i)\n }\n return avatarColors[(hash >>> 0) % avatarColors.length][variant]\n}\n\nexport type AvatarSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl' | '2xl'\nexport type AvatarShape = 'circle' | 'square'\nexport type AvatarStatus = 'online' | 'offline' | 'busy' | 'away'\n\nexport interface AvatarProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n VariantProps<typeof avatarVariants> {\n status?: AvatarStatus\n}\n\nconst AvatarRoot = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarProps\n>(({ className, size, shape, status, children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n\n if (!status) {\n return (\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n )\n }\n\n // Wrap with an outer span so the status dot is not clipped by overflow-hidden\n return (\n <span className=\"relative inline-flex\">\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n <span\n className={cn(\n 'absolute bottom-0 right-0 rounded-full ring-2 ring-background',\n statusDotSizes[resolvedSize],\n statusColors[status]\n )}\n />\n </span>\n )\n})\nAvatarRoot.displayName = 'Avatar'\n\nexport interface AvatarImageProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image> {}\n\nconst AvatarImage = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Image>,\n AvatarImageProps\n>(({ className, ...props }, ref) => (\n <AvatarPrimitive.Image\n ref={ref}\n className={cn('object-cover w-full h-full', className)}\n {...props}\n />\n))\nAvatarImage.displayName = 'AvatarImage'\n\nexport interface AvatarFallbackProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback> {\n size?: AvatarSize\n /** Shorthand: auto-generates initials + color from a name. Children override auto-initials. */\n name?: string\n /** Pass a name/key to enable colorized mode. The string is hashed to pick a deterministic color. */\n colorized?: string\n /** Color style: \"vivid\" (strong bg + white text) or \"soft\" (pastel bg + dark text). Default: \"vivid\" */\n colorVariant?: AvatarColorVariant\n}\n\nconst AvatarFallback = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Fallback>,\n AvatarFallbackProps\n>(({ className, size, name, colorized, colorVariant = 'vivid', children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n const colorKey = name || colorized\n const color = colorKey ? getAvatarColor(colorKey, colorVariant) : null\n const resolvedChildren = children ?? (name ? getAvatarInitials(name) : undefined)\n return (\n <AvatarPrimitive.Fallback\n ref={ref}\n className={cn(\n 'flex items-center justify-center w-full h-full font-semibold',\n color ? [color.bg, color.text] : 'bg-background-muted text-text-muted',\n fallbackFontSizes[resolvedSize],\n className\n )}\n {...props}\n >\n {resolvedChildren}\n </AvatarPrimitive.Fallback>\n )\n})\nAvatarFallback.displayName = 'AvatarFallback'\n\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n max?: number\n size?: AvatarSize\n shape?: AvatarShape\n}\n\nconst AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n ({ className, max, size = 'default', shape = 'circle', children, ...props }, ref) => {\n const childArray = React.Children.toArray(children)\n const visibleChildren = max ? childArray.slice(0, max) : childArray\n const overflowCount = max ? childArray.length - max : 0\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center',\n groupNegativeMargins[size],\n '[&>*]:ring-2 [&>*]:ring-background',\n className\n )}\n {...props}\n >\n {visibleChildren}\n {overflowCount > 0 && (\n <AvatarRoot size={size} shape={shape}>\n <AvatarFallback size={size}>+{overflowCount}</AvatarFallback>\n </AvatarRoot>\n )}\n </div>\n )\n }\n)\nAvatarGroup.displayName = 'AvatarGroup'\n\n// ─── Namespace ──────────────────────────────────────────\nconst Avatar = Object.assign(AvatarRoot, {\n Image: AvatarImage,\n Fallback: AvatarFallback,\n Group: AvatarGroup,\n})\n\n// eslint-disable-next-line @typescript-eslint/no-namespace\nnamespace Avatar {\n export type ImageProps = AvatarImageProps\n export type FallbackProps = AvatarFallbackProps\n export type GroupProps = AvatarGroupProps\n}\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarGroup, avatarVariants, avatarColors, getAvatarColor, getAvatarInitials }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,YAAuB;AACvB,sBAAiC;AACjC,sCAAuC;AACvC,mBAAmB;AAGnB,MAAM,qBAAiB;AAAA,EACrB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAS;AAAA;AAAA,QACT,IAAS;AAAA;AAAA,QACT,SAAS;AAAA;AAAA,QACT,IAAS;AAAA;AAAA,QACT,IAAS;AAAA;AAAA,QACT,OAAS;AAAA;AAAA,MACX;AAAA,MACA,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,iBAAiB,EAAE,MAAM,WAAW,OAAO,SAAS;AAAA,EACtD;AACF;AAGA,MAAM,iBAAiB;AAAA,EACrB,IAAS;AAAA,EACT,IAAS;AAAA,EACT,SAAS;AAAA,EACT,IAAS;AAAA,EACT,IAAS;AAAA,EACT,OAAS;AACX;AAGA,MAAM,eAAe;AAAA,EACnB,QAAS;AAAA,EACT,SAAS;AAAA,EACT,MAAS;AAAA,EACT,MAAS;AACX;AAGA,MAAM,oBAAoB;AAAA,EACxB,IAAS;AAAA,EACT,IAAS;AAAA,EACT,SAAS;AAAA,EACT,IAAS;AAAA,EACT,IAAS;AAAA,EACT,OAAS;AACX;AAGA,MAAM,uBAAuB;AAAA,EAC3B,IAAS;AAAA,EACT,IAAS;AAAA,EACT,SAAS;AAAA,EACT,IAAS;AAAA,EACT,IAAS;AAAA,EACT,OAAS;AACX;AAGA,MAAM,eAAe;AAAA,EACnB,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAAA,EAC1G,EAAE,OAAO,EAAE,IAAI,gBAAgB,MAAM,aAAa,GAAG,MAAM,EAAE,IAAI,gBAAgB,MAAM,iBAAiB,EAAE;AAAA;AAC5G;AAKA,SAAS,kBAAkB,MAAc,WAAW,GAAW;AAC7D,QAAM,UAAU,KAAK,KAAK;AAC1B,MAAI,CAAC,QAAS,QAAO;AAGrB,QAAM,WAAW;AACjB,MAAI,SAAS,KAAK,QAAQ,OAAO,CAAC,CAAC,GAAG;AACpC,WAAO,QAAQ,MAAM,GAAG,QAAQ;AAAA,EAClC;AAGA,QAAM,QAAQ,QAAQ,MAAM,WAAW,EAAE,OAAO,OAAO;AACvD,MAAI,MAAM,WAAW,GAAG;AACtB,WAAO,MAAM,CAAC,EAAE,OAAO,CAAC,EAAE,YAAY;AAAA,EACxC;AAGA,UAAQ,MAAM,CAAC,EAAE,OAAO,CAAC,IAAI,MAAM,MAAM,SAAS,CAAC,EAAE,OAAO,CAAC,GAC1D,YAAY,EACZ,MAAM,GAAG,QAAQ;AACtB;AAGA,SAAS,eAAe,MAAc,UAA8B,SAAS;AAC3E,MAAI,OAAO;AACX,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;AACpC,YAAS,QAAQ,KAAK,OAAQ,KAAK,WAAW,CAAC;AAAA,EACjD;AACA,SAAO,cAAc,SAAS,KAAK,aAAa,MAAM,EAAE,OAAO;AACjE;AAYA,MAAM,aAAa,MAAM,WAGvB,CAAC,EAAE,WAAW,MAAM,OAAO,QAAQ,UAAU,GAAG,MAAM,GAAG,QAAQ;AACjE,QAAM,eAAe,QAAQ;AAE7B,MAAI,CAAC,QAAQ;AACX,WACE;AAAA,MAAC,gBAAgB;AAAA,MAAhB;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,eAAe,EAAE,MAAM,MAAM,CAAC,GAAG,SAAS;AAAA,QACvD,GAAG;AAAA;AAAA,MAEH;AAAA,IACH;AAAA,EAEJ;AAGA,SACE,oCAAC,UAAK,WAAU,0BACd;AAAA,IAAC,gBAAgB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,eAAW,iBAAG,eAAe,EAAE,MAAM,MAAM,CAAC,GAAG,SAAS;AAAA,MACvD,GAAG;AAAA;AAAA,IAEH;AAAA,EACH,GACA;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA,eAAe,YAAY;AAAA,QAC3B,aAAa,MAAM;AAAA,MACrB;AAAA;AAAA,EACF,CACF;AAEJ,CAAC;AACD,WAAW,cAAc;AAKzB,MAAM,cAAc,MAAM,WAGxB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC;AAAA,IACA,eAAW,iBAAG,8BAA8B,SAAS;AAAA,IACpD,GAAG;AAAA;AACN,CACD;AACD,YAAY,cAAc;AAa1B,MAAM,iBAAiB,MAAM,WAG3B,CAAC,EAAE,WAAW,MAAM,MAAM,WAAW,eAAe,SAAS,UAAU,GAAG,MAAM,GAAG,QAAQ;AAC3F,QAAM,eAAe,QAAQ;AAC7B,QAAM,WAAW,QAAQ;AACzB,QAAM,QAAQ,WAAW,eAAe,UAAU,YAAY,IAAI;AAClE,QAAM,mBAAmB,aAAa,OAAO,kBAAkB,IAAI,IAAI;AACvE,SACE;AAAA,IAAC,gBAAgB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,eAAW;AAAA,QACT;AAAA,QACA,QAAQ,CAAC,MAAM,IAAI,MAAM,IAAI,IAAI;AAAA,QACjC,kBAAkB,YAAY;AAAA,QAC9B;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,EACH;AAEJ,CAAC;AACD,eAAe,cAAc;AAQ7B,MAAM,cAAc,MAAM;AAAA,EACxB,CAAC,EAAE,WAAW,KAAK,OAAO,WAAW,QAAQ,UAAU,UAAU,GAAG,MAAM,GAAG,QAAQ;AACnF,UAAM,aAAa,MAAM,SAAS,QAAQ,QAAQ;AAClD,UAAM,kBAAkB,MAAM,WAAW,MAAM,GAAG,GAAG,IAAI;AACzD,UAAM,gBAAgB,MAAM,WAAW,SAAS,MAAM;AAEtD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA,qBAAqB,IAAI;AAAA,UACzB;AAAA,UACA;AAAA,QACF;AAAA,QACC,GAAG;AAAA;AAAA,MAEH;AAAA,MACA,gBAAgB,KACf,oCAAC,cAAW,MAAY,SACtB,oCAAC,kBAAe,QAAY,KAAE,aAAc,CAC9C;AAAA,IAEJ;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;AAG1B,MAAM,SAAS,OAAO,OAAO,YAAY;AAAA,EACvC,OAAO;AAAA,EACP,UAAU;AAAA,EACV,OAAO;AACT,CAAC;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/ui/avatar.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as AvatarPrimitive from '@radix-ui/react-avatar'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Avatar root variants\nconst avatarVariants = cva(\n 'relative inline-flex items-center justify-center overflow-hidden bg-background-muted select-none',\n {\n variants: {\n size: {\n xs: 'w-6 h-6', // 24px\n sm: 'w-8 h-8', // 32px\n default: 'w-10 h-10', // 40px\n lg: 'w-12 h-12', // 48px\n xl: 'w-16 h-16', // 64px\n '2xl': 'w-20 h-20', // 80px\n },\n shape: {\n circle: 'rounded-full',\n square: 'rounded-xl',\n },\n },\n defaultVariants: { size: 'default', shape: 'circle' },\n }\n)\n\n// Status dot sizes per avatar size\nconst statusDotSizes = {\n xs: 'w-1.5 h-1.5',\n sm: 'w-2 h-2',\n default: 'w-2.5 h-2.5',\n lg: 'w-3 h-3',\n xl: 'w-3.5 h-3.5',\n '2xl': 'w-4 h-4',\n}\n\n// Status dot colors\nconst statusColors = {\n online: 'bg-success',\n offline: 'bg-text-muted',\n busy: 'bg-error',\n away: 'bg-warning',\n}\n\n// Fallback font sizes per avatar size\nconst fallbackFontSizes = {\n xs: 'text-2xs',\n sm: 'text-xs',\n default: 'text-sm',\n lg: 'text-base',\n xl: 'text-xl',\n '2xl': 'text-2xl',\n}\n\n// Negative margin per size for AvatarGroup overlap\nconst groupNegativeMargins = {\n xs: '-space-x-1.5',\n sm: '-space-x-2',\n default: '-space-x-2.5',\n lg: '-space-x-3',\n xl: '-space-x-4',\n '2xl': '-space-x-5',\n}\n\n// Colorized fallback palette (12 colors × 2 variants) — exception 13 in TOKEN-EXCEPTIONS.md\nconst avatarColors = [\n { vivid: { bg: 'bg-[#DC2626]', text: 'text-white' }, soft: { bg: 'bg-[#FEE2E2]', text: 'text-[#DC2626]' } }, // red\n { vivid: { bg: 'bg-[#EA580C]', text: 'text-white' }, soft: { bg: 'bg-[#FFEDD5]', text: 'text-[#EA580C]' } }, // orange\n { vivid: { bg: 'bg-[#D97706]', text: 'text-white' }, soft: { bg: 'bg-[#FEF3C7]', text: 'text-[#B45309]' } }, // amber\n { vivid: { bg: 'bg-[#CA8A04]', text: 'text-white' }, soft: { bg: 'bg-[#FEF9C3]', text: 'text-[#A16207]' } }, // yellow\n { vivid: { bg: 'bg-[#059669]', text: 'text-white' }, soft: { bg: 'bg-[#D1FAE5]', text: 'text-[#047857]' } }, // emerald\n { vivid: { bg: 'bg-[#0D9488]', text: 'text-white' }, soft: { bg: 'bg-[#CCFBF1]', text: 'text-[#0F766E]' } }, // teal\n { vivid: { bg: 'bg-[#0891B2]', text: 'text-white' }, soft: { bg: 'bg-[#CFFAFE]', text: 'text-[#0E7490]' } }, // cyan\n { vivid: { bg: 'bg-[#2563EB]', text: 'text-white' }, soft: { bg: 'bg-[#DBEAFE]', text: 'text-[#1D4ED8]' } }, // blue\n { vivid: { bg: 'bg-[#4F46E5]', text: 'text-white' }, soft: { bg: 'bg-[#E0E7FF]', text: 'text-[#4338CA]' } }, // indigo\n { vivid: { bg: 'bg-[#7C3AED]', text: 'text-white' }, soft: { bg: 'bg-[#EDE9FE]', text: 'text-[#6D28D9]' } }, // violet\n { vivid: { bg: 'bg-[#9333EA]', text: 'text-white' }, soft: { bg: 'bg-[#F3E8FF]', text: 'text-[#7E22CE]' } }, // purple\n { vivid: { bg: 'bg-[#DB2777]', text: 'text-white' }, soft: { bg: 'bg-[#FCE7F3]', text: 'text-[#BE185D]' } }, // pink\n] as const\n\nexport type AvatarColorVariant = 'vivid' | 'soft'\n\n/** Extract initials from a name string (e.g. \"John Doe\" → \"JD\", \"김민수\" → \"김민\") */\nfunction getAvatarInitials(name: string, maxChars = 2): string {\n const trimmed = name.trim()\n if (!trimmed) return ''\n\n // CJK: use first character(s) directly\n const cjkRegex = /[\\u3000-\\u9fff\\uac00-\\ud7af\\uff00-\\uffef]/\n if (cjkRegex.test(trimmed.charAt(0))) {\n return trimmed.slice(0, maxChars)\n }\n\n // Split on spaces, hyphens, underscores, dots\n const parts = trimmed.split(/[\\s\\-_.]+/).filter(Boolean)\n if (parts.length === 1) {\n return parts[0].charAt(0).toUpperCase()\n }\n\n // First + last part initials\n return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0))\n .toUpperCase()\n .slice(0, maxChars)\n}\n\n/** Hash a name string to a deterministic avatar color pair (djb2 xor variant) */\nfunction getAvatarColor(name: string, variant: AvatarColorVariant = 'vivid') {\n let hash = 5381\n for (let i = 0; i < name.length; i++) {\n hash = ((hash << 5) + hash) ^ name.charCodeAt(i)\n }\n return avatarColors[(hash >>> 0) % avatarColors.length][variant]\n}\n\nexport type AvatarSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl' | '2xl'\nexport type AvatarShape = 'circle' | 'square'\nexport type AvatarStatus = 'online' | 'offline' | 'busy' | 'away'\n\nexport interface AvatarProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n VariantProps<typeof avatarVariants> {\n status?: AvatarStatus\n}\n\nconst Avatar = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarProps\n>(({ className, size, shape, status, children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n\n if (!status) {\n return (\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n )\n }\n\n // Wrap with an outer span so the status dot is not clipped by overflow-hidden\n return (\n <span className=\"relative inline-flex\">\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n <span\n className={cn(\n 'absolute bottom-0 right-0 rounded-full ring-2 ring-background',\n statusDotSizes[resolvedSize],\n statusColors[status]\n )}\n />\n </span>\n )\n})\nAvatar.displayName = 'Avatar'\n\nexport interface AvatarImageProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image> {}\n\nconst AvatarImage = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Image>,\n AvatarImageProps\n>(({ className, ...props }, ref) => (\n <AvatarPrimitive.Image\n ref={ref}\n className={cn('object-cover w-full h-full', className)}\n {...props}\n />\n))\nAvatarImage.displayName = 'AvatarImage'\n\nexport interface AvatarFallbackProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback> {\n size?: AvatarSize\n /** Shorthand: auto-generates initials + color from a name. Children override auto-initials. */\n name?: string\n /** Pass a name/key to enable colorized mode. The string is hashed to pick a deterministic color. */\n colorized?: string\n /** Color style: \"vivid\" (strong bg + white text) or \"soft\" (pastel bg + dark text). Default: \"vivid\" */\n colorVariant?: AvatarColorVariant\n}\n\nconst AvatarFallback = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Fallback>,\n AvatarFallbackProps\n>(({ className, size, name, colorized, colorVariant = 'vivid', children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n const colorKey = name || colorized\n const color = colorKey ? getAvatarColor(colorKey, colorVariant) : null\n const resolvedChildren = children ?? (name ? getAvatarInitials(name) : undefined)\n return (\n <AvatarPrimitive.Fallback\n ref={ref}\n className={cn(\n 'flex items-center justify-center w-full h-full font-semibold',\n color ? [color.bg, color.text] : 'bg-background-muted text-text-muted',\n fallbackFontSizes[resolvedSize],\n className\n )}\n {...props}\n >\n {resolvedChildren}\n </AvatarPrimitive.Fallback>\n )\n})\nAvatarFallback.displayName = 'AvatarFallback'\n\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n max?: number\n size?: AvatarSize\n shape?: AvatarShape\n}\n\nconst AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n ({ className, max, size = 'default', shape = 'circle', children, ...props }, ref) => {\n const childArray = React.Children.toArray(children)\n const visibleChildren = max ? childArray.slice(0, max) : childArray\n const overflowCount = max ? childArray.length - max : 0\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center',\n groupNegativeMargins[size],\n '[&>*]:ring-2 [&>*]:ring-background',\n className\n )}\n {...props}\n >\n {visibleChildren}\n {overflowCount > 0 && (\n <Avatar size={size} shape={shape}>\n <AvatarFallback size={size}>+{overflowCount}</AvatarFallback>\n </Avatar>\n )}\n </div>\n )\n }\n)\nAvatarGroup.displayName = 'AvatarGroup'\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarGroup, avatarVariants, avatarColors, getAvatarColor, getAvatarInitials }\n"],"mappings":"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","names":[]}
|
|
@@ -105,7 +105,7 @@ function getAvatarColor(name, variant = "vivid") {
|
|
|
105
105
|
}
|
|
106
106
|
return avatarColors[(hash >>> 0) % avatarColors.length][variant];
|
|
107
107
|
}
|
|
108
|
-
const
|
|
108
|
+
const Avatar = React.forwardRef(({ className, size, shape, status, children, ...props }, ref) => {
|
|
109
109
|
const resolvedSize = size || "default";
|
|
110
110
|
if (!status) {
|
|
111
111
|
return /* @__PURE__ */ React.createElement(
|
|
@@ -137,7 +137,7 @@ const AvatarRoot = React.forwardRef(({ className, size, shape, status, children,
|
|
|
137
137
|
}
|
|
138
138
|
));
|
|
139
139
|
});
|
|
140
|
-
|
|
140
|
+
Avatar.displayName = "Avatar";
|
|
141
141
|
const AvatarImage = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
142
142
|
AvatarPrimitive.Image,
|
|
143
143
|
{
|
|
@@ -186,16 +186,11 @@ const AvatarGroup = React.forwardRef(
|
|
|
186
186
|
...props
|
|
187
187
|
},
|
|
188
188
|
visibleChildren,
|
|
189
|
-
overflowCount > 0 && /* @__PURE__ */ React.createElement(
|
|
189
|
+
overflowCount > 0 && /* @__PURE__ */ React.createElement(Avatar, { size, shape }, /* @__PURE__ */ React.createElement(AvatarFallback, { size }, "+", overflowCount))
|
|
190
190
|
);
|
|
191
191
|
}
|
|
192
192
|
);
|
|
193
193
|
AvatarGroup.displayName = "AvatarGroup";
|
|
194
|
-
const Avatar = Object.assign(AvatarRoot, {
|
|
195
|
-
Image: AvatarImage,
|
|
196
|
-
Fallback: AvatarFallback,
|
|
197
|
-
Group: AvatarGroup
|
|
198
|
-
});
|
|
199
194
|
export {
|
|
200
195
|
Avatar,
|
|
201
196
|
AvatarFallback,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/ui/avatar.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as AvatarPrimitive from '@radix-ui/react-avatar'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Avatar root variants\nconst avatarVariants = cva(\n 'relative inline-flex items-center justify-center overflow-hidden bg-background-muted select-none',\n {\n variants: {\n size: {\n xs: 'w-6 h-6', // 24px\n sm: 'w-8 h-8', // 32px\n default: 'w-10 h-10', // 40px\n lg: 'w-12 h-12', // 48px\n xl: 'w-16 h-16', // 64px\n '2xl': 'w-20 h-20', // 80px\n },\n shape: {\n circle: 'rounded-full',\n square: 'rounded-xl',\n },\n },\n defaultVariants: { size: 'default', shape: 'circle' },\n }\n)\n\n// Status dot sizes per avatar size\nconst statusDotSizes = {\n xs: 'w-1.5 h-1.5',\n sm: 'w-2 h-2',\n default: 'w-2.5 h-2.5',\n lg: 'w-3 h-3',\n xl: 'w-3.5 h-3.5',\n '2xl': 'w-4 h-4',\n}\n\n// Status dot colors\nconst statusColors = {\n online: 'bg-success',\n offline: 'bg-text-muted',\n busy: 'bg-error',\n away: 'bg-warning',\n}\n\n// Fallback font sizes per avatar size\nconst fallbackFontSizes = {\n xs: 'text-2xs',\n sm: 'text-xs',\n default: 'text-sm',\n lg: 'text-base',\n xl: 'text-xl',\n '2xl': 'text-2xl',\n}\n\n// Negative margin per size for AvatarGroup overlap\nconst groupNegativeMargins = {\n xs: '-space-x-1.5',\n sm: '-space-x-2',\n default: '-space-x-2.5',\n lg: '-space-x-3',\n xl: '-space-x-4',\n '2xl': '-space-x-5',\n}\n\n// Colorized fallback palette (12 colors × 2 variants) — exception 13 in TOKEN-EXCEPTIONS.md\nconst avatarColors = [\n { vivid: { bg: 'bg-[#DC2626]', text: 'text-white' }, soft: { bg: 'bg-[#FEE2E2]', text: 'text-[#DC2626]' } }, // red\n { vivid: { bg: 'bg-[#EA580C]', text: 'text-white' }, soft: { bg: 'bg-[#FFEDD5]', text: 'text-[#EA580C]' } }, // orange\n { vivid: { bg: 'bg-[#D97706]', text: 'text-white' }, soft: { bg: 'bg-[#FEF3C7]', text: 'text-[#B45309]' } }, // amber\n { vivid: { bg: 'bg-[#CA8A04]', text: 'text-white' }, soft: { bg: 'bg-[#FEF9C3]', text: 'text-[#A16207]' } }, // yellow\n { vivid: { bg: 'bg-[#059669]', text: 'text-white' }, soft: { bg: 'bg-[#D1FAE5]', text: 'text-[#047857]' } }, // emerald\n { vivid: { bg: 'bg-[#0D9488]', text: 'text-white' }, soft: { bg: 'bg-[#CCFBF1]', text: 'text-[#0F766E]' } }, // teal\n { vivid: { bg: 'bg-[#0891B2]', text: 'text-white' }, soft: { bg: 'bg-[#CFFAFE]', text: 'text-[#0E7490]' } }, // cyan\n { vivid: { bg: 'bg-[#2563EB]', text: 'text-white' }, soft: { bg: 'bg-[#DBEAFE]', text: 'text-[#1D4ED8]' } }, // blue\n { vivid: { bg: 'bg-[#4F46E5]', text: 'text-white' }, soft: { bg: 'bg-[#E0E7FF]', text: 'text-[#4338CA]' } }, // indigo\n { vivid: { bg: 'bg-[#7C3AED]', text: 'text-white' }, soft: { bg: 'bg-[#EDE9FE]', text: 'text-[#6D28D9]' } }, // violet\n { vivid: { bg: 'bg-[#9333EA]', text: 'text-white' }, soft: { bg: 'bg-[#F3E8FF]', text: 'text-[#7E22CE]' } }, // purple\n { vivid: { bg: 'bg-[#DB2777]', text: 'text-white' }, soft: { bg: 'bg-[#FCE7F3]', text: 'text-[#BE185D]' } }, // pink\n] as const\n\nexport type AvatarColorVariant = 'vivid' | 'soft'\n\n/** Extract initials from a name string (e.g. \"John Doe\" → \"JD\", \"김민수\" → \"김민\") */\nfunction getAvatarInitials(name: string, maxChars = 2): string {\n const trimmed = name.trim()\n if (!trimmed) return ''\n\n // CJK: use first character(s) directly\n const cjkRegex = /[\\u3000-\\u9fff\\uac00-\\ud7af\\uff00-\\uffef]/\n if (cjkRegex.test(trimmed.charAt(0))) {\n return trimmed.slice(0, maxChars)\n }\n\n // Split on spaces, hyphens, underscores, dots\n const parts = trimmed.split(/[\\s\\-_.]+/).filter(Boolean)\n if (parts.length === 1) {\n return parts[0].charAt(0).toUpperCase()\n }\n\n // First + last part initials\n return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0))\n .toUpperCase()\n .slice(0, maxChars)\n}\n\n/** Hash a name string to a deterministic avatar color pair (djb2 xor variant) */\nfunction getAvatarColor(name: string, variant: AvatarColorVariant = 'vivid') {\n let hash = 5381\n for (let i = 0; i < name.length; i++) {\n hash = ((hash << 5) + hash) ^ name.charCodeAt(i)\n }\n return avatarColors[(hash >>> 0) % avatarColors.length][variant]\n}\n\nexport type AvatarSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl' | '2xl'\nexport type AvatarShape = 'circle' | 'square'\nexport type AvatarStatus = 'online' | 'offline' | 'busy' | 'away'\n\nexport interface AvatarProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n VariantProps<typeof avatarVariants> {\n status?: AvatarStatus\n}\n\nconst AvatarRoot = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarProps\n>(({ className, size, shape, status, children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n\n if (!status) {\n return (\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n )\n }\n\n // Wrap with an outer span so the status dot is not clipped by overflow-hidden\n return (\n <span className=\"relative inline-flex\">\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n <span\n className={cn(\n 'absolute bottom-0 right-0 rounded-full ring-2 ring-background',\n statusDotSizes[resolvedSize],\n statusColors[status]\n )}\n />\n </span>\n )\n})\nAvatarRoot.displayName = 'Avatar'\n\nexport interface AvatarImageProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image> {}\n\nconst AvatarImage = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Image>,\n AvatarImageProps\n>(({ className, ...props }, ref) => (\n <AvatarPrimitive.Image\n ref={ref}\n className={cn('object-cover w-full h-full', className)}\n {...props}\n />\n))\nAvatarImage.displayName = 'AvatarImage'\n\nexport interface AvatarFallbackProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback> {\n size?: AvatarSize\n /** Shorthand: auto-generates initials + color from a name. Children override auto-initials. */\n name?: string\n /** Pass a name/key to enable colorized mode. The string is hashed to pick a deterministic color. */\n colorized?: string\n /** Color style: \"vivid\" (strong bg + white text) or \"soft\" (pastel bg + dark text). Default: \"vivid\" */\n colorVariant?: AvatarColorVariant\n}\n\nconst AvatarFallback = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Fallback>,\n AvatarFallbackProps\n>(({ className, size, name, colorized, colorVariant = 'vivid', children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n const colorKey = name || colorized\n const color = colorKey ? getAvatarColor(colorKey, colorVariant) : null\n const resolvedChildren = children ?? (name ? getAvatarInitials(name) : undefined)\n return (\n <AvatarPrimitive.Fallback\n ref={ref}\n className={cn(\n 'flex items-center justify-center w-full h-full font-semibold',\n color ? [color.bg, color.text] : 'bg-background-muted text-text-muted',\n fallbackFontSizes[resolvedSize],\n className\n )}\n {...props}\n >\n {resolvedChildren}\n </AvatarPrimitive.Fallback>\n )\n})\nAvatarFallback.displayName = 'AvatarFallback'\n\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n max?: number\n size?: AvatarSize\n shape?: AvatarShape\n}\n\nconst AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n ({ className, max, size = 'default', shape = 'circle', children, ...props }, ref) => {\n const childArray = React.Children.toArray(children)\n const visibleChildren = max ? childArray.slice(0, max) : childArray\n const overflowCount = max ? childArray.length - max : 0\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center',\n groupNegativeMargins[size],\n '[&>*]:ring-2 [&>*]:ring-background',\n className\n )}\n {...props}\n >\n {visibleChildren}\n {overflowCount > 0 && (\n <AvatarRoot size={size} shape={shape}>\n <AvatarFallback size={size}>+{overflowCount}</AvatarFallback>\n </AvatarRoot>\n )}\n </div>\n )\n }\n)\nAvatarGroup.displayName = 'AvatarGroup'\n\n// ─── Namespace ──────────────────────────────────────────\nconst Avatar = Object.assign(AvatarRoot, {\n Image: AvatarImage,\n Fallback: AvatarFallback,\n Group: AvatarGroup,\n})\n\n// eslint-disable-next-line @typescript-eslint/no-namespace\nnamespace Avatar {\n export type ImageProps = AvatarImageProps\n export type FallbackProps = AvatarFallbackProps\n export type GroupProps = AvatarGroupProps\n}\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarGroup, avatarVariants, avatarColors, getAvatarColor, getAvatarInitials }\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/ui/avatar.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as AvatarPrimitive from '@radix-ui/react-avatar'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Avatar root variants\nconst avatarVariants = cva(\n 'relative inline-flex items-center justify-center overflow-hidden bg-background-muted select-none',\n {\n variants: {\n size: {\n xs: 'w-6 h-6', // 24px\n sm: 'w-8 h-8', // 32px\n default: 'w-10 h-10', // 40px\n lg: 'w-12 h-12', // 48px\n xl: 'w-16 h-16', // 64px\n '2xl': 'w-20 h-20', // 80px\n },\n shape: {\n circle: 'rounded-full',\n square: 'rounded-xl',\n },\n },\n defaultVariants: { size: 'default', shape: 'circle' },\n }\n)\n\n// Status dot sizes per avatar size\nconst statusDotSizes = {\n xs: 'w-1.5 h-1.5',\n sm: 'w-2 h-2',\n default: 'w-2.5 h-2.5',\n lg: 'w-3 h-3',\n xl: 'w-3.5 h-3.5',\n '2xl': 'w-4 h-4',\n}\n\n// Status dot colors\nconst statusColors = {\n online: 'bg-success',\n offline: 'bg-text-muted',\n busy: 'bg-error',\n away: 'bg-warning',\n}\n\n// Fallback font sizes per avatar size\nconst fallbackFontSizes = {\n xs: 'text-2xs',\n sm: 'text-xs',\n default: 'text-sm',\n lg: 'text-base',\n xl: 'text-xl',\n '2xl': 'text-2xl',\n}\n\n// Negative margin per size for AvatarGroup overlap\nconst groupNegativeMargins = {\n xs: '-space-x-1.5',\n sm: '-space-x-2',\n default: '-space-x-2.5',\n lg: '-space-x-3',\n xl: '-space-x-4',\n '2xl': '-space-x-5',\n}\n\n// Colorized fallback palette (12 colors × 2 variants) — exception 13 in TOKEN-EXCEPTIONS.md\nconst avatarColors = [\n { vivid: { bg: 'bg-[#DC2626]', text: 'text-white' }, soft: { bg: 'bg-[#FEE2E2]', text: 'text-[#DC2626]' } }, // red\n { vivid: { bg: 'bg-[#EA580C]', text: 'text-white' }, soft: { bg: 'bg-[#FFEDD5]', text: 'text-[#EA580C]' } }, // orange\n { vivid: { bg: 'bg-[#D97706]', text: 'text-white' }, soft: { bg: 'bg-[#FEF3C7]', text: 'text-[#B45309]' } }, // amber\n { vivid: { bg: 'bg-[#CA8A04]', text: 'text-white' }, soft: { bg: 'bg-[#FEF9C3]', text: 'text-[#A16207]' } }, // yellow\n { vivid: { bg: 'bg-[#059669]', text: 'text-white' }, soft: { bg: 'bg-[#D1FAE5]', text: 'text-[#047857]' } }, // emerald\n { vivid: { bg: 'bg-[#0D9488]', text: 'text-white' }, soft: { bg: 'bg-[#CCFBF1]', text: 'text-[#0F766E]' } }, // teal\n { vivid: { bg: 'bg-[#0891B2]', text: 'text-white' }, soft: { bg: 'bg-[#CFFAFE]', text: 'text-[#0E7490]' } }, // cyan\n { vivid: { bg: 'bg-[#2563EB]', text: 'text-white' }, soft: { bg: 'bg-[#DBEAFE]', text: 'text-[#1D4ED8]' } }, // blue\n { vivid: { bg: 'bg-[#4F46E5]', text: 'text-white' }, soft: { bg: 'bg-[#E0E7FF]', text: 'text-[#4338CA]' } }, // indigo\n { vivid: { bg: 'bg-[#7C3AED]', text: 'text-white' }, soft: { bg: 'bg-[#EDE9FE]', text: 'text-[#6D28D9]' } }, // violet\n { vivid: { bg: 'bg-[#9333EA]', text: 'text-white' }, soft: { bg: 'bg-[#F3E8FF]', text: 'text-[#7E22CE]' } }, // purple\n { vivid: { bg: 'bg-[#DB2777]', text: 'text-white' }, soft: { bg: 'bg-[#FCE7F3]', text: 'text-[#BE185D]' } }, // pink\n] as const\n\nexport type AvatarColorVariant = 'vivid' | 'soft'\n\n/** Extract initials from a name string (e.g. \"John Doe\" → \"JD\", \"김민수\" → \"김민\") */\nfunction getAvatarInitials(name: string, maxChars = 2): string {\n const trimmed = name.trim()\n if (!trimmed) return ''\n\n // CJK: use first character(s) directly\n const cjkRegex = /[\\u3000-\\u9fff\\uac00-\\ud7af\\uff00-\\uffef]/\n if (cjkRegex.test(trimmed.charAt(0))) {\n return trimmed.slice(0, maxChars)\n }\n\n // Split on spaces, hyphens, underscores, dots\n const parts = trimmed.split(/[\\s\\-_.]+/).filter(Boolean)\n if (parts.length === 1) {\n return parts[0].charAt(0).toUpperCase()\n }\n\n // First + last part initials\n return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0))\n .toUpperCase()\n .slice(0, maxChars)\n}\n\n/** Hash a name string to a deterministic avatar color pair (djb2 xor variant) */\nfunction getAvatarColor(name: string, variant: AvatarColorVariant = 'vivid') {\n let hash = 5381\n for (let i = 0; i < name.length; i++) {\n hash = ((hash << 5) + hash) ^ name.charCodeAt(i)\n }\n return avatarColors[(hash >>> 0) % avatarColors.length][variant]\n}\n\nexport type AvatarSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl' | '2xl'\nexport type AvatarShape = 'circle' | 'square'\nexport type AvatarStatus = 'online' | 'offline' | 'busy' | 'away'\n\nexport interface AvatarProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n VariantProps<typeof avatarVariants> {\n status?: AvatarStatus\n}\n\nconst Avatar = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarProps\n>(({ className, size, shape, status, children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n\n if (!status) {\n return (\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n )\n }\n\n // Wrap with an outer span so the status dot is not clipped by overflow-hidden\n return (\n <span className=\"relative inline-flex\">\n <AvatarPrimitive.Root\n ref={ref}\n className={cn(avatarVariants({ size, shape }), className)}\n {...props}\n >\n {children}\n </AvatarPrimitive.Root>\n <span\n className={cn(\n 'absolute bottom-0 right-0 rounded-full ring-2 ring-background',\n statusDotSizes[resolvedSize],\n statusColors[status]\n )}\n />\n </span>\n )\n})\nAvatar.displayName = 'Avatar'\n\nexport interface AvatarImageProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image> {}\n\nconst AvatarImage = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Image>,\n AvatarImageProps\n>(({ className, ...props }, ref) => (\n <AvatarPrimitive.Image\n ref={ref}\n className={cn('object-cover w-full h-full', className)}\n {...props}\n />\n))\nAvatarImage.displayName = 'AvatarImage'\n\nexport interface AvatarFallbackProps\n extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback> {\n size?: AvatarSize\n /** Shorthand: auto-generates initials + color from a name. Children override auto-initials. */\n name?: string\n /** Pass a name/key to enable colorized mode. The string is hashed to pick a deterministic color. */\n colorized?: string\n /** Color style: \"vivid\" (strong bg + white text) or \"soft\" (pastel bg + dark text). Default: \"vivid\" */\n colorVariant?: AvatarColorVariant\n}\n\nconst AvatarFallback = React.forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Fallback>,\n AvatarFallbackProps\n>(({ className, size, name, colorized, colorVariant = 'vivid', children, ...props }, ref) => {\n const resolvedSize = size || 'default'\n const colorKey = name || colorized\n const color = colorKey ? getAvatarColor(colorKey, colorVariant) : null\n const resolvedChildren = children ?? (name ? getAvatarInitials(name) : undefined)\n return (\n <AvatarPrimitive.Fallback\n ref={ref}\n className={cn(\n 'flex items-center justify-center w-full h-full font-semibold',\n color ? [color.bg, color.text] : 'bg-background-muted text-text-muted',\n fallbackFontSizes[resolvedSize],\n className\n )}\n {...props}\n >\n {resolvedChildren}\n </AvatarPrimitive.Fallback>\n )\n})\nAvatarFallback.displayName = 'AvatarFallback'\n\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n max?: number\n size?: AvatarSize\n shape?: AvatarShape\n}\n\nconst AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n ({ className, max, size = 'default', shape = 'circle', children, ...props }, ref) => {\n const childArray = React.Children.toArray(children)\n const visibleChildren = max ? childArray.slice(0, max) : childArray\n const overflowCount = max ? childArray.length - max : 0\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center',\n groupNegativeMargins[size],\n '[&>*]:ring-2 [&>*]:ring-background',\n className\n )}\n {...props}\n >\n {visibleChildren}\n {overflowCount > 0 && (\n <Avatar size={size} shape={shape}>\n <AvatarFallback size={size}>+{overflowCount}</AvatarFallback>\n </Avatar>\n )}\n </div>\n )\n }\n)\nAvatarGroup.displayName = 'AvatarGroup'\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarGroup, avatarVariants, avatarColors, getAvatarColor, getAvatarInitials }\n"],"mappings":"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","names":[]}
|
|
@@ -29,6 +29,7 @@ interface BreadcrumbProps extends React.ComponentPropsWithoutRef<'nav'> {
|
|
|
29
29
|
/** Items visible after the ellipsis when collapsed */
|
|
30
30
|
itemsAfterCollapse?: number;
|
|
31
31
|
}
|
|
32
|
+
declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
|
|
32
33
|
declare const BreadcrumbList: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
|
|
33
34
|
declare const BreadcrumbItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
34
35
|
interface BreadcrumbLinkProps extends React.ComponentPropsWithoutRef<'a'> {
|
|
@@ -41,17 +42,5 @@ declare const BreadcrumbSeparator: React.ForwardRefExoticComponent<Omit<React.De
|
|
|
41
42
|
interface BreadcrumbEllipsisProps extends React.ComponentPropsWithoutRef<'span'> {
|
|
42
43
|
}
|
|
43
44
|
declare const BreadcrumbEllipsis: React.ForwardRefExoticComponent<BreadcrumbEllipsisProps & React.RefAttributes<HTMLSpanElement>>;
|
|
44
|
-
declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>> & {
|
|
45
|
-
List: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
|
|
46
|
-
Item: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
47
|
-
Link: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
|
48
|
-
Page: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
49
|
-
Separator: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
50
|
-
Ellipsis: React.ForwardRefExoticComponent<BreadcrumbEllipsisProps & React.RefAttributes<HTMLSpanElement>>;
|
|
51
|
-
};
|
|
52
|
-
declare namespace Breadcrumb {
|
|
53
|
-
type LinkProps = BreadcrumbLinkProps;
|
|
54
|
-
type EllipsisProps = BreadcrumbEllipsisProps;
|
|
55
|
-
}
|
|
56
45
|
|
|
57
46
|
export { Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbList, BreadcrumbPage, type BreadcrumbProps, BreadcrumbSeparator, breadcrumbSizeMap };
|
|
@@ -29,6 +29,7 @@ interface BreadcrumbProps extends React.ComponentPropsWithoutRef<'nav'> {
|
|
|
29
29
|
/** Items visible after the ellipsis when collapsed */
|
|
30
30
|
itemsAfterCollapse?: number;
|
|
31
31
|
}
|
|
32
|
+
declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
|
|
32
33
|
declare const BreadcrumbList: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
|
|
33
34
|
declare const BreadcrumbItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
34
35
|
interface BreadcrumbLinkProps extends React.ComponentPropsWithoutRef<'a'> {
|
|
@@ -41,17 +42,5 @@ declare const BreadcrumbSeparator: React.ForwardRefExoticComponent<Omit<React.De
|
|
|
41
42
|
interface BreadcrumbEllipsisProps extends React.ComponentPropsWithoutRef<'span'> {
|
|
42
43
|
}
|
|
43
44
|
declare const BreadcrumbEllipsis: React.ForwardRefExoticComponent<BreadcrumbEllipsisProps & React.RefAttributes<HTMLSpanElement>>;
|
|
44
|
-
declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>> & {
|
|
45
|
-
List: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
|
|
46
|
-
Item: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
47
|
-
Link: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
|
48
|
-
Page: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
49
|
-
Separator: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
50
|
-
Ellipsis: React.ForwardRefExoticComponent<BreadcrumbEllipsisProps & React.RefAttributes<HTMLSpanElement>>;
|
|
51
|
-
};
|
|
52
|
-
declare namespace Breadcrumb {
|
|
53
|
-
type LinkProps = BreadcrumbLinkProps;
|
|
54
|
-
type EllipsisProps = BreadcrumbEllipsisProps;
|
|
55
|
-
}
|
|
56
45
|
|
|
57
46
|
export { Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbList, BreadcrumbPage, type BreadcrumbProps, BreadcrumbSeparator, breadcrumbSizeMap };
|
|
@@ -75,7 +75,7 @@ const breadcrumbSizeMap = {
|
|
|
75
75
|
default: { text: "text-sm", icon: "icon-xs", gap: "gap-2" },
|
|
76
76
|
lg: { text: "text-md", icon: "icon-sm", gap: "gap-2" }
|
|
77
77
|
};
|
|
78
|
-
const
|
|
78
|
+
const Breadcrumb = React.forwardRef(
|
|
79
79
|
({ className, separator, size = "default", ...props }, ref) => /* @__PURE__ */ React.createElement(BreadcrumbContext.Provider, { value: { size, separator } }, /* @__PURE__ */ React.createElement(
|
|
80
80
|
"nav",
|
|
81
81
|
{
|
|
@@ -86,7 +86,7 @@ const BreadcrumbRoot = React.forwardRef(
|
|
|
86
86
|
}
|
|
87
87
|
))
|
|
88
88
|
);
|
|
89
|
-
|
|
89
|
+
Breadcrumb.displayName = "Breadcrumb";
|
|
90
90
|
const BreadcrumbList = React.forwardRef(
|
|
91
91
|
({ className, ...props }, ref) => {
|
|
92
92
|
const { size = "default" } = useBreadcrumbContext();
|
|
@@ -187,14 +187,6 @@ const BreadcrumbEllipsis = React.forwardRef(
|
|
|
187
187
|
}
|
|
188
188
|
);
|
|
189
189
|
BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
|
|
190
|
-
const Breadcrumb = Object.assign(BreadcrumbRoot, {
|
|
191
|
-
List: BreadcrumbList,
|
|
192
|
-
Item: BreadcrumbItem,
|
|
193
|
-
Link: BreadcrumbLink,
|
|
194
|
-
Page: BreadcrumbPage,
|
|
195
|
-
Separator: BreadcrumbSeparator,
|
|
196
|
-
Ellipsis: BreadcrumbEllipsis
|
|
197
|
-
});
|
|
198
190
|
// Annotate the CommonJS export names for ESM import in node:
|
|
199
191
|
0 && (module.exports = {
|
|
200
192
|
Breadcrumb,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/ui/breadcrumb.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 ──────────────────────────────────────────────\n\ntype BreadcrumbContextValue = {\n size?: 'sm' | 'default' | 'lg'\n separator?: React.ReactNode\n}\n\nconst BreadcrumbContext = React.createContext<BreadcrumbContextValue>({})\nconst useBreadcrumbContext = () => React.useContext(BreadcrumbContext)\n\n// ─── Default Separator Icon ───────────────────────────────\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n </svg>\n )\n}\n\n// ─── Ellipsis Icon ────────────────────────────────────────\n\nfunction EllipsisIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" />\n </svg>\n )\n}\n\n// ─── Breadcrumb (Root) ────────────────────────────────────\n\nconst breadcrumbSizeMap = {\n sm: { text: 'text-xs', icon: 'icon-xs', gap: 'gap-1.5' },\n default: { text: 'text-sm', icon: 'icon-xs', gap: 'gap-2' },\n lg: { text: 'text-md', icon: 'icon-sm', gap: 'gap-2' },\n} as const\n\nexport interface BreadcrumbProps extends React.ComponentPropsWithoutRef<'nav'> {\n /** Separator element between items */\n separator?: React.ReactNode\n /** Size of the breadcrumb */\n size?: 'sm' | 'default' | 'lg'\n /** Max items before collapsing (undefined = no collapse) */\n maxItems?: number\n /** Items visible before the ellipsis when collapsed */\n itemsBeforeCollapse?: number\n /** Items visible after the ellipsis when collapsed */\n itemsAfterCollapse?: number\n}\n\nconst
|
|
1
|
+
{"version":3,"sources":["../../../src/components/ui/breadcrumb.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 ──────────────────────────────────────────────\n\ntype BreadcrumbContextValue = {\n size?: 'sm' | 'default' | 'lg'\n separator?: React.ReactNode\n}\n\nconst BreadcrumbContext = React.createContext<BreadcrumbContextValue>({})\nconst useBreadcrumbContext = () => React.useContext(BreadcrumbContext)\n\n// ─── Default Separator Icon ───────────────────────────────\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n </svg>\n )\n}\n\n// ─── Ellipsis Icon ────────────────────────────────────────\n\nfunction EllipsisIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" />\n </svg>\n )\n}\n\n// ─── Breadcrumb (Root) ────────────────────────────────────\n\nconst breadcrumbSizeMap = {\n sm: { text: 'text-xs', icon: 'icon-xs', gap: 'gap-1.5' },\n default: { text: 'text-sm', icon: 'icon-xs', gap: 'gap-2' },\n lg: { text: 'text-md', icon: 'icon-sm', gap: 'gap-2' },\n} as const\n\nexport interface BreadcrumbProps extends React.ComponentPropsWithoutRef<'nav'> {\n /** Separator element between items */\n separator?: React.ReactNode\n /** Size of the breadcrumb */\n size?: 'sm' | 'default' | 'lg'\n /** Max items before collapsing (undefined = no collapse) */\n maxItems?: number\n /** Items visible before the ellipsis when collapsed */\n itemsBeforeCollapse?: number\n /** Items visible after the ellipsis when collapsed */\n itemsAfterCollapse?: number\n}\n\nconst Breadcrumb = React.forwardRef<HTMLElement, BreadcrumbProps>(\n ({ className, separator, size = 'default', ...props }, ref) => (\n <BreadcrumbContext.Provider value={{ size, separator }}>\n <nav\n ref={ref}\n aria-label=\"breadcrumb\"\n className={cn('', className)}\n {...props}\n />\n </BreadcrumbContext.Provider>\n )\n)\nBreadcrumb.displayName = 'Breadcrumb'\n\n// ─── BreadcrumbList ───────────────────────────────────────\n\nconst BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<'ol'>>(\n ({ className, ...props }, ref) => {\n const { size = 'default' } = useBreadcrumbContext()\n const sizeClass = breadcrumbSizeMap[size]\n return (\n <ol\n ref={ref}\n className={cn(\n 'flex flex-wrap items-center',\n sizeClass.gap,\n sizeClass.text,\n 'text-text-muted',\n className\n )}\n {...props}\n />\n )\n }\n)\nBreadcrumbList.displayName = 'BreadcrumbList'\n\n// ─── BreadcrumbItem ───────────────────────────────────────\n\nconst BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n ({ className, ...props }, ref) => (\n <li\n ref={ref}\n className={cn('inline-flex items-center gap-1.5', className)}\n {...props}\n />\n )\n)\nBreadcrumbItem.displayName = 'BreadcrumbItem'\n\n// ─── BreadcrumbLink ───────────────────────────────────────\n\nexport interface BreadcrumbLinkProps extends React.ComponentPropsWithoutRef<'a'> {\n /** Use Radix Slot to compose with custom link components */\n asChild?: boolean\n}\n\nconst BreadcrumbLink = React.forwardRef<HTMLAnchorElement, BreadcrumbLinkProps>(\n ({ asChild, className, ...props }, ref) => {\n const Comp = asChild ? Slot : 'a'\n return (\n <Comp\n ref={ref}\n className={cn(\n 'transition-colors duration-fast hover:text-foreground',\n className\n )}\n {...props}\n />\n )\n }\n)\nBreadcrumbLink.displayName = 'BreadcrumbLink'\n\n// ─── BreadcrumbPage ───────────────────────────────────────\n\nconst BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n ({ className, ...props }, ref) => (\n <span\n ref={ref}\n role=\"link\"\n aria-disabled=\"true\"\n aria-current=\"page\"\n className={cn('text-foreground', className)}\n {...props}\n />\n )\n)\nBreadcrumbPage.displayName = 'BreadcrumbPage'\n\n// ─── BreadcrumbSeparator ──────────────────────────────────\n\nconst BreadcrumbSeparator = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n ({ children, className, ...props }, ref) => {\n const { separator, size = 'default' } = useBreadcrumbContext()\n const sizeClass = breadcrumbSizeMap[size]\n return (\n <li\n ref={ref}\n role=\"presentation\"\n aria-hidden=\"true\"\n className={cn('flex items-center text-text-subtle', className)}\n {...props}\n >\n {children ?? separator ?? <ChevronRightIcon className={sizeClass.icon} />}\n </li>\n )\n }\n)\nBreadcrumbSeparator.displayName = 'BreadcrumbSeparator'\n\n// ─── BreadcrumbEllipsis ───────────────────────────────────\n\nexport interface BreadcrumbEllipsisProps extends React.ComponentPropsWithoutRef<'span'> {}\n\nconst BreadcrumbEllipsis = React.forwardRef<HTMLSpanElement, BreadcrumbEllipsisProps>(\n ({ className, ...props }, ref) => {\n const { size = 'default' } = useBreadcrumbContext()\n const sizeClass = breadcrumbSizeMap[size]\n return (\n <span\n ref={ref}\n role=\"presentation\"\n aria-hidden=\"true\"\n className={cn('flex items-center justify-center', className)}\n {...props}\n >\n <EllipsisIcon className={sizeClass.icon} />\n <span className=\"sr-only\">More</span>\n </span>\n )\n }\n)\nBreadcrumbEllipsis.displayName = 'BreadcrumbEllipsis'\n\n// ─── Exports ──────────────────────────────────────────────\n\nexport {\n Breadcrumb,\n BreadcrumbList,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbPage,\n BreadcrumbSeparator,\n BreadcrumbEllipsis,\n breadcrumbSizeMap,\n}\n"],"mappings":"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","names":[]}
|
|
@@ -35,7 +35,7 @@ const breadcrumbSizeMap = {
|
|
|
35
35
|
default: { text: "text-sm", icon: "icon-xs", gap: "gap-2" },
|
|
36
36
|
lg: { text: "text-md", icon: "icon-sm", gap: "gap-2" }
|
|
37
37
|
};
|
|
38
|
-
const
|
|
38
|
+
const Breadcrumb = React.forwardRef(
|
|
39
39
|
({ className, separator, size = "default", ...props }, ref) => /* @__PURE__ */ React.createElement(BreadcrumbContext.Provider, { value: { size, separator } }, /* @__PURE__ */ React.createElement(
|
|
40
40
|
"nav",
|
|
41
41
|
{
|
|
@@ -46,7 +46,7 @@ const BreadcrumbRoot = React.forwardRef(
|
|
|
46
46
|
}
|
|
47
47
|
))
|
|
48
48
|
);
|
|
49
|
-
|
|
49
|
+
Breadcrumb.displayName = "Breadcrumb";
|
|
50
50
|
const BreadcrumbList = React.forwardRef(
|
|
51
51
|
({ className, ...props }, ref) => {
|
|
52
52
|
const { size = "default" } = useBreadcrumbContext();
|
|
@@ -147,14 +147,6 @@ const BreadcrumbEllipsis = React.forwardRef(
|
|
|
147
147
|
}
|
|
148
148
|
);
|
|
149
149
|
BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
|
|
150
|
-
const Breadcrumb = Object.assign(BreadcrumbRoot, {
|
|
151
|
-
List: BreadcrumbList,
|
|
152
|
-
Item: BreadcrumbItem,
|
|
153
|
-
Link: BreadcrumbLink,
|
|
154
|
-
Page: BreadcrumbPage,
|
|
155
|
-
Separator: BreadcrumbSeparator,
|
|
156
|
-
Ellipsis: BreadcrumbEllipsis
|
|
157
|
-
});
|
|
158
150
|
export {
|
|
159
151
|
Breadcrumb,
|
|
160
152
|
BreadcrumbEllipsis,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/ui/breadcrumb.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 ──────────────────────────────────────────────\n\ntype BreadcrumbContextValue = {\n size?: 'sm' | 'default' | 'lg'\n separator?: React.ReactNode\n}\n\nconst BreadcrumbContext = React.createContext<BreadcrumbContextValue>({})\nconst useBreadcrumbContext = () => React.useContext(BreadcrumbContext)\n\n// ─── Default Separator Icon ───────────────────────────────\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n </svg>\n )\n}\n\n// ─── Ellipsis Icon ────────────────────────────────────────\n\nfunction EllipsisIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" />\n </svg>\n )\n}\n\n// ─── Breadcrumb (Root) ────────────────────────────────────\n\nconst breadcrumbSizeMap = {\n sm: { text: 'text-xs', icon: 'icon-xs', gap: 'gap-1.5' },\n default: { text: 'text-sm', icon: 'icon-xs', gap: 'gap-2' },\n lg: { text: 'text-md', icon: 'icon-sm', gap: 'gap-2' },\n} as const\n\nexport interface BreadcrumbProps extends React.ComponentPropsWithoutRef<'nav'> {\n /** Separator element between items */\n separator?: React.ReactNode\n /** Size of the breadcrumb */\n size?: 'sm' | 'default' | 'lg'\n /** Max items before collapsing (undefined = no collapse) */\n maxItems?: number\n /** Items visible before the ellipsis when collapsed */\n itemsBeforeCollapse?: number\n /** Items visible after the ellipsis when collapsed */\n itemsAfterCollapse?: number\n}\n\nconst
|
|
1
|
+
{"version":3,"sources":["../../../src/components/ui/breadcrumb.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 ──────────────────────────────────────────────\n\ntype BreadcrumbContextValue = {\n size?: 'sm' | 'default' | 'lg'\n separator?: React.ReactNode\n}\n\nconst BreadcrumbContext = React.createContext<BreadcrumbContextValue>({})\nconst useBreadcrumbContext = () => React.useContext(BreadcrumbContext)\n\n// ─── Default Separator Icon ───────────────────────────────\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n </svg>\n )\n}\n\n// ─── Ellipsis Icon ────────────────────────────────────────\n\nfunction EllipsisIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" />\n </svg>\n )\n}\n\n// ─── Breadcrumb (Root) ────────────────────────────────────\n\nconst breadcrumbSizeMap = {\n sm: { text: 'text-xs', icon: 'icon-xs', gap: 'gap-1.5' },\n default: { text: 'text-sm', icon: 'icon-xs', gap: 'gap-2' },\n lg: { text: 'text-md', icon: 'icon-sm', gap: 'gap-2' },\n} as const\n\nexport interface BreadcrumbProps extends React.ComponentPropsWithoutRef<'nav'> {\n /** Separator element between items */\n separator?: React.ReactNode\n /** Size of the breadcrumb */\n size?: 'sm' | 'default' | 'lg'\n /** Max items before collapsing (undefined = no collapse) */\n maxItems?: number\n /** Items visible before the ellipsis when collapsed */\n itemsBeforeCollapse?: number\n /** Items visible after the ellipsis when collapsed */\n itemsAfterCollapse?: number\n}\n\nconst Breadcrumb = React.forwardRef<HTMLElement, BreadcrumbProps>(\n ({ className, separator, size = 'default', ...props }, ref) => (\n <BreadcrumbContext.Provider value={{ size, separator }}>\n <nav\n ref={ref}\n aria-label=\"breadcrumb\"\n className={cn('', className)}\n {...props}\n />\n </BreadcrumbContext.Provider>\n )\n)\nBreadcrumb.displayName = 'Breadcrumb'\n\n// ─── BreadcrumbList ───────────────────────────────────────\n\nconst BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<'ol'>>(\n ({ className, ...props }, ref) => {\n const { size = 'default' } = useBreadcrumbContext()\n const sizeClass = breadcrumbSizeMap[size]\n return (\n <ol\n ref={ref}\n className={cn(\n 'flex flex-wrap items-center',\n sizeClass.gap,\n sizeClass.text,\n 'text-text-muted',\n className\n )}\n {...props}\n />\n )\n }\n)\nBreadcrumbList.displayName = 'BreadcrumbList'\n\n// ─── BreadcrumbItem ───────────────────────────────────────\n\nconst BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n ({ className, ...props }, ref) => (\n <li\n ref={ref}\n className={cn('inline-flex items-center gap-1.5', className)}\n {...props}\n />\n )\n)\nBreadcrumbItem.displayName = 'BreadcrumbItem'\n\n// ─── BreadcrumbLink ───────────────────────────────────────\n\nexport interface BreadcrumbLinkProps extends React.ComponentPropsWithoutRef<'a'> {\n /** Use Radix Slot to compose with custom link components */\n asChild?: boolean\n}\n\nconst BreadcrumbLink = React.forwardRef<HTMLAnchorElement, BreadcrumbLinkProps>(\n ({ asChild, className, ...props }, ref) => {\n const Comp = asChild ? Slot : 'a'\n return (\n <Comp\n ref={ref}\n className={cn(\n 'transition-colors duration-fast hover:text-foreground',\n className\n )}\n {...props}\n />\n )\n }\n)\nBreadcrumbLink.displayName = 'BreadcrumbLink'\n\n// ─── BreadcrumbPage ───────────────────────────────────────\n\nconst BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n ({ className, ...props }, ref) => (\n <span\n ref={ref}\n role=\"link\"\n aria-disabled=\"true\"\n aria-current=\"page\"\n className={cn('text-foreground', className)}\n {...props}\n />\n )\n)\nBreadcrumbPage.displayName = 'BreadcrumbPage'\n\n// ─── BreadcrumbSeparator ──────────────────────────────────\n\nconst BreadcrumbSeparator = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n ({ children, className, ...props }, ref) => {\n const { separator, size = 'default' } = useBreadcrumbContext()\n const sizeClass = breadcrumbSizeMap[size]\n return (\n <li\n ref={ref}\n role=\"presentation\"\n aria-hidden=\"true\"\n className={cn('flex items-center text-text-subtle', className)}\n {...props}\n >\n {children ?? separator ?? <ChevronRightIcon className={sizeClass.icon} />}\n </li>\n )\n }\n)\nBreadcrumbSeparator.displayName = 'BreadcrumbSeparator'\n\n// ─── BreadcrumbEllipsis ───────────────────────────────────\n\nexport interface BreadcrumbEllipsisProps extends React.ComponentPropsWithoutRef<'span'> {}\n\nconst BreadcrumbEllipsis = React.forwardRef<HTMLSpanElement, BreadcrumbEllipsisProps>(\n ({ className, ...props }, ref) => {\n const { size = 'default' } = useBreadcrumbContext()\n const sizeClass = breadcrumbSizeMap[size]\n return (\n <span\n ref={ref}\n role=\"presentation\"\n aria-hidden=\"true\"\n className={cn('flex items-center justify-center', className)}\n {...props}\n >\n <EllipsisIcon className={sizeClass.icon} />\n <span className=\"sr-only\">More</span>\n </span>\n )\n }\n)\nBreadcrumbEllipsis.displayName = 'BreadcrumbEllipsis'\n\n// ─── Exports ──────────────────────────────────────────────\n\nexport {\n Breadcrumb,\n BreadcrumbList,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbPage,\n BreadcrumbSeparator,\n BreadcrumbEllipsis,\n breadcrumbSizeMap,\n}\n"],"mappings":"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","names":[]}
|
|
@@ -26,6 +26,7 @@ interface CardProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<t
|
|
|
26
26
|
/** Render as child element (Slot pattern) */
|
|
27
27
|
asChild?: boolean;
|
|
28
28
|
}
|
|
29
|
+
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
|
|
29
30
|
interface CardImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
|
|
30
31
|
/** Gradient overlay on image */
|
|
31
32
|
overlay?: boolean;
|
|
@@ -55,23 +56,5 @@ declare const CardContent: React.ForwardRefExoticComponent<CardContentProps & Re
|
|
|
55
56
|
interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
56
57
|
}
|
|
57
58
|
declare const CardFooter: React.ForwardRefExoticComponent<CardFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
58
|
-
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>> & {
|
|
59
|
-
Image: React.ForwardRefExoticComponent<CardImageProps & React.RefAttributes<HTMLImageElement>>;
|
|
60
|
-
Header: React.ForwardRefExoticComponent<CardHeaderProps & React.RefAttributes<HTMLDivElement>>;
|
|
61
|
-
Title: React.ForwardRefExoticComponent<CardTitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
62
|
-
Description: React.ForwardRefExoticComponent<CardDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
63
|
-
Action: React.ForwardRefExoticComponent<CardActionProps & React.RefAttributes<HTMLDivElement>>;
|
|
64
|
-
Content: React.ForwardRefExoticComponent<CardContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
65
|
-
Footer: React.ForwardRefExoticComponent<CardFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
66
|
-
};
|
|
67
|
-
declare namespace Card {
|
|
68
|
-
type ImageProps = CardImageProps;
|
|
69
|
-
type HeaderProps = CardHeaderProps;
|
|
70
|
-
type TitleProps = CardTitleProps;
|
|
71
|
-
type DescriptionProps = CardDescriptionProps;
|
|
72
|
-
type ActionProps = CardActionProps;
|
|
73
|
-
type ContentProps = CardContentProps;
|
|
74
|
-
type FooterProps = CardFooterProps;
|
|
75
|
-
}
|
|
76
59
|
|
|
77
60
|
export { Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, CardImage, type CardImageProps, type CardProps, type CardRadius, CardTitle, type CardTitleProps, type CardVariant, cardVariants };
|
|
@@ -26,6 +26,7 @@ interface CardProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<t
|
|
|
26
26
|
/** Render as child element (Slot pattern) */
|
|
27
27
|
asChild?: boolean;
|
|
28
28
|
}
|
|
29
|
+
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
|
|
29
30
|
interface CardImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
|
|
30
31
|
/** Gradient overlay on image */
|
|
31
32
|
overlay?: boolean;
|
|
@@ -55,23 +56,5 @@ declare const CardContent: React.ForwardRefExoticComponent<CardContentProps & Re
|
|
|
55
56
|
interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
56
57
|
}
|
|
57
58
|
declare const CardFooter: React.ForwardRefExoticComponent<CardFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
58
|
-
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>> & {
|
|
59
|
-
Image: React.ForwardRefExoticComponent<CardImageProps & React.RefAttributes<HTMLImageElement>>;
|
|
60
|
-
Header: React.ForwardRefExoticComponent<CardHeaderProps & React.RefAttributes<HTMLDivElement>>;
|
|
61
|
-
Title: React.ForwardRefExoticComponent<CardTitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
62
|
-
Description: React.ForwardRefExoticComponent<CardDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
63
|
-
Action: React.ForwardRefExoticComponent<CardActionProps & React.RefAttributes<HTMLDivElement>>;
|
|
64
|
-
Content: React.ForwardRefExoticComponent<CardContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
65
|
-
Footer: React.ForwardRefExoticComponent<CardFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
66
|
-
};
|
|
67
|
-
declare namespace Card {
|
|
68
|
-
type ImageProps = CardImageProps;
|
|
69
|
-
type HeaderProps = CardHeaderProps;
|
|
70
|
-
type TitleProps = CardTitleProps;
|
|
71
|
-
type DescriptionProps = CardDescriptionProps;
|
|
72
|
-
type ActionProps = CardActionProps;
|
|
73
|
-
type ContentProps = CardContentProps;
|
|
74
|
-
type FooterProps = CardFooterProps;
|
|
75
|
-
}
|
|
76
59
|
|
|
77
60
|
export { Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, CardImage, type CardImageProps, type CardProps, type CardRadius, CardTitle, type CardTitleProps, type CardVariant, cardVariants };
|
|
@@ -92,7 +92,7 @@ const cardVariants = (0, import_class_variance_authority.cva)(
|
|
|
92
92
|
}
|
|
93
93
|
}
|
|
94
94
|
);
|
|
95
|
-
const
|
|
95
|
+
const Card = React.forwardRef(
|
|
96
96
|
({
|
|
97
97
|
className,
|
|
98
98
|
variant = "default",
|
|
@@ -134,7 +134,7 @@ const CardRoot = React.forwardRef(
|
|
|
134
134
|
));
|
|
135
135
|
}
|
|
136
136
|
);
|
|
137
|
-
|
|
137
|
+
Card.displayName = "Card";
|
|
138
138
|
const sizePaddingMap = {
|
|
139
139
|
sm: "p-4",
|
|
140
140
|
// 16px
|
|
@@ -346,15 +346,6 @@ const CardFooter = React.forwardRef(
|
|
|
346
346
|
}
|
|
347
347
|
);
|
|
348
348
|
CardFooter.displayName = "CardFooter";
|
|
349
|
-
const Card = Object.assign(CardRoot, {
|
|
350
|
-
Image: CardImage,
|
|
351
|
-
Header: CardHeader,
|
|
352
|
-
Title: CardTitle,
|
|
353
|
-
Description: CardDescription,
|
|
354
|
-
Action: CardAction,
|
|
355
|
-
Content: CardContent,
|
|
356
|
-
Footer: CardFooter
|
|
357
|
-
});
|
|
358
349
|
// Annotate the CommonJS export names for ESM import in node:
|
|
359
350
|
0 && (module.exports = {
|
|
360
351
|
Card,
|