@public-ui/components/dist/esm/getRenderStates-c4b5c6cb.js

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

/*!
 * KoliBri - The accessible HTML-Standard
 */
import{i as watchBoolean,o as objectObjectHandler,k as parseJson,w as watchValidator,x as isObject,t as isString,C as buildBadgeTextString,m as showExpertSlot,j as a11yHintDisabled,c as a11yHint,B as watchString,D as devHint,l as setState}from"./index-ebe5a881.js";import{d as dispatchDomEvent,K as KolEvent}from"./events-bad0a075.js";import{A as AssociatedInputController}from"./associated.controller-92af2554.js";import{v as validateAccessKey,a as validateAccessAndShortKey,b as validateShortKey,c as validateTabIndex}from"./access-and-short-key-f743a5c4.js";import{v as validateTooltipAlign}from"./tooltip-align-465a8590.js";import{v as validateHideLabel}from"./hide-label-8b3a8709.js";import{a as validateLabelWithExpertSlot}from"./label-bf9966d0.js";import{_ as __rest}from"./tslib.es6-1173d062.js";import{h,F as Fragment}from"./index-1ed13705.js";import{c as clsx}from"./clsx-09a06a12.js";import{K as KolAlertFc}from"./Alert-112aec59.js";import{i as isString$1,K as KolInternalUnderlinedBadgeTextFc}from"./InternalUnderlinedBadgeText-781ef373.js";import{t as translate}from"./i18n-260f0fe9.js";import{a as KolTooltipWcTag}from"./component-names-7924d82a.js";const validateAdjustHeight=(e,t)=>{watchBoolean(e,"_adjustHeight",t)},validateHideMsg=(e,t,o)=>{watchBoolean(e,"_hideMsg",t,o)};function transformObjectProperties(e){return Object.entries(e).reduce(((e,[t,o])=>{const i=t.startsWith("_")?t.slice(1):t;return Object.assign(Object.assign({},e),{[i]:o})}),{})}const validateMsg=(e,t)=>{objectObjectHandler(t,(()=>{try{t=parseJson(t)}catch(e){}watchValidator(e,"_msg",(e=>isObject(e)&&isString(null==e?void 0:e._description,1)||void 0===(null==e?void 0:e._type)),new Set(["MsgPropType"]),t)}))};function convertMsgToInternMsg(e){if(e)return transformObjectProperties(e)}function checkHasMsg(e,t){return!!e&&(!0===t||"error"!==(null==e?void 0:e.type))}const validateTouched=(e,t)=>{watchBoolean(e,"_touched",t)},FormFieldMsgFc=e=>{var{alert:t,msg:o,hideMsg:i,id:s,class:n}=e,a=__rest(e,["alert","msg","hideMsg","id","class"]);return h(KolAlertFc,Object.assign({id:`${s}-msg`,alert:t,type:"error",class:clsx("kol-form-field__msg",{"visually-hidden":!0===i},n)},o,a,{"aria-hidden":"true"}),(null==o?void 0:o.description)||void 0)},LabelFc=({hasExpertSlot:e,accessKey:t,shortKey:o,label:i,showBadge:s=!0})=>{if(e)return h("slot",{name:"expert"});if(!i)return null;const n=isString$1(t)||isString$1(o);if(!s||!n)return h("span",null,i);const a=buildBadgeTextString(t,o);return h(Fragment,null,h(KolInternalUnderlinedBadgeTextFc,{badgeText:a,label:i})," ",h("span",{class:"badge-text-hint","aria-hidden":"true"},a))},KolFormFieldLabelFc=e=>{var{component:t="label",id:o,baseClassName:i="kol-form-field",class:s,accessKey:n,shortKey:a,label:l,hideLabel:r,hasExpertSlot:d,showBadge:c}=e,p=__rest(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge"]);const m=!d&&r;return h(t,Object.assign({},p,{class:clsx(`${i}__label`,s),id:m?void 0:`${o}-label`,hidden:m,htmlFor:o}),h("span",{class:clsx(`${i}__label-text`)},h(LabelFc,{hasExpertSlot:d,accessKey:n,shortKey:a,label:l,showBadge:c})))},KolFormFieldHintFc=e=>{var{id:t,class:o,hint:i,baseClassName:s="kol-form-field"}=e,n=__rest(e,["id","class","hint","baseClassName"]);return i?h("span",Object.assign({class:clsx(`${s}__hint`,o),id:`${t}-hint`},n),i):null},KolFormFieldCounterFc=e=>{var{currentLength:t,maxLength:o,class:i}=e,s=__rest(e,["currentLength","maxLength","class"]);return h("span",Object.assign({class:clsx("kol-form-field__counter",i)},s,{"aria-atomic":"true","aria-live":"polite","data-testid":"input-counter"}),t,o&&h(Fragment,null,h("span",{"aria-label":translate("kol-of"),role:"img"},"/"),o)," ",h("span",null,translate("kol-characters")))},FormFieldTooltipFc=({id:e,align:t,badgeText:o,hideLabel:i,label:s,class:n})=>h(KolTooltipWcTag,{"aria-hidden":"true",class:clsx("kol-form-field__tooltip",n),_badgeText:o,_align:t,_id:i?`${e}-label`:void 0,_label:s});function getModifierClassNameByMsgType(e){return(null==e?void 0:e.type)&&{default:"msg-type-default",info:"msg-type-info",success:"msg-type-success",warning:"msg-type-warning",error:"msg-type-error"}[null==e?void 0:e.type]||""}const InputContainer=(e,t)=>{var{class:o}=e,i=__rest(e,["class"]);return h("div",Object.assign({class:clsx("kol-form-field__input",o)},i),t)},KolFormFieldFc=(e,t)=>{const{component:o="div",renderNoLabel:i,renderNoTooltip:s,renderNoHint:n,anotherChildren:a,id:l,required:r,alert:d,disabled:c,class:p,msg:m,hideMsg:u,hideLabel:g,label:b,hint:v,accessKey:_,shortKey:f,tooltipAlign:y,counter:F,readOnly:K,touched:j,formFieldLabelProps:x,formFieldHintProps:L,formFieldTooltipProps:C,formFieldMsgProps:S,formFieldCounterProps:T,formFieldInputProps:H}=e,M=__rest(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideMsg","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldCounterProps","formFieldInputProps"]),B=!i,O=!n,k=!s,I=showExpertSlot(b),A=checkHasMsg(m,j),E=buildBadgeTextString(_,f),P=k&&!I&&g;let w={"kol-form-field--disabled":Boolean(c),"kol-form-field--required":Boolean(r),"kol-form-field--touched":Boolean(j),"kol-form-field--hide-label":Boolean(g),"kol-form-field--read-only":Boolean(K),"kol-form-field--hidden-msg":Boolean(u)};return A&&(w=Object.assign(Object.assign({},w),{[`kol-form-field--${(null==m?void 0:m.type)||"error"}`]:!0,[`kol-form-field--${getModifierClassNameByMsgType(m)}`]:!0})),h(o,Object.assign({class:clsx("kol-form-field",w,p)},M),B&&h(KolFormFieldLabelFc,Object.assign({},x||{},{id:l,hasExpertSlot:I,hideLabel:g,label:b,accessKey:_,shortKey:f})),h(InputContainer,Object.assign({},H),t,P&&h(FormFieldTooltipFc,Object.assign({},C||{},{id:l,label:b,hideLabel:g,align:y,badgeText:E}))),F?h(KolFormFieldCounterFc,Object.assign({},T||{},F)):null,A&&h(FormFieldMsgFc,Object.assign({},S||{},{id:l,alert:d,msg:m,hideMsg:u})),O&&h(KolFormFieldHintFc,Object.assign({},L||{},{id:l,hint:v})),a)};function getDefaultProps({ariaDescribedBy:e,hideLabel:t,label:o}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":t&&o?o:void 0}}class ControlledInputController extends AssociatedInputController{constructor(e,t,o){super(e,t,o),this.component=e}validateTouched(e){validateTouched(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class InputController extends ControlledInputController{constructor(e,t,o){super(e,t,o),this.valueChangeListeners=[],this.onFacade={onBlur:this.onBlur.bind(this),onChange:this.onChange.bind(this),onClick:this.onClick.bind(this),onFocus:this.onFocus.bind(this),onInput:this.onInput.bind(this)},this.component=e}validateAccessKey(e){validateAccessKey(this.component,e),validateAccessAndShortKey(e,this.component._shortKey)}validateAdjustHeight(e){validateAdjustHeight(this.component,e)}validateDisabled(e){watchBoolean(this.component,"_disabled",e),!0===e&&a11yHintDisabled()}validateTooltipAlign(e){validateTooltipAlign(this.component,e)}validateHideMsg(e){validateHideMsg(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideMsg&&a11yHint("Property _hideMsg for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(e){validateHideLabel(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&a11yHint("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(e){watchString(this.component,"_hint",e)}validateId(e){watchString(this.component,"_id",e,{minLength:1}),""!==e&&void 0!==e||devHint("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(e){validateLabelWithExpertSlot(this.component,e,{required:!0})}validateMsg(e){validateMsg(this.component,e)}validateOn(e){"object"==typeof e&&setState(this.component,"_on",e)}validateShortKey(e){validateShortKey(this.component,e),validateAccessAndShortKey(this.component._accessKey,e)}validateSmartButton(e){objectObjectHandler(e,(()=>{try{e=parseJson(e)}catch(e){}setState(this.component,"_smartButton",e)}))}validateTabIndex(e){validateTabIndex(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideMsg(this.component._hideMsg),this.validateHideLabel(this.component._hideLabel),this.validateHint(this.component._hint),this.validateId(this.component._id),this.validateLabel(this.component._label),this.validateShortKey(this.component._shortKey),this.validateSmartButton(this.component._smartButton),this.validateOn(this.component._on),this.validateTabIndex(this.component._tabIndex),validateAccessAndShortKey(this.component._accessKey,this.component._shortKey)}emitEvent(e,t){this.host&&dispatchDomEvent(this.host,e,t)}onBlur(e){var t;this.component._touched=!0,this.emitEvent(KolEvent.blur),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onBlur)&&this.component._on.onBlur(e)}onChange(e,t){var o;void 0===t&&(t=e.target.value),this.emitEvent(KolEvent.change,t),"function"==typeof(null===(o=this.component._on)||void 0===o?void 0:o.onChange)&&this.component._on.onChange(e,t),this.valueChangeListeners.forEach((e=>e(t)))}onInput(e,t=!0,o){var i;void 0===o&&(o=e.target.value),this.emitEvent(KolEvent.input,o),t&&this.setFormAssociatedValue(o),"function"==typeof(null===(i=this.component._on)||void 0===i?void 0:i.onInput)&&this.component._on.onInput(e,o)}onClick(e){var t;this.emitEvent(KolEvent.click),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onClick)&&this.component._on.onClick(e)}onFocus(e){var t;this.emitEvent(KolEvent.focus),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onFocus)&&this.component._on.onFocus(e)}addValueChangeListener(e){this.valueChangeListeners.push(e)}}function getFormFieldProps(e){const t={id:e._id,disabled:e._disabled,msg:convertMsgToInternMsg(e._msg),hint:e._hint,label:e._label,hideLabel:e._hideLabel,hideMsg:e._hideMsg,touched:e._touched};return"_required"in e&&(t.required=e._required),"_readOnly"in e&&(t.readOnly=e._readOnly),"_accessKey"in e&&(t.accessKey=e._accessKey),"_shortKey"in e&&(t.shortKey=e._shortKey),"_hasCounter"in e&&"_currentLength"in e&&(t.counter=e._hasCounter?{currentLength:e._currentLength}:void 0,t.counter&&"_maxLength"in e&&(t.counter.maxLength=e._maxLength)),t}const FormFieldStateWrapper=(e,t)=>{var{state:o}=e,i=__rest(e,["state"]);return h(KolFormFieldFc,Object.assign({},getFormFieldProps(o),i),t)},getRenderStates=e=>{var t,o,i;const s=Boolean((null===(t=null==e?void 0:e._msg)||void 0===t?void 0:t._description)&&(null===(o=e._msg._description)||void 0===o?void 0:o.length)>0),n="error"===(null===(i=e._msg)||void 0===i?void 0:i._type)&&s&&!0===e._touched,a="string"==typeof e._hint&&e._hint.length>0,l=[];return s&&l.push(`${e._id}-msg`),a&&l.push(`${e._id}-hint`),{hasError:n,hasHint:a,ariaDescribedBy:l}};export{FormFieldStateWrapper as F,InputController as I,KolFormFieldLabelFc as K,convertMsgToInternMsg as a,FormFieldTooltipFc as b,checkHasMsg as c,KolFormFieldHintFc as d,getDefaultProps as e,getRenderStates as g};