@public-ui/components 1.3.3-rc.2 → 1.4.0-rc.0

package/dist/kolibri/kol-input-number.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-0dce65d2.js";import{p as s}from"./reuse-2f7da8fc.js";import{p as d}from"./controller-542bf2a8.js";import{I as n,g as l}from"./controller-5c3674df.js";import{a as h,c as r,w as o,b as u,d as p}from"./prop.validators-59bc26b2.js";import"./validator-2e4f8df6.js";import"./a11y.tipps-ff5a1a99.js";import"./dev.utils-daaf2f39.js";import"./tab-index-818b2a80.js";import"./index-b76497e7.js";import"./index.m-86dc8c44.js";class c extends n{constructor(t,e,a){super(t,e,a),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)?)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e)=>{const a=parseFloat(e),i=a==e;return h(this.component,t,(t=>void 0===t||i&&"number"==typeof a||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e))},this.component=t}validateAutoComplete(t){h(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){r(this.component,"_list",(t=>"string"==typeof t),t)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){o(this.component,"_placeholder",t)}validateReadOnly(t){u(this.component,"_readOnly",t)}validateRequired(t){u(this.component,"_required",t)}validateStep(t){p(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.validateIso8601("_value",t)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateList(this.component._list),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 f="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",v=class{render(){const{ariaDiscribedBy:e}=l(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0;return t(i,null,t("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched}," ",t("span",{slot:"label"},t("slot",null)),t("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,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,slot:"input",step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){e(this,t),this.catchRef=t=>{this.ref=t,s(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._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._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_id:"⚠",_list:[],_type:"number"},this.controller=new c(this,"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)}validateList(t){this.controller.validateList(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)}validateStep(t){this.controller.validateStep(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(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{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};v.style={default:f};export{v as kol_input_number};
+import{h as t,H as e,r as i,g as a}from"./index-0dce65d2.js";import{p as s}from"./reuse-2f7da8fc.js";import{p as d}from"./controller-eecee40f.js";import{g as n}from"./controller-7adb5f0e.js";import{a as l,c as h,w as r,b as o,d as u}from"./prop.validators-0ce5851c.js";import{I as p}from"./controller-icon-c113ba17.js";import"./validator-2e4f8df6.js";import"./a11y.tipps-ff5a1a99.js";import"./dev.utils-daaf2f39.js";import"./tab-index-e15e7adc.js";import"./index-2eac13ad.js";import"./index.m-86dc8c44.js";import"./icon-22dfdb71.js";class c extends p{constructor(t,e,a){super(t,e,a),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)?)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e)=>{const a=parseFloat(e),i=a==e;return l(this.component,t,(t=>void 0===t||i&&"number"==typeof a||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e))},this.component=t}validateAutoComplete(t){l(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){h(this.component,"_list",(t=>"string"==typeof t),t)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){r(this.component,"_placeholder",t)}validateReadOnly(t){o(this.component,"_readOnly",t)}validateRequired(t){o(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){l(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.validateIso8601("_value",t)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateList(this.component._list),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 f="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",m=class{render(){const{ariaDiscribedBy:a}=n(this.state),i=Array.isArray(this.state._list)&&this.state._list.length>0;return t(e,null,t("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched}," ",t("span",{slot:"label"},t("slot",null)),t("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":a.length>0?a.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:i?`${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,slot:"input",step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,s(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._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._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_id:"⚠",_list:[],_type:"number"},this.controller=new c(this,"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)}validateList(t){this.controller.validateList(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)}validateStep(t){this.controller.validateStep(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(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{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};m.style={default:f};export{m as kol_input_number};

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

@@ -1 +1 @@
-{"version":3,"names":["InputNumberController","InputController","constructor","component","name","host","super","this","numberOrIsoDateRegex","parseToString","value","Date","toISOString","validateIso8601","propName","parsedValue","parseFloat","valueMatched","watchValidator","undefined","test","Set","validateAutoComplete","validateList","watchJsonArrayString","item","validateMax","validateMin","validatePlaceholder","watchString","validateReadOnly","watchBoolean","validateRequired","validateStep","watchNumber","validateType","validateValue","componentWillLoad","_autoComplete","_max","_min","_list","_readOnly","_required","_step","_type","_value","defaultStyleCss","KolInputNumber","render","ariaDiscribedBy","getRenderStates","state","hasList","Array","isArray","length","h","Host","_disabled","_error","_hideLabel","_hint","_icon","_id","_smartButton","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","join","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","readOnly","required","placeholder","_placeholder","step","spellcheck","type","controller","onFacade","onKeyUp","hostRef","propergateFocus","event","code","propergateSubmitEventToForm","form","onChange","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateName","validateOn","validateSmartButton","validateTabIndex","validateTouched","_alert"],"sources":["./src/components/input-number/controller.ts","./src/components/style.sass?tag=kol-input-number&mode=default&encapsulation=shadow","./src/components/input-number/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { watchBoolean, watchJsonArrayString, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputController } from '../@deprecated/input/controller';\nimport { Props, Watches } from './types';\n\nexport class InputNumberController extends InputController implements Watches {\n\t/**\n\t * Regex to check whether a string is a number or a date in ISO-8601 format.\n\t * Test the regex here: https://regex101.com/r/nFDzrD/1\n\t */\n\tprivate readonly 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)?)?$)/;\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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\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 * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\tprivate readonly parseToString = (value?: number | Date | string) => {\n\t\tif (typeof value === 'string') {\n\t\t\treturn value;\n\t\t}\n\t\tif (typeof value === 'number') {\n\t\t\treturn `${value}`;\n\t\t}\n\t\tif (typeof value === 'object' && value instanceof Date) {\n\t\t\treturn value.toISOString();\n\t\t}\n\t\treturn '';\n\t};\n\n\tprivate readonly validateIso8601 = (propName: string, value?: number | Iso8601) => {\n\t\tconst parsedValue = parseFloat(value as string);\n\t\tconst valueMatched = parsedValue == value;\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || (valueMatched && typeof parsedValue === 'number') || this.numberOrIsoDateRegex.test(value),\n\t\t\tnew Set(['number', 'Date', 'string{ISO-8601}']),\n\t\t\tthis.parseToString(value)\n\t\t);\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_max', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_value', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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.validateList(this.component._list);\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","@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { propergateSubmitEventToForm } from '../form/controller';\nimport { KoliBriInputIcon } from '../input-text/types';\nimport { getRenderStates } from '../input/controller';\nimport { InputNumberController } from './controller';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-number',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputNumber implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputNumberElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropergateSubmitEventToForm({\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 { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\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_list={this.state._list}\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{' '}\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputNumberController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriInputIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _max?: number | Iso8601;\n\n\t/**\n\t * Gibt den kleinstmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _min?: number | Iso8601;\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 den Platzhalter des Eingabefeldes an, wenn es leer ist.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\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 dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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 an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist.\n\t *\n\t * @deprecated Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.\n\t */\n\t@Prop() public _type?: InputNumberType = 'number';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: number | Iso8601;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t\t_list: [],\n\n\t\t_type: 'number',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputNumberController(this, 'number', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriInputIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_min')\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputNumberType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: number | Iso8601): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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"],"mappings":";;;qdASaA,UAA8BC,EAS1CC,YAAmBC,EAA8CC,EAAcC,GAC9EC,MAAMH,EAAWC,EAAMC,GALPE,KAAAC,qBAAuB,iHA6BvBD,KAAAE,cAAiBC,IACjC,UAAWA,IAAU,SAAU,CAC9B,OAAOA,C,CAER,UAAWA,IAAU,SAAU,CAC9B,MAAO,GAAGA,G,CAEX,UAAWA,IAAU,UAAYA,aAAiBC,KAAM,CACvD,OAAOD,EAAME,a,CAEd,MAAO,EAAE,EAGOL,KAAAM,gBAAkB,CAACC,EAAkBJ,KACrD,MAAMK,EAAcC,WAAWN,GAC/B,MAAMO,EAAeF,GAAeL,EACpC,OAAOQ,EACNX,KAAKJ,UACLW,GACCJ,GAAmBA,IAAUS,WAAcF,UAAuBF,IAAgB,UAAaR,KAAKC,qBAAqBY,KAAKV,IAC/H,IAAIW,IAAI,CAAC,SAAU,OAAQ,qBAC3Bd,KAAKE,cAAcC,GACnB,EA7CDH,KAAKJ,UAAYA,C,CAMXmB,qBAAqBZ,GAC3BQ,EACCX,KAAKJ,UACL,iBACCO,UAA0BA,IAAU,WAAaA,IAAU,MAAQA,IAAU,QAC9E,IAAIW,IAAI,CAAC,aACTX,E,CAOKa,aAAab,GACnBc,EAAqBjB,KAAKJ,UAAW,SAAUsB,UAAwBA,IAAS,UAAUf,E,CA+BpFgB,YAAYhB,GAClBH,KAAKM,gBAAgB,OAAQH,E,CAMvBiB,YAAYjB,GAClBH,KAAKM,gBAAgB,OAAQH,E,CAMvBkB,oBAAoBlB,GAC1BmB,EAAYtB,KAAKJ,UAAW,eAAgBO,E,CAMtCoB,iBAAiBpB,GACvBqB,EAAaxB,KAAKJ,UAAW,YAAaO,E,CAMpCsB,iBAAiBtB,GACvBqB,EAAaxB,KAAKJ,UAAW,YAAaO,E,CAMpCuB,aAAavB,GACnBwB,EAAY3B,KAAKJ,UAAW,QAASO,E,CAO/ByB,aAAazB,GACnBQ,EACCX,KAAKJ,UACL,SACCO,UACOA,IAAU,WAChBA,IAAU,QAAUA,IAAU,kBAAoBA,IAAU,SAAWA,IAAU,UAAYA,IAAU,QAAUA,IAAU,SAC7H,IAAIW,IAAI,CAAC,6DACTX,E,CAOK0B,cAAc1B,GACpBH,KAAKM,gBAAgB,SAAUH,E,CAMzB2B,oBACN/B,MAAM+B,oBACN9B,KAAKe,qBAAqBf,KAAKJ,UAAUmC,eACzC/B,KAAKmB,YAAYnB,KAAKJ,UAAUoC,MAChChC,KAAKoB,YAAYpB,KAAKJ,UAAUqC,MAChCjC,KAAKgB,aAAahB,KAAKJ,UAAUsC,OACjClC,KAAKuB,iBAAiBvB,KAAKJ,UAAUuC,WACrCnC,KAAKyB,iBAAiBzB,KAAKJ,UAAUwC,WACrCpC,KAAK0B,aAAa1B,KAAKJ,UAAUyC,OACjCrC,KAAK4B,aAAa5B,KAAKJ,UAAU0C,OACjCtC,KAAK6B,cAAc7B,KAAKJ,UAAU2C,O,EClJpC,MAAMC,EAAkB,ge,MCoBXC,EAAc,MAoBnBC,SACN,MAAMC,gBAAEA,GAAoBC,EAAgB5C,KAAK6C,OACjD,MAAMC,EAAUC,MAAMC,QAAQhD,KAAK6C,MAAMX,QAAUlC,KAAK6C,MAAMX,MAAMe,OAAS,EAC7E,OACCC,EAACC,EAAI,KACJD,EAAA,aACCE,UAAWpD,KAAK6C,MAAMO,UACtBC,OAAQrD,KAAK6C,MAAMQ,OACnBC,WAAYtD,KAAK6C,MAAMS,WACvBC,MAAOvD,KAAK6C,MAAMU,MAClBC,MAAOxD,KAAK6C,MAAMW,MAClBC,IAAKzD,KAAK6C,MAAMY,IAChBvB,MAAOlC,KAAK6C,MAAMX,MAClBC,UAAWnC,KAAK6C,MAAMV,UACtBC,UAAWpC,KAAK6C,MAAMT,UACtBsB,aAAc1D,KAAK6C,MAAMa,aACzBC,SAAU3D,KAAK6C,MAAMc,UAEpB,IACDT,EAAA,QAAMU,KAAK,SACVV,EAAA,cAEDA,EAAA,QAAAW,OAAAC,OAAA,CACCC,IAAK/D,KAAKgE,SACVC,KAAK,QACLC,MAAM,GACNC,UAAWnE,KAAK6C,MAAMuB,WAAU,mBACdzB,EAAgBM,OAAS,EAAIN,EAAgB0B,KAAK,KAAOzD,UAAS,kBACnE,GAAGZ,KAAK6C,MAAMY,YAC/Ba,eAAe,MACfC,aAAcvE,KAAK6C,MAAMd,cACzByC,YAAY,MACZC,SAAUzE,KAAK6C,MAAMO,UACrBsB,GAAI1E,KAAK6C,MAAMY,IACfkB,KAAM7B,EAAU,GAAG9C,KAAK6C,MAAMY,WAAa7C,UAC3CgE,IAAK5E,KAAK6C,MAAMb,KAChB6C,IAAK7E,KAAK6C,MAAMZ,KAChBpC,KAAMG,KAAK6C,MAAMiC,MACjBC,SAAU/E,KAAK6C,MAAMV,UACrB6C,SAAUhF,KAAK6C,MAAMT,UACrB6C,YAAajF,KAAK6C,MAAMqC,aACxBtB,KAAK,QACLuB,KAAMnF,KAAK6C,MAAMR,MACjB+C,WAAW,QACXC,KAAMrF,KAAK6C,MAAMP,MACjBnC,MAAOH,KAAK6C,MAAMN,QACdvC,KAAKsF,WAAWC,SAAQ,CAC5BC,QAASxF,KAAKwF,Y,CAyInB7F,YAAA8F,G,UAxMiBzF,KAAAgE,SAAYD,IAC5B/D,KAAK+D,IAAMA,EACX2B,EAAgB1F,KAAKF,KAAME,KAAK+D,IAAI,EAGpB/D,KAAAwF,QAAWG,IAC3B,GAAIA,EAAMC,OAAS,QAAS,CAC3BC,EAA4B,CAC3BC,KAAM9F,KAAKF,KACXiE,IAAK/D,KAAK+D,K,KAEL,CACN/D,KAAKsF,WAAWC,SAASQ,SAASJ,E,yCAoE8B,K,iHAyBlC,G,mTAsEoC,M,WAO3B,S,iCAUT,CAC/B5D,cAAe,MACf0B,IAAK,IACLvB,MAAO,GAEPI,MAAO,UAIPtC,KAAKsF,WAAa,IAAI7F,EAAsBO,KAAM,SAAUA,KAAKF,K,CAO3DkG,kBAAkB7F,GACxBH,KAAKsF,WAAWU,kBAAkB7F,E,CAO5B8F,cAAc9F,GACpBH,KAAKsF,WAAWW,cAAc9F,E,CAOxBY,qBAAqBZ,GAC3BH,KAAKsF,WAAWvE,qBAAqBZ,E,CAO/B+F,iBAAiB/F,GACvBH,KAAKsF,WAAWY,iBAAiB/F,E,CAO3BgG,cAAchG,GACpBH,KAAKsF,WAAWa,cAAchG,E,CAOxBiG,kBAAkBjG,GACxBH,KAAKsF,WAAWc,kBAAkBjG,E,CAO5BkG,aAAalG,GACnBH,KAAKsF,WAAWe,aAAalG,E,CAOvBmG,aAAanG,GACnBH,KAAKsF,WAAWgB,aAAanG,E,CAOvBoG,WAAWpG,GACjBH,KAAKsF,WAAWiB,WAAWpG,E,CAOrBa,aAAab,GACnBH,KAAKsF,WAAWtE,aAAab,E,CAOvBgB,YAAYhB,GAClBH,KAAKsF,WAAWnE,YAAYhB,E,CAOtBiB,YAAYjB,GAClBH,KAAKsF,WAAWlE,YAAYjB,E,CAOtBqG,aAAarG,GACnBH,KAAKsF,WAAWkB,aAAarG,E,CAOvBsG,WAAWtG,GACjBH,KAAKsF,WAAWmB,WAAWtG,E,CAOrBkB,oBAAoBlB,GAC1BH,KAAKsF,WAAWjE,oBAAoBlB,E,CAO9BoB,iBAAiBpB,GACvBH,KAAKsF,WAAW/D,iBAAiBpB,E,CAO3BsB,iBAAiBtB,GACvBH,KAAKsF,WAAW7D,iBAAiBtB,E,CAO3BuG,oBAAoBvG,GAC1BH,KAAKsF,WAAWoB,oBAAoBvG,E,CAO9BuB,aAAavB,GACnBH,KAAKsF,WAAW5D,aAAavB,E,CAOvBwG,iBAAiBxG,GACvBH,KAAKsF,WAAWqB,iBAAiBxG,E,CAO3ByG,gBAAgBzG,GACtBH,KAAKsF,WAAWsB,gBAAgBzG,E,CAQ1ByB,aAAazB,GACnBH,KAAKsF,WAAW1D,aAAazB,E,CAOvB0B,cAAc1B,GACpBH,KAAKsF,WAAWzD,cAAc1B,E,CAMxB2B,oBACN9B,KAAK6G,OAAS7G,KAAK6G,SAAW,KAC9B7G,KAAK2D,SAAW3D,KAAK2D,WAAa,KAClC3D,KAAKsF,WAAWxD,mB"}
+{"version":3,"names":["InputNumberController","InputIconController","constructor","component","name","host","super","this","numberOrIsoDateRegex","parseToString","value","Date","toISOString","validateIso8601","propName","parsedValue","parseFloat","valueMatched","watchValidator","undefined","test","Set","validateAutoComplete","validateList","watchJsonArrayString","item","validateMax","validateMin","validatePlaceholder","watchString","validateReadOnly","watchBoolean","validateRequired","validateStep","watchNumber","validateType","validateValue","componentWillLoad","_autoComplete","_max","_min","_list","_readOnly","_required","_step","_type","_value","defaultStyleCss","KolInputNumber","render","ariaDiscribedBy","getRenderStates","state","hasList","Array","isArray","length","h","Host","_disabled","_error","_hideLabel","_hint","_icon","_id","_smartButton","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","join","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","readOnly","required","placeholder","_placeholder","step","spellcheck","type","controller","onFacade","onKeyUp","hostRef","propergateFocus","event","code","propergateSubmitEventToForm","form","onChange","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateName","validateOn","validateSmartButton","validateTabIndex","validateTouched","_alert"],"sources":["./src/components/input-number/controller.ts","./src/components/style.sass?tag=kol-input-number&mode=default&encapsulation=shadow","./src/components/input-number/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { watchBoolean, watchJsonArrayString, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputNumberController extends InputIconController implements Watches {\n\t/**\n\t * Regex to check whether a string is a number or a date in ISO-8601 format.\n\t * Test the regex here: https://regex101.com/r/nFDzrD/1\n\t */\n\tprivate readonly 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)?)?$)/;\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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\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 * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\tprivate readonly parseToString = (value?: number | Date | string) => {\n\t\tif (typeof value === 'string') {\n\t\t\treturn value;\n\t\t}\n\t\tif (typeof value === 'number') {\n\t\t\treturn `${value}`;\n\t\t}\n\t\tif (typeof value === 'object' && value instanceof Date) {\n\t\t\treturn value.toISOString();\n\t\t}\n\t\treturn '';\n\t};\n\n\tprivate readonly validateIso8601 = (propName: string, value?: number | Iso8601) => {\n\t\tconst parsedValue = parseFloat(value as string);\n\t\tconst valueMatched = parsedValue == value;\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || (valueMatched && typeof parsedValue === 'number') || this.numberOrIsoDateRegex.test(value),\n\t\t\tnew Set(['number', 'Date', 'string{ISO-8601}']),\n\t\t\tthis.parseToString(value)\n\t\t);\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_max', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_value', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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.validateList(this.component._list);\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","@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { propergateSubmitEventToForm } from '../form/controller';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { getRenderStates } from '../input/controller';\nimport { InputNumberController } from './controller';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-number',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputNumber implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputNumberElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropergateSubmitEventToForm({\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 { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\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_list={this.state._list}\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{' '}\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputNumberController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _max?: number | Iso8601;\n\n\t/**\n\t * Gibt den kleinstmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _min?: number | Iso8601;\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 den Platzhalter des Eingabefeldes an, wenn es leer ist.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\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 dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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 an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist.\n\t *\n\t * @deprecated Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.\n\t */\n\t@Prop() public _type?: InputNumberType = 'number';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: number | Iso8601;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t\t_list: [],\n\n\t\t_type: 'number',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputNumberController(this, 'number', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_min')\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputNumberType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: number | Iso8601): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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"],"mappings":"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"}

package/dist/kolibri/kol-input-password.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-0dce65d2.js";import{d as s}from"./a11y.tipps-ff5a1a99.js";import{p as d}from"./reuse-2f7da8fc.js";import{p as n}from"./controller-542bf2a8.js";import{g as l}from"./controller-5c3674df.js";import{I as o}from"./controller-7fa728c2.js";import"./dev.utils-daaf2f39.js";import"./validator-2e4f8df6.js";import"./prop.validators-59bc26b2.js";import"./index-b76497e7.js";import"./index.m-86dc8c44.js";import"./tab-index-818b2a80.js";const r="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",h=class{render(){const{ariaDiscribedBy:a}=l(this.state);return t(e,null,t("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},t("slot",null)),t("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":a.length>0?a.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,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,slot:"input",spellcheck:"false",type:"password",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,d(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?n({form:this.host,ref:this.ref}):this.controller.onFacade.onClick(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._maxLength=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._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_id:"⚠"},this.controller=new o(this,"password",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t),"on"===t&&s("[KolInputPassword] Die Option 'autocomplete' sollte bei einem Passwort-Eingabefeld nicht auf \"on\" gesetzt werden.")}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)}validateMaxLength(t){this.controller.validateMaxLength(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)}validateSmartButton(t){this.controller.validateSmartButton(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{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};h.style={default:r};export{h as kol_input_password};
+import{h as e,H as t,r as i,g as a}from"./index-0dce65d2.js";import{d as s}from"./a11y.tipps-ff5a1a99.js";import{p as d}from"./reuse-2f7da8fc.js";import{p as n}from"./controller-eecee40f.js";import{g as l}from"./controller-7adb5f0e.js";import{I as o}from"./controller-401e5985.js";import"./dev.utils-daaf2f39.js";import"./validator-2e4f8df6.js";import"./prop.validators-0ce5851c.js";import"./index-2eac13ad.js";import"./index.m-86dc8c44.js";import"./tab-index-e15e7adc.js";import"./controller-icon-c113ba17.js";import"./icon-22dfdb71.js";const r="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",h=class{render(){const{ariaDiscribedBy:a}=l(this.state);return e(t,null,e("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},e("span",{slot:"label"},e("slot",null)),e("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":a.length>0?a.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,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,slot:"input",spellcheck:"false",type:"password",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,d(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?n({form:this.host,ref:this.ref}):this.controller.onFacade.onClick(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._maxLength=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._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_id:"⚠"},this.controller=new o(this,"password",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t),"on"===t&&s("[KolInputPassword] Die Option 'autocomplete' sollte bei einem Passwort-Eingabefeld nicht auf \"on\" gesetzt werden.")}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)}validateMaxLength(t){this.controller.validateMaxLength(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)}validateSmartButton(t){this.controller.validateSmartButton(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{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};h.style={default:r};export{h as kol_input_password};

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

@@ -1 +1 @@
-{"version":3,"names":["defaultStyleCss","KolInputPassword","render","ariaDiscribedBy","getRenderStates","this","state","h","Host","_disabled","_error","_hideLabel","_hint","_icon","_id","_readOnly","_required","_smartButton","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","length","join","undefined","autoCapitalize","autoComplete","_autoComplete","autoCorrect","disabled","id","maxlength","_maxLength","name","_name","pattern","_pattern","placeholder","_placeholder","readOnly","required","size","_size","spellcheck","type","value","_value","controller","onFacade","onKeyUp","constructor","hostRef","propergateFocus","host","event","code","propergateSubmitEventToForm","form","onClick","InputPasswordController","validateAccessKey","validateAlert","validateAutoComplete","devHint","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateMaxLength","validateName","validateOn","validatePattern","validatePlaceholder","validateReadOnly","validateRequired","validateSize","validateSmartButton","validateTabIndex","validateTouched","validateValue","componentWillLoad","_alert"],"sources":["./src/components/style.sass?tag=kol-input-password&mode=default&encapsulation=shadow","./src/components/input-password/component.tsx"],"sourcesContent":["@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\n\nimport { devHint } from '../../utils/a11y.tipps';\nimport { propergateFocus } from '../../utils/reuse';\nimport { propergateSubmitEventToForm } from '../form/controller';\nimport { KoliBriInputIcon } from '../input-text/types';\nimport { getRenderStates } from '../input/controller';\nimport { InputPasswordController } from './controller';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-password',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputPassword implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputPasswordElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropergateSubmitEventToForm({\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.onClick(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\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_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<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\tpattern={this.state._pattern}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tsize={this.state._size}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t// title={this.state._title}\n\t\t\t\t\t\ttype=\"password\"\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputPasswordController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriInputIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man maximal eingeben kann.\n\t */\n\t@Prop() public _maxLength?: number;\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üfpattern 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 * Gibt an, ob die Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man eingeben kann.\n\t */\n\t@Prop() public _size?: number;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputPasswordController(this, 'password', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t\tif (value === 'on') {\n\t\t\tdevHint(`[KolInputPassword] Die Option 'autocomplete' sollte bei einem Passwort-Eingabefeld nicht auf \"on\" gesetzt werden.`);\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriInputIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_size')\n\tpublic validateSize(value?: number): void {\n\t\tthis.controller.validateSize(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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"],"mappings":";;;ydAAA,MAAMA,EAAkB,ge,MCoBXC,EAAgB,MAoBrBC,SACN,MAAMC,gBAAEA,GAAoBC,EAAgBC,KAAKC,OACjD,OACCC,EAACC,EAAI,KACJD,EAAA,aACCE,UAAWJ,KAAKC,MAAMG,UACtBC,OAAQL,KAAKC,MAAMI,OACnBC,WAAYN,KAAKC,MAAMK,WACvBC,MAAOP,KAAKC,MAAMM,MAClBC,MAAOR,KAAKC,MAAMO,MAClBC,IAAKT,KAAKC,MAAMQ,IAChBC,UAAWV,KAAKC,MAAMS,UACtBC,UAAWX,KAAKC,MAAMU,UACtBC,aAAcZ,KAAKC,MAAMW,aACzBC,SAAUb,KAAKC,MAAMY,UAErBX,EAAA,QAAMY,KAAK,SACVZ,EAAA,cAEDA,EAAA,QAAAa,OAAAC,OAAA,CACCC,IAAKjB,KAAKkB,SACVC,KAAK,QACLC,MAAM,GACNC,UAAWrB,KAAKC,MAAMqB,WAAU,mBACdxB,EAAgByB,OAAS,EAAIzB,EAAgB0B,KAAK,KAAOC,UAAS,kBACnE,GAAGzB,KAAKC,MAAMQ,YAC/BiB,eAAe,MACfC,aAAc3B,KAAKC,MAAM2B,cACzBC,YAAY,MACZC,SAAU9B,KAAKC,MAAMG,UACrB2B,GAAI/B,KAAKC,MAAMQ,IACfuB,UAAWhC,KAAKC,MAAMgC,WACtBC,KAAMlC,KAAKC,MAAMkC,MACjBC,QAASpC,KAAKC,MAAMoC,SACpBC,YAAatC,KAAKC,MAAMsC,aACxBC,SAAUxC,KAAKC,MAAMS,UACrB+B,SAAUzC,KAAKC,MAAMU,UACrB+B,KAAM1C,KAAKC,MAAM0C,MACjB7B,KAAK,QACL8B,WAAW,QAEXC,KAAK,WACLC,MAAO9C,KAAKC,MAAM8C,QACd/C,KAAKgD,WAAWC,SAAQ,CAC5BC,QAASlD,KAAKkD,Y,CA0HnBC,YAAAC,G,UAtLiBpD,KAAAkB,SAAYD,IAC5BjB,KAAKiB,IAAMA,EACXoC,EAAgBrD,KAAKsD,KAAMtD,KAAKiB,IAAI,EAGpBjB,KAAAkD,QAAWK,IAC3B,GAAIA,EAAMC,OAAS,QAAS,CAC3BC,EAA4B,CAC3BC,KAAM1D,KAAKsD,KACXrC,IAAKjB,KAAKiB,K,KAEL,CACNjB,KAAKgD,WAAWC,SAASU,QAAQJ,E,yCAiE+B,K,iHAyBlC,G,wSAiEoC,M,iCAUpC,CAC/B3B,cAAe,MACfnB,IAAK,KAILT,KAAKgD,WAAa,IAAIY,EAAwB5D,KAAM,WAAYA,KAAKsD,K,CAO/DO,kBAAkBf,GACxB9C,KAAKgD,WAAWa,kBAAkBf,E,CAO5BgB,cAAchB,GACpB9C,KAAKgD,WAAWc,cAAchB,E,CAOxBiB,qBAAqBjB,GAC3B9C,KAAKgD,WAAWe,qBAAqBjB,GACrC,GAAIA,IAAU,KAAM,CACnBkB,EAAQ,oH,EAQHC,iBAAiBnB,GACvB9C,KAAKgD,WAAWiB,iBAAiBnB,E,CAO3BoB,cAAcpB,GACpB9C,KAAKgD,WAAWkB,cAAcpB,E,CAOxBqB,kBAAkBrB,GACxB9C,KAAKgD,WAAWmB,kBAAkBrB,E,CAO5BsB,aAAatB,GACnB9C,KAAKgD,WAAWoB,aAAatB,E,CAOvBuB,aAAavB,GACnB9C,KAAKgD,WAAWqB,aAAavB,E,CAOvBwB,WAAWxB,GACjB9C,KAAKgD,WAAWsB,WAAWxB,E,CAOrByB,kBAAkBzB,GACxB9C,KAAKgD,WAAWuB,kBAAkBzB,E,CAO5B0B,aAAa1B,GACnB9C,KAAKgD,WAAWwB,aAAa1B,E,CAOvB2B,WAAW3B,GACjB9C,KAAKgD,WAAWyB,WAAW3B,E,CAOrB4B,gBAAgB5B,GACtB9C,KAAKgD,WAAW0B,gBAAgB5B,E,CAO1B6B,oBAAoB7B,GAC1B9C,KAAKgD,WAAW2B,oBAAoB7B,E,CAO9B8B,iBAAiB9B,GACvB9C,KAAKgD,WAAW4B,iBAAiB9B,E,CAO3B+B,iBAAiB/B,GACvB9C,KAAKgD,WAAW6B,iBAAiB/B,E,CAO3BgC,aAAahC,GACnB9C,KAAKgD,WAAW8B,aAAahC,E,CAOvBiC,oBAAoBjC,GAC1B9C,KAAKgD,WAAW+B,oBAAoBjC,E,CAO9BkC,iBAAiBlC,GACvB9C,KAAKgD,WAAWgC,iBAAiBlC,E,CAO3BmC,gBAAgBnC,GACtB9C,KAAKgD,WAAWiC,gBAAgBnC,E,CAO1BoC,cAAcpC,GACpB9C,KAAKgD,WAAWkC,cAAcpC,E,CAMxBqC,oBACNnF,KAAKoF,OAASpF,KAAKoF,SAAW,KAC9BpF,KAAKa,SAAWb,KAAKa,WAAa,KAClCb,KAAKgD,WAAWmC,mB"}
+{"version":3,"names":["defaultStyleCss","KolInputPassword","render","ariaDiscribedBy","getRenderStates","this","state","h","Host","_disabled","_error","_hideLabel","_hint","_icon","_id","_readOnly","_required","_smartButton","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","length","join","undefined","autoCapitalize","autoComplete","_autoComplete","autoCorrect","disabled","id","maxlength","_maxLength","name","_name","pattern","_pattern","placeholder","_placeholder","readOnly","required","size","_size","spellcheck","type","value","_value","controller","onFacade","onKeyUp","constructor","hostRef","propergateFocus","host","event","code","propergateSubmitEventToForm","form","onClick","InputPasswordController","validateAccessKey","validateAlert","validateAutoComplete","devHint","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateMaxLength","validateName","validateOn","validatePattern","validatePlaceholder","validateReadOnly","validateRequired","validateSize","validateSmartButton","validateTabIndex","validateTouched","validateValue","componentWillLoad","_alert"],"sources":["./src/components/style.sass?tag=kol-input-password&mode=default&encapsulation=shadow","./src/components/input-password/component.tsx"],"sourcesContent":["@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\n\nimport { devHint } from '../../utils/a11y.tipps';\nimport { propergateFocus } from '../../utils/reuse';\nimport { propergateSubmitEventToForm } from '../form/controller';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { getRenderStates } from '../input/controller';\nimport { InputPasswordController } from './controller';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-password',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputPassword implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputPasswordElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropergateSubmitEventToForm({\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.onClick(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\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_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<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\tpattern={this.state._pattern}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tsize={this.state._size}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t// title={this.state._title}\n\t\t\t\t\t\ttype=\"password\"\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputPasswordController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man maximal eingeben kann.\n\t */\n\t@Prop() public _maxLength?: number;\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üfpattern 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 * Gibt an, ob die Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man eingeben kann.\n\t */\n\t@Prop() public _size?: number;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputPasswordController(this, 'password', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t\tif (value === 'on') {\n\t\t\tdevHint(`[KolInputPassword] Die Option 'autocomplete' sollte bei einem Passwort-Eingabefeld nicht auf \"on\" gesetzt werden.`);\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_size')\n\tpublic validateSize(value?: number): void {\n\t\tthis.controller.validateSize(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as i,H as e,r as t,g as a}from"./index-0dce65d2.js";import{p as s}from"./reuse-2f7da8fc.js";import{g as d}from"./controller-5c3674df.js";import{a as n}from"./controller-51e89038.js";import"./validator-2e4f8df6.js";import"./a11y.tipps-ff5a1a99.js";import"./dev.utils-daaf2f39.js";import"./prop.validators-59bc26b2.js";import"./index-b76497e7.js";import"./index.m-86dc8c44.js";import"./tab-index-818b2a80.js";const r="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",l=class{render(){const{ariaDiscribedBy:t,hasError:a}=d(this.state);return i(e,null,i("fieldset",{class:{error:!0===a,disabled:!0===this.state._disabled,required:!0===this.state._required,[this.state._orientation]:!0}},i("legend",{class:"block w-full mb-1 leading-normal"},i("span",null,i("slot",null))),this.state._list.map(((e,a)=>{const s=`${this.state._id}-${a}`;return i("kol-input",{key:s,_disabled:this.state._disabled,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:s,_renderNoLabel:!0,_required:this.state._required,_touched:this.state._touched},i("div",{slot:"input"},i("input",Object.assign({ref:this.state._value===e.value?this.catchRef:void 0,accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.join(" "):void 0,"aria-labelledby":`${s}-label`,part:"input",title:"",type:"radio",id:s,checked:this.state._value===e.value,name:this.state._name||this.state._id,disabled:this.state._disabled||e.disabled,required:this.state._required,tabIndex:this.state._tabIndex,value:`-${a}`},this.controller.onFacade,{onChange:this.onChange})),i("label",{htmlFor:`${s}`,id:`${s}-label`,style:{height:this.state._hideLabel&&!0!==this.state._required?"0":void 0,margin:this.state._hideLabel&&!0!==this.state._required?"0":void 0,padding:this.state._hideLabel&&!0!==this.state._required?"0":void 0,visibility:this.state._hideLabel&&!0!==this.state._required?"hidden":void 0}},i("span",null,i("span",null,e.label)))))})),a&&i("kol-alert",{id:"error",_alert:!0,_type:"error",_variant:"msg"},this.state._error)))}constructor(e){t(this,e),this.catchRef=t=>{this.ref=t,s(this.host,this.ref)},this.onChange=t=>{if(t.target instanceof HTMLInputElement){const e=this.controller.getOptionByKey(t.target.value);void 0!==e&&this.controller.setValue(t,e.value)}},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._id=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._orientation="vertical",this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_id:"⚠",_list:[],_orientation:"vertical"},this.controller=new n(this,"radio",this.host)}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)}validateId(t){this.controller.validateId(t)}validateList(t){this.controller.validateList(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateOrientation(t){this.controller.validateOrientation(t)}validateRequired(t){this.controller.validateRequired(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.onChange)}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_id:["validateId"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_orientation:["validateOrientation"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};l.style={default:r};export{l as kol_input_radio};
+import{h as i,H as e,r as t,g as a}from"./index-0dce65d2.js";import{p as s}from"./reuse-2f7da8fc.js";import{g as d}from"./controller-7adb5f0e.js";import{a as n}from"./controller-4c6206b0.js";import"./validator-2e4f8df6.js";import"./a11y.tipps-ff5a1a99.js";import"./dev.utils-daaf2f39.js";import"./prop.validators-0ce5851c.js";import"./index-2eac13ad.js";import"./index.m-86dc8c44.js";import"./tab-index-e15e7adc.js";const r="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",l=class{render(){const{ariaDiscribedBy:t,hasError:a}=d(this.state);return i(e,null,i("fieldset",{class:{error:!0===a,disabled:!0===this.state._disabled,required:!0===this.state._required,[this.state._orientation]:!0}},i("legend",{class:"block w-full mb-1 leading-normal"},i("span",null,i("slot",null))),this.state._list.map(((e,a)=>{const s=`${this.state._id}-${a}`;return i("kol-input",{key:s,_disabled:this.state._disabled,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:s,_renderNoLabel:!0,_required:this.state._required,_touched:this.state._touched},i("div",{slot:"input"},i("input",Object.assign({ref:this.state._value===e.value?this.catchRef:void 0,accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.join(" "):void 0,"aria-labelledby":`${s}-label`,part:"input",title:"",type:"radio",id:s,checked:this.state._value===e.value,name:this.state._name||this.state._id,disabled:this.state._disabled||e.disabled,required:this.state._required,tabIndex:this.state._tabIndex,value:`-${a}`},this.controller.onFacade,{onChange:this.onChange})),i("label",{htmlFor:`${s}`,id:`${s}-label`,style:{height:this.state._hideLabel&&!0!==this.state._required?"0":void 0,margin:this.state._hideLabel&&!0!==this.state._required?"0":void 0,padding:this.state._hideLabel&&!0!==this.state._required?"0":void 0,visibility:this.state._hideLabel&&!0!==this.state._required?"hidden":void 0}},i("span",null,i("span",null,e.label)))))})),a&&i("kol-alert",{id:"error",_alert:!0,_type:"error",_variant:"msg"},this.state._error)))}constructor(e){t(this,e),this.catchRef=t=>{this.ref=t,s(this.host,this.ref)},this.onChange=t=>{if(t.target instanceof HTMLInputElement){const e=this.controller.getOptionByKey(t.target.value);void 0!==e&&this.controller.setValue(t,e.value)}},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._id=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._orientation="vertical",this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_id:"⚠",_list:[],_orientation:"vertical"},this.controller=new n(this,"radio",this.host)}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)}validateId(t){this.controller.validateId(t)}validateList(t){this.controller.validateList(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateOrientation(t){this.controller.validateOrientation(t)}validateRequired(t){this.controller.validateRequired(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.onChange)}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_id:["validateId"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_orientation:["validateOrientation"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};l.style={default:r};export{l as kol_input_radio};

package/dist/kolibri/kol-input-range.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-0dce65d2.js";import{p as s}from"./reuse-2f7da8fc.js";import{I as d,g as n}from"./controller-5c3674df.js";import{a as l,c as h,d as o}from"./prop.validators-59bc26b2.js";import"./validator-2e4f8df6.js";import"./a11y.tipps-ff5a1a99.js";import"./dev.utils-daaf2f39.js";import"./tab-index-818b2a80.js";import"./index-b76497e7.js";import"./index.m-86dc8c44.js";class r extends d{constructor(t,e,i){super(t,e,i),this.component=t}validateAutoComplete(t){l(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){h(this.component,"_list",(t=>"object"==typeof t&&"string"==typeof t.label&&t.label.length>0),t)}validateMax(t){o(this.component,"_max",t)}validateMin(t){o(this.component,"_min",t)}validateStep(t){o(this.component,"_step",t)}validateValue(t){o(this.component,"_value",t),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateList(this.component._list),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateStep(this.component._step),this.validateValue(this.component._value)}}const p="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",c=class{render(){const{ariaDiscribedBy:e}=n(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0;return t(i,null,t("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_touched:this.state._touched},t("span",{slot:"label"},t("slot",null)),t("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,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,slot:"input",spellcheck:"false",step:this.state._step,type:"range",value:this.state._value},this.controller.onFacade)),a&&[t("datalist",{id:`${this.state._id}-list`},this.state._list.map((e=>t("option",{value:e.value}))))]))}constructor(t){e(this,t),this.catchRef=t=>{this.ref=t,s(this.host,this.ref)},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._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_id:"⚠",_list:[]},this.controller=new r(this,"range",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)}validateList(t){this.controller.validateList(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)}validateStep(t){this.controller.validateStep(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{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:p};export{c as kol_input_range};
+import{h as t,H as i,r as e,g as a}from"./index-0dce65d2.js";import{p as s}from"./reuse-2f7da8fc.js";import{g as d}from"./controller-7adb5f0e.js";import{a as n,c as l,d as o}from"./prop.validators-0ce5851c.js";import{I as h}from"./controller-icon-c113ba17.js";import"./validator-2e4f8df6.js";import"./a11y.tipps-ff5a1a99.js";import"./dev.utils-daaf2f39.js";import"./tab-index-e15e7adc.js";import"./index-2eac13ad.js";import"./index.m-86dc8c44.js";import"./icon-22dfdb71.js";class r extends h{constructor(t,e,i){super(t,e,i),this.component=t}validateAutoComplete(t){n(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){l(this.component,"_list",(t=>"object"==typeof t&&"string"==typeof t.label&&t.label.length>0),t)}validateMax(t){o(this.component,"_max",t)}validateMin(t){o(this.component,"_min",t)}validateStep(t){o(this.component,"_step",t)}validateValue(t){o(this.component,"_value",t),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateList(this.component._list),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateStep(this.component._step),this.validateValue(this.component._value)}}const p="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",c=class{render(){const{ariaDiscribedBy:e}=d(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0;return t(i,null,t("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_touched:this.state._touched},t("span",{slot:"label"},t("slot",null)),t("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,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,slot:"input",spellcheck:"false",step:this.state._step,type:"range",value:this.state._value},this.controller.onFacade)),a&&[t("datalist",{id:`${this.state._id}-list`},this.state._list.map((e=>t("option",{value:e.value}))))]))}constructor(t){e(this,t),this.catchRef=t=>{this.ref=t,s(this.host,this.ref)},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._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_id:"⚠",_list:[]},this.controller=new r(this,"range",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)}validateList(t){this.controller.validateList(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)}validateStep(t){this.controller.validateStep(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{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:p};export{c as kol_input_range};

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

@@ -1 +1 @@
-{"version":3,"names":["InputRangeController","InputController","constructor","component","name","host","super","this","validateAutoComplete","value","watchValidator","Set","validateList","watchJsonArrayString","item","label","length","validateMax","watchNumber","validateMin","validateStep","validateValue","setFormAssociatedValue","state","_value","componentWillLoad","_autoComplete","_list","_max","_min","_step","defaultStyleCss","KolInputRange","render","ariaDiscribedBy","getRenderStates","hasList","Array","isArray","h","Host","_disabled","_error","_hideLabel","_hint","_icon","_id","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","spellcheck","step","type","controller","onFacade","map","option","hostRef","propergateFocus","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateName","validateOn","validateTabIndex","validateTouched","_alert"],"sources":["./src/components/input-range/controller.ts","./src/components/style.sass?tag=kol-input-range&mode=default&encapsulation=shadow","./src/components/input-range/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputTypeOnOff, Option } from '../../types/input/types';\nimport { watchJsonArrayString, watchNumber, watchValidator } from '../../utils/prop.validators';\nimport { InputController } from '../@deprecated/input/controller';\nimport { Props, Watches } from './types';\n\nexport class InputRangeController extends InputController 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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\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 * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateList(value?: Stringified<Option<number>[]>): void {\n\t\twatchJsonArrayString(\n\t\t\tthis.component,\n\t\t\t'_list',\n\t\t\t(item: Option<number>) => typeof item === 'object' && typeof item.label === 'string' && item.label.length > 0,\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMax(value?: number): void {\n\t\twatchNumber(this.component, '_max', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMin(value?: number): void {\n\t\twatchNumber(this.component, '_min', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: number): void {\n\t\twatchNumber(this.component, '_value', value);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateList(this.component._list);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../types/common';\n\nimport { InputTypeOnDefault, InputTypeOnOff, Option } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { KoliBriInputIcon } from '../input-text/types';\nimport { getRenderStates } from '../input/controller';\nimport { InputRangeController } from './controller';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-range',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputRange implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputRangeElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\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_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\ttype=\"range\"\n\t\t\t\t\t\tvalue={this.state._value as number}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t/>\n\t\t\t\t\t{hasList && [\n\t\t\t\t\t\t<datalist id={`${this.state._id}-list`}>\n\t\t\t\t\t\t\t{this.state._list.map((option: Option<number>) => (\n\t\t\t\t\t\t\t\t<option value={option.value}></option>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</datalist>,\n\t\t\t\t\t\t// <ul class=\"grid gap-1 text-sm grid-flow-col\">\n\t\t\t\t\t\t//   {this.state._list.map((option: InputOption<number>) => (\n\t\t\t\t\t\t//     <li class=\"border-1\">{option.label}</li>\n\t\t\t\t\t\t//   ))}\n\t\t\t\t\t\t// </ul>,\n\t\t\t\t\t]}\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputRangeController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriInputIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<Option<number>[]>;\n\n\t/**\n\t * Gibt den Maximalwert des Eingabefeldes an.\n\t */\n\t@Prop() public _max?: number;\n\n\t/**\n\t * Gibt den Minimalwert des Eingabefeldes an.\n\t */\n\t@Prop() public _min?: number;\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 die Schrittweite der Wertveränderung an.\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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?: number;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t\t_list: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputRangeController(this, 'range', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriInputIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<Option<number>[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: number): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_min')\n\tpublic validateMin(value?: number): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: number): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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"],"mappings":"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"}
+{"version":3,"names":["InputRangeController","InputIconController","constructor","component","name","host","super","this","validateAutoComplete","value","watchValidator","Set","validateList","watchJsonArrayString","item","label","length","validateMax","watchNumber","validateMin","validateStep","validateValue","setFormAssociatedValue","state","_value","componentWillLoad","_autoComplete","_list","_max","_min","_step","defaultStyleCss","KolInputRange","render","ariaDiscribedBy","getRenderStates","hasList","Array","isArray","h","Host","_disabled","_error","_hideLabel","_hint","_icon","_id","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","spellcheck","step","type","controller","onFacade","map","option","hostRef","propergateFocus","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateName","validateOn","validateTabIndex","validateTouched","_alert"],"sources":["./src/components/input-range/controller.ts","./src/components/style.sass?tag=kol-input-range&mode=default&encapsulation=shadow","./src/components/input-range/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputTypeOnOff, Option } from '../../types/input/types';\nimport { watchJsonArrayString, watchNumber, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputRangeController 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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\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 * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateList(value?: Stringified<Option<number>[]>): void {\n\t\twatchJsonArrayString(\n\t\t\tthis.component,\n\t\t\t'_list',\n\t\t\t(item: Option<number>) => typeof item === 'object' && typeof item.label === 'string' && item.label.length > 0,\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMax(value?: number): void {\n\t\twatchNumber(this.component, '_max', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMin(value?: number): void {\n\t\twatchNumber(this.component, '_min', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: number): void {\n\t\twatchNumber(this.component, '_value', value);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateList(this.component._list);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../types/common';\n\nimport { InputTypeOnDefault, InputTypeOnOff, Option } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { getRenderStates } from '../input/controller';\nimport { InputRangeController } from './controller';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-range',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputRange implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputRangeElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\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_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\ttype=\"range\"\n\t\t\t\t\t\tvalue={this.state._value as number}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t/>\n\t\t\t\t\t{hasList && [\n\t\t\t\t\t\t<datalist id={`${this.state._id}-list`}>\n\t\t\t\t\t\t\t{this.state._list.map((option: Option<number>) => (\n\t\t\t\t\t\t\t\t<option value={option.value}></option>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</datalist>,\n\t\t\t\t\t\t// <ul class=\"grid gap-1 text-sm grid-flow-col\">\n\t\t\t\t\t\t//   {this.state._list.map((option: InputOption<number>) => (\n\t\t\t\t\t\t//     <li class=\"border-1\">{option.label}</li>\n\t\t\t\t\t\t//   ))}\n\t\t\t\t\t\t// </ul>,\n\t\t\t\t\t]}\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputRangeController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<Option<number>[]>;\n\n\t/**\n\t * Gibt den Maximalwert des Eingabefeldes an.\n\t */\n\t@Prop() public _max?: number;\n\n\t/**\n\t * Gibt den Minimalwert des Eingabefeldes an.\n\t */\n\t@Prop() public _min?: number;\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 die Schrittweite der Wertveränderung an.\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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?: number;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t\t_list: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputRangeController(this, 'range', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<Option<number>[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: number): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_min')\n\tpublic validateMin(value?: number): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: number): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\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"],"mappings":"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"}

package/dist/kolibri/kol-input-text.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-0dce65d2.js";import{f as s}from"./a11y.tipps-ff5a1a99.js";import{p as d}from"./reuse-2f7da8fc.js";import{p as l}from"./controller-542bf2a8.js";import{g as n}from"./controller-5c3674df.js";import{a as h}from"./controller-546903ef.js";import"./dev.utils-daaf2f39.js";import"./validator-2e4f8df6.js";import"./prop.validators-59bc26b2.js";import"./index-b76497e7.js";import"./index.m-86dc8c44.js";import"./tab-index-818b2a80.js";import"./controller-7fa728c2.js";const r="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}";s("[KolInputText] Pre- und post-Label für Währung usw.");const o=class{render(){const{ariaDiscribedBy:e}=n(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0;return t(i,null,this.state._accessKey,t("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},t("slot",null)),t("input",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,maxlength:this.state._maxLength,name:this.state._name,part:"input",pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",title:"",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){e(this,t),this.catchRef=t=>{var e;this.ref=t,d(this.host,this.ref),this.disconnectedCallback(),null===(e=this.ref)||void 0===e||e.addEventListener("search",this.onChange)},this.onKeyUp=t=>{"Enter"===t.code||"NumpadEnter"===t.code?l({form:this.host,ref:this.ref}):this.onChange(t)},this.onChange=t=>{var e,a;this.oldValue!==(null===(e=this.ref)||void 0===e?void 0:e.value)&&(this.oldValue=null===(a=this.ref)||void 0===a?void 0:a.value,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._list=void 0,this._maxLength=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._tabIndex=void 0,this._touched=!1,this._type="text",this._value=void 0,this.state={_autoComplete:"off",_id:"id",_list:[],_type:"text"},this.controller=new h(this,"text",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)}validateList(t){this.controller.validateList(t)}validateMaxLength(t){this.controller.validateMaxLength(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)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.oldValue=this._value,this.controller.componentWillLoad()}disconnectedCallback(){var t;null===(t=this.ref)||void 0===t||t.removeEventListener("search",this.onChange)}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};o.style={default:r};export{o as kol_input_text};
+import{h as t,H as i,r as e,g as a}from"./index-0dce65d2.js";import{f as s}from"./a11y.tipps-ff5a1a99.js";import{p as d}from"./reuse-2f7da8fc.js";import{p as l}from"./controller-eecee40f.js";import{g as n}from"./controller-7adb5f0e.js";import{a as h}from"./controller-3cfe91c9.js";import"./dev.utils-daaf2f39.js";import"./validator-2e4f8df6.js";import"./prop.validators-0ce5851c.js";import"./index-2eac13ad.js";import"./index.m-86dc8c44.js";import"./tab-index-e15e7adc.js";import"./controller-401e5985.js";import"./controller-icon-c113ba17.js";import"./icon-22dfdb71.js";const r="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}";s("[KolInputText] Pre- und post-Label für Währung usw.");const o=class{render(){const{ariaDiscribedBy:e}=n(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0;return t(i,null,this.state._accessKey,t("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},t("slot",null)),t("input",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,maxlength:this.state._maxLength,name:this.state._name,part:"input",pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",title:"",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){e(this,t),this.catchRef=t=>{var e;this.ref=t,d(this.host,this.ref),this.disconnectedCallback(),null===(e=this.ref)||void 0===e||e.addEventListener("search",this.onChange)},this.onKeyUp=t=>{"Enter"===t.code||"NumpadEnter"===t.code?l({form:this.host,ref:this.ref}):this.onChange(t)},this.onChange=t=>{var e,a;this.oldValue!==(null===(e=this.ref)||void 0===e?void 0:e.value)&&(this.oldValue=null===(a=this.ref)||void 0===a?void 0:a.value,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._list=void 0,this._maxLength=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._tabIndex=void 0,this._touched=!1,this._type="text",this._value=void 0,this.state={_autoComplete:"off",_id:"id",_list:[],_type:"text"},this.controller=new h(this,"text",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)}validateList(t){this.controller.validateList(t)}validateMaxLength(t){this.controller.validateMaxLength(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)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.oldValue=this._value,this.controller.componentWillLoad()}disconnectedCallback(){var t;null===(t=this.ref)||void 0===t||t.removeEventListener("search",this.onChange)}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};o.style={default:r};export{o as kol_input_text};

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

@@ -1 +1 @@
-{"version":3,"names":["defaultStyleCss","featureHint","KolInputText","render","ariaDiscribedBy","getRenderStates","this","state","hasList","Array","isArray","_list","length","h","Host","_accessKey","_disabled","_error","_hideLabel","_hint","_icon","_id","_readOnly","_required","_smartButton","_touched","slot","Object","assign","ref","catchRef","accessKey","join","undefined","autoCapitalize","autoComplete","_autoComplete","autoCorrect","disabled","id","list","maxlength","_maxLength","name","_name","part","pattern","_pattern","placeholder","_placeholder","readOnly","required","size","_size","spellcheck","title","type","_type","value","_value","controller","onFacade","onKeyUp","constructor","hostRef","propergateFocus","host","disconnectedCallback","_a","addEventListener","onChange","event","code","propergateSubmitEventToForm","form","oldValue","_b","InputTextController","validateAccessKey","validateAlert","validateAutoComplete","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateList","validateMaxLength","validateName","validateOn","validatePattern","validatePlaceholder","validateReadOnly","validateRequired","validateSize","validateSmartButton","validateTabIndex","validateTouched","validateType","validateValue","componentWillLoad","_alert","removeEventListener"],"sources":["./src/components/style.sass?tag=kol-input-text&mode=default&encapsulation=shadow","./src/components/input-text/component.tsx"],"sourcesContent":["@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputTextType } from '../../types/input/control/text';\n\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { propergateFocus } from '../../utils/reuse';\nimport { propergateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputTextController } from './controller';\nimport { ComponentApi, KoliBriInputIcon, States } from './types';\n\nfeatureHint(`[KolInputText] Pre- und post-Label für Währung usw.`);\n\n@Component({\n\ttag: 'kol-input-text',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputText implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputTextElement;\n\tprivate ref?: HTMLInputElement;\n\tprivate oldValue?: string;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t\tthis.disconnectedCallback();\n\t\tthis.ref?.addEventListener('search', this.onChange);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter' || event.code === 'NumpadEnter') {\n\t\t\tpropergateSubmitEventToForm({\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.onChange(event);\n\t\t}\n\t};\n\n\tprivate readonly onChange = (event: Event) => {\n\t\tif (this.oldValue !== this.ref?.value) {\n\t\t\tthis.oldValue = this.ref?.value;\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._accessKey}\n\t\t\t\t<kol-input\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_list={this.state._list}\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<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\tpattern={this.state._pattern}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tsize={this.state._size}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t// title={this.state._title}\n\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t// onInput={this.controller.onFacade.onChange}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputTextController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriInputIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man maximal eingeben kann.\n\t */\n\t@Prop() public _maxLength?: number;\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üfpattern 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 * Gibt an, ob die Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man eingeben kann.\n\t */\n\t@Prop() public _size?: number;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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 an, ob es ein Text-, Suche-, URL- oder Telefon-Eingabefeld ist.\n\t */\n\t@Prop() public _type?: InputTextType = 'text';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true }) public _value?: string;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: 'id',\n\t\t_list: [],\n\t\t_type: 'text',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputTextController(this, 'text', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriInputIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_size')\n\tpublic validateSize(value?: number): void {\n\t\tthis.controller.validateSize(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputTextType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.oldValue = this._value;\n\t\tthis.controller.componentWillLoad();\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.ref?.removeEventListener('search', this.onChange);\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["defaultStyleCss","featureHint","KolInputText","render","ariaDiscribedBy","getRenderStates","this","state","hasList","Array","isArray","_list","length","h","Host","_accessKey","_disabled","_error","_hideLabel","_hint","_icon","_id","_readOnly","_required","_smartButton","_touched","slot","Object","assign","ref","catchRef","accessKey","join","undefined","autoCapitalize","autoComplete","_autoComplete","autoCorrect","disabled","id","list","maxlength","_maxLength","name","_name","part","pattern","_pattern","placeholder","_placeholder","readOnly","required","size","_size","spellcheck","title","type","_type","value","_value","controller","onFacade","onKeyUp","constructor","hostRef","propergateFocus","host","disconnectedCallback","_a","addEventListener","onChange","event","code","propergateSubmitEventToForm","form","oldValue","_b","InputTextController","validateAccessKey","validateAlert","validateAutoComplete","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateList","validateMaxLength","validateName","validateOn","validatePattern","validatePlaceholder","validateReadOnly","validateRequired","validateSize","validateSmartButton","validateTabIndex","validateTouched","validateType","validateValue","componentWillLoad","_alert","removeEventListener"],"sources":["./src/components/style.sass?tag=kol-input-text&mode=default&encapsulation=shadow","./src/components/input-text/component.tsx"],"sourcesContent":["@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { KoliBriHorizontalIcon } from '../../components';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputTextType } from '../../types/input/control/text';\n\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { propergateFocus } from '../../utils/reuse';\nimport { propergateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputTextController } from './controller';\nimport { ComponentApi, States } from './types';\n\nfeatureHint(`[KolInputText] Pre- und post-Label für Währung usw.`);\n\n@Component({\n\ttag: 'kol-input-text',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolInputText implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputTextElement;\n\tprivate ref?: HTMLInputElement;\n\tprivate oldValue?: string;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t\tthis.disconnectedCallback();\n\t\tthis.ref?.addEventListener('search', this.onChange);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter' || event.code === 'NumpadEnter') {\n\t\t\tpropergateSubmitEventToForm({\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.onChange(event);\n\t\t}\n\t};\n\n\tprivate readonly onChange = (event: Event) => {\n\t\tif (this.oldValue !== this.ref?.value) {\n\t\t\tthis.oldValue = this.ref?.value;\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._accessKey}\n\t\t\t\t<kol-input\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_list={this.state._list}\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<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\tpattern={this.state._pattern}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tsize={this.state._size}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t// title={this.state._title}\n\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t// onInput={this.controller.onFacade.onChange}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputTextController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) 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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man maximal eingeben kann.\n\t */\n\t@Prop() public _maxLength?: number;\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üfpattern 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 * Gibt an, ob die Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt an, wie viele Zeichen man eingeben kann.\n\t */\n\t@Prop() public _size?: number;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\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 an, ob es ein Text-, Suche-, URL- oder Telefon-Eingabefeld ist.\n\t */\n\t@Prop() public _type?: InputTextType = 'text';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true }) public _value?: string;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: 'id',\n\t\t_list: [],\n\t\t_type: 'text',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputTextController(this, 'text', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_size')\n\tpublic validateSize(value?: number): void {\n\t\tthis.controller.validateSize(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputTextType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.oldValue = this._value;\n\t\tthis.controller.componentWillLoad();\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.ref?.removeEventListener('search', this.onChange);\n\t}\n}\n"],"mappings":"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"}