@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
4 lines • 1.87 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
"use strict";var index=require("./index-C3uXtd6W.js");require("./common-1pTy2kta.js");var color=require("./color-CnWT1y2W.js"),imageSource=require("./image-source-D4a1NLKp.js"),label=require("./label-6ELpV3zN.js"),i18n=require("./i18n-D4Klw_bZ.js");require("./i18n-yHKQt1gl.js");const formatNameAsInitial=a=>0===a.length?"":a[0].toUpperCase(),formatLabelAsInitials=a=>{const e=a.split(/\s+/),r=e[0],t=e[e.length-1];return e.length>=2&&r&&t?`${formatNameAsInitial(r)}${formatNameAsInitial(t)}`:formatNameAsInitial(a)},KolAvatarWc=class{constructor(a){index.registerInstance(this,a),this.bgColorStr="#d3d3d3",this.colorStr="#000",this.handleColorChange=a=>{const e=color.handleColorChange(a);this.bgColorStr=e.backgroundColor,this.colorStr=e.foregroundColor},this._color="#d3d3d3",this.state={_src:"",_label:"",_color:{backgroundColor:"#d3d3d3",foregroundColor:"#000"}}}render(){return index.h("div",{key:"04d0b5653648f532391c0b8f611ef3bd7d4e8bbf","aria-label":i18n.translate("kol-avatar-alt",{placeholders:{name:this.state._label}}),class:"kol-avatar",role:"img",style:{backgroundColor:this.bgColorStr,color:this.colorStr}},this.state._src?index.h("img",{alt:"","aria-hidden":"true",class:"kol-avatar__image",src:this.state._src}):index.h("span",{"aria-hidden":"true",class:"kol-avatar__initials"},formatLabelAsInitials(this.state._label.trim())))}validateColor(a){color.validateColor(this,a,{defaultValue:"#d3d3d3",hooks:{beforePatch:this.handleColorChange}})}validateSrc(a){imageSource.validateImageSource(this,a)}validateLabel(a){label.validateLabel(this,a,{required:!0})}componentWillLoad(){this.validateColor(this._color),this.validateSrc(this._src),this.validateLabel(this._label)}static get watchers(){return{_color:["validateColor"],_src:["validateSrc"],_label:["validateLabel"]}}};exports.kol_avatar_wc=KolAvatarWc;