@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
4 lines • 13.8 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
import{d as e,e as t,p as i,o as r,w as n,G as s,g as o,j as a,s as l,q as d}from"./common-Dd0zJQbD.js";import{v as c,a as u,b as h,c as f}from"./access-and-short-key-B37XLwy2.js";import{v as m}from"./disabled-BhpAFgSp.js";import{v as p}from"./hide-label-B9FhGrWP.js";import{a as b}from"./label-Dnmzb2S_.js";import{v}from"./tooltip-align-Cnin7S26.js";import{d as g,K as y}from"./events-9-skLO0f.js";import{A as _}from"./associated.controller-B9GDDaFL.js";import{a as j,c as x,i as L,r as k}from"./isObject-DvSELytj.js";import{_ as B}from"./tslib.es6-CxX45GIN.js";import{h as O,F as S}from"./index-Biu4X4Y_.js";import{c as K}from"./clsx-eK3rPvPS.js";import{b as C,s as D}from"./reuse-CX4AQDkS.js";import{t as T}from"./i18n-LBpyQ66X.js";import{i as $,K as F}from"./InternalUnderlinedBadgeText-CZdqjm5O.js";import{K as P}from"./Alert-CTUp0cq0.js";import{a as w}from"./component-names-C3fyby67.js";const M=(t,n)=>{e(t,"_adjustHeight",n)},E=(t,n,o)=>{e(t,"_hideMsg",n,o)},I=(e,n)=>{t(e,"_hint",n)},N=(e,t)=>{r(t,()=>{try{t=i(t)}catch(e){}n(e,"_msg",e=>{if(void 0===e)return!0;if("string"==typeof e&&e.length>0)return!0;if(s(e)&&null!==e){const t=e._description;return o(t,1)}return!1},new Set(["MsgPropType","string"]),t)})};function q(e,t){var n;if(!e)return!1;const o="string"==typeof e?"error":null!==(n=e._type)&&void 0!==n?n:"error";return!0===t||"error"!==o}function A(e){if("string"==typeof e)try{return i(e)}catch(t){return{_description:e,_type:"error"}}return e&&"object"==typeof e&&!("_type"in e)?Object.assign(Object.assign({},e),{_type:"error"}):e}const H=(t,n)=>{e(t,"_touched",n)},X=({id:e,maxLength:t})=>O("span",{id:`${e}-character-limit-hint`,class:"visually-hidden"},T("kol-character-limit-hint",{placeholders:{limit:String(t)}})),G=({currentLength:e,currentLengthDebounced:t,maxLength:n,maxLengthBehavior:o,id:i})=>{let r,s;const a=["kol-form-field__counter"];if("hard"===o)r="number"==typeof n?T("kol-character-counter-current-of-max",{placeholders:{current:String(e),max:String(n)}}):T("kol-character-counter-current",{placeholders:{current:String(e)}}),s="number"==typeof n?T("kol-character-counter-current-of-max-aria",{placeholders:{current:String(t),max:String(n)}}):T("kol-character-counter-current",{placeholders:{current:String(t)}});else{if("number"!=typeof n)return null;{const o=n-e,i=o<0,l=n-t,c=l<0;r=i?T("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(o))}}):T("kol-character-limit-remaining",{placeholders:{remaining:String(o)}}),s=c?T("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(l))}}):T("kol-character-limit-remaining",{placeholders:{remaining:String(l)}}),i&&a.push("kol-form-field__counter--exceeded")}}return O(S,null,O("span",{class:K(a),"aria-hidden":"true","data-testid":"input-counter"},r),O("span",{id:`${i}-counter`,"aria-live":"polite",class:"visually-hidden","data-testid":"input-counter-aria"},s))},W=e=>{var{id:t,class:n,hint:o,baseClassName:i="kol-form-field"}=e,r=B(e,["id","class","hint","baseClassName"]);return o?O("span",Object.assign({class:K(`${i}__hint`,n),id:`${t}-hint`},r),o):null};var z="[object Symbol]";function Q(e){return"symbol"==typeof e||j(e)&&x(e)==z}var U=/\s/;function J(e){for(var t=e.length;t--&&U.test(e.charAt(t)););return t}var V=/^\s+/;function Y(e){return e?e.slice(0,J(e)+1).replace(V,""):e}var Z=NaN,R=/^[-+]0x[0-9a-f]+$/i,ee=/^0b[01]+$/i,te=/^0o[0-7]+$/i,ie=parseInt;function re(e){if("number"==typeof e)return e;if(Q(e))return Z;if(L(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=L(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=Y(e);var n=ee.test(e);return n||te.test(e)?ie(e.slice(2),n?2:8):R.test(e)?Z:+e}var ne=function(){return k.Date.now()},se="Expected a function",oe=Math.max,ae=Math.min;function le(e,t,n){var o,i,r,s,a,l,c=0,d=!1,h=!1,u=!0;if("function"!=typeof e)throw new TypeError(se);function m(t){var n=o,r=i;return o=i=void 0,c=t,s=e.apply(r,n)}function p(e){var n=e-l;return void 0===l||n>=t||n<0||h&&e-c>=r}function f(){var e=ne();if(p(e))return g(e);a=setTimeout(f,function(e){var n=t-(e-l);return h?ae(n,r-(e-c)):n}(e))}function g(e){return a=void 0,u&&o?m(e):(o=i=void 0,s)}function v(){var e=ne(),n=p(e);if(o=arguments,i=this,l=e,n){if(void 0===a)return function(e){return c=e,a=setTimeout(f,t),d?m(e):s}(l);if(h)return clearTimeout(a),a=setTimeout(f,t),m(l)}return void 0===a&&(a=setTimeout(f,t)),s}return t=re(t)||0,L(n)&&(d=!!n.leading,r=(h="maxWait"in n)?oe(re(n.maxWait)||0,t):r,u="trailing"in n?!!n.trailing:u),v.cancel=function(){void 0!==a&&clearTimeout(a),c=0,o=l=i=a=void 0},v.flush=function(){return void 0===a?s:g(ne())},v}const de=({hasExpertSlot:e,accessKey:t,shortKey:n,label:o,showBadge:i=!0})=>{if(e)return O("slot",{name:"expert"});if(!o)return null;const r=$(t)||$(n);if(!i||!r)return O("span",null,o);const s=C(t,n);return O(S,null,O(F,{badgeText:s,label:o})," ",O("kbd",{class:"badge-text-hint","aria-hidden":"true"},s))},ce=e=>{var{component:t="label",id:n,baseClassName:o="kol-form-field",class:i,accessKey:r,shortKey:s,label:a,hideLabel:l,hasExpertSlot:c,showBadge:d,readOnly:h}=e,u=B(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge","readOnly"]);const m=!c&&l,p=T("kol-readonly");return O(t,Object.assign({},u,{class:K(`${o}__label`,i),id:m?void 0:`${n}-label`,hidden:m,htmlFor:n}),O("span",{class:K(`${o}__label-text`)},O(de,{hasExpertSlot:c,accessKey:r,shortKey:s,label:a,showBadge:d}),h?O("span",{class:K(`${o}__label__read-only`),"aria-hidden":"true"},"(",p,")"):null))},ue=e=>{var t,n,{alert:o,msg:i,id:r,class:s}=e,a=B(e,["alert","msg","id","class"]);const l=A(i);return O(P,Object.assign({id:`${r}-msg`,alert:null!==(t=null==l?void 0:l._alert)&&void 0!==t?t:o,hasCloser:!1,level:0,type:null!==(n=null==l?void 0:l._type)&&void 0!==n?n:"error",variant:"msg",class:K("kol-form-field__msg",s)},a),(null==l?void 0:l._description)||void 0)},he=({id:e,align:t,badgeText:n,label:o,class:i})=>O(w,{"aria-hidden":"true",class:K("kol-form-field__tooltip",i),_badgeText:n,_align:t,_id:`${e}-label`,_label:o});function fe(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 me=(e,t)=>{var{class:n}=e,o=B(e,["class"]);return O("div",Object.assign({class:K("kol-form-field__input",n)},o),t)},pe=(e,t)=>{var n;const{component:o="div",renderNoLabel:i,renderNoTooltip:r,renderNoHint:s,anotherChildren:a,id:l,required:c,alert:d,disabled:h,class:u,msg:m,hideMsg:p,hideLabel:f,label:g,hint:v,accessKey:b,shortKey:y,tooltipAlign:_,counter:L,readOnly:x,touched:j,maxLength:k,ariaDescribedBy:T,formFieldLabelProps:S,formFieldHintProps:F,formFieldTooltipProps:w,formFieldMsgProps:M,formFieldInputProps:$}=e,E=B(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideMsg","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","maxLength","ariaDescribedBy","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldInputProps"]),P=!i,I=!s,H=!r,A=D(g),N=q(m,j),z=C(b,y),Q=H&&!A&&f,U="string"==typeof m?"error":null!==(n=null==m?void 0:m._type)&&void 0!==n?n:"error";let V={"kol-form-field--disabled":Boolean(h),"kol-form-field--required":Boolean(c),"kol-form-field--touched":Boolean(j),"kol-form-field--hide-label":Boolean(f),"kol-form-field--read-only":Boolean(x),"kol-form-field--hidden-msg":Boolean(p)};return N&&(V=Object.assign(Object.assign({},V),{[`kol-form-field--${U||"error"}`]:!0,[`kol-form-field--${fe({type:U})}`]:!0})),O(o,Object.assign({class:K("kol-form-field",V,u),"aria-describedby":T},E),P&&O(ce,Object.assign({},S||{},{id:l,hasExpertSlot:A,hideLabel:f,label:g,accessKey:b,shortKey:y,readOnly:x})),O(me,Object.assign({},$),t,Q&&!0===f&&O(he,Object.assign({},w||{},{id:l,label:g,align:_,badgeText:z}))),L?O(G,Object.assign({id:l},L)):null,k?O(X,{id:l,maxLength:k}):null,N&&!p&&O(ue,Object.assign({},M||{},{id:l,alert:d,msg:m})),I&&O(W,Object.assign({},F||{},{id:l,hint:v})),a)};function be({ariaDescribedBy:e,hideLabel:t,label:n}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":t&&n?n:void 0}}class ve extends _{constructor(e,t,n){super(e,t,n),this.component=e}validateTouched(e){H(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class ge extends ve{constructor(e,t,n){super(e,t,n),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),onKeyDown:this.onKeyDown.bind(this)},this.updateCurrentLengthDebounced=le(e=>{l(this.component,"_currentLengthDebounced",e)},500),this.component=e}validateAccessKey(e){c(this.component,e),u(e,this.component._shortKey)}validateAdjustHeight(e){M(this.component,e)}validateDisabled(e){m(this.component,e)}validateTooltipAlign(e){v(this.component,e)}validateHideMsg(e){E(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideMsg&&d("Property _hideMsg for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(e){p(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&d("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(e){I(this.component,e)}validateId(e){t(this.component,"_id",e,{minLength:1}),""!==e&&void 0!==e||a("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(e){b(this.component,e,{required:!0})}validateMsg(e){N(this.component,e)}validateOn(e){"object"==typeof e&&l(this.component,"_on",e)}validateShortKey(e){h(this.component,e),u(this.component._accessKey,e)}validateSmartButton(e){r(e,()=>{try{e=i(e)}catch(e){}l(this.component,"_smartButton",e)})}validateTabIndex(e){f(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),u(this.component._accessKey,this.component._shortKey)}emitEvent(e,t){this.host&&g(this.host,e,t)}onBlur(e){var t;this.component._touched=!0,this.emitEvent(y.blur),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onBlur)&&this.component._on.onBlur(e)}onChange(e,t){var n;void 0===t&&(t=e.target.value),this.emitEvent(y.change,t),"function"==typeof(null===(n=this.component._on)||void 0===n?void 0:n.onChange)&&this.component._on.onChange(e,t),this.valueChangeListeners.forEach(e=>e(t))}onInput(e,t=!0,n){var o;void 0===n&&(n=e.target.value),this.emitEvent(y.input,n),t&&this.setFormAssociatedValue(n),"function"==typeof(null===(o=this.component._on)||void 0===o?void 0:o.onInput)&&this.component._on.onInput(e,n)}onClick(e){var t;this.emitEvent(y.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(y.focus),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onFocus)&&this.component._on.onFocus(e)}onKeyDown(e){var t;this.emitEvent(y.keydown),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onKeyDown)&&this.component._on.onKeyDown(e)}addValueChangeListener(e){this.valueChangeListeners.push(e)}hasSoftCharacterLimit(){return"number"==typeof this.component.state._maxLength&&"soft"===this.component.state._maxLengthBehavior}hasCounter(){return!0===this.component.state._hasCounter}}const ye=e=>{var t;const n=e._msg,o="string"==typeof n?n:null==n?void 0:n._description,i="string"==typeof n?"error":null!==(t=null==n?void 0:n._type)&&void 0!==t?t:"error",r=Boolean(o&&o.length>0),s="error"===i&&r&&!0===e._touched,a="string"==typeof e._hint&&e._hint.length>0,l=[];return r&&!e._hideMsg&&l.push(`${e._id}-msg`),!0===a&&l.push(`${e._id}-hint`),e._hasCounter&&l.push(`${e._id}-counter`),!0===s&&l.push(`${e._id}-error`),{hasError:s,hasHint:a,ariaDescribedBy:l}};function _e(e){const t={id:e._id,disabled:e._disabled,msg: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),"_maxLength"in e&&(t.maxLength=e._maxLength),"_currentLength"in e&&"number"==typeof e._currentLength&&"_currentLengthDebounced"in e&&"number"==typeof e._currentLengthDebounced&&"_hasCounter"in e&&!0===e._hasCounter&&(t.counter={currentLength:e._currentLength,currentLengthDebounced:e._currentLengthDebounced,maxLength:e._maxLength,maxLengthBehavior:e._maxLengthBehavior||"hard"}),t}const je=(e,t)=>{var{state:n}=e,o=B(e,["state"]);const{ariaDescribedBy:i}=ye(n),r=("fieldset"===o.component||"_options"in n&&"_orientation"in n)&&i.length>0?i.join(" "):void 0,s=_e(n);return O(pe,Object.assign({},s,o,{ariaDescribedBy:r}),t)};export{je as F,ge as I,ce as K,he as a,W as b,q as c,be as d,ye as g};