@radix-ui/themes/dist/cjs/components/avatar.js

[](https://radix-ui.com/themes)

"use strict";"use client";var h=Object.create;var m=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var C=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var D=(r,t)=>{for(var a in t)m(r,a,{get:t[a],enumerable:!0})},v=(r,t,a,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of w(t))!x.call(r,o)&&o!==a&&m(r,o,{get:()=>t[o],enumerable:!(p=N(t,o))||p.enumerable});return r};var f=(r,t,a)=>(a=r!=null?h(C(r)):{},v(t||!r||!r.__esModule?m(a,"default",{value:r,enumerable:!0}):a,r)),S=r=>v(m({},"__esModule",{value:!0}),r);var b={};D(b,{Avatar:()=>n});module.exports=S(b);var e=f(require("react")),i=f(require("classnames")),l=require("radix-ui"),A=require("./avatar.props.js"),P=require("../helpers/extract-props.js"),g=require("../helpers/get-subtree.js"),y=require("../props/margin.props.js");const n=e.forwardRef((r,t)=>{const{asChild:a,children:p,className:o,style:s,color:c,radius:u,...I}=(0,P.extractProps)(r,A.avatarPropDefs,y.marginPropDefs);return e.createElement(l.Avatar.Root,{"data-accent-color":c,"data-radius":u,className:(0,i.default)("rt-reset","rt-AvatarRoot",o),style:s,asChild:a},(0,g.getSubtree)({asChild:a,children:p},e.createElement(d,{ref:t,...I})))});n.displayName="Avatar";const d=e.forwardRef(({fallback:r,...t},a)=>{const[p,o]=e.useState("idle");return e.createElement(e.Fragment,null,p==="idle"||p==="loading"?e.createElement("span",{className:"rt-AvatarFallback"}):null,p==="error"?e.createElement(l.Avatar.Fallback,{className:(0,i.default)("rt-AvatarFallback",{"rt-one-letter":typeof r=="string"&&r.length===1,"rt-two-letters":typeof r=="string"&&r.length===2}),delayMs:0},r):null,e.createElement(l.Avatar.Image,{ref:a,className:"rt-AvatarImage",...t,onLoadingStatusChange:s=>{t.onLoadingStatusChange?.(s),o(s)}}))});d.displayName="AvatarImpl";
//# sourceMappingURL=avatar.js.map