4f: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"] 50: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"] 51:Tc59,"use client" import * as React from "react" import { cn } from "@/lib/utils" type AvatarContextValue = { imageLoadingStatus: "idle" | "loading" | "loaded" | "error" onImageLoadingStatusChange: (status: "loading" | "loaded" | "error") => void } const AvatarContext = React.createContext( undefined ) function useAvatarContext() { const context = React.useContext(AvatarContext) if (!context) { throw new Error("Avatar components must be used within Avatar") } return context } interface AvatarProps extends React.HTMLAttributes {} function Avatar({ className, ...props }: AvatarProps) { const [imageLoadingStatus, setImageLoadingStatus] = React.useState< "idle" | "loading" | "loaded" | "error" >("idle") return ( ) } interface AvatarImageProps extends React.ImgHTMLAttributes {} function AvatarImage({ className, src, alt, ...props }: AvatarImageProps) { const { onImageLoadingStatusChange } = useAvatarContext() const [loadingStatus, setLoadingStatus] = React.useState< "idle" | "loading" | "loaded" | "error" >("idle") React.useEffect(() => { if (!src) { onImageLoadingStatusChange("error") return } let isMounted = true const image = new window.Image() const updateStatus = (status: "loading" | "loaded" | "error") => { if (!isMounted) return setLoadingStatus(status) onImageLoadingStatusChange(status) } updateStatus("loading") image.onload = () => updateStatus("loaded") image.onerror = () => updateStatus("error") image.src = src return () => { isMounted = false } }, [src, onImageLoadingStatusChange]) if (loadingStatus !== "loaded") { return null } return ( {alt}

) } interface AvatarFallbackProps extends React.HTMLAttributes { delayMs?: number } function AvatarFallback({ className, delayMs, ...props }: AvatarFallbackProps) { const { imageLoadingStatus } = useAvatarContext() const [canRender, setCanRender] = React.useState(delayMs === undefined) React.useEffect(() => { if (delayMs === undefined) return const timerId = window.setTimeout(() => setCanRender(true), delayMs) return () => window.clearTimeout(timerId) }, [delayMs]) if (!canRender || imageLoadingStatus === "loaded") { return null } return ( ) } export { Avatar, AvatarImage, AvatarFallback } 4e:["$","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":[null,["$","$L4f",null,{"namespace":"@taki","registryDependencies":["https://taki-ui.com/r/utils.json"]}]]}],null]}],["$","$L50",null,{"files":[{"path":"registry/new-york/ui/avatar.tsx","content":"$51","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]