@lanaco/lnc-react-ui/dist/Avatar.cjs

React component library

"use strict";const s=require("react/jsx-runtime"),b=require("react"),I=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),t=require("./utils-BK6B_Y9X.cjs"),$=require("./Icon.cjs"),w=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),x=I.styled.div`
  border-radius: ${e=>t.getBorderRadiusValueWithUnits(e.theme,e.borderRadius)};
  color: white;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: ${e=>e.sizeInUnits?e.sizeInUnits:t.getSizeValueWithUnits(e.theme,e.size)};
  width: ${e=>e.sizeInUnits?e.sizeInUnits:t.getSizeValueWithUnits(e.theme,e.size)};
  ${e=>e.disabled===!0&&t.getDisabledStateCss(e.theme)};
  background-color: ${e=>!e.disabled&&t.getColorRgbaValue(e.theme,"Chip",e.color,"enabled","text")};
  overflow: hidden;
  & img {
    height: ${e=>e.sizeInUnits?e.sizeInUnits:t.getSizeValueWithUnits(e.theme,e.size)};
    width: ${e=>e.sizeInUnits?e.sizeInUnits:t.getSizeValueWithUnits(e.theme,e.size)};
  }
`,y=b.forwardRef((e,l)=>{const{image:n,icon:a="user",sizeInUnits:i,borderRadius:c="curved",onFocus:u=()=>{},onBlur:d=()=>{},onClick:o=()=>{},size:r="small",color:h="primary",className:m="",style:z={},...g}=e,U={theme:w.useTheme(),color:h,style:z,size:r,sizeInUnits:i,className:"lnc-ui-avatar "+m};return s.jsx(x,{ref:l,...U,borderRadius:c,onClick:o,onFocus:u,onBlur:d,...g,children:n?s.jsx("img",{src:n}):s.jsx($,{icon:a,size:r,sizeInUnits:i?`calc(${i} / 2)`:null})})});module.exports=y;