@public-ui/components 1.6.0-rc.24 → 1.6.0-rc.25

package/dist/kolibri/kol-input-date.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as t,H as e,r as i,g as s}from"./index-5ab2ea42.js";import{n as a}from"./dev.utils-2f404ce5.js";import{a as n}from"./reuse-c2156413.js";import{p as l}from"./controller-3213f6ba.js";import{g as d}from"./controller-108aa205.js";import{a as o,w as h,s as r,e as u}from"./prop.validators-286b41b1.js";import{v as p}from"./suggestions-3df3e5fd.js";import{I as c}from"./controller-icon-e6f72083.js";import"./a11y.tipps-010cc7bb.js";import"./label-8596593d.js";import"./associated.controller-9d8da408.js";import"./tab-index-a7766f42.js";import"./index-37b5cbcf.js";import"./icon-a0bacdc8.js";const f=(t,e)=>{o(t,"_readOnly",e)};class m extends c{constructor(t,e,i){super(t,e,i),this.validateIso8601=(t,e,i)=>h(this.component,t,(t=>void 0===t||null==t||""===t||this.validateDateString(t)),new Set(["Date","string{ISO-8601}"]),this.tryParseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&i&&i(t)}}}),this.component=t}validateAutoComplete(t){h(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(){}validateSuggestions(t){p(this.component,t)}tryParseToString(t,e){const i=null!=t?t:e;if("string"==typeof i)return i;if("object"==typeof i&&i instanceof Date)switch(this.component._type){case"date":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}`;case"datetime-local":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}T${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"month":return`${i.getFullYear()}-${i.getMonth()+1}`;case"time":return void 0===this.component._step||"string"==typeof this.component._step&&"60"===this.component._step||"number"==typeof this.component._step&&60===this.component._step?`${i.getHours()}:${i.getMinutes()}`:`${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"week":throw new Error("Auto convert to week is not supported!")}return null===t?null:void 0}validateDateString(t){switch(this.component._type){case"date":return m.isoDateRegex.test(t);case"datetime-local":return m.isoLocalDateTimeRegex.test(t);case"month":return m.isoMonthRegex.test(t);case"time":return m.isoTimeRegex.test(t);case"week":return m.isoWeekRegex.test(t);default:return!1}}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){h(this.component,"_max",(t=>void 0===t||null!==t&&this.validateDateString(t)),new Set(["Iso8601","Date"]),this.tryParseToString(t,"date"===this.component._type||"month"===this.component._type||"datetime-local"===this.component._type?m.DEFAULT_MAX_DATE:void 0))}validateMin(t){h(this.component,"_min",(t=>void 0===t||null!==t&&this.validateDateString(t)),new Set(["Iso8601","Date"]),this.tryParseToString(t))}validateOn(t){r(this.component,"_on",Object.assign(Object.assign({},t),{onChange:(e,i)=>{!!i!=!!this.component._value&&(this.component._value=i),(null==t?void 0:t.onChange)&&t.onChange(e,i)}}))}validateReadOnly(t){f(this.component,t)}validateRequired(t){o(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){h(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateLabel(this.component._label),this.validateSuggestions(this.component._suggestions||this.component._list),this.validateOn(this.component._on),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}m.isoDateRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])/,m.isoLocalDateTimeRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])[T ][0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,m.isoMonthRegex=/^\d{4}-([0]\d|1[0-2])/,m.isoTimeRegex=/^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,m.isoWeekRegex=/^\d{4}-W(?:[0-4]\d|5[0-3])$/,m.DEFAULT_MAX_DATE=new Date(9999,11,31,23,59,59);const v=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}kol-input-number{display:block}",y=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,s=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},s?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip",{"aria-hidden":"true",hidden:s||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?l({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._step=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._type="date",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:`id-${a()}`,_label:!1,_suggestions:[],_type:"datetime-local"},this.controller=new m(this,"input-date",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateStep(t){this.controller.validateStep(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return s(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_step:["validateStep"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};y.style={default:v};export{y as kol_input_date};
+import{h as t,H as e,r as i,g as s}from"./index-5ab2ea42.js";import{n as a}from"./dev.utils-1ee29ed1.js";import{a as n}from"./reuse-c2156413.js";import{p as d}from"./controller-f073ed22.js";import{g as l}from"./controller-ab167bf7.js";import{a as o,w as h,s as r,e as u}from"./prop.validators-6cf6ed2d.js";import{v as p}from"./suggestions-efa371a2.js";import{I as c}from"./controller-icon-cfbc5bbf.js";import"./a11y.tipps-3dbf06fc.js";import"./label-162d9b49.js";import"./associated.controller-6c7440df.js";import"./tab-index-cda3bf60.js";import"./index-37b5cbcf.js";import"./icon-a7195182.js";const f=(t,e)=>{o(t,"_readOnly",e)};class m extends c{constructor(t,e,i){super(t,e,i),this.validateIso8601=(t,e,i)=>h(this.component,t,(t=>void 0===t||null==t||""===t||this.validateDateString(t)),new Set(["Date","string{ISO-8601}"]),this.tryParseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&i&&i(t)}}}),this.component=t}validateAutoComplete(t){h(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(){}validateSuggestions(t){p(this.component,t)}tryParseToString(t,e){const i=null!=t?t:e;if("string"==typeof i)return i;if("object"==typeof i&&i instanceof Date)switch(this.component._type){case"date":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}`;case"datetime-local":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}T${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"month":return`${i.getFullYear()}-${i.getMonth()+1}`;case"time":return void 0===this.component._step||"string"==typeof this.component._step&&"60"===this.component._step||"number"==typeof this.component._step&&60===this.component._step?`${i.getHours()}:${i.getMinutes()}`:`${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"week":throw new Error("Auto convert to week is not supported!")}return null===t?null:void 0}validateDateString(t){switch(this.component._type){case"date":return m.isoDateRegex.test(t);case"datetime-local":return m.isoLocalDateTimeRegex.test(t);case"month":return m.isoMonthRegex.test(t);case"time":return m.isoTimeRegex.test(t);case"week":return m.isoWeekRegex.test(t);default:return!1}}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){h(this.component,"_max",(t=>void 0===t||null!==t&&this.validateDateString(t)),new Set(["Iso8601","Date"]),this.tryParseToString(t,"date"===this.component._type||"month"===this.component._type||"datetime-local"===this.component._type?m.DEFAULT_MAX_DATE:void 0))}validateMin(t){h(this.component,"_min",(t=>void 0===t||null!==t&&this.validateDateString(t)),new Set(["Iso8601","Date"]),this.tryParseToString(t))}validateOn(t){r(this.component,"_on",Object.assign(Object.assign({},t),{onChange:(e,i)=>{!!i!=!!this.component._value&&(this.component._value=i),(null==t?void 0:t.onChange)&&t.onChange(e,i)}}))}validateReadOnly(t){f(this.component,t)}validateRequired(t){o(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){h(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateLabel(this.component._label),this.validateSuggestions(this.component._suggestions||this.component._list),this.validateOn(this.component._on),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}m.isoDateRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])/,m.isoLocalDateTimeRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])[T ][0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,m.isoMonthRegex=/^\d{4}-([0]\d|1[0-2])/,m.isoTimeRegex=/^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,m.isoWeekRegex=/^\d{4}-W(?:[0-4]\d|5[0-3])$/,m.DEFAULT_MAX_DATE=new Date(9999,11,31,23,59,59);const v=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}kol-input-number{display:block}",y=class{render(){const{ariaDescribedBy:i}=l(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,s=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},s?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip",{"aria-hidden":"true",hidden:s||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?d({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._step=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._type="date",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:`id-${a()}`,_label:!1,_suggestions:[],_type:"datetime-local"},this.controller=new m(this,"input-date",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateStep(t){this.controller.validateStep(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return s(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_step:["validateStep"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};y.style={default:v};export{y as kol_input_date};

package/dist/kolibri/kol-input-date.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["validateReadOnly","component","value","watchBoolean","InputDateController","InputIconController","constructor","name","host","super","this","validateIso8601","propName","afterPatch","watchValidator","undefined","validateDateString","Set","tryParseToString","hooks","validateAutoComplete","validateList","validateSuggestions","defaultValue","v","Date","_type","getFullYear","getMonth","getDate","getHours","getMinutes","getSeconds","_step","Error","isoDateRegex","test","isoLocalDateTimeRegex","isoMonthRegex","isoTimeRegex","isoWeekRegex","onChange","event","target","_value","validateMax","DEFAULT_MAX_DATE","validateMin","validateOn","setState","Object","assign","e","validateRequired","validateStep","watchNumber","validateType","validateValue","validateValueEx","setFormAssociatedValue","state","componentWillLoad","_autoComplete","_max","_min","validateLabel","_label","_suggestions","_list","_on","_readOnly","_required","defaultStyleCss","KolInputDate","render","ariaDescribedBy","getRenderStates","hasSuggestions","Array","isArray","length","hasExpertSlot","h","Host","class","_hasValue","_hideLabel","_disabled","_error","_hint","_icon","_id","_smartButton","_touched","slot","ref","catchRef","title","accessKey","_accessKey","join","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","readOnly","required","step","spellcheck","type","controller","onFacade","onKeyUp","hidden","_align","_tooltipAlign","hostRef","propagateFocus","code","propagateSubmitEventToForm","form","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateName","validateSmartButton","validateSyncValueBySelector","validateTabIndex","validateTouched","_alert","addValueChangeListener"],"sources":["src/types/props/read-only.ts","src/components/input-date/controller.ts","src/components/input-date/style.css?tag=kol-input-date&mode=default&encapsulation=shadow","src/components/input-date/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type ReadOnlyPropType = boolean;\n\n/**\n * Makes the input element read only.\n */\nexport type PropReadOnly = {\n\treadOnly: ReadOnlyPropType;\n};\n\n/* validator */\nexport const validateReadOnly = (component: Generic.Element.Component, value?: ReadOnlyPropType): void => {\n\twatchBoolean(component, '_readOnly', value);\n};\n","import { Generic } from '@a11y-ui/core';\n\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { ReadOnlyPropType, validateReadOnly } from '../../types/props/read-only';\nimport { SuggestionsPropType, validateSuggestions } from '../../types/props/suggestions';\nimport { setState, watchBoolean, watchNumber, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputDateController extends InputIconController implements Watches {\n\t// test: https://regex101.com/r/NTVh4L/1\n\tprivate static readonly isoDateRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])/;\n\tprivate static readonly isoLocalDateTimeRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])[T ][0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoMonthRegex = /^\\d{4}-([0]\\d|1[0-2])/;\n\tprivate static readonly isoTimeRegex = /^[0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoWeekRegex = /^\\d{4}-W(?:[0-4]\\d|5[0-3])$/;\n\n\tprivate static readonly DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);\n\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @deprecated remains to satisfy `Watches` interface\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-empty-function\n\tpublic validateList(): void {}\n\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tvalidateSuggestions(this.component, value);\n\t}\n\n\tprivate tryParseToString(value?: Iso8601 | Date | null, defaultValue?: Date): string | null | undefined {\n\t\tconst v: Iso8601 | Date | undefined = value ?? defaultValue;\n\t\tif (typeof v === 'string') {\n\t\t\treturn v;\n\t\t}\n\t\tif (typeof v === 'object' && v instanceof Date) {\n\t\t\tswitch (this.component._type) {\n\t\t\t\tcase 'date':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}`;\n\t\t\t\tcase 'datetime-local':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}T${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\tcase 'month':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}`;\n\t\t\t\tcase 'time':\n\t\t\t\t\t// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time#using_the_step_attribute\n\t\t\t\t\tif (\n\t\t\t\t\t\tthis.component._step === undefined ||\n\t\t\t\t\t\t(typeof this.component._step === 'string' && this.component._step === '60') ||\n\t\t\t\t\t\t(typeof this.component._step === 'number' && this.component._step === 60)\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\t\t}\n\t\t\t\tcase 'week':\n\t\t\t\t\tthrow new Error('Auto convert to week is not supported!');\n\t\t\t}\n\t\t}\n\t\tif (value === null) {\n\t\t\treturn null;\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tprivate validateDateString(value: string): boolean {\n\t\tswitch (this.component._type) {\n\t\t\tcase 'date':\n\t\t\t\treturn InputDateController.isoDateRegex.test(value);\n\t\t\tcase 'datetime-local':\n\t\t\t\treturn InputDateController.isoLocalDateTimeRegex.test(value);\n\t\t\tcase 'month':\n\t\t\t\treturn InputDateController.isoMonthRegex.test(value);\n\t\t\tcase 'time':\n\t\t\t\treturn InputDateController.isoTimeRegex.test(value);\n\t\t\tcase 'week':\n\t\t\t\treturn InputDateController.isoWeekRegex.test(value);\n\t\t\tdefault:\n\t\t\t\treturn false;\n\t\t}\n\t}\n\n\tprivate readonly validateIso8601 = (propName: string, value?: Date | Iso8601 | null, afterPatch?: (v: string) => void) => {\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || value == null || value === '' || this.validateDateString(value),\n\t\t\tnew Set(['Date', 'string{ISO-8601}']),\n\t\t\tthis.tryParseToString(value),\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t};\n\n\tprotected onChange(event: Event): void {\n\t\tsuper.onChange(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_max',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.tryParseToString(\n\t\t\t\tvalue,\n\t\t\t\tthis.component._type === 'date' || this.component._type === 'month' || this.component._type === 'datetime-local'\n\t\t\t\t\t? InputDateController.DEFAULT_MAX_DATE\n\t\t\t\t\t: undefined\n\t\t\t)\n\t\t);\n\t}\n\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_min',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.tryParseToString(value)\n\t\t);\n\t}\n\n\tpublic validateOn(value?: InputTypeOnDefault) {\n\t\tsetState(this.component, '_on', {\n\t\t\t...value,\n\t\t\tonChange: (e: Event, v: unknown) => {\n\t\t\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\t\t\tif (!!v !== !!this.component._value) {\n\t\t\t\t\tthis.component._value = v as Iso8601;\n\t\t\t\t}\n\n\t\t\t\tif (value?.onChange) {\n\t\t\t\t\tvalue.onChange(e, v);\n\t\t\t\t}\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tvalidateReadOnly(this.component, value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\tpublic validateType(value?: InputNumberType): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_type',\n\t\t\t(value): boolean =>\n\t\t\t\ttypeof value === 'string' &&\n\t\t\t\t(value === 'date' || value === 'datetime-local' || value === 'month' || value === 'number' || value === 'time' || value === 'week'),\n\t\t\tnew Set(['String {date, datetime-local, month, number, time, week}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: Iso8601 | Date | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateLabel(this.component._label);\n\t\tthis.validateSuggestions(this.component._suggestions || this.component._list);\n\t\tthis.validateOn(this.component._on);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateType(this.component._type);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\nkol-input-number {\n\tdisplay: block;\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputDateType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { AlignPropType } from '../../types/props/align';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { SuggestionsPropType } from '../../types/props/suggestions';\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputDateController } from './controller';\nimport { ComponentApi, States } from './types';\nimport { ReadOnlyPropType } from '../../types/props/read-only';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-date',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputDate implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputDateElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;\n\t\tconst hasExpertSlot = this.state._label === false; // _label=\"\" or _label\n\n\t\treturn (\n\t\t\t<Host class={{ 'has-value': this.state._hasValue }}>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type]: true,\n\t\t\t\t\t\t'hide-label': !!this.state._hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_suggestions={this.state._suggestions}\n\t\t\t\t\t_readOnly={this.state._readOnly}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t{/*  TODO: der folgende Slot ohne Name muss später entfernt werden */}\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tlist={hasSuggestions ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\thidden={hasExpertSlot || !this.state._hideLabel}\n\t\t\t\t\t\t\t_align={this._tooltipAlign}\n\t\t\t\t\t\t\t_label={typeof this.state._label === 'string' ? this.state._label : ''}\n\t\t\t\t\t\t></kol-tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputDateController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.\n\t */\n\t@Prop() public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t */\n\t@Prop() public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die interne ID des primären Elements in der Komponente an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t * @deprecated Use _suggestions instead.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Eingabewert an.\n\t */\n\t@Prop() public _max?: Iso8601 | Date;\n\n\t/**\n\t * Gibt den kleinstmöglichen Eingabewert an.\n\t */\n\t@Prop() public _min?: Iso8601 | Date;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Makes the input element read only.\n\t */\n\t@Prop() public _readOnly?: ReadOnlyPropType;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop() public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: string;\n\n\t/**\n\t * Gibt die Schrittweite der Wertveränderung an.\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: AlignPropType = 'top';\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Setzt den Typ der Komponente oder des interaktiven Elements in der Komponente an.\n\t */\n\t@Prop() public _type: InputDateType = 'date';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true }) public _value?: Iso8601 | Date | null;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_hasValue: false,\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: false, // ⚠ required\n\t\t_suggestions: [],\n\t\t_type: 'datetime-local',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputDateController(this, 'input-date', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.validateSuggestions(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: string): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: InputDateType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tthis.controller.validateValueEx(value, (v) => {\n\t\t\tif (v === '' && this.ref) {\n\t\t\t\tthis.ref.value = '';\n\t\t\t}\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["validateReadOnly","component","value","watchBoolean","InputDateController","InputIconController","constructor","name","host","super","this","validateIso8601","propName","afterPatch","watchValidator","undefined","validateDateString","Set","tryParseToString","hooks","validateAutoComplete","validateList","validateSuggestions","defaultValue","v","Date","_type","getFullYear","getMonth","getDate","getHours","getMinutes","getSeconds","_step","Error","isoDateRegex","test","isoLocalDateTimeRegex","isoMonthRegex","isoTimeRegex","isoWeekRegex","onChange","event","target","_value","validateMax","DEFAULT_MAX_DATE","validateMin","validateOn","setState","Object","assign","e","validateRequired","validateStep","watchNumber","validateType","validateValue","validateValueEx","setFormAssociatedValue","state","componentWillLoad","_autoComplete","_max","_min","validateLabel","_label","_suggestions","_list","_on","_readOnly","_required","defaultStyleCss","KolInputDate","render","ariaDescribedBy","getRenderStates","hasSuggestions","Array","isArray","length","hasExpertSlot","h","Host","class","_hasValue","_hideLabel","_disabled","_error","_hint","_icon","_id","_smartButton","_touched","slot","ref","catchRef","title","accessKey","_accessKey","join","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","readOnly","required","step","spellcheck","type","controller","onFacade","onKeyUp","hidden","_align","_tooltipAlign","hostRef","propagateFocus","code","propagateSubmitEventToForm","form","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateName","validateSmartButton","validateSyncValueBySelector","validateTabIndex","validateTouched","_alert","addValueChangeListener"],"sources":["src/types/props/read-only.ts","src/components/input-date/controller.ts","src/components/input-date/style.css?tag=kol-input-date&mode=default&encapsulation=shadow","src/components/input-date/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type ReadOnlyPropType = boolean;\n\n/**\n * Makes the input element read only.\n */\nexport type PropReadOnly = {\n\treadOnly: ReadOnlyPropType;\n};\n\n/* validator */\nexport const validateReadOnly = (component: Generic.Element.Component, value?: ReadOnlyPropType): void => {\n\twatchBoolean(component, '_readOnly', value);\n};\n","import { Generic } from '@a11y-ui/core';\n\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { ReadOnlyPropType, validateReadOnly } from '../../types/props/read-only';\nimport { SuggestionsPropType, validateSuggestions } from '../../types/props/suggestions';\nimport { setState, watchBoolean, watchNumber, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputDateController extends InputIconController implements Watches {\n\t// test: https://regex101.com/r/NTVh4L/1\n\tprivate static readonly isoDateRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])/;\n\tprivate static readonly isoLocalDateTimeRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])[T ][0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoMonthRegex = /^\\d{4}-([0]\\d|1[0-2])/;\n\tprivate static readonly isoTimeRegex = /^[0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoWeekRegex = /^\\d{4}-W(?:[0-4]\\d|5[0-3])$/;\n\n\tprivate static readonly DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);\n\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @deprecated remains to satisfy `Watches` interface\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-empty-function\n\tpublic validateList(): void {}\n\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tvalidateSuggestions(this.component, value);\n\t}\n\n\tprivate tryParseToString(value?: Iso8601 | Date | null, defaultValue?: Date): string | null | undefined {\n\t\tconst v: Iso8601 | Date | undefined = value ?? defaultValue;\n\t\tif (typeof v === 'string') {\n\t\t\treturn v;\n\t\t}\n\t\tif (typeof v === 'object' && v instanceof Date) {\n\t\t\tswitch (this.component._type) {\n\t\t\t\tcase 'date':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}`;\n\t\t\t\tcase 'datetime-local':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}T${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\tcase 'month':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}`;\n\t\t\t\tcase 'time':\n\t\t\t\t\t// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time#using_the_step_attribute\n\t\t\t\t\tif (\n\t\t\t\t\t\tthis.component._step === undefined ||\n\t\t\t\t\t\t(typeof this.component._step === 'string' && this.component._step === '60') ||\n\t\t\t\t\t\t(typeof this.component._step === 'number' && this.component._step === 60)\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\t\t}\n\t\t\t\tcase 'week':\n\t\t\t\t\tthrow new Error('Auto convert to week is not supported!');\n\t\t\t}\n\t\t}\n\t\tif (value === null) {\n\t\t\treturn null;\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tprivate validateDateString(value: string): boolean {\n\t\tswitch (this.component._type) {\n\t\t\tcase 'date':\n\t\t\t\treturn InputDateController.isoDateRegex.test(value);\n\t\t\tcase 'datetime-local':\n\t\t\t\treturn InputDateController.isoLocalDateTimeRegex.test(value);\n\t\t\tcase 'month':\n\t\t\t\treturn InputDateController.isoMonthRegex.test(value);\n\t\t\tcase 'time':\n\t\t\t\treturn InputDateController.isoTimeRegex.test(value);\n\t\t\tcase 'week':\n\t\t\t\treturn InputDateController.isoWeekRegex.test(value);\n\t\t\tdefault:\n\t\t\t\treturn false;\n\t\t}\n\t}\n\n\tprivate readonly validateIso8601 = (propName: string, value?: Date | Iso8601 | null, afterPatch?: (v: string) => void) => {\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || value == null || value === '' || this.validateDateString(value),\n\t\t\tnew Set(['Date', 'string{ISO-8601}']),\n\t\t\tthis.tryParseToString(value),\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t};\n\n\tprotected onChange(event: Event): void {\n\t\tsuper.onChange(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_max',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.tryParseToString(\n\t\t\t\tvalue,\n\t\t\t\tthis.component._type === 'date' || this.component._type === 'month' || this.component._type === 'datetime-local'\n\t\t\t\t\t? InputDateController.DEFAULT_MAX_DATE\n\t\t\t\t\t: undefined\n\t\t\t)\n\t\t);\n\t}\n\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_min',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.tryParseToString(value)\n\t\t);\n\t}\n\n\tpublic validateOn(value?: InputTypeOnDefault) {\n\t\tsetState(this.component, '_on', {\n\t\t\t...value,\n\t\t\tonChange: (e: Event, v: unknown) => {\n\t\t\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\t\t\tif (!!v !== !!this.component._value) {\n\t\t\t\t\tthis.component._value = v as Iso8601;\n\t\t\t\t}\n\n\t\t\t\tif (value?.onChange) {\n\t\t\t\t\tvalue.onChange(e, v);\n\t\t\t\t}\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tvalidateReadOnly(this.component, value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\tpublic validateType(value?: InputNumberType): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_type',\n\t\t\t(value): boolean =>\n\t\t\t\ttypeof value === 'string' &&\n\t\t\t\t(value === 'date' || value === 'datetime-local' || value === 'month' || value === 'number' || value === 'time' || value === 'week'),\n\t\t\tnew Set(['String {date, datetime-local, month, number, time, week}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: Iso8601 | Date | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateLabel(this.component._label);\n\t\tthis.validateSuggestions(this.component._suggestions || this.component._list);\n\t\tthis.validateOn(this.component._on);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateType(this.component._type);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\nkol-input-number {\n\tdisplay: block;\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Props as ButtonProps } from '../button/types';\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputDateType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { SuggestionsPropType } from '../../types/props/suggestions';\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputDateController } from './controller';\nimport { ComponentApi, States } from './types';\nimport { ReadOnlyPropType } from '../../types/props/read-only';\nimport { SyncValueBySelectorPropType } from '../../types/props/sync-value-by-selector';\nimport { IdPropType } from '../../types/props/id';\nimport { NamePropType } from '../../types/props/name';\nimport { TooltipAlignPropType } from '../../types/props/tooltip-align';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-date',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputDate implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputDateElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;\n\t\tconst hasExpertSlot = this.state._label === false; // _label=\"\" or _label\n\n\t\treturn (\n\t\t\t<Host class={{ 'has-value': this.state._hasValue }}>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type]: true,\n\t\t\t\t\t\t'hide-label': !!this.state._hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_suggestions={this.state._suggestions}\n\t\t\t\t\t_readOnly={this.state._readOnly}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t{/*  TODO: der folgende Slot ohne Name muss später entfernt werden */}\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tlist={hasSuggestions ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\thidden={hasExpertSlot || !this.state._hideLabel}\n\t\t\t\t\t\t\t_align={this._tooltipAlign}\n\t\t\t\t\t\t\t_label={typeof this.state._label === 'string' ? this.state._label : ''}\n\t\t\t\t\t\t></kol-tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputDateController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Tells the element to hide the label.\n\t * TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t * @deprecated Use _suggestions instead.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Eingabewert an.\n\t */\n\t@Prop() public _max?: Iso8601 | Date;\n\n\t/**\n\t * Gibt den kleinstmöglichen Eingabewert an.\n\t */\n\t@Prop() public _min?: Iso8601 | Date;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Makes the input element read only.\n\t * TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _readOnly?: boolean;\n\n\t/**\n\t * Makes the input element required.\n\t * TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Gibt die Schrittweite der Wertveränderung an.\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Setzt den Typ der Komponente oder des interaktiven Elements in der Komponente an.\n\t */\n\t@Prop() public _type: InputDateType = 'date';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true }) public _value?: Iso8601 | Date | null;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_hasValue: false,\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: false, // ⚠ required\n\t\t_suggestions: [],\n\t\t_type: 'datetime-local',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputDateController(this, 'input-date', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.validateSuggestions(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: InputDateType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tthis.controller.validateValueEx(value, (v) => {\n\t\t\tif (v === '' && this.ref) {\n\t\t\t\tthis.ref.value = '';\n\t\t\t}\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"mappings":"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"}

package/dist/kolibri/kol-input-email.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as t,H as e,r as i,g as a}from"./index-5ab2ea42.js";import{n as s}from"./dev.utils-2f404ce5.js";import{a as n,s as l}from"./prop.validators-286b41b1.js";import{a as d}from"./reuse-c2156413.js";import{p as o}from"./controller-3213f6ba.js";import{g as r}from"./controller-108aa205.js";import{I as h}from"./controller-f3db680c.js";import"./a11y.tipps-010cc7bb.js";import"./index-37b5cbcf.js";import"./label-8596593d.js";import"./associated.controller-9d8da408.js";import"./tab-index-a7766f42.js";import"./controller-dc2f0e5c.js";import"./controller-icon-e6f72083.js";import"./icon-a0bacdc8.js";import"./suggestions-3df3e5fd.js";const u=(t,e)=>{n(t,"_multiple",e)};class p extends h{constructor(t,e,i){super(t,e,i),this.component=t}validateMultiple(t){u(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",f=class{render(){const{ariaDescribedBy:i}=r(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,l=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{email:!0,"hide-label":!!this.state._hideLabel},_alert:this.state._alert,_currentLength:this.state._currentLength,_disabled:this.state._disabled,_error:this.state._error,_hasCounter:this.state._hasCounter,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_maxLength:this.state._maxLength,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,multiple:this.state._multiple,id:this.state._id,list:a?`${this.state._id}-list`:void 0,maxlength:this.state._maxLength,name:this.state._name,pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,spellcheck:"false",type:"email",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip",{"aria-hidden":"true",hidden:l||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,d(this.host,this.ref)},this.onKeyUp=t=>{l(this,"_currentLength",t.target.value.length),"Enter"===t.code?o({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hasCounter=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._maxLength=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._size=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_hasValue:!1,_id:`id-${s()}`,_label:!1,_suggestions:[]},this.controller=new p(this,"input-email",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePattern(t){this.controller.validatePattern(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSize(t){this.controller.validateSize(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hasCounter:["validateHasCounter"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_maxLength:["validateMaxLength"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_suggestions:["validateSuggestions"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};f.style={default:c};export{f as kol_input_email};
+import{h as t,H as e,r as i,g as a}from"./index-5ab2ea42.js";import{n as s}from"./dev.utils-1ee29ed1.js";import{a as n,s as l}from"./prop.validators-6cf6ed2d.js";import{a as d}from"./reuse-c2156413.js";import{p as o}from"./controller-f073ed22.js";import{g as r}from"./controller-ab167bf7.js";import{I as h}from"./controller-152cc0b9.js";import"./a11y.tipps-3dbf06fc.js";import"./index-37b5cbcf.js";import"./label-162d9b49.js";import"./associated.controller-6c7440df.js";import"./tab-index-cda3bf60.js";import"./controller-d04db4dd.js";import"./controller-icon-cfbc5bbf.js";import"./icon-a7195182.js";import"./suggestions-efa371a2.js";const u=(t,e)=>{n(t,"_multiple",e)};class p extends h{constructor(t,e,i){super(t,e,i),this.component=t}validateMultiple(t){u(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",f=class{render(){const{ariaDescribedBy:i}=r(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,l=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{email:!0,"hide-label":!!this.state._hideLabel},_alert:this.state._alert,_currentLength:this.state._currentLength,_disabled:this.state._disabled,_error:this.state._error,_hasCounter:this.state._hasCounter,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_maxLength:this.state._maxLength,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,multiple:this.state._multiple,id:this.state._id,list:a?`${this.state._id}-list`:void 0,maxlength:this.state._maxLength,name:this.state._name,pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,spellcheck:"false",type:"email",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip",{"aria-hidden":"true",hidden:l||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,d(this.host,this.ref)},this.onKeyUp=t=>{l(this,"_currentLength",t.target.value.length),"Enter"===t.code?o({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hasCounter=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._maxLength=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._size=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_hasValue:!1,_id:`id-${s()}`,_label:!1,_suggestions:[]},this.controller=new p(this,"input-email",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePattern(t){this.controller.validatePattern(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSize(t){this.controller.validateSize(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hasCounter:["validateHasCounter"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_maxLength:["validateMaxLength"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_suggestions:["validateSuggestions"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};f.style={default:c};export{f as kol_input_email};

package/dist/kolibri/kol-input-email.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["validateMultiple","component","value","watchBoolean","InputEmailController","InputTextEmailController","constructor","name","host","super","this","componentWillLoad","_multiple","defaultStyleCss","KolInputEmail","render","ariaDescribedBy","getRenderStates","state","hasSuggestions","Array","isArray","_suggestions","length","hasExpertSlot","_label","h","Host","class","_hasValue","email","_hideLabel","_alert","_currentLength","_disabled","_error","_hasCounter","_hint","_icon","_id","_maxLength","_readOnly","_required","_smartButton","_touched","onClick","_a","ref","focus","slot","Object","assign","catchRef","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoComplete","_autoComplete","autoCorrect","disabled","multiple","id","list","maxlength","_name","pattern","_pattern","placeholder","_placeholder","readOnly","required","size","_size","spellcheck","type","_value","controller","onFacade","onKeyUp","hidden","_align","_tooltipAlign","hostRef","propagateFocus","event","setState","target","code","propagateSubmitEventToForm","form","onChange","nonce","validateAccessKey","validateAlert","validateAutoComplete","validateDisabled","validateError","validateHasCounter","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateList","validateSuggestions","validateMaxLength","validateName","validateOn","validatePattern","validatePlaceholder","validateReadOnly","validateRequired","validateSize","validateSmartButton","validateSyncValueBySelector","validateTabIndex","validateTouched","validateValue","addValueChangeListener","v"],"sources":["src/types/props/multiple.ts","src/components/input-email/controller.ts","src/components/input-email/style.css?tag=kol-input-email&mode=default&encapsulation=shadow","src/components/input-email/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type MultiplePropType = boolean;\n\n/**\n * Makes the input accept multiple inputs.\n */\nexport type PropMultiple = {\n\tmultiple: MultiplePropType;\n};\n\n/* validator */\nexport const validateMultiple = (component: Generic.Element.Component, value?: MultiplePropType): void => {\n\twatchBoolean(component, '_multiple', value);\n};\n","import { Generic } from '@a11y-ui/core';\n\nimport { MultiplePropType, validateMultiple } from '../../types/props/multiple';\nimport { InputTextEmailController } from '../input-text/controller';\nimport { Props, Watches } from './types';\n\nexport class InputEmailController extends InputTextEmailController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tvalidateMultiple(this.component, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateMultiple(this.component._multiple);\n\t}\n}\n","@import url(../input-line.css);\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { AlignPropType } from '../../types/props/align';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { SuggestionsPropType } from '../../types/props/suggestions';\nimport { nonce } from '../../utils/dev.utils';\nimport { setState } from '../../utils/prop.validators';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputEmailController } from './controller';\nimport { ComponentApi, States } from './types';\nimport { MultiplePropType } from '../../types/props/multiple';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-email',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputEmail implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputEmailElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tsetState(this, '_currentLength', (event.target as HTMLInputElement).value.length);\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;\n\t\tconst hasExpertSlot = this.state._label === false; // _label=\"\" or _label\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{ email: true, 'hide-label': !!this.state._hideLabel }}\n\t\t\t\t\t_alert={this.state._alert}\n\t\t\t\t\t_currentLength={this.state._currentLength}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hasCounter={this.state._hasCounter}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_suggestions={this.state._suggestions}\n\t\t\t\t\t_maxLength={this.state._maxLength}\n\t\t\t\t\t_readOnly={this.state._readOnly}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t{/*  TODO: der folgende Slot ohne Name muss später entfernt werden */}\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tmultiple={this.state._multiple}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tlist={hasSuggestions ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\tpattern={this.state._pattern}\n\t\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tsize={this.state._size}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\ttype=\"email\"\n\t\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\thidden={hasExpertSlot || !this.state._hideLabel}\n\t\t\t\t\t\t\t_align={this._tooltipAlign}\n\t\t\t\t\t\t\t_label={typeof this.state._label === 'string' ? this.state._label : ''}\n\t\t\t\t\t\t></kol-tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputEmailController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.\n\t */\n\t@Prop() public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Aktiviert den Zeichenanzahlzähler am unteren Rand des Eingabefeldes.\n\t */\n\t@Prop() public _hasCounter?: boolean;\n\n\t/**\n\t * Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t */\n\t@Prop() public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die interne ID des primären Elements in der Komponente an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t * @deprecated Use _suggestions.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt an, wie viele Zeichen maximal eingegeben werden können.\n\t */\n\t@Prop() public _maxLength?: number;\n\n\t/**\n\t * Makes the input accept multiple inputs.\n\t */\n\t@Prop() public _multiple?: MultiplePropType;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt ein Prüfmuster (Pattern) für das Eingabefeld an.\n\t */\n\t@Prop() public _pattern?: string;\n\n\t/**\n\t * Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Setzt das Eingabefeld in den schreibgeschützten Modus.\n\t */\n\t@Prop() public _readOnly?: boolean;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop() public _required?: boolean;\n\n\t/**\n\t * Setzt die Breite des Eingabefeldes in Buchstabenbreiten.\n\t */\n\t@Prop() public _size?: number;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche in das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: string;\n\n\t/**\n\t * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: AlignPropType = 'top';\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_currentLength: 0,\n\t\t_hasValue: false,\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: false, // ⚠ required\n\t\t_suggestions: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputEmailController(this, 'input-email', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tthis.controller.validateHasCounter(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t/**\n\t * @deprecated\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.validateSuggestions(value);\n\t}\n\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @deprecated\n\t */\n\t@Watch('_size')\n\tpublic validateSize(value?: number): void {\n\t\tthis.controller.validateSize(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: string): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["validateMultiple","component","value","watchBoolean","InputEmailController","InputTextEmailController","constructor","name","host","super","this","componentWillLoad","_multiple","defaultStyleCss","KolInputEmail","render","ariaDescribedBy","getRenderStates","state","hasSuggestions","Array","isArray","_suggestions","length","hasExpertSlot","_label","h","Host","class","_hasValue","email","_hideLabel","_alert","_currentLength","_disabled","_error","_hasCounter","_hint","_icon","_id","_maxLength","_readOnly","_required","_smartButton","_touched","onClick","_a","ref","focus","slot","Object","assign","catchRef","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoComplete","_autoComplete","autoCorrect","disabled","multiple","id","list","maxlength","_name","pattern","_pattern","placeholder","_placeholder","readOnly","required","size","_size","spellcheck","type","_value","controller","onFacade","onKeyUp","hidden","_align","_tooltipAlign","hostRef","propagateFocus","event","setState","target","code","propagateSubmitEventToForm","form","onChange","nonce","validateAccessKey","validateAlert","validateAutoComplete","validateDisabled","validateError","validateHasCounter","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateList","validateSuggestions","validateMaxLength","validateName","validateOn","validatePattern","validatePlaceholder","validateReadOnly","validateRequired","validateSize","validateSmartButton","validateSyncValueBySelector","validateTabIndex","validateTouched","validateValue","addValueChangeListener","v"],"sources":["src/types/props/multiple.ts","src/components/input-email/controller.ts","src/components/input-email/style.css?tag=kol-input-email&mode=default&encapsulation=shadow","src/components/input-email/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type MultiplePropType = boolean;\n\n/**\n * Makes the input accept multiple inputs.\n */\nexport type PropMultiple = {\n\tmultiple: MultiplePropType;\n};\n\n/* validator */\nexport const validateMultiple = (component: Generic.Element.Component, value?: MultiplePropType): void => {\n\twatchBoolean(component, '_multiple', value);\n};\n","import { Generic } from '@a11y-ui/core';\n\nimport { MultiplePropType, validateMultiple } from '../../types/props/multiple';\nimport { InputTextEmailController } from '../input-text/controller';\nimport { Props, Watches } from './types';\n\nexport class InputEmailController extends InputTextEmailController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tvalidateMultiple(this.component, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateMultiple(this.component._multiple);\n\t}\n}\n","@import url(../input-line.css);\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Props as ButtonProps } from '../button/types';\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { SuggestionsPropType } from '../../types/props/suggestions';\nimport { nonce } from '../../utils/dev.utils';\nimport { setState } from '../../utils/prop.validators';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputEmailController } from './controller';\nimport { API, States } from './types';\nimport { MultiplePropType } from '../../types/props/multiple';\nimport { SyncValueBySelectorPropType } from '../../types/props/sync-value-by-selector';\nimport { IdPropType } from '../../types/props/id';\nimport { NamePropType } from '../../types/props/name';\nimport { TooltipAlignPropType } from '../../types/props/tooltip-align';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-email',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputEmail implements API {\n\t@Element() private readonly host?: HTMLKolInputEmailElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tsetState(this, '_currentLength', (event.target as HTMLInputElement).value.length);\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;\n\t\tconst hasExpertSlot = this.state._label === false; // _label=\"\" or _label\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{ email: true, 'hide-label': !!this.state._hideLabel }}\n\t\t\t\t\t_alert={this.state._alert}\n\t\t\t\t\t_currentLength={this.state._currentLength}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hasCounter={this.state._hasCounter}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_suggestions={this.state._suggestions}\n\t\t\t\t\t_maxLength={this.state._maxLength}\n\t\t\t\t\t_readOnly={this.state._readOnly}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t{/*  TODO: der folgende Slot ohne Name muss später entfernt werden */}\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tmultiple={this.state._multiple}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tlist={hasSuggestions ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\tpattern={this.state._pattern}\n\t\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tsize={this.state._size}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\ttype=\"email\"\n\t\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\thidden={hasExpertSlot || !this.state._hideLabel}\n\t\t\t\t\t\t\t_align={this._tooltipAlign}\n\t\t\t\t\t\t\t_label={typeof this.state._label === 'string' ? this.state._label : ''}\n\t\t\t\t\t\t></kol-tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputEmailController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Shows the character count on the lower border of the input.s\n\t * TODO: Change type back to `HasCounterPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _hasCounter?: boolean;\n\n\t/**\n\t * Tells the element to hide the label.\n\t * TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t * @deprecated Use _suggestions.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt an, wie viele Zeichen maximal eingegeben werden können.\n\t */\n\t@Prop() public _maxLength?: number;\n\n\t/**\n\t * Makes the input accept multiple inputs.\n\t * TODO: Change type back to `MultiplePropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _multiple?: boolean;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt ein Prüfmuster (Pattern) für das Eingabefeld an.\n\t */\n\t@Prop() public _pattern?: string;\n\n\t/**\n\t * Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Makes the input element read only.\n\t * TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _readOnly?: boolean;\n\n\t/**\n\t * Makes the input element required.\n\t * TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _required?: boolean;\n\n\t/**\n\t * Setzt die Breite des Eingabefeldes in Buchstabenbreiten.\n\t */\n\t@Prop() public _size?: number;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche in das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_currentLength: 0,\n\t\t_hasValue: false,\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: false, // ⚠ required\n\t\t_suggestions: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputEmailController(this, 'input-email', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tthis.controller.validateHasCounter(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t/**\n\t * @deprecated\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.validateSuggestions(value);\n\t}\n\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @deprecated\n\t */\n\t@Watch('_size')\n\tpublic validateSize(value?: number): void {\n\t\tthis.controller.validateSize(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"mappings":"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"}

package/dist/kolibri/kol-input-file.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as t,H as i,r as e,g as a}from"./index-5ab2ea42.js";import{n as s}from"./dev.utils-2f404ce5.js";import{s as n,t as l}from"./associated.controller-9d8da408.js";import{a as o}from"./reuse-c2156413.js";import{g as d}from"./controller-108aa205.js";import{d as r,a as h}from"./prop.validators-286b41b1.js";import{I as p}from"./controller-icon-e6f72083.js";import"./a11y.tipps-010cc7bb.js";import"./label-8596593d.js";import"./tab-index-a7766f42.js";import"./index-37b5cbcf.js";import"./icon-a0bacdc8.js";class u extends p{constructor(t,e,i){super(t,e,i),this.component=t}validateAccept(t){r(this.component,"_accept",t)}validateMultiple(t){h(this.component,"_multiple",t)}validateRequired(t){h(this.component,"_required",t)}validateValue(t){r(this.component,"_value",t),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateValue(this.component._value)}}const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}label input[type='file']::-webkit-file-upload-button{display:none}label input[type='file']:before{content:'Datei auswählen'}label input[multiple]:before{content:'Dateien auswählen'}div.input{cursor:pointer}",f=class{render(){const{ariaDescribedBy:e}=d(this.state),a=!1===this.state._label;return t(i,null,t("kol-input",{class:{file:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},a?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accept:this.state._accept,accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,spellcheck:"false",type:"file",value:this.state._value},this.controller.onFacade,{onChange:this.onChange})),t("kol-tooltip",{"aria-hidden":"true",hidden:a||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){e(this,t),this.catchRef=t=>{this.ref=t,o(this.host,this.ref)},this.onChange=t=>{var e;if(this.ref instanceof HTMLInputElement&&"file"===this.ref.type){const i=this.ref.files;n(t),l("change",this.host,i),this.controller.setFormAssociatedValue(i),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onChange)&&this.state._on.onChange(t,i)}},this._accept=void 0,this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_id:`id-${s()}`,_label:!1},this.controller=new u(this,"input-file",this.host)}validateAccept(t){this.controller.validateAccept(t)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return a(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};f.style={default:c};export{f as kol_input_file};
+import{h as t,H as e,r as i,g as a}from"./index-5ab2ea42.js";import{n as s}from"./dev.utils-1ee29ed1.js";import{s as n,t as l}from"./associated.controller-6c7440df.js";import{a as o}from"./reuse-c2156413.js";import{g as d}from"./controller-ab167bf7.js";import{d as r,a as h}from"./prop.validators-6cf6ed2d.js";import{I as p}from"./controller-icon-cfbc5bbf.js";import"./a11y.tipps-3dbf06fc.js";import"./label-162d9b49.js";import"./tab-index-cda3bf60.js";import"./index-37b5cbcf.js";import"./icon-a7195182.js";class u extends p{constructor(t,e,i){super(t,e,i),this.component=t}validateAccept(t){r(this.component,"_accept",t)}validateMultiple(t){h(this.component,"_multiple",t)}validateRequired(t){h(this.component,"_required",t)}validateValue(t){r(this.component,"_value",t),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateValue(this.component._value)}}const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}label input[type='file']::-webkit-file-upload-button{display:none}label input[type='file']:before{content:'Datei auswählen'}label input[multiple]:before{content:'Dateien auswählen'}div.input{cursor:pointer}",f=class{render(){const{ariaDescribedBy:i}=d(this.state),a=!1===this.state._label;return t(e,null,t("kol-input",{class:{file:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},a?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accept:this.state._accept,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,spellcheck:"false",type:"file",value:this.state._value},this.controller.onFacade,{onChange:this.onChange})),t("kol-tooltip",{"aria-hidden":"true",hidden:a||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,o(this.host,this.ref)},this.onChange=t=>{var e;if(this.ref instanceof HTMLInputElement&&"file"===this.ref.type){const i=this.ref.files;n(t),l("change",this.host,i),this.controller.setFormAssociatedValue(i),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onChange)&&this.state._on.onChange(t,i)}},this._accept=void 0,this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_id:`id-${s()}`,_label:!1},this.controller=new u(this,"input-file",this.host)}validateAccept(t){this.controller.validateAccept(t)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return a(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};f.style={default:c};export{f as kol_input_file};

package/dist/kolibri/kol-input-file.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["InputFileController","InputIconController","constructor","component","name","host","super","this","validateAccept","value","watchString","validateMultiple","watchBoolean","validateRequired","validateValue","setFormAssociatedValue","_value","componentWillLoad","_accept","_multiple","_required","defaultStyleCss","KolInputFile","render","ariaDescribedBy","getRenderStates","state","hasExpertSlot","_label","h","Host","class","file","_hideLabel","_disabled","_error","_hint","_icon","_id","_smartButton","_touched","onClick","_a","ref","focus","slot","Object","assign","catchRef","title","accept","accessKey","_accessKey","length","join","undefined","autoCapitalize","autoCorrect","disabled","id","multiple","_name","required","spellcheck","type","controller","onFacade","onChange","hidden","_align","_tooltipAlign","hostRef","propagateFocus","event","HTMLInputElement","files","stopPropagation","tryToDispatchKoliBriEvent","_on","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateName","validateOn","validateSmartButton","validateSyncValueBySelector","validateTabIndex","validateTouched","_alert"],"sources":["src/components/input-file/controller.ts","src/components/input-file/style.css?tag=kol-input-file&mode=default&encapsulation=shadow","src/components/input-file/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputFileController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAccept(value?: string): void {\n\t\twatchString(this.component, '_accept', value);\n\t}\n\n\tpublic validateMultiple(value?: boolean): void {\n\t\twatchBoolean(this.component, '_multiple', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t\tthis.setFormAssociatedValue(this.component._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAccept(this.component._accept);\n\t\tthis.validateMultiple(this.component._multiple);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\nlabel input[type='file']::-webkit-file-upload-button {\n\tdisplay: none;\n}\nlabel input[type='file']:before {\n\tcontent: 'Datei auswählen';\n}\nlabel input[multiple]:before {\n\tcontent: 'Dateien auswählen';\n}\ndiv.input {\n\tcursor: pointer;\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputTypeOnDefault } from '../../types/input/types';\nimport { AlignPropType } from '../../types/props/align';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { nonce } from '../../utils/dev.utils';\nimport { stopPropagation, tryToDispatchKoliBriEvent } from '../../utils/events';\nimport { propagateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputFileController } from './controller';\nimport { ComponentApi, States } from './types';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-file',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputFile implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputFileElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasExpertSlot = this.state._label === false; // _label=\"\" or _label\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tfile: true,\n\t\t\t\t\t\t'hide-label': !!this.state._hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t{/*  TODO: der folgende Slot ohne Name muss später entfernt werden */}\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccept={this.state._accept}\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tmultiple={this.state._multiple}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\ttype=\"file\"\n\t\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\thidden={hasExpertSlot || !this.state._hideLabel}\n\t\t\t\t\t\t\t_align={this._tooltipAlign}\n\t\t\t\t\t\t\t_label={typeof this.state._label === 'string' ? this.state._label : ''}\n\t\t\t\t\t\t></kol-tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputFileController;\n\n\t/**\n\t * Gibt an, welche Dateiformate erlaubt sind.\n\t */\n\t@Prop() public _accept?: string;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.\n\t */\n\t@Prop() public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t */\n\t@Prop() public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die interne ID des primären Elements in der Komponente an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Gibt an, ob mehrere Werte eingegeben werden können.\n\t */\n\t@Prop() public _multiple?: boolean;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop() public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: string;\n\n\t/**\n\t * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: AlignPropType = 'top';\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t@State() public state: States = {\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: false, // ⚠ required\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputFileController(this, 'input-file', this.host);\n\t}\n\n\t@Watch('_accept')\n\tpublic validateAccept(value?: string): void {\n\t\tthis.controller.validateAccept(value);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: boolean): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: string): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tif (this.ref instanceof HTMLInputElement && this.ref.type === 'file') {\n\t\t\tconst value = this.ref.files;\n\n\t\t\t// Event handling\n\t\t\tstopPropagation(event);\n\t\t\ttryToDispatchKoliBriEvent('change', this.host, value);\n\n\t\t\t// Static form handling\n\t\t\tthis.controller.setFormAssociatedValue(value);\n\n\t\t\t// Callback\n\t\t\tif (typeof this.state._on?.onChange === 'function') {\n\t\t\t\tthis.state._on.onChange(event, value);\n\t\t\t}\n\t\t}\n\t};\n}\n"],"mappings":"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"}
+{"version":3,"names":["InputFileController","InputIconController","constructor","component","name","host","super","this","validateAccept","value","watchString","validateMultiple","watchBoolean","validateRequired","validateValue","setFormAssociatedValue","_value","componentWillLoad","_accept","_multiple","_required","defaultStyleCss","KolInputFile","render","ariaDescribedBy","getRenderStates","state","hasExpertSlot","_label","h","Host","class","file","_hideLabel","_disabled","_error","_hint","_icon","_id","_smartButton","_touched","onClick","_a","ref","focus","slot","Object","assign","catchRef","title","accept","accessKey","_accessKey","length","join","undefined","autoCapitalize","autoCorrect","disabled","id","multiple","_name","required","spellcheck","type","controller","onFacade","onChange","hidden","_align","_tooltipAlign","hostRef","propagateFocus","event","HTMLInputElement","files","stopPropagation","tryToDispatchKoliBriEvent","_on","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateName","validateOn","validateSmartButton","validateSyncValueBySelector","validateTabIndex","validateTouched","_alert"],"sources":["src/components/input-file/controller.ts","src/components/input-file/style.css?tag=kol-input-file&mode=default&encapsulation=shadow","src/components/input-file/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputFileController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAccept(value?: string): void {\n\t\twatchString(this.component, '_accept', value);\n\t}\n\n\tpublic validateMultiple(value?: boolean): void {\n\t\twatchBoolean(this.component, '_multiple', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t\tthis.setFormAssociatedValue(this.component._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAccept(this.component._accept);\n\t\tthis.validateMultiple(this.component._multiple);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\nlabel input[type='file']::-webkit-file-upload-button {\n\tdisplay: none;\n}\nlabel input[type='file']:before {\n\tcontent: 'Datei auswählen';\n}\nlabel input[multiple]:before {\n\tcontent: 'Dateien auswählen';\n}\ndiv.input {\n\tcursor: pointer;\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Props as ButtonProps } from '../button/types';\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputTypeOnDefault } from '../../types/input/types';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { nonce } from '../../utils/dev.utils';\nimport { stopPropagation, tryToDispatchKoliBriEvent } from '../../utils/events';\nimport { propagateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputFileController } from './controller';\nimport { API, States } from './types';\nimport { SyncValueBySelectorPropType } from '../../types/props/sync-value-by-selector';\nimport { TooltipAlignPropType } from '../../types/props/tooltip-align';\nimport { IdPropType } from '../../types/props/id';\nimport { NamePropType } from '../../types/props/name';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-file',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputFile implements API {\n\t@Element() private readonly host?: HTMLKolInputFileElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasExpertSlot = this.state._label === false; // _label=\"\" or _label\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tfile: true,\n\t\t\t\t\t\t'hide-label': !!this.state._hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t{/*  TODO: der folgende Slot ohne Name muss später entfernt werden */}\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccept={this.state._accept}\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tmultiple={this.state._multiple}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\ttype=\"file\"\n\t\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\thidden={hasExpertSlot || !this.state._hideLabel}\n\t\t\t\t\t\t\t_align={this._tooltipAlign}\n\t\t\t\t\t\t\t_label={typeof this.state._label === 'string' ? this.state._label : ''}\n\t\t\t\t\t\t></kol-tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputFileController;\n\n\t/**\n\t * Gibt an, welche Dateiformate erlaubt sind.\n\t */\n\t@Prop() public _accept?: string;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Tells the element to hide the label.\n\t * TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Makes the input accept multiple inputs.\n\t * TODO: Change type back to `MultiplePropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _multiple?: boolean;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Makes the input element required.\n\t * TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop() public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t@State() public state: States = {\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: false, // ⚠ required\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputFileController(this, 'input-file', this.host);\n\t}\n\n\t@Watch('_accept')\n\tpublic validateAccept(value?: string): void {\n\t\tthis.controller.validateAccept(value);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: boolean): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tif (this.ref instanceof HTMLInputElement && this.ref.type === 'file') {\n\t\t\tconst value = this.ref.files;\n\n\t\t\t// Event handling\n\t\t\tstopPropagation(event);\n\t\t\ttryToDispatchKoliBriEvent('change', this.host, value);\n\n\t\t\t// Static form handling\n\t\t\tthis.controller.setFormAssociatedValue(value);\n\n\t\t\t// Callback\n\t\t\tif (typeof this.state._on?.onChange === 'function') {\n\t\t\t\tthis.state._on.onChange(event, value);\n\t\t\t}\n\t\t}\n\t};\n}\n"],"mappings":"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"}

package/dist/kolibri/kol-input-number.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as t,H as e,r as i,g as s}from"./index-5ab2ea42.js";import{n as a}from"./dev.utils-2f404ce5.js";import{a as n}from"./reuse-c2156413.js";import{p as l}from"./controller-3213f6ba.js";import{g as d}from"./controller-108aa205.js";import{v as o}from"./suggestions-3df3e5fd.js";import{w as h,d as r,a as p,e as u}from"./prop.validators-286b41b1.js";import{I as c}from"./controller-icon-e6f72083.js";import"./a11y.tipps-010cc7bb.js";import"./label-8596593d.js";import"./associated.controller-9d8da408.js";import"./tab-index-a7766f42.js";import"./index-37b5cbcf.js";import"./icon-a0bacdc8.js";class f extends c{constructor(t,e,i){super(t,e,i),this.numberOrIsoDateRegex=/^\d+$|(^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])([T ][0-2]\d:[0-5]\d:[0-5]\d(?:\.\d+)?([+-][0-2]\d:[0-5]\d|Z)?)?$)|(^[0-2]\d:[0-5]\d(:[0-5]\d)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e,i)=>{const a=parseFloat(e),s=a==e;return h(this.component,t,(t=>void 0===t||""===t||s&&"number"==typeof a||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&i&&i(t)}}})},this.component=t}validateAutoComplete(t){h(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(){}validateSuggestions(t){o(this.component,t)}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){r(this.component,"_placeholder",t)}validateReadOnly(t){p(this.component,"_readOnly",t)}validateRequired(t){p(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){h(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateSuggestions(this.component._suggestions||this.component._list),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}const m=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",y=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,s=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},s?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,placeholder:this.state._placeholder,step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip",{"aria-hidden":"true",hidden:s||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?l({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._suggestions=void 0,this._step=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:`id-${a()}`,_label:!1,_suggestions:[],_type:"number"},this.controller=new f(this,"input-number",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateStep(t){this.controller.validateStep(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return s(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_step:["validateStep"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};y.style={default:m};export{y as kol_input_number};
+import{h as t,H as e,r as i,g as s}from"./index-5ab2ea42.js";import{n as a}from"./dev.utils-1ee29ed1.js";import{a as n}from"./reuse-c2156413.js";import{p as l}from"./controller-f073ed22.js";import{g as d}from"./controller-ab167bf7.js";import{v as o}from"./suggestions-efa371a2.js";import{w as h,d as r,a as p,e as u}from"./prop.validators-6cf6ed2d.js";import{I as c}from"./controller-icon-cfbc5bbf.js";import"./a11y.tipps-3dbf06fc.js";import"./label-162d9b49.js";import"./associated.controller-6c7440df.js";import"./tab-index-cda3bf60.js";import"./index-37b5cbcf.js";import"./icon-a7195182.js";class f extends c{constructor(t,e,i){super(t,e,i),this.numberOrIsoDateRegex=/^\d+$|(^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])([T ][0-2]\d:[0-5]\d:[0-5]\d(?:\.\d+)?([+-][0-2]\d:[0-5]\d|Z)?)?$)|(^[0-2]\d:[0-5]\d(:[0-5]\d)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e,i)=>{const a=parseFloat(e),s=a==e;return h(this.component,t,(t=>void 0===t||""===t||s&&"number"==typeof a||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&i&&i(t)}}})},this.component=t}validateAutoComplete(t){h(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(){}validateSuggestions(t){o(this.component,t)}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){r(this.component,"_placeholder",t)}validateReadOnly(t){p(this.component,"_readOnly",t)}validateRequired(t){p(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){h(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateSuggestions(this.component._suggestions||this.component._list),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}const m=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",y=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,s=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},s?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,placeholder:this.state._placeholder,step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip",{"aria-hidden":"true",hidden:s||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?l({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._suggestions=void 0,this._step=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:`id-${a()}`,_label:!1,_suggestions:[],_type:"number"},this.controller=new f(this,"input-number",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateStep(t){this.controller.validateStep(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return s(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_step:["validateStep"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};y.style={default:m};export{y as kol_input_number};