@public-ui/components 1.6.0-rc.0 → 1.6.0-rc.1

package/dist/kolibri/kol-input-color.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-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{g as o}from"./controller-e7d68f52.js";import{a as l,d as r,w as d}from"./prop.validators-2c20cdf8.js";import{I as p}from"./controller-icon-a11cdc92.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class h extends p{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){r(this.component,"_list",(t=>"string"==typeof t),t)}validateValue(t){d(this.component,"_value",t)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateList(this.component._list),this.validateValue(this.component._value)}}const u=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}div.input{cursor:pointer}",c=class{render(){const{ariaDescribedBy:i}=o(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,null,t("kol-input",{class:{color:!0},_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,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:!0===this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,name:this.state._name,slot:"input",spellcheck:"false",type:"color",value:this.state._value},this.controller.onFacade))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(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._label=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._smartButton=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_id:s(),_label:"…",_list:[]},this.controller=new h(this,"color",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.controller.validateList(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(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"],_label:["validateLabel"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:u};export{c as kol_input_color};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{g as o}from"./controller-e02d4577.js";import{a as l,d as r,w as d}from"./prop.validators-2c20cdf8.js";import{I as p}from"./controller-icon-1255b762.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class h extends p{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){r(this.component,"_list",(t=>"string"==typeof t),t)}validateValue(t){d(this.component,"_value",t),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateList(this.component._list),this.validateValue(this.component._value)}}const u=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}div.input{cursor:pointer}",c=class{render(){const{ariaDescribedBy:i}=o(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,null,t("kol-input",{class:{color:!0},_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,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:!0===this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,name:this.state._name,slot:"input",spellcheck:"false",type:"color",value:this.state._value},this.controller.onFacade))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(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._label=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._smartButton=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_id:s(),_label:"…",_list:[]},this.controller=new h(this,"color",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.controller.validateList(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(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"],_label:["validateLabel"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:u};export{c as kol_input_color};

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

@@ -1 +1 @@
-{"version":3,"names":["InputColorController","InputIconController","constructor","component","name","host","super","this","validateAutoComplete","value","watchValidator","Set","validateList","watchJsonArrayString","item","validateValue","watchString","componentWillLoad","_autoComplete","_list","_value","defaultStyleCss","KolInputColor","render","ariaDescribedBy","getRenderStates","state","hasList","Array","isArray","length","showExpertSlot","_label","showDefaultSlot","h","Host","class","color","_disabled","_error","_hideLabel","_hint","_icon","_id","_smartButton","_touched","onClick","_a","ref","focus","slot","Object","assign","catchRef","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","_name","spellcheck","type","controller","onFacade","hostRef","propagateFocus","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateName","validateOn","validateSmartButton","validateTabIndex","validateTouched","_alert"],"sources":["./src/components/input-color/controller.ts","./src/components/input-color/style.css?tag=kol-input-color&mode=default&encapsulation=shadow","./src/components/input-color/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { watchJsonArrayString, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputColorController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic 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\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t}\n\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.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\ndiv.input {\n\tcursor: pointer;\n}\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 { KoliBriHorizontalIcon } from '../../types/icon';\n\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputColorController } from './controller';\nimport { ComponentApi, States } from './types';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-color',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputColor implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputColorElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\tconst showExpertSlot = this.state._label === ''; // _label=\"\" or _label\n\t\tconst showDefaultSlot = this.state._label === '…'; // deprecated: default slot will be removed in v2.0.0\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tcolor: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_list={this.state._list}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">{showExpertSlot ? <slot name=\"expert\"></slot> : showDefaultSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\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={ariaDescribedBy.length > 0 ? ariaDescribedBy.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 === true}\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\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\ttype=\"color\"\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/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputColorController;\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 * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\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 * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * 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 * Das Label dient der Beschriftung unterschiedlicher Elemente.\n\t * - Button -> label text\n\t * - Heading -> headline text\n\t * - Input, Select und Textarea -> label text\n\t * - Summary -> summary text\n\t * - Table -> caption text\n\t * - etc.\n\t *\n\t * Das Label ist häufig ein Pflichtattribut und kann leer gesetzt werden,\n\t * wenn man das Label mittels dem Expert-Slot überschreiben will.\n\t */\n\t@Prop() public _label!: 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 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 * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\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@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: nonce(), // ⚠ required\n\t\t_label: '…', // ⚠ required\n\t\t_list: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputColorController(this, 'color', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["InputColorController","InputIconController","constructor","component","name","host","super","this","validateAutoComplete","value","watchValidator","Set","validateList","watchJsonArrayString","item","validateValue","watchString","setFormAssociatedValue","state","_value","componentWillLoad","_autoComplete","_list","defaultStyleCss","KolInputColor","render","ariaDescribedBy","getRenderStates","hasList","Array","isArray","length","showExpertSlot","_label","showDefaultSlot","h","Host","class","color","_disabled","_error","_hideLabel","_hint","_icon","_id","_smartButton","_touched","onClick","_a","ref","focus","slot","Object","assign","catchRef","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","_name","spellcheck","type","controller","onFacade","hostRef","propagateFocus","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateName","validateOn","validateSmartButton","validateTabIndex","validateTouched","_alert"],"sources":["./src/components/input-color/controller.ts","./src/components/input-color/style.css?tag=kol-input-color&mode=default&encapsulation=shadow","./src/components/input-color/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { watchJsonArrayString, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputColorController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic 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\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateList(this.component._list);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\ndiv.input {\n\tcursor: pointer;\n}\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 { KoliBriHorizontalIcon } from '../../types/icon';\n\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputColorController } from './controller';\nimport { ComponentApi, States } from './types';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-color',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputColor implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputColorElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\tconst showExpertSlot = this.state._label === ''; // _label=\"\" or _label\n\t\tconst showDefaultSlot = this.state._label === '…'; // deprecated: default slot will be removed in v2.0.0\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tcolor: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_list={this.state._list}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">{showExpertSlot ? <slot name=\"expert\"></slot> : showDefaultSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\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={ariaDescribedBy.length > 0 ? ariaDescribedBy.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 === true}\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\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\ttype=\"color\"\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/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputColorController;\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 * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\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 * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * 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 * Das Label dient der Beschriftung unterschiedlicher Elemente.\n\t * - Button -> label text\n\t * - Heading -> headline text\n\t * - Input, Select und Textarea -> label text\n\t * - Summary -> summary text\n\t * - Table -> caption text\n\t * - etc.\n\t *\n\t * Das Label ist häufig ein Pflichtattribut und kann leer gesetzt werden,\n\t * wenn man das Label mittels dem Expert-Slot überschreiben will.\n\t */\n\t@Prop() public _label!: 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 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 * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\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@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: nonce(), // ⚠ required\n\t\t_label: '…', // ⚠ required\n\t\t_list: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputColorController(this, 'color', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n}\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as l}from"./reuse-3a02afb9.js";import{p as n}from"./controller-abdc8667.js";import{g as d}from"./controller-e7d68f52.js";import{b as o}from"./prop.validators-2c20cdf8.js";import{I as r}from"./controller-2184621f.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./controller-0b4a141f.js";import"./controller-icon-a11cdc92.js";import"./icon-52e86ff8.js";const h=(t,e)=>{o(t,"_multiple",e)};class p extends r{constructor(t,e,i){super(t,e,i),this.component=t}validateMultiple(t){o(this.component,"_multiple",t)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const u=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",c=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:"email",_alert:this.state._alert,_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,multiple:this.state._multiple,id:this.state._id,list:a?`${this.state._id}-list`:void 0,maxlength:this.state._maxLength,name:this.state._name,pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",type:"email",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,l(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?n({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._maxLength=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._size=void 0,this._smartButton=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:s(),_label:"…",_list:[]},this.controller=new p(this,"email",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.controller.validateList(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateMultiple(t){h(this,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(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_maxLength:["validateMaxLength"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:u};export{c as kol_input_email};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as l}from"./reuse-3a02afb9.js";import{p as n}from"./controller-abdc8667.js";import{g as d}from"./controller-e02d4577.js";import{b as o}from"./prop.validators-2c20cdf8.js";import{I as r}from"./controller-3f613951.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./controller-4b599938.js";import"./controller-icon-1255b762.js";import"./icon-52e86ff8.js";const h=(t,e)=>{o(t,"_multiple",e)};class p extends r{constructor(t,e,i){super(t,e,i),this.component=t}validateMultiple(t){o(this.component,"_multiple",t)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const u=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",c=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:"email",_alert:this.state._alert,_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,multiple:this.state._multiple,id:this.state._id,list:a?`${this.state._id}-list`:void 0,maxlength:this.state._maxLength,name:this.state._name,pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",type:"email",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,l(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?n({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._maxLength=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._size=void 0,this._smartButton=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:s(),_label:"…",_list:[]},this.controller=new p(this,"email",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.controller.validateList(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateMultiple(t){h(this,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(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_maxLength:["validateMaxLength"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:u};export{c as kol_input_email};

package/dist/kolibri/kol-input-file.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-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{g as l}from"./controller-e7d68f52.js";import{w as o,b as d}from"./prop.validators-2c20cdf8.js";import{I as r}from"./controller-icon-a11cdc92.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class p extends r{constructor(t,e,i){super(t,e,i),this.component=t}validateAccept(t){o(this.component,"_accept",t)}validateMultiple(t){d(this.component,"_multiple",t)}validateRequired(t){d(this.component,"_required",t)}validateValue(t){o(this.component,"_value",t),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateValue(this.component._value)}}const h=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}label input[type='file']::-webkit-file-upload-button{display:none}label input[type='file']:before{content:'Datei auswählen'}label input[multiple]:before{content:'Dateien auswählen'}div.input{cursor:pointer}",u=class{render(){const{ariaDescribedBy:i}=l(this.state),a=""===this.state._label,o="…"===this.state._label;return t(e,null,t("kol-input",{class:{file:!0},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},a?t("slot",{name:"expert"}):o?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accept:this.state._accept,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,slot:"input",spellcheck:"false",type:"file",value:this.state._value},this.controller.onFacade,{onChange:this.onChange}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onChange=t=>{var e;this.ref instanceof HTMLInputElement&&"file"===this.ref.type&&"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onChange)&&this.state._on.onChange(t,this.ref.files)},this._accept=void 0,this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._smartButton=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_id:s(),_label:"…"},this.controller=new p(this,"file",this.host)}validateAccept(t){this.controller.validateAccept(t)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return a(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};u.style={default:h};export{u as kol_input_file};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{g as l}from"./controller-e02d4577.js";import{w as o,b as d}from"./prop.validators-2c20cdf8.js";import{I as r}from"./controller-icon-1255b762.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class p extends r{constructor(t,e,i){super(t,e,i),this.component=t}validateAccept(t){o(this.component,"_accept",t)}validateMultiple(t){d(this.component,"_multiple",t)}validateRequired(t){d(this.component,"_required",t)}validateValue(t){o(this.component,"_value",t),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateValue(this.component._value)}}const h=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}label input[type='file']::-webkit-file-upload-button{display:none}label input[type='file']:before{content:'Datei auswählen'}label input[multiple]:before{content:'Dateien auswählen'}div.input{cursor:pointer}",u=class{render(){const{ariaDescribedBy:i}=l(this.state),a=""===this.state._label,o="…"===this.state._label;return t(e,null,t("kol-input",{class:{file:!0},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},a?t("slot",{name:"expert"}):o?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accept:this.state._accept,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,slot:"input",spellcheck:"false",type:"file",value:this.state._value},this.controller.onFacade,{onChange:this.onChange}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onChange=t=>{var e;this.ref instanceof HTMLInputElement&&"file"===this.ref.type&&"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onChange)&&this.state._on.onChange(t,this.ref.files)},this._accept=void 0,this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._smartButton=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_id:s(),_label:"…"},this.controller=new p(this,"file",this.host)}validateAccept(t){this.controller.validateAccept(t)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return a(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};u.style={default:h};export{u as kol_input_file};

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{p as l}from"./controller-abdc8667.js";import{g as d}from"./controller-e7d68f52.js";import{a as o,d as h,w as r,b as p,e as u}from"./prop.validators-2c20cdf8.js";import{I as c}from"./controller-icon-a11cdc92.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class f extends c{constructor(t,e,i){super(t,e,i),this.numberOrIsoDateRegex=/^\d+$|(^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])([T ][0-2]\d:[0-5]\d:[0-5]\d(?:\.\d+)?([+-][0-2]\d:[0-5]\d|Z)?)?$)|(^[0-2]\d:[0-5]\d(:[0-5]\d)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e,i)=>{const a=parseFloat(e),l=a==e;return o(this.component,t,(t=>void 0===t||""===t||l&&"number"==typeof a||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&i&&i(t)}}})},this.component=t}validateAutoComplete(t){o(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)}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){r(this.component,"_placeholder",t)}validateReadOnly(t){p(this.component,"_readOnly",t)}validateRequired(t){p(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){o(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e)}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 m=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",y=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0},_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"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.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){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?l({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:s(),_label:"…",_list:[],_type:"number"},this.controller=new f(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)}validateLabel(t){this.controller.validateLabel(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.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};y.style={default:m};export{y as kol_input_number};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{p as l}from"./controller-abdc8667.js";import{g as d}from"./controller-e02d4577.js";import{a as o,d as h,w as r,b as p,e as u}from"./prop.validators-2c20cdf8.js";import{I as c}from"./controller-icon-1255b762.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class f extends c{constructor(t,e,i){super(t,e,i),this.numberOrIsoDateRegex=/^\d+$|(^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])([T ][0-2]\d:[0-5]\d:[0-5]\d(?:\.\d+)?([+-][0-2]\d:[0-5]\d|Z)?)?$)|(^[0-2]\d:[0-5]\d(:[0-5]\d)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e,i)=>{const a=parseFloat(e),l=a==e;return o(this.component,t,(t=>void 0===t||""===t||l&&"number"==typeof a||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&i&&i(t)}}})},this.component=t}validateAutoComplete(t){o(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)}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){r(this.component,"_placeholder",t)}validateReadOnly(t){p(this.component,"_readOnly",t)}validateRequired(t){p(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){o(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.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 m=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",y=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0},_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"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.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){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?l({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:s(),_label:"…",_list:[],_type:"number"},this.controller=new f(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)}validateLabel(t){this.controller.validateLabel(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.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};y.style={default:m};export{y as kol_input_number};

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

@@ -1 +1 @@
-{"version":3,"names":["InputNumberController","InputIconController","constructor","component","name","host","super","this","numberOrIsoDateRegex","parseToString","value","Date","toISOString","validateIso8601","propName","afterPatch","parsedValue","parseFloat","valueMatched","watchValidator","undefined","test","Set","hooks","validateAutoComplete","validateList","watchJsonArrayString","item","onChange","event","target","_value","validateMax","validateMin","validatePlaceholder","watchString","validateReadOnly","watchBoolean","validateRequired","validateStep","watchNumber","validateType","validateValue","validateValueEx","componentWillLoad","_autoComplete","_max","_min","_list","_readOnly","_required","_step","_type","defaultStyleCss","KolInputNumber","render","ariaDescribedBy","getRenderStates","state","hasList","Array","isArray","length","showExpertSlot","_label","showDefaultSlot","h","Host","class","_hasValue","_disabled","_error","_hideLabel","_hint","_icon","_id","_smartButton","_touched","slot","Object","assign","ref","catchRef","title","accessKey","_accessKey","join","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","readOnly","required","placeholder","_placeholder","step","spellcheck","type","controller","onFacade","onKeyUp","hostRef","propagateFocus","code","propagateSubmitEventToForm","form","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateName","validateOn","validateSmartButton","validateTabIndex","validateTouched","v","_alert","addValueChangeListener"],"sources":["./src/components/input-number/controller.ts","./src/components/input-number/style.css?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/ddGR4V/1\n\t */\n\tprivate readonly numberOrIsoDateRegex =\n\t\t/^\\d+$|(^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])([T ][0-2]\\d:[0-5]\\d:[0-5]\\d(?:\\.\\d+)?([+-][0-2]\\d:[0-5]\\d|Z)?)?$)|(^[0-2]\\d:[0-5]\\d(:[0-5]\\d)?$)/;\n\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\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 | null) => {\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 | null, afterPatch?: (v: string) => void) => {\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 || value === '' || (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\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t};\n\n\tprotected onChange(event: Event): void {\n\t\tsuper.onChange(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as number | Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_max', value);\n\t}\n\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\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\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: number | Iso8601 | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.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","@import url(../input-line.css);\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 { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputNumberController } from './controller';\nimport { ComponentApi, States } from './types';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-number',\n\tstyleUrls: {\n\t\tdefault: './style.css',\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\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\tconst showExpertSlot = this.state._label === ''; // _label=\"\" or _label\n\t\tconst showDefaultSlot = this.state._label === '…'; // deprecated: default slot will be removed in v2.0.0\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type]: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_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\">{showExpertSlot ? <slot name=\"expert\"></slot> : showDefaultSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\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={ariaDescribedBy.length > 0 ? ariaDescribedBy.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 * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\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 * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * 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 * Das Label dient der Beschriftung unterschiedlicher Elemente.\n\t * - Button -> label text\n\t * - Heading -> headline text\n\t * - Input, Select und Textarea -> label text\n\t * - Summary -> summary text\n\t * - Table -> caption text\n\t * - etc.\n\t *\n\t * Das Label ist häufig ein Pflichtattribut und kann leer gesetzt werden,\n\t * wenn man das Label mittels dem Expert-Slot überschreiben will.\n\t */\n\t@Prop() public _label!: 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 * Setzt das Eingabefeld in den schreibgeschützten Modus.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: 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({ mutable: true }) public _value?: number | Iso8601 | null;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_hasValue: false,\n\t\t_id: nonce(), // ⚠ required\n\t\t_label: '…', // ⚠ required\n\t\t_list: [],\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@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\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@Watch('_value')\n\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.controller.validateValueEx(value, (v) => {\n\t\t\tif (v === '' && this.ref) {\n\t\t\t\tthis.ref.value = '';\n\t\t\t}\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["InputNumberController","InputIconController","constructor","component","name","host","super","this","numberOrIsoDateRegex","parseToString","value","Date","toISOString","validateIso8601","propName","afterPatch","parsedValue","parseFloat","valueMatched","watchValidator","undefined","test","Set","hooks","validateAutoComplete","validateList","watchJsonArrayString","item","onChange","event","target","_value","validateMax","validateMin","validatePlaceholder","watchString","validateReadOnly","watchBoolean","validateRequired","validateStep","watchNumber","validateType","validateValue","validateValueEx","setFormAssociatedValue","state","componentWillLoad","_autoComplete","_max","_min","_list","_readOnly","_required","_step","_type","defaultStyleCss","KolInputNumber","render","ariaDescribedBy","getRenderStates","hasList","Array","isArray","length","showExpertSlot","_label","showDefaultSlot","h","Host","class","_hasValue","_disabled","_error","_hideLabel","_hint","_icon","_id","_smartButton","_touched","slot","Object","assign","ref","catchRef","title","accessKey","_accessKey","join","autoCapitalize","autoComplete","autoCorrect","disabled","id","list","max","min","_name","readOnly","required","placeholder","_placeholder","step","spellcheck","type","controller","onFacade","onKeyUp","hostRef","propagateFocus","code","propagateSubmitEventToForm","form","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcon","validateId","validateLabel","validateName","validateOn","validateSmartButton","validateTabIndex","validateTouched","v","_alert","addValueChangeListener"],"sources":["./src/components/input-number/controller.ts","./src/components/input-number/style.css?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/ddGR4V/1\n\t */\n\tprivate readonly numberOrIsoDateRegex =\n\t\t/^\\d+$|(^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])([T ][0-2]\\d:[0-5]\\d:[0-5]\\d(?:\\.\\d+)?([+-][0-2]\\d:[0-5]\\d|Z)?)?$)|(^[0-2]\\d:[0-5]\\d(:[0-5]\\d)?$)/;\n\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\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 | null) => {\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 | null, afterPatch?: (v: string) => void) => {\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 || value === '' || (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\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t};\n\n\tprotected onChange(event: Event): void {\n\t\tsuper.onChange(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as number | Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_max', value);\n\t}\n\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\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\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: number | Iso8601 | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.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","@import url(../input-line.css);\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 { KoliBriHorizontalIcon } from '../../types/icon';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { getRenderStates } from '../input/controller';\nimport { InputNumberController } from './controller';\nimport { ComponentApi, States } from './types';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-number',\n\tstyleUrls: {\n\t\tdefault: './style.css',\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\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\tconst showExpertSlot = this.state._label === ''; // _label=\"\" or _label\n\t\tconst showDefaultSlot = this.state._label === '…'; // deprecated: default slot will be removed in v2.0.0\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type]: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_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\">{showExpertSlot ? <slot name=\"expert\"></slot> : showDefaultSlot ? <slot></slot> : this.state._label}</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\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={ariaDescribedBy.length > 0 ? ariaDescribedBy.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 * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\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 * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * 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 * Das Label dient der Beschriftung unterschiedlicher Elemente.\n\t * - Button -> label text\n\t * - Heading -> headline text\n\t * - Input, Select und Textarea -> label text\n\t * - Summary -> summary text\n\t * - Table -> caption text\n\t * - etc.\n\t *\n\t * Das Label ist häufig ein Pflichtattribut und kann leer gesetzt werden,\n\t * wenn man das Label mittels dem Expert-Slot überschreiben will.\n\t */\n\t@Prop() public _label!: 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 * Setzt das Eingabefeld in den schreibgeschützten Modus.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: 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({ mutable: true }) public _value?: number | Iso8601 | null;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_hasValue: false,\n\t\t_id: nonce(), // ⚠ required\n\t\t_label: '…', // ⚠ required\n\t\t_list: [],\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@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\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@Watch('_value')\n\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.controller.validateValueEx(value, (v) => {\n\t\t\tif (v === '' && this.ref) {\n\t\t\t\tthis.ref.value = '';\n\t\t\t}\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"mappings":"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"}

package/dist/kolibri/kol-input-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-34c3d6f8.js";import{d as s}from"./a11y.tipps-2e27f8e6.js";import{n}from"./dev.utils-157f0499.js";import{a as l}from"./reuse-3a02afb9.js";import{p as o}from"./controller-abdc8667.js";import{g as d}from"./controller-e7d68f52.js";import{I as r}from"./controller-0b4a141f.js";import"./prop.validators-2c20cdf8.js";import"./index-f4596895.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./controller-icon-a11cdc92.js";import"./icon-52e86ff8.js";const h=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",p=class{render(){const{ariaDescribedBy:a}=d(this.state),i=""===this.state._label,l="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{password:!0},_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},i?t("slot",{name:"expert"}):l?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,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,l(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?o({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=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:n(),_label:"…",_hasValue:!1},this.controller=new r(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)}validateLabel(t){this.controller.validateLabel(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(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};p.style={default:h};export{p as kol_input_password};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{d as s}from"./a11y.tipps-2e27f8e6.js";import{n}from"./dev.utils-157f0499.js";import{a as l}from"./reuse-3a02afb9.js";import{p as o}from"./controller-abdc8667.js";import{g as d}from"./controller-e02d4577.js";import{I as r}from"./controller-4b599938.js";import"./prop.validators-2c20cdf8.js";import"./index-f4596895.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./controller-icon-1255b762.js";import"./icon-52e86ff8.js";const h=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",p=class{render(){const{ariaDescribedBy:a}=d(this.state),i=""===this.state._label,l="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{password:!0},_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},i?t("slot",{name:"expert"}):l?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,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,l(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?o({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=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:n(),_label:"…",_hasValue:!1},this.controller=new r(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)}validateLabel(t){this.controller.validateLabel(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(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};p.style={default:h};export{p as kol_input_password};

package/dist/kolibri/kol-input-radio.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-34c3d6f8.js";import{n}from"./dev.utils-157f0499.js";import{a as s}from"./reuse-3a02afb9.js";import{g as r}from"./controller-e7d68f52.js";import{a as l}from"./controller-004bc53b.js";import"./a11y.tipps-2e27f8e6.js";import"./prop.validators-2c20cdf8.js";import"./index-f4596895.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";const d=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}:host{--border-width:2px;--input-size:1.5em}kol-input .icons{display:none}label{cursor:pointer}input{appearance:none;border-width:var(--border-width);border-style:solid;border-radius:100%;cursor:pointer;display:flex;height:var(--input-size);margin:0;min-height:var(--input-size);min-width:var(--input-size);padding:0;width:var(--input-size)}input:before{border-radius:100%;content:'';margin:auto;height:calc(var(--input-size) / 2);width:calc(var(--input-size) / 2)}input:checked:before{background-color:#000}fieldset{display:flex}fieldset.vertical{flex-direction:column}fieldset [slot='input']{align-items:center;display:flex}.required label>span::after{content:''}",o=class{render(){const{ariaDescribedBy:i,hasError:a}=r(this.state),l=""===this.state._label,s="…"===this.state._label;return t(e,null,t("fieldset",{class:{disabled:!0===this.state._disabled,error:!0===a,required:!0===this.state._required,[this.state._orientation]:!0}},t("legend",{class:"block w-full mb-1 leading-normal"},t("span",null,l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label)),this.state._list.map(((e,a)=>{const l=`${this.state._id}-${a}`;return t("kol-input",{class:{radio:!0},key:l,_disabled:this.state._disabled||e.disabled,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:l,_renderNoLabel:!0,_required:this.state._required,_touched:this.state._touched},t("div",{slot:"input"},t("input",Object.assign({ref:this.state._value===e.value?this.catchRef:void 0,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${l}-label`,title:"",type:"radio",id:l,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})),t("label",{htmlFor:`${l}`,id:`${l}-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}},t("span",null,t("span",null,e.label)))))})),a&&t("kol-alert",{id:"error",_alert:!0,_type:"error",_variant:"msg"},this.state._error)))}constructor(t){i(this,t),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._label=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:n(),_label:"…",_list:[],_orientation:"vertical"},this.controller=new l(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)}validateLabel(t){this.controller.validateLabel(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"],_label:["validateLabel"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_orientation:["validateOrientation"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};o.style={default:d};export{o as kol_input_radio};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n}from"./dev.utils-157f0499.js";import{a as s}from"./reuse-3a02afb9.js";import{g as r}from"./controller-e02d4577.js";import{a as d}from"./controller-bd4d58e4.js";import"./a11y.tipps-2e27f8e6.js";import"./prop.validators-2c20cdf8.js";import"./index-f4596895.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";const l=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}:host{--border-width:2px;--input-size:1.5em}kol-input .icons{display:none}label{cursor:pointer}input{appearance:none;border-width:var(--border-width);border-style:solid;border-radius:100%;cursor:pointer;display:flex;height:var(--input-size);margin:0;min-height:var(--input-size);min-width:var(--input-size);padding:0;width:var(--input-size)}input:before{border-radius:100%;content:'';margin:auto;height:calc(var(--input-size) / 2);width:calc(var(--input-size) / 2)}input:checked:before{background-color:#000}fieldset{display:flex}fieldset.vertical{flex-direction:column}fieldset [slot='input']{align-items:center;display:flex}.required label>span::after{content:''}",o=class{render(){const{ariaDescribedBy:i,hasError:a}=r(this.state),l=""===this.state._label,s="…"===this.state._label;return t(e,null,t("fieldset",{class:{disabled:!0===this.state._disabled,error:!0===a,required:!0===this.state._required,[this.state._orientation]:!0}},t("legend",{class:"block w-full mb-1 leading-normal"},t("span",null,l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label)),this.state._list.map(((e,a)=>{const l=`${this.state._id}-${a}`;return t("kol-input",{class:{radio:!0},key:l,_disabled:this.state._disabled||e.disabled,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:l,_renderNoLabel:!0,_required:this.state._required,_touched:this.state._touched},t("div",{slot:"input"},t("input",Object.assign({ref:this.state._value===e.value?this.catchRef:void 0,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${l}-label`,title:"",type:"radio",id:l,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})),t("label",{htmlFor:`${l}`,id:`${l}-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}},t("span",null,t("span",null,e.label)))))})),a&&t("kol-alert",{id:"error",_alert:!0,_type:"error",_variant:"msg"},this.state._error)))}constructor(t){i(this,t),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._label=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:n(),_label:"…",_list:[],_orientation:"vertical"},this.controller=new d(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)}validateLabel(t){this.controller.validateLabel(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"],_label:["validateLabel"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_orientation:["validateOrientation"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};o.style={default:l};export{o 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 e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{g as o}from"./controller-e7d68f52.js";import{a as l,d,e as r}from"./prop.validators-2c20cdf8.js";import{I as p}from"./controller-icon-a11cdc92.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class h extends p{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){d(this.component,"_list",(t=>"object"==typeof t&&"string"==typeof t.label&&t.label.length>0),t)}validateMax(t){r(this.component,"_max",t)}validateMin(t){r(this.component,"_min",t)}validateStep(t){r(this.component,"_step",t)}validateValue(t){r(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 u=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}input[type='range']{appearance:none;background-color:#d3d3d3;border:0;display:inline-block;height:0.5rem;line-height:1.5em;padding:0;margin:0}input[type='range']::-webkit-slider-thumb{box-sizing:border-box;background-color:#000;height:20px;width:20px;border-radius:20px;cursor:pointer;-webkit-appearance:none}input[type='range']::-moz-range-thumb{box-sizing:border-box;background-color:#000;height:20px;width:20px;border-radius:20px;cursor:pointer;-moz-appearance:none}",c=class{render(){const{ariaDescribedBy:i}=o(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,null,t("kol-input",{class:{range:!0},_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.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){i(this,t),this.catchRef=t=>{this.ref=t,n(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._label=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:s(),_label:"…",_list:[]},this.controller=new h(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)}validateLabel(t){this.controller.validateLabel(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"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:u};export{c as kol_input_range};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{n as s}from"./dev.utils-157f0499.js";import{a as n}from"./reuse-3a02afb9.js";import{g as o}from"./controller-e02d4577.js";import{a as l,d,e as r}from"./prop.validators-2c20cdf8.js";import{I as p}from"./controller-icon-1255b762.js";import"./a11y.tipps-2e27f8e6.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./index-f4596895.js";import"./icon-52e86ff8.js";class h extends p{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){d(this.component,"_list",(t=>"object"==typeof t&&"string"==typeof t.label&&t.label.length>0),t)}validateMax(t){r(this.component,"_max",t)}validateMin(t){r(this.component,"_min",t)}validateStep(t){r(this.component,"_step",t)}validateValue(t){r(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 u=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}input[type='range']{appearance:none;background-color:#d3d3d3;border:0;display:inline-block;height:0.5rem;line-height:1.5em;padding:0;margin:0}input[type='range']::-webkit-slider-thumb{box-sizing:border-box;background-color:#000;height:20px;width:20px;border-radius:20px;cursor:pointer;-webkit-appearance:none}input[type='range']::-moz-range-thumb{box-sizing:border-box;background-color:#000;height:20px;width:20px;border-radius:20px;cursor:pointer;-moz-appearance:none}",c=class{render(){const{ariaDescribedBy:i}=o(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,null,t("kol-input",{class:{range:!0},_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.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){i(this,t),this.catchRef=t=>{this.ref=t,n(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._label=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:s(),_label:"…",_list:[]},this.controller=new h(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)}validateLabel(t){this.controller.validateLabel(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"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};c.style={default:u};export{c as kol_input_range};

package/dist/kolibri/kol-input-text.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-34c3d6f8.js";import{f as s}from"./a11y.tipps-2e27f8e6.js";import{a as n}from"./reuse-3a02afb9.js";import{p as l}from"./controller-abdc8667.js";import{g as d}from"./controller-e7d68f52.js";import{a as o}from"./controller-2184621f.js";import{b as r}from"./prop.validators-2c20cdf8.js";import{v as h}from"./hide-label-1fa80b94.js";import"./dev.utils-157f0499.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./controller-0b4a141f.js";import"./controller-icon-a11cdc92.js";import"./icon-52e86ff8.js";import"./index-f4596895.js";const p=(t,e)=>{r(t,"_alert",e)},u=(t,e)=>{r(t,"_readOnly",e)},c=(t,e)=>{r(t,"_required",e)},f=(t,e)=>{r(t,"_touched",e)},m=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}";s("[KolInputText] Pre- und post-Label für Währung usw.");const v=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0},_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.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,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){i(this,t),this.catchRef=t=>{var e;this.ref=t,n(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,i;this.oldValue!==(null===(e=this.ref)||void 0===e?void 0:e.value)&&(this.oldValue=null===(i=this.ref)||void 0===i?void 0:i.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._label=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",_hasValue:!1,_label:"…",_list:[],_type:"text"},this.controller=new o(this,"text",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){p(this,t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){h(this,t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.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){u(this,t)}validateRequired(t){c(this,t)}validateSize(t){this.controller.validateSize(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){f(this,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(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}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"],_label:["validateLabel"],_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"]}}};v.style={default:m};export{v as kol_input_text};
+import{h as t,H as e,r as i,g as a}from"./index-34c3d6f8.js";import{f as s}from"./a11y.tipps-2e27f8e6.js";import{a as n}from"./reuse-3a02afb9.js";import{p as l}from"./controller-abdc8667.js";import{g as d}from"./controller-e02d4577.js";import{a as o}from"./controller-3f613951.js";import{b as r}from"./prop.validators-2c20cdf8.js";import{v as h}from"./hide-label-1fa80b94.js";import"./dev.utils-157f0499.js";import"./tab-index-2de507bb.js";import"./label-58f2333f.js";import"./controller-4b599938.js";import"./controller-icon-1255b762.js";import"./icon-52e86ff8.js";import"./index-f4596895.js";const p=(t,e)=>{r(t,"_alert",e)},u=(t,e)=>{r(t,"_readOnly",e)},c=(t,e)=>{r(t,"_required",e)},f=(t,e)=>{r(t,"_touched",e)},m=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}";s("[KolInputText] Pre- und post-Label für Währung usw.");const v=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._list)&&this.state._list.length>0,l=""===this.state._label,s="…"===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0},_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,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},l?t("slot",{name:"expert"}):s?t("slot",null):this.state._label),t("input",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.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,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){i(this,t),this.catchRef=t=>{var e;this.ref=t,n(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,i;this.oldValue!==(null===(e=this.ref)||void 0===e?void 0:e.value)&&(this.oldValue=null===(i=this.ref)||void 0===i?void 0:i.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._label=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",_hasValue:!1,_label:"…",_list:[],_type:"text"},this.controller=new o(this,"text",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){p(this,t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){h(this,t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.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){u(this,t)}validateRequired(t){c(this,t)}validateSize(t){this.controller.validateSize(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){f(this,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(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}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"],_label:["validateLabel"],_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"]}}};v.style={default:m};export{v as kol_input_text};