@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
4 lines • 5.18 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
import{r as registerInstance,h,F as Fragment,H as Host,g as getElement}from"./index-f0de5c73.js";import{c as clsx}from"./clsx-09a06a12.js";import{t as translate}from"./i18n-5fe08f1c.js";import{a as KolTooltipWcTag,g as KolIconTag,c as KolButtonWcTag}from"./component-names-6ca7e863.js";import{h as handleSlotContent,s as showExpertSlot}from"./reuse-32931294.js";import{K as KolFormFieldMsgFc}from"./FormFieldMsg-02436ede.js";import"./i18n-7ea9f137.js";import"./Alert-6efb8352.js";import"./tslib.es6-2e5096f8.js";import"./dev.utils-fab45cbc.js";const KolInputWc=class{constructor(t){registerInstance(this,t),this.slotName="input",this.catchInputSlot=t=>{handleSlotContent(this.host,t,this.slotName)},this._accessKey=void 0,this._alert=!0,this._currentLength=void 0,this._disabled=!1,this._hasCounter=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._maxLength=void 0,this._msg=void 0,this._readOnly=!1,this._renderNoLabel=!1,this._required=!1,this._shortKey=void 0,this._slotName=void 0,this._suggestions=void 0,this._smartButton=void 0,this._tooltipAlign="top",this._touched=!1}componentWillRender(){this.slotName=this._slotName?this._slotName:"input"}getIconStyles(t){return t&&"object"==typeof t&&t.style?t.style:{}}render(){var t,s,i,e,o,a,l,n,d,r,c,_;const f="object"==typeof this._msg&&null!==this._msg&&"string"==typeof(null===(t=this._msg)||void 0===t?void 0:t._description)&&(null===(s=this._msg)||void 0===s?void 0:s._description.length)>0&&(!0===this._touched||"error"!==(null===(i=this._msg)||void 0===i?void 0:i._type)),u=showExpertSlot(this._label),b="string"==typeof this._hint&&this._hint.length>0,g=!u&&this._hideLabel;return h(Host,{key:"65e25236006d47c556c287f57522693a775819ef",class:clsx("kol-input",this.getModifierClassNameByMsgType(f),{disabled:!0===this._disabled,[(null===(e=this._msg)||void 0===e?void 0:e._type)||"error"]:!0===f,"read-only":!0===this._readOnly,required:!0===this._required,touched:!0===this._touched,"hidden-error":!0===this._hideError})},h("label",{key:"38b715784bbae9e94589d8a7ed1743de9c92969b",class:"input-label",id:g?void 0:`${this._id}-label`,hidden:g,htmlFor:this._id},h("span",{key:"5934f50ab92196658618fcb334af74447b47bcdb",class:"input-label-span"},h("slot",{key:"8a39a951858a36ccf7774ce7813e62deea8a2e85",name:"label"}))),b&&h("span",{key:"8db0923f2189c5c6e7ea3faf0f6120734e77f1ed",class:"hint",id:`${this._id}-hint`},this._hint),h("div",{key:"49a2bfbfcc153b68ca8b323605b9f9cb80f22900",class:{input:!0,"icon-left":"object"==typeof(null===(o=this._icons)||void 0===o?void 0:o.left),"icon-right":"object"==typeof(null===(a=this._icons)||void 0===a?void 0:a.right)}},(null===(l=this._icons)||void 0===l?void 0:l.left)&&h(KolIconTag,{key:"e7f0db71fab21ae736a66dc02f0c78357e18bf91",_label:"",_icons:(null===(n=this._icons)||void 0===n?void 0:n.left).icon,style:this.getIconStyles(null===(d=this._icons)||void 0===d?void 0:d.left)}),h("div",{key:"9669a185c1451fc77642c5e062a4c153e70abaca",ref:this.catchInputSlot,id:this.slotName,class:"input-slot"}),"object"==typeof this._smartButton&&null!==this._smartButton&&h(KolButtonWcTag,{key:"a3d9e730f5e6b026990e697d02d8cf945af5c11c",_customClass:this._smartButton._customClass,_disabled:this._smartButton._disabled,_icons:this._smartButton._icons,_hideLabel:!0,_id:this._smartButton._id,_label:this._smartButton._label,_on:this._smartButton._on,_tooltipAlign:this._smartButton._tooltipAlign,_variant:this._smartButton._variant}),(null===(r=this._icons)||void 0===r?void 0:r.right)&&h(KolIconTag,{key:"f6e6042d20148fb236129588c14cbca5b19dd873",_label:"",_icons:(null===(c=this._icons)||void 0===c?void 0:c.right).icon,style:this.getIconStyles(null===(_=this._icons)||void 0===_?void 0:_.right)})),g&&h(KolTooltipWcTag,{key:"e08bdf1c1ea0f363e3f3824809ee30d75a7868cc","aria-hidden":"true",class:"input-tooltip",_badgeText:this._accessKey||this._shortKey,_align:this._tooltipAlign,_id:this._hideLabel?`${this._id}-label`:void 0,_label:this._label}),f&&h(KolFormFieldMsgFc,{key:"4d82ed833659163c1315cd84d644f4022d2fb0ad",_alert:this._alert,_hideError:this._hideError,_msg:this._msg,_id:this._id}),Array.isArray(this._suggestions)&&this._suggestions.length>0&&h("datalist",{key:"bf391ca45c04582bc9e1d1083a3b0777c5ef433c",id:`${this._id}-list`},this._suggestions.map((t=>h("option",{value:t})))),this._hasCounter&&h("span",{key:"f6a3f6d6a14dddc4963c9a9f862899a0d7c3a9ab",class:"counter","aria-atomic":"true","aria-live":"polite","data-testid":"input-counter"},this._currentLength,this._maxLength&&h(Fragment,null,h("span",{key:"6d407c7b633fcb3f2c0fcb6901b37f8659abb808","aria-label":translate("kol-of"),role:"img"},"/"),this._maxLength)," ",h("span",{key:"c1fa9f7a068669b0802b3ad69fb1f4c7927869f1"},translate("kol-characters"))))}getModifierClassNameByMsgType(t){var s,i;if(t&&(null===(s=this._msg)||void 0===s?void 0:s._type))return{default:"msg-type-default",info:"msg-type-info",success:"msg-type-success",warning:"msg-type-warning",error:"msg-type-error"}[null===(i=this._msg)||void 0===i?void 0:i._type]}get host(){return getElement(this)}};export{KolInputWc as kol_input};