v4web-components/dist/stencil-library/p-5acf144e.entry.js

Stencil Component Starter

import{r as a,c as e,h as s}from"./p-c2aeec95.js";const t=".avatar{text-align:center;display:flex;justify-content:center;align-items:center;padding:var(--lab-ds-semantic-placeholder-space-padding-none);border-radius:100%;background-color:var(--lab-ds-semantic-color-bg-default);color:var(--lab-ds-semantic-color-fg-default);border-color:var(--lab-ds-semantic-color-bg-cloudy);border-width:var(--lab-ds-semantic-selectable-border-width-s);border-style:solid}.avatar.disabled{opacity:var(--lab-ds-core-opacity-50);cursor:not-allowed}.name{text-transform:uppercase}.avatar.x-small{width:var(--lab-ds-semantic-selectable-size-sm);height:var(--lab-ds-semantic-selectable-size-sm)}.avatar.x-small .name{font:var(--lab-ds-semantic-typography-heading-h8)}.avatar.small{width:var(--lab-ds-semantic-selectable-size-sm);height:var(--lab-ds-semantic-selectable-size-sm)}.avatar.small .name{font:var(--lab-ds-semantic-typography-heading-h8)}.avatar.medium{width:var(--lab-ds-semantic-selectable-size-m);height:var(--lab-ds-semantic-selectable-size-m)}.avatar.medium .name{font:var(--lab-ds-semantic-typography-heading-h6)}.avatar.large{width:var(--lab-ds-semantic-selectable-size-l);height:var(--lab-ds-semantic-selectable-size-l)}.avatar.large .name{font:var(--lab-ds-semantic-typography-heading-h5)}.avatar.x-large{width:var(--lab-ds-semantic-selectable-size-xl);height:var(--lab-ds-semantic-selectable-size-xl)}.avatar.x-large .name{font:var(--lab-ds-semantic-typography-heading-h4)}.avatar.xx-large{width:var(--lab-ds-semantic-selectable-size-xxl);height:var(--lab-ds-semantic-selectable-size-xxl)}.avatar.xx-large .name{font:var(--lab-ds-semantic-typography-heading-h4)}";const l=class{constructor(s){a(this,s);this.clickAvatar=e(this,"clickAvatar",7);this.iconSize={small:"small",medium:"s-medium",large:"medium","x-large":"large","xx-large":"x-large"};this.size=undefined;this.imageSRC=undefined;this.disabled=undefined;this.name=undefined}handleClick(){if(this.disabled)return;this.clickAvatar.emit()}render(){const a=this.name&&this.name.slice(0,1);return s("div",{onClick:()=>this.handleClick()},this.imageSRC?s("img",{class:`${this.size} avatar ${this.disabled&&"disabled"}`,src:this.imageSRC}):s("div",{class:`avatar ${this.size} ${this.disabled&&"disabled"}`},this.name?s("span",{class:`name`},a):s("lab-ds-icon-not-selectable",{size:this.iconSize[this.size],icon:"person"})))}};l.style=t;export{l as lab_ds_avatar};
//# sourceMappingURL=p-5acf144e.entry.js.map