50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T6471,"use client"; import { Avatar as AvatarPrimitive } from "@base-ui/react/avatar"; import { Slot } from "@radix-ui/react-slot"; import { AnimatePresence, motion, useReducedMotion } from "motion/react"; import * as React from "react"; import { createPortal } from "react-dom"; import { cn } from "@/lib/utils"; const componentThemeClassName = "[--ic-background:#ffffff] [--ic-foreground:#111111] [--ic-primary:#111111] [--ic-secondary:#646b75] [--ic-surface-border:#e9edf2] [--ic-border:#e3e7ec] [--ic-card:#ffffff] [--ic-card-foreground:#111111] [--ic-muted:#f5f7fa] [--ic-muted-foreground:#6d7480] [--ic-accent:#f3f5f8] [--color-accent:var(--ic-accent)] [--color-accent-foreground:var(--ic-accent-foreground)] [--ic-accent-foreground:#111111] [--ic-input:#e3e7ec] [--ic-ring:rgba(17,17,17,0.16)] [--ic-destructive:#dc2626] [--ic-paper:#fcfcfd] [--ic-popover-foreground:#111111] [--ic-brand:#0ea5e9] [--ic-brand-soft:#bae6fd] [--ic-shadow-soft:0_18px_38px_-24px_rgba(15,23,42,0.35)] [--ic-chart-1:oklch(0.52_0.19_254)] [--ic-chart-2:oklch(0.74_0.11_232)] [--ic-chart-3:oklch(0.42_0.16_262)] [--ic-chart-4:oklch(0.84_0.07_228)] [--ic-chart-5:oklch(0.62_0.14_240)] [--color-background:var(--ic-background)] [--color-foreground:var(--ic-foreground)] [--color-primary:var(--ic-primary)] [--color-secondary:var(--ic-secondary)] [--color-border:var(--ic-border)] [--color-card:var(--ic-card)] [--color-card-foreground:var(--ic-card-foreground)] [--color-muted:var(--ic-muted)] [--color-muted-foreground:var(--ic-muted-foreground)] [--color-accent:var(--ic-accent)] [--color-accent-foreground:var(--ic-accent-foreground)] [--color-input:var(--ic-input)] [--color-ring:var(--ic-ring)] [--color-destructive:var(--ic-destructive)] [--color-paper:var(--ic-paper)] [--color-popover-foreground:var(--ic-popover-foreground)] [--color-brand:var(--ic-brand)] [--color-brand-soft:var(--ic-brand-soft)] [--color-chart-1:var(--ic-chart-1)] [--color-chart-2:var(--ic-chart-2)] [--color-chart-3:var(--ic-chart-3)] [--color-chart-4:var(--ic-chart-4)] [--color-chart-5:var(--ic-chart-5)] dark:[--ic-background:#111111] dark:[--ic-foreground:#f6f3ec] dark:[--ic-primary:#f6f3ec] dark:[--ic-secondary:#cbc6bb] dark:[--ic-surface-border:#2a2a25] dark:[--ic-border:#2b2a25] dark:[--ic-card:#111111] dark:[--ic-card-foreground:#f6f3ec] dark:[--ic-muted:#171716] dark:[--ic-muted-foreground:#9a958a] dark:[--ic-accent:#1a1a18] [--color-accent:var(--ic-accent)] [--color-accent-foreground:var(--ic-accent-foreground)] dark:[--ic-accent-foreground:#f6f3ec] dark:[--ic-input:#2b2a25] dark:[--ic-ring:rgba(246,243,236,0.18)] dark:[--ic-destructive:#f87171] dark:[--ic-paper:#171716] dark:[--ic-popover-foreground:#f6f3ec] dark:[--ic-brand:#38bdf8] dark:[--ic-brand-soft:#0c4a6e] dark:[--ic-shadow-soft:0_20px_44px_-28px_rgba(0,0,0,0.6)] dark:[--ic-chart-1:oklch(0.68_0.17_250)] dark:[--ic-chart-2:oklch(0.82_0.09_225)] dark:[--ic-chart-3:oklch(0.58_0.15_260)] dark:[--ic-chart-4:oklch(0.75_0.12_235)] dark:[--ic-chart-5:oklch(0.88_0.06_220)]"; type AvatarSize = "default" | "sm" | "lg"; type TooltipSide = "top" | "bottom" | "left" | "right"; type AvatarBadgeVariant = "online" | "offline" | "busy" | "away"; type TooltipTriggerProps = React.HTMLAttributes & { "aria-describedby"?: string; ref?: React.Ref; }; type TooltipTriggerElement = React.ReactElement; export interface AvatarBadgeProps extends React.ComponentProps<"span"> { tooltip?: string; tooltipSide?: TooltipSide; tooltipDelay?: number; tooltipClassName?: string; variant?: AvatarBadgeVariant; } export interface AvatarProps extends AvatarPrimitive.Root.Props { size?: AvatarSize; name?: string; asChild?: boolean; tooltip?: string; tooltipSide?: TooltipSide; tooltipDelay?: number; tooltipClassName?: string; } function hasFallbackChildren(children: React.ReactNode) { if (children === undefined || children === null || children === false) { return false; } if (typeof children === "string") { return children.trim().length > 0; } if (Array.isArray(children)) { return children.some(hasFallbackChildren); } return true; } const MAX_TOOLTIP_CHARACTERS = 80; const TOOLTIP_COLLISION_PADDING = 12; const TOOLTIP_OFFSET = 10; const DEFAULT_TOOLTIP_SIDE_ORDER: TooltipSide[] = [ "right", "left", "top", "bottom", ]; const WHITESPACE_REGEX = /\s+/g; const FALLBACK_SPLIT_REGEX = /[\s_-]+/; const NON_ALPHANUMERIC_REGEX = /[^\p{L}\p{N}]+/gu; const AVATAR_IMAGE_SIZE: Record = { sm: 24, default: 32, lg: 40, }; const BADGE_VARIANT_CLASSNAME: Record = { online: "bg-emerald-500", offline: "bg-muted-foreground", busy: "bg-destructive", away: "bg-amber-500", }; const BADGE_VARIANT_LABEL: Record = { online: "Online", offline: "Offline", busy: "Busy", away: "Away", }; type TooltipPlacement = { left: number; side: TooltipSide; top: number; transformOrigin: string; }; type AvatarContextValue = { name?: string; size: AvatarSize; }; const AvatarContext = React.createContext({ size: "default", }); function useAvatarContext() { return React.useContext(AvatarContext); } function normalizeText(value?: string) { return value?.trim().replace(WHITESPACE_REGEX, " ") ?? ""; } function firstCharacter(value: string) { return Array.from(value)[0] ?? ""; } function getAvatarInitials(fallback?: string, name?: string, alt?: string) { const normalized = [fallback, name, alt].map(normalizeText).find(Boolean); if (!normalized) { return "?"; } const words = normalized .split(FALLBACK_SPLIT_REGEX) .map((word) => word.replace(NON_ALPHANUMERIC_REGEX, "")) .filter(Boolean); if (words.length >= 2) { return `${firstCharacter(words[0])}${firstCharacter(words[1])}`.toUpperCase(); } const compact = Array.from( words[0] ?? normalized.replace(WHITESPACE_REGEX, "") ) .slice(0, 2) .join(""); return compact.toUpperCase() || "?"; } function mergeRefs(...refs: Array | undefined>) { return (value: T | null) => { for (const ref of refs) { if (typeof ref === "function") { ref(value); } else if (ref) { (ref as React.MutableRefObject).current = value; } } }; } function isTooltipTriggerElement( node: React.ReactNode ): node is TooltipTriggerElement { return React.isValidElement(node) && node.type !== React.Fragment; } function mergeDescribedBy(...ids: Array) { const merged = ids.filter(Boolean).join(" "); return merged.length > 0 ? merged : undefined; } function composeEventHandlers( childHandler: React.EventHandler | undefined, ownHandler: React.EventHandler ) { return (event: React.SyntheticEvent) => { childHandler?.(event); if (!event.defaultPrevented) { ownHandler(event); } }; } function clamp(value: number, min: number, max: number) { return Math.min(Math.max(value, min), Math.max(min, max)); } function getTooltipSideOrder(preferredSide?: TooltipSide) { if (!preferredSide || preferredSide === "right") { return DEFAULT_TOOLTIP_SIDE_ORDER; } return [ preferredSide, ...DEFAULT_TOOLTIP_SIDE_ORDER.filter((side) => side !== preferredSide), ]; } function getTooltipTransformOrigin(side: TooltipSide) { switch (side) { case "left": return "right center"; case "top": return "center bottom"; case "bottom": return "center top"; default: return "left center"; } } function hasPrimaryAxisSpace( side: TooltipSide, triggerRect: DOMRect, tooltipRect: DOMRect ) { switch (side) { case "left": return ( triggerRect.left - TOOLTIP_OFFSET - tooltipRect.width >= TOOLTIP_COLLISION_PADDING ); case "top": return ( triggerRect.top - TOOLTIP_OFFSET - tooltipRect.height >= TOOLTIP_COLLISION_PADDING ); case "bottom": return ( triggerRect.bottom + TOOLTIP_OFFSET + tooltipRect.height <= window.innerHeight - TOOLTIP_COLLISION_PADDING ); default: return ( triggerRect.right + TOOLTIP_OFFSET + tooltipRect.width <= window.innerWidth - TOOLTIP_COLLISION_PADDING ); } } function getTooltipCandidate( side: TooltipSide, triggerRect: DOMRect, tooltipRect: DOMRect ): TooltipPlacement { const maxLeft = window.innerWidth - TOOLTIP_COLLISION_PADDING - tooltipRect.width; const maxTop = window.innerHeight - TOOLTIP_COLLISION_PADDING - tooltipRect.height; const centeredLeft = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2; const centeredTop = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2; switch (side) { case "left": return { left: clamp( triggerRect.left - TOOLTIP_OFFSET - tooltipRect.width, TOOLTIP_COLLISION_PADDING, maxLeft ), side, top: clamp(centeredTop, TOOLTIP_COLLISION_PADDING, maxTop), transformOrigin: getTooltipTransformOrigin(side), }; case "top": return { left: clamp(centeredLeft, TOOLTIP_COLLISION_PADDING, maxLeft), side, top: clamp( triggerRect.top - TOOLTIP_OFFSET - tooltipRect.height, TOOLTIP_COLLISION_PADDING, maxTop ), transformOrigin: getTooltipTransformOrigin(side), }; case "bottom": return { left: clamp(centeredLeft, TOOLTIP_COLLISION_PADDING, maxLeft), side, top: clamp( triggerRect.bottom + TOOLTIP_OFFSET, TOOLTIP_COLLISION_PADDING, maxTop ), transformOrigin: getTooltipTransformOrigin(side), }; default: return { left: clamp( triggerRect.right + TOOLTIP_OFFSET, TOOLTIP_COLLISION_PADDING, maxLeft ), side, top: clamp(centeredTop, TOOLTIP_COLLISION_PADDING, maxTop), transformOrigin: getTooltipTransformOrigin(side), }; } } function getTooltipPlacement( triggerRect: DOMRect, tooltipRect: DOMRect, preferredSide?: TooltipSide ) { const sideOrder = getTooltipSideOrder(preferredSide); const resolvedSide = sideOrder.find((side) => hasPrimaryAxisSpace(side, triggerRect, tooltipRect) ) ?? sideOrder.at(-1) ?? "bottom"; return getTooltipCandidate(resolvedSide, triggerRect, tooltipRect); } const tooltipBubbleClassName = "group/tooltip pointer-events-none fixed z-50 max-w-60 whitespace-normal rounded-lg bg-foreground px-3 py-1.5 font-medium text-background text-xs leading-snug shadow-[0_4px_24px_-4px_rgba(0,0,0,0.25)]"; const tooltipArrowClassName = "absolute h-2 w-2 rotate-45 bg-foreground group-data-[side=bottom]/tooltip:-top-1 group-data-[side=left]/tooltip:top-1/2 group-data-[side=right]/tooltip:top-1/2 group-data-[side=left]/tooltip:-right-1 group-data-[side=top]/tooltip:-bottom-1 group-data-[side=bottom]/tooltip:left-1/2 group-data-[side=right]/tooltip:-left-1 group-data-[side=top]/tooltip:left-1/2 group-data-[side=bottom]/tooltip:-translate-x-1/2 group-data-[side=top]/tooltip:-translate-x-1/2 group-data-[side=left]/tooltip:-translate-y-1/2 group-data-[side=right]/tooltip:-translate-y-1/2"; function getTooltipMotionConfig(reduceMotion: boolean | null) { const motionTransition = reduceMotion ? { duration: 0 } : { type: "spring" as const, stiffness: 400, damping: 24, mass: 0.6, }; const arrowTransition = reduceMotion ? { duration: 0 } : { type: "spring" as const, stiffness: 500, damping: 28, delay: 0.03, }; const visibleState = reduceMotion ? { opacity: 1 } : { opacity: 1, scale: 1, filter: "blur(0px)" }; const hiddenState = reduceMotion ? { opacity: 0 } : { opacity: 0, scale: 0.92, filter: "blur(4px)" }; return { arrowTransition, hiddenState, motionTransition, reduceMotion: Boolean(reduceMotion), visibleState, }; } function useAvatarTooltip({ content, delay, side, }: { content: string; delay: number; side: TooltipSide; }) { const [open, setOpen] = React.useState(false); const [placement, setPlacement] = React.useState( null ); const tooltipRef = React.useRef(null); const triggerRef = React.useRef(null); const timeoutRef = React.useRef>(undefined); const tooltipId = React.useId(); const normalizedContent = content.trim(); React.useEffect(() => { if ( process.env.NODE_ENV !== "production" && (normalizedContent.length > MAX_TOOLTIP_CHARACTERS || normalizedContent.includes("\n")) ) { console.warn( "Avatar tooltip content should stay short, single-line, and non-interactive. Use Tooltip directly for richer content." ); } }, [normalizedContent]); const updatePlacement = React.useCallback(() => { const trigger = triggerRef.current; const tooltip = tooltipRef.current; if (!(trigger && tooltip)) { return; } setPlacement( getTooltipPlacement( trigger.getBoundingClientRect(), tooltip.getBoundingClientRect(), side ) ); }, [side]); const handleEnter = React.useCallback( (event: React.SyntheticEvent) => { triggerRef.current = event.currentTarget as HTMLElement; setPlacement(null); clearTimeout(timeoutRef.current); timeoutRef.current = setTimeout(() => setOpen(true), delay * 1000); }, [delay] ); const handleLeave = React.useCallback(() => { clearTimeout(timeoutRef.current); setOpen(false); }, []); React.useEffect(() => () => clearTimeout(timeoutRef.current), []); React.useEffect(() => { if (!open) { return; } const handleKeyDown = (event: KeyboardEvent) => { if (event.key === "Escape") { handleLeave(); } }; window.addEventListener("keydown", handleKeyDown); return () => { window.removeEventListener("keydown", handleKeyDown); }; }, [handleLeave, open]); React.useLayoutEffect(() => { if (!open) { return; } updatePlacement(); const frameId = window.requestAnimationFrame(updatePlacement); window.addEventListener("resize", updatePlacement); window.addEventListener("scroll", updatePlacement, true); return () => { window.cancelAnimationFrame(frameId); window.removeEventListener("resize", updatePlacement); window.removeEventListener("scroll", updatePlacement, true); }; }, [open, updatePlacement]); return { handleEnter, handleLeave, normalizedContent, open, placement, tooltipId, tooltipRef, triggerRef, }; } function attachTooltipTrigger( children: TooltipTriggerElement, { handleEnter, handleLeave, open, tooltipId, triggerRef, }: { handleEnter: (event: React.SyntheticEvent) => void; handleLeave: () => void; open: boolean; tooltipId: string; triggerRef: React.MutableRefObject; } ) { const childProps = children.props; const childAriaDescribedBy = childProps["aria-describedby"]; const triggerDescription = open ? mergeDescribedBy(childAriaDescribedBy, tooltipId) : childAriaDescribedBy; return React.cloneElement(children, { "aria-describedby": triggerDescription, onBlur: composeEventHandlers(childProps.onBlur, handleLeave), onFocus: composeEventHandlers(childProps.onFocus, handleEnter), onMouseEnter: composeEventHandlers(childProps.onMouseEnter, handleEnter), onMouseLeave: composeEventHandlers(childProps.onMouseLeave, handleLeave), onPointerEnter: composeEventHandlers( childProps.onPointerEnter, handleEnter ), onPointerLeave: composeEventHandlers( childProps.onPointerLeave, handleLeave ), ref: mergeRefs(childProps.ref, (node: HTMLElement | null) => { triggerRef.current = node; }), }); } function AvatarTooltipBubble({ className, content, motionConfig, open, placement, side, tooltipId, tooltipRef, }: { className?: string; content: string; motionConfig: ReturnType; open: boolean; placement: TooltipPlacement | null; side: TooltipSide; tooltipId: string; tooltipRef: React.RefObject; }) { if (typeof document === "undefined") { return null; } const reduceMotion = motionConfig.reduceMotion; return createPortal( {open ? ( ) : null} , document.body ); } function AvatarTooltipImpl({ children, className, content, delay = 0.15, side = "right", }: { children: TooltipTriggerElement; className?: string; content: string; delay?: number; side?: TooltipSide; }) { const reduceMotion = useReducedMotion(); const motionConfig = getTooltipMotionConfig(reduceMotion); const { handleEnter, handleLeave, normalizedContent, open, placement, tooltipId, tooltipRef, triggerRef, } = useAvatarTooltip({ content, delay, side }); if (normalizedContent.length === 0) { return children; } return ( <> {attachTooltipTrigger(children, { handleEnter, handleLeave, open, tooltipId, triggerRef, })} ); } function AvatarTooltip({ children, className, content, delay = 0.15, side = "right", }: { children: React.ReactNode; className?: string; content: string; delay?: number; side?: TooltipSide; }) { if (!isTooltipTriggerElement(children)) { if (process.env.NODE_ENV !== "production") { console.error( "Avatar tooltip expects a single element child so it can forward hover, focus, and accessibility props." ); } return children; } return ( {children} ); } const Avatar = React.forwardRef( ( { "aria-label": ariaLabel, asChild = false, className, name, render, size = "default", tabIndex, tooltip, tooltipClassName, tooltipDelay, tooltipSide, ...props }, ref ) => { const normalizedTooltip = tooltip?.trim() ?? ""; const accessibleLabel = ariaLabel ?? (normalizedTooltip || undefined); const avatarRoot = ( : undefined)} tabIndex={tabIndex ?? (normalizedTooltip ? 0 : undefined)} /> ); return ( {normalizedTooltip ? ( {avatarRoot} ) : ( avatarRoot )} ); } ); Avatar.displayName = "Avatar"; const AvatarImage = React.forwardRef< HTMLImageElement, AvatarPrimitive.Image.Props >(({ className, height, width, ...props }, ref) => { const { size } = useAvatarContext(); const dimension = AVATAR_IMAGE_SIZE[size]; return ( ); }); AvatarImage.displayName = "AvatarImage"; const AvatarFallback = React.forwardRef< HTMLSpanElement, AvatarPrimitive.Fallback.Props >(({ children, className, ...props }, ref) => { const { name } = useAvatarContext(); const fallbackContent = hasFallbackChildren(children) ? children : getAvatarInitials(undefined, name); return ( {fallbackContent} ); }); AvatarFallback.displayName = "AvatarFallback"; const AvatarBadge = React.forwardRef( ( { "aria-label": ariaLabel, className, tabIndex, tooltip, tooltipClassName, tooltipDelay, tooltipSide, variant = "online", ...props }, ref ) => { const normalizedTooltip = tooltip?.trim() ?? ""; const badgeLabel = ariaLabel ?? (normalizedTooltip || BADGE_VARIANT_LABEL[variant]); const badge = ( svg]:hidden group-data-[size=default]/avatar:[&>svg]:size-2 group-data-[size=lg]/avatar:[&>svg]:size-2", BADGE_VARIANT_CLASSNAME[variant], className )} data-slot="avatar-badge" role="img" tabIndex={tabIndex ?? (normalizedTooltip ? 0 : undefined)} {...props} ref={ref} /> ); if (!normalizedTooltip) { return badge; } return ( {badge} ); } ); AvatarBadge.displayName = "AvatarBadge"; const AvatarGroup = React.forwardRef< HTMLDivElement, React.ComponentProps<"div"> >(({ className, ...props }, ref) => { return (

); }); AvatarGroup.displayName = "AvatarGroup"; const AvatarGroupCount = React.forwardRef< HTMLDivElement, React.ComponentProps<"div"> >(({ className, ...props }, ref) => { return (

svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3", className )} data-slot="avatar-group-count" ref={ref} {...props} /> ); }); AvatarGroupCount.displayName = "AvatarGroupCount"; export { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, getAvatarInitials, type AvatarBadgeVariant, type AvatarSize, }; 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","@base-ui/react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40base-ui%2Freact","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@base-ui/react"}]]}]}],["$","li","@radix-ui/react-slot",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40radix-ui%2Freact-slot","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@radix-ui/react-slot"}]]}]}],["$","li","motion",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/motion","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"motion"}]]}]}]]}],["$","$L50",null,{"namespace":"@iconiq","registryDependencies":[]}]]}],null]}],["$","$L51",null,{"files":[{"path":"avatar.tsx","content":"$52","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]