@public-ui/components 1.4.2-rc.3 → 1.4.2-rc.5

package/cheat-sheet.html

@@ -9,9 +9,9 @@
 		<link href="https://fonts.cdnfonts.com/css/roboto" rel="stylesheet" />
 		<link href="https://use.fontawesome.com/releases/v6.2.1/css/all.css" rel="stylesheet" />
 		<script type="module">
-			import { register } from 'https://esm.sh/@public-ui/core@1.4.2-rc.3';
-			import { defineCustomElements } from 'https://esm.sh/@public-ui/components@1.4.2-rc.3/dist/loader';
-			import { DEFAULT } from 'https://esm.sh/@public-ui/themes@1.4.2-rc.3';
+			import { register } from 'https://esm.sh/@public-ui/core@1.4.2-rc.5';
+			import { defineCustomElements } from 'https://esm.sh/@public-ui/components@1.4.2-rc.5/dist/loader';
+			import { DEFAULT } from 'https://esm.sh/@public-ui/themes@1.4.2-rc.5';
 				register(DEFAULT, defineCustomElements)
 						.then(() => {})
 						.catch(console.warn);
@@ -78,9 +78,9 @@
 			<pre>
 				<code class="language-html">&#60;head&#62;
 	&#60;script type="module"&#62;
-		import { register } from 'https://esm.sh/@public-ui/core@1.4.2-rc.3';
-		import { defineCustomElements } from 'https://esm.sh/@public-ui/components@1.4.2-rc.3/dist/loader';
-		import { DEFAULT } from 'https://esm.sh/@public-ui/themes@1.4.2-rc.3';
+		import { register } from 'https://esm.sh/@public-ui/core@1.4.2-rc.5';
+		import { defineCustomElements } from 'https://esm.sh/@public-ui/components@1.4.2-rc.5/dist/loader';
+		import { DEFAULT } from 'https://esm.sh/@public-ui/themes@1.4.2-rc.5';
 		register([DEFAULT], [defineCustomElements])
 			.then(() =&#62; {})
 			.catch(console.warn);

package/custom-elements.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.4.2-rc.3",
+  "version": "1.4.2-rc.5",
   "tags": [
     {
       "name": "kol-abbr",

package/dist/cjs/kol-input-checkbox.cjs.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),reuse=require("./reuse-bbd0b4e7.js"),controller$1=require("./controller-1c9293c6.js"),a11y_tipps=require("./a11y.tipps-4af0092d.js"),prop_validators=require("./prop.validators-7154e3f9.js"),controller=require("./controller-c831bc96.js");require("./tab-index-0ff2fc1d.js"),require("./dev.utils-7123fb34.js"),require("./index-cc5674d0.js");class InputCheckboxController extends controller.InputCheckboxRadioController{constructor(e,t,i){super(e,t,i),this.component=e}validateChecked(e){prop_validators.watchBoolean(this.component,"_checked",e),this.setFormAssociatedValue(this.component.state._checked)}validateIcon(e){prop_validators.watchValidator(this.component,"_icons",(e=>"object"==typeof e&&null!==e&&(reuse.isString(e.checked,1)||reuse.isString(e.indeterminate,1)||reuse.isString(e.unchecked,1))),new Set(["InputCheckboxIcons"]),e)}validateIndeterminate(e){prop_validators.watchBoolean(this.component,"_indeterminate",e)}validateType(e){a11y_tipps.devHint('The "_type" prop is deprecated. Use "_variant" instead.'),this.validateVariant(e)}validateValue(e){prop_validators.setState(this.component,"_value",e)}validateVariant(e){prop_validators.watchValidator(this.component,"_variant",(e=>"string"==typeof e&&("button"===e||"checkbox"===e||"switch"===e)),new Set(["String {button, checkbox, switch}"]),e)}componentWillLoad(){super.componentWillLoad(),this.validateChecked(this.component._checked),this.validateIcon(this.component._icon),this.validateIndeterminate(this.component._indeterminate),this.validateValue(this.component._value),this.validateVariant(this.component._variant||this.component._type)}}const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:#999}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}label{cursor:pointer}input{border-color:var(--kolibri-border-color);border-width:2px;border-style:solid;line-height:24px;font-size:var(--kolibri-font-size)}.required label>span::after{content:'*';padding-left:0.125em}input:hover{border-color:var(--kolibri-color-normal)}kol-input{align-items:center;display:grid;gap:var(--kolibri-spacing);justify-items:left;width:100}kol-input.checkbox,kol-input.switch{grid-template-columns:auto 1fr}kol-input .input{display:inline-flex;order:1}kol-input .input div{display:inline-flex}kol-input .input input{margin:0px}kol-input label{order:2}kol-input.error>kol-alert,kol-input .hint{grid-column:span 2}kol-input kol-alert.error{order:3}kol-input .hint{order:4}input[type='checkbox']{appearance:none;background-color:white;cursor:pointer;transition:0.5s}input[type='checkbox'].kol-disabled:before{cursor:not-allowed}input[type='checkbox']:before{content:'';cursor:pointer}input[type='checkbox']:checked{background-color:var(--kolibri-color-primary);border-color:var(--kolibri-color-primary)}.disabled{opacity:0.33}.checkbox kol-icon,.switch kol-icon{display:none}.button label{cursor:pointer;display:inline-flex;width:auto}.button label>span>span{display:inline-flex;gap:calc(2 * var(--kolibri-spacing));place-items:center}.button input{display:none}.checkbox input[type='checkbox']{height:1.5em;width:1.5em}.checkbox input[type='checkbox']{height:1.5em;width:1.5em}.checkbox input[type='checkbox']:before{background-color:transparent;display:block;height:1.5em;position:relative;width:1.5em}.checkbox input[type='checkbox']:checked:before{background-color:transparent;border-bottom-width:3px;border-color:white;border-radius:1px;border-right-width:3px;border-style:solid;border-width:0px 3px 3px 0px;height:0.75em;left:calc(0.375em - 2px);transform:rotate(40deg) translate(-50%, -50%);top:calc(0.7125em - 2px);width:0.375em}.checkbox input[type='checkbox']:indeterminate:before{background-color:var(--kolibri-color-normal);height:0.35em;left:0.14em;top:0.45em;width:1em}.switch input[type='checkbox']{display:inline-block;height:1.7em;min-width:3.2em;position:relative;width:3.2em}.switch input[type='checkbox']:before{background-color:black;height:1.2em;left:calc(0.25em - 2px);top:calc(0.25em - 2px);position:absolute;-webkit-transition:0.5s;-moz-transition:0.5s;-ms-transition:0.5s;transition:0.5;width:1.2em}.switch input[type='checkbox']:checked:before{background-color:white;-webkit-transform:translateX(1.5em);-moz-transform:translateX(1.5em);-ms-transform:translateX(1.5em);transform:translateX(1.5em)}.switch input[type='checkbox']:indeterminate:before{background-color:var(--kolibri-color-normal);transform:translateX(0.75em)}",KolInputCheckbox=class{render(){const{ariaDiscribedBy:e}=controller$1.getRenderStates(this.state);return index.h(index.Host,null,index.h("kol-input",{class:{[this.state._variant]:!0},_alert:this.state._alert,_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:this.state._id,_required:this.state._required,_touched:this.state._touched},index.h("span",{"data-role":"button"===this.state._variant?"button":void 0,onKeyPress:"button"===this.state._variant?this.onChange:void 0,tabIndex:"button"===this.state._variant?0:void 0,slot:"label"},index.h("kol-icon",{onClick:this.onChange,_ariaLabel:"",_icon:this.state._indeterminate?this.state._icon.indeterminate:this.state._checked?this.state._icon.checked:this.state._icon.unchecked}),index.h("slot",null)),index.h("div",{slot:"input"},index.h("input",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,checked:!0===this.state._checked,disabled:!0===this.state._disabled,id:this.state._id,indeterminate:!0===this.state._indeterminate,name:this.state._name,required:!0===this.state._required,tabIndex:this.state._tabIndex,title:"",type:"checkbox",value:"string"==typeof this.state._value?this.state._value:""},this.controller.onFacade,{onChange:this.onChange})))))}constructor(e){index.registerInstance(this,e),this.catchRef=e=>{this.ref=e,reuse.propergateFocus(this.host,this.ref)},this.onChange=e=>{this._checked=!1===this._checked,this._indeterminate=!1,this.controller.setValue(e,this._checked)},this._accessKey=void 0,this._alert=!0,this._checked=!1,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._indeterminate=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._type=void 0,this._value=void 0,this._variant=void 0,this.state={_checked:!1,_icon:{checked:"fa-solid fa-check",indeterminate:"fa-solid fa-minus",unchecked:"fa-solid fa-plus"},_id:"⚠",_indeterminate:!1,_variant:"checkbox"},this.controller=new InputCheckboxController(this,"checkbox",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateChecked(e){this.controller.validateChecked(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcon(e){this.controller.validateIcon(e)}validateId(e){this.controller.validateId(e)}validateIndeterminate(e){this.controller.validateIndeterminate(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateType(e){this.controller.validateType(e)}validateValue(e){this.controller.validateValue(e)}validateVariant(e){this.controller.validateVariant(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return index.getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_checked:["validateChecked"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_indeterminate:["validateIndeterminate"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"],_variant:["validateVariant"]}}};KolInputCheckbox.style={default:defaultStyleCss},exports.kol_input_checkbox=KolInputCheckbox;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),reuse=require("./reuse-bbd0b4e7.js"),controller$1=require("./controller-1c9293c6.js"),a11y_tipps=require("./a11y.tipps-4af0092d.js"),prop_validators=require("./prop.validators-7154e3f9.js"),controller=require("./controller-c831bc96.js");require("./tab-index-0ff2fc1d.js"),require("./dev.utils-7123fb34.js"),require("./index-cc5674d0.js");class InputCheckboxController extends controller.InputCheckboxRadioController{constructor(e,t,i){super(e,t,i),this.component=e}validateChecked(e){prop_validators.watchBoolean(this.component,"_checked",e),this.setFormAssociatedValue(this.component.state._checked)}validateIcon(e){prop_validators.watchValidator(this.component,"_icons",(e=>"object"==typeof e&&null!==e&&(reuse.isString(e.checked,1)||reuse.isString(e.indeterminate,1)||reuse.isString(e.unchecked,1))),new Set(["InputCheckboxIcons"]),e)}validateIndeterminate(e){prop_validators.watchBoolean(this.component,"_indeterminate",e)}validateType(e){a11y_tipps.devHint('The "_type" prop is deprecated. Use "_variant" instead.'),this.validateVariant(e)}validateValue(e){prop_validators.setState(this.component,"_value",e)}validateVariant(e){prop_validators.watchValidator(this.component,"_variant",(e=>"string"==typeof e&&("button"===e||"checkbox"===e||"switch"===e)),new Set(["String {button, checkbox, switch}"]),e)}componentWillLoad(){super.componentWillLoad(),this.validateChecked(this.component._checked),this.validateIcon(this.component._icon),this.validateIndeterminate(this.component._indeterminate),this.validateValue(this.component._value),this.validateVariant(this.component._variant||this.component._type)}}const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:var(--kolibri-color-text)}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}label{cursor:pointer}input{border-color:var(--kolibri-border-color);border-width:2px;border-style:solid;line-height:24px;font-size:var(--kolibri-font-size)}.required label>span::after{content:'*';padding-left:0.125em}input:hover{border-color:var(--kolibri-color-normal)}kol-input{align-items:center;display:grid;gap:var(--kolibri-spacing);justify-items:left;width:100}kol-input.checkbox,kol-input.switch{grid-template-columns:auto 1fr}kol-input .input{display:inline-flex;order:1}kol-input .input div{display:inline-flex}kol-input .input input{margin:0px}kol-input label{order:2}kol-input.error>kol-alert,kol-input .hint{grid-column:span 2}kol-input kol-alert.error{order:3}kol-input .hint{order:4}input[type='checkbox']{appearance:none;background-color:white;cursor:pointer;transition:0.5s}input[type='checkbox'].kol-disabled:before{cursor:not-allowed}input[type='checkbox']:before{content:'';cursor:pointer}input[type='checkbox']:checked{background-color:var(--kolibri-color-primary);border-color:var(--kolibri-color-primary)}.disabled{opacity:0.33}.checkbox kol-icon,.switch kol-icon{display:none}.button label{cursor:pointer;display:inline-flex;width:auto}.button label>span>span{display:inline-flex;gap:calc(2 * var(--kolibri-spacing));place-items:center}.button input{display:none}.checkbox input[type='checkbox']{height:1.5em;width:1.5em}.checkbox input[type='checkbox']{height:1.5em;width:1.5em}.checkbox input[type='checkbox']:before{background-color:transparent;display:block;height:1.5em;position:relative;width:1.5em}.checkbox input[type='checkbox']:checked:before{background-color:transparent;border-bottom-width:3px;border-color:white;border-radius:1px;border-right-width:3px;border-style:solid;border-width:0px 3px 3px 0px;height:0.75em;left:calc(0.375em - 2px);transform:rotate(40deg) translate(-50%, -50%);top:calc(0.7125em - 2px);width:0.375em}.checkbox input[type='checkbox']:indeterminate:before{background-color:var(--kolibri-color-normal);height:0.35em;left:0.14em;top:0.45em;width:1em}.switch input[type='checkbox']{display:inline-block;height:1.7em;min-width:3.2em;position:relative;width:3.2em}.switch input[type='checkbox']:before{background-color:black;height:1.2em;left:calc(0.25em - 2px);top:calc(0.25em - 2px);position:absolute;-webkit-transition:0.5s;-moz-transition:0.5s;-ms-transition:0.5s;transition:0.5;width:1.2em}.switch input[type='checkbox']:checked:before{background-color:white;-webkit-transform:translateX(1.5em);-moz-transform:translateX(1.5em);-ms-transform:translateX(1.5em);transform:translateX(1.5em)}.switch input[type='checkbox']:indeterminate:before{background-color:var(--kolibri-color-normal);transform:translateX(0.75em)}",KolInputCheckbox=class{render(){const{ariaDiscribedBy:e}=controller$1.getRenderStates(this.state);return index.h(index.Host,null,index.h("kol-input",{class:{[this.state._variant]:!0},_alert:this.state._alert,_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:this.state._id,_required:this.state._required,_touched:this.state._touched},index.h("span",{"data-role":"button"===this.state._variant?"button":void 0,onKeyPress:"button"===this.state._variant?this.onChange:void 0,tabIndex:"button"===this.state._variant?0:void 0,slot:"label"},index.h("kol-icon",{onClick:this.onChange,_ariaLabel:"",_icon:this.state._indeterminate?this.state._icon.indeterminate:this.state._checked?this.state._icon.checked:this.state._icon.unchecked}),index.h("slot",null)),index.h("div",{slot:"input"},index.h("input",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,checked:!0===this.state._checked,disabled:!0===this.state._disabled,id:this.state._id,indeterminate:!0===this.state._indeterminate,name:this.state._name,required:!0===this.state._required,tabIndex:this.state._tabIndex,title:"",type:"checkbox",value:"string"==typeof this.state._value?this.state._value:""},this.controller.onFacade,{onChange:this.onChange})))))}constructor(e){index.registerInstance(this,e),this.catchRef=e=>{this.ref=e,reuse.propergateFocus(this.host,this.ref)},this.onChange=e=>{this._checked=!1===this._checked,this._indeterminate=!1,this.controller.setValue(e,this._checked)},this._accessKey=void 0,this._alert=!0,this._checked=!1,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._indeterminate=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._type=void 0,this._value=void 0,this._variant=void 0,this.state={_checked:!1,_icon:{checked:"fa-solid fa-check",indeterminate:"fa-solid fa-minus",unchecked:"fa-solid fa-plus"},_id:"⚠",_indeterminate:!1,_variant:"checkbox"},this.controller=new InputCheckboxController(this,"checkbox",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateChecked(e){this.controller.validateChecked(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcon(e){this.controller.validateIcon(e)}validateId(e){this.controller.validateId(e)}validateIndeterminate(e){this.controller.validateIndeterminate(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateType(e){this.controller.validateType(e)}validateValue(e){this.controller.validateValue(e)}validateVariant(e){this.controller.validateVariant(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return index.getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_checked:["validateChecked"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_indeterminate:["validateIndeterminate"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"],_variant:["validateVariant"]}}};KolInputCheckbox.style={default:defaultStyleCss},exports.kol_input_checkbox=KolInputCheckbox;

package/dist/cjs/kol-input-checkbox.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"kol-input-checkbox.entry.cjs.js","mappings":"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","names":["InputCheckboxRadioController","watchBoolean","watchValidator","isString","devHint","setState","getRenderStates","h","Host","propergateFocus"],"sources":["./src/components/input-checkbox/controller.ts","./src/components/input-checkbox/style.css?tag=kol-input-checkbox&mode=default&encapsulation=shadow","./src/components/input-checkbox/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../components';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { setState, watchBoolean, watchValidator } from '../../utils/prop.validators';\nimport { isString } from '../../utils/validator';\nimport { InputCheckboxRadioController } from '../input-radio/controller';\nimport { InputCheckboxIcon, InputCheckboxVariant, Props, Watches } from './types';\n\nexport class InputCheckboxController extends InputCheckboxRadioController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateChecked(value?: boolean): void {\n\t\twatchBoolean(this.component, '_checked', value);\n\t\tthis.setFormAssociatedValue(this.component.state._checked as string);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateIcon(value?: Stringified<InputCheckboxIcon>): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_icons',\n\t\t\t(value): boolean => {\n\t\t\t\treturn typeof value === 'object' && value !== null && (isString(value.checked, 1) || isString(value.indeterminate, 1) || isString(value.unchecked, 1));\n\t\t\t},\n\t\t\tnew Set(['InputCheckboxIcons']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateIndeterminate(value?: boolean): void {\n\t\twatchBoolean(this.component, '_indeterminate', value);\n\t}\n\n\t/**\n\t * @deprecated\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateType(value?: InputCheckboxVariant): void {\n\t\tdevHint(`The \"_type\" prop is deprecated. Use \"_variant\" instead.`);\n\t\tthis.validateVariant(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: string): void {\n\t\tsetState(this.component, '_value', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateVariant(value?: InputCheckboxVariant): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_variant',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'button' || value === 'checkbox' || value === 'switch'),\n\t\t\tnew Set(['String {button, checkbox, switch}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateChecked(this.component._checked);\n\t\tthis.validateIcon(this.component._icon);\n\t\tthis.validateIndeterminate(this.component._indeterminate);\n\t\tthis.validateValue(this.component._value);\n\t\tthis.validateVariant(this.component._variant || this.component._type);\n\t}\n}\n","@import '../input.css';\n@import './common.css';\n@import './button.css';\n@import './checkbox.css';\n@import './switch.css';\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../components';\n\nimport { InputTypeOnDefault } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputCheckboxController } from './controller';\nimport { ComponentApi, InputCheckboxIcon, InputCheckboxVariant, States } from './types';\n\n@Component({\n\ttag: 'kol-input-checkbox',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputCheckbox implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputCheckboxElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\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\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_alert={this.state._alert}\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_id={this.state._id}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t<span\n\t\t\t\t\t\tdata-role={this.state._variant === 'button' ? 'button' : undefined}\n\t\t\t\t\t\tonKeyPress={this.state._variant === 'button' ? this.onChange : undefined}\n\t\t\t\t\t\ttabIndex={this.state._variant === 'button' ? 0 : undefined}\n\t\t\t\t\t\tslot=\"label\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<kol-icon\n\t\t\t\t\t\t\tonClick={this.onChange}\n\t\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t\t_icon={this.state._indeterminate ? this.state._icon.indeterminate : this.state._checked ? this.state._icon.checked : this.state._icon.unchecked}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\taccessKey={this.state._accessKey} // by checkbox?!\n\t\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\t\tchecked={this.state._checked === true}\n\t\t\t\t\t\t\tdisabled={this.state._disabled === true}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tindeterminate={this.state._indeterminate === true}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\trequired={this.state._required === true}\n\t\t\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tvalue={typeof this.state._value === 'string' ? this.state._value : ''}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t></input>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputCheckboxController;\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 die Checkbox ausgewählt ist oder nicht.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _checked?: boolean = false;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Überschreiben der Icons für die Checkbox.\n\t */\n\t@Prop() public _icon?: Stringified<InputCheckboxIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt an, ob die Checkbox weder ausgewählt noch nicht ausgewählt ist.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _indeterminate?: boolean;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt an, ob die Checkbox ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\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, welchen Type das Input haben soll.\n\t *\n\t * @deprecated Verwende stattdessen das Attribute _variant.\n\t */\n\t@Prop() public _type?: InputCheckboxVariant;\n\n\t/**\n\t * Gibt den Wert der Checkbox an.\n\t */\n\t@Prop() public _value?: string;\n\n\t/**\n\t * Gibt an, welchen Type das Input haben soll.\n\t */\n\t@Prop() public _variant?: InputCheckboxVariant; // = 'checkbox';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_checked: false,\n\t\t_icon: {\n\t\t\tchecked: 'fa-solid fa-check',\n\t\t\tindeterminate: 'fa-solid fa-minus',\n\t\t\tunchecked: 'fa-solid fa-plus',\n\t\t},\n\t\t_id: '⚠',\n\t\t_indeterminate: false,\n\t\t_variant: 'checkbox',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputCheckboxController(this, 'checkbox', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_checked')\n\tpublic validateChecked(value?: boolean): void {\n\t\tthis.controller.validateChecked(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<InputCheckboxIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_indeterminate')\n\tpublic validateIndeterminate(value?: boolean): void {\n\t\tthis.controller.validateIndeterminate(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputCheckboxVariant): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: InputCheckboxVariant): void {\n\t\tthis.controller.validateVariant(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tthis._checked = this._checked === false;\n\t\tthis._indeterminate = false;\n\t\tthis.controller.setValue(event, this._checked);\n\t};\n}\n"],"version":3}
+{"file":"kol-input-checkbox.entry.cjs.js","mappings":"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","names":["InputCheckboxRadioController","watchBoolean","watchValidator","isString","devHint","setState","getRenderStates","h","Host","propergateFocus"],"sources":["./src/components/input-checkbox/controller.ts","./src/components/input-checkbox/style.css?tag=kol-input-checkbox&mode=default&encapsulation=shadow","./src/components/input-checkbox/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../components';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { setState, watchBoolean, watchValidator } from '../../utils/prop.validators';\nimport { isString } from '../../utils/validator';\nimport { InputCheckboxRadioController } from '../input-radio/controller';\nimport { InputCheckboxIcon, InputCheckboxVariant, Props, Watches } from './types';\n\nexport class InputCheckboxController extends InputCheckboxRadioController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateChecked(value?: boolean): void {\n\t\twatchBoolean(this.component, '_checked', value);\n\t\tthis.setFormAssociatedValue(this.component.state._checked as string);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateIcon(value?: Stringified<InputCheckboxIcon>): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_icons',\n\t\t\t(value): boolean => {\n\t\t\t\treturn typeof value === 'object' && value !== null && (isString(value.checked, 1) || isString(value.indeterminate, 1) || isString(value.unchecked, 1));\n\t\t\t},\n\t\t\tnew Set(['InputCheckboxIcons']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateIndeterminate(value?: boolean): void {\n\t\twatchBoolean(this.component, '_indeterminate', value);\n\t}\n\n\t/**\n\t * @deprecated\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateType(value?: InputCheckboxVariant): void {\n\t\tdevHint(`The \"_type\" prop is deprecated. Use \"_variant\" instead.`);\n\t\tthis.validateVariant(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: string): void {\n\t\tsetState(this.component, '_value', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateVariant(value?: InputCheckboxVariant): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_variant',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'button' || value === 'checkbox' || value === 'switch'),\n\t\t\tnew Set(['String {button, checkbox, switch}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateChecked(this.component._checked);\n\t\tthis.validateIcon(this.component._icon);\n\t\tthis.validateIndeterminate(this.component._indeterminate);\n\t\tthis.validateValue(this.component._value);\n\t\tthis.validateVariant(this.component._variant || this.component._type);\n\t}\n}\n","@import '../input.css';\n@import './common.css';\n@import './button.css';\n@import './checkbox.css';\n@import './switch.css';\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../components';\n\nimport { InputTypeOnDefault } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputCheckboxController } from './controller';\nimport { ComponentApi, InputCheckboxIcon, InputCheckboxVariant, States } from './types';\n\n@Component({\n\ttag: 'kol-input-checkbox',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputCheckbox implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputCheckboxElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\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\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_alert={this.state._alert}\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_id={this.state._id}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t<span\n\t\t\t\t\t\tdata-role={this.state._variant === 'button' ? 'button' : undefined}\n\t\t\t\t\t\tonKeyPress={this.state._variant === 'button' ? this.onChange : undefined}\n\t\t\t\t\t\ttabIndex={this.state._variant === 'button' ? 0 : undefined}\n\t\t\t\t\t\tslot=\"label\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<kol-icon\n\t\t\t\t\t\t\tonClick={this.onChange}\n\t\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t\t_icon={this.state._indeterminate ? this.state._icon.indeterminate : this.state._checked ? this.state._icon.checked : this.state._icon.unchecked}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\taccessKey={this.state._accessKey} // by checkbox?!\n\t\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\t\tchecked={this.state._checked === true}\n\t\t\t\t\t\t\tdisabled={this.state._disabled === true}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tindeterminate={this.state._indeterminate === true}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\trequired={this.state._required === true}\n\t\t\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tvalue={typeof this.state._value === 'string' ? this.state._value : ''}\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t></input>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputCheckboxController;\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 die Checkbox ausgewählt ist oder nicht.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _checked?: boolean = false;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Überschreiben der Icons für die Checkbox.\n\t */\n\t@Prop() public _icon?: Stringified<InputCheckboxIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt an, ob die Checkbox weder ausgewählt noch nicht ausgewählt ist.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _indeterminate?: boolean;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt an, ob die Checkbox ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\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, welchen Type das Input haben soll.\n\t *\n\t * @deprecated Verwende stattdessen das Attribute _variant.\n\t */\n\t@Prop() public _type?: InputCheckboxVariant;\n\n\t/**\n\t * Gibt den Wert der Checkbox an.\n\t */\n\t@Prop() public _value?: string;\n\n\t/**\n\t * Gibt an, welchen Type das Input haben soll.\n\t */\n\t@Prop() public _variant?: InputCheckboxVariant; // = 'checkbox';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_checked: false,\n\t\t_icon: {\n\t\t\tchecked: 'fa-solid fa-check',\n\t\t\tindeterminate: 'fa-solid fa-minus',\n\t\t\tunchecked: 'fa-solid fa-plus',\n\t\t},\n\t\t_id: '⚠',\n\t\t_indeterminate: false,\n\t\t_variant: 'checkbox',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputCheckboxController(this, 'checkbox', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_checked')\n\tpublic validateChecked(value?: boolean): void {\n\t\tthis.controller.validateChecked(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<InputCheckboxIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_indeterminate')\n\tpublic validateIndeterminate(value?: boolean): void {\n\t\tthis.controller.validateIndeterminate(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputCheckboxVariant): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: InputCheckboxVariant): void {\n\t\tthis.controller.validateVariant(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tthis._checked = this._checked === false;\n\t\tthis._indeterminate = false;\n\t\tthis.controller.setValue(event, this._checked);\n\t};\n}\n"],"version":3}

package/dist/cjs/kol-input-color.cjs.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),reuse=require("./reuse-bbd0b4e7.js"),controller=require("./controller-1c9293c6.js"),prop_validators=require("./prop.validators-7154e3f9.js"),controllerIcon=require("./controller-icon-7980fc53.js");require("./a11y.tipps-4af0092d.js"),require("./dev.utils-7123fb34.js"),require("./tab-index-0ff2fc1d.js"),require("./index-cc5674d0.js"),require("./icon-d0e921c9.js");class InputColorController extends controllerIcon.InputIconController{constructor(t,e,i){super(t,e,i),this.component=t}validateAutoComplete(t){prop_validators.watchValidator(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){prop_validators.watchJsonArrayString(this.component,"_list",(t=>"string"==typeof t),t)}validateValue(t){prop_validators.watchString(this.component,"_value",t)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateList(this.component._list),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:#999}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}kol-input{display:grid;gap:calc(2 * var(--kolibri-spacing))}input,select,textarea{background-color:white;border-color:var(--kolibri-border-color);border-radius:var(--kolibri-border-radius);border-style:solid;border-width:var(--kolibri-border-width);font-size:1em;font-family:var(--kolibri-font-family-sans);line-height:2.5em;overflow:hidden;width:100%}input,select:not([multiple]){height:2.75em}input::placeholder{color:var(--kolibri-color-normal)}input:hover{border-color:var(--kolibri-color-primary)}input:not([type='color']):read-only,input:disabled,select:read-only,select:disabled,textarea:read-only,textarea:disabled{cursor:not-allowed}.required label>span::after{content:'*';padding-left:var(--kolibri-spacing)}.icons{display:flex;justify-content:space-between;height:0}.icons>kol-icon{display:grid;height:44px;padding:0 0.75em;place-items:center}.icon-left input,.icon-left select{padding-left:2em}.icon-right input,.icon-right select{padding-right:2em}kol-button-wc{position:relative;float:right;z-index:1000;margin-top:-44px}kol-button-wc button{background-color:transparent;display:inline-block;min-height:44px;min-width:44px}.icon-right kol-button-wc{margin-right:44px}.disabled{opacity:0.5}select[multiple],textarea{overflow:auto}textarea{display:block}select option{margin:var(--kolibri-spacing) 0;padding:0.5em;border-radius:0.25em;cursor:pointer}select option:disabled{cursor:not-allowed}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled){background-color:var(--kolibri-color-primary);color:white}",KolInputColor=class{render(){const{ariaDiscribedBy:t}=controller.getRenderStates(this.state),e=Array.isArray(this.state._list)&&this.state._list.length>0;return index.h(index.Host,null,index.h("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_smartButton:this.state._smartButton,_touched:this.state._touched},index.h("span",{slot:"label"},index.h("slot",null)),index.h("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.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:e?`${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){index.registerInstance(this,t),this.catchRef=t=>{this.ref=t,reuse.propergateFocus(this.host,this.ref)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._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:"⚠",_list:[]},this.controller=new InputColorController(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)}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 index.getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};KolInputColor.style={default:defaultStyleCss},exports.kol_input_color=KolInputColor;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),reuse=require("./reuse-bbd0b4e7.js"),controller=require("./controller-1c9293c6.js"),prop_validators=require("./prop.validators-7154e3f9.js"),controllerIcon=require("./controller-icon-7980fc53.js");require("./a11y.tipps-4af0092d.js"),require("./dev.utils-7123fb34.js"),require("./tab-index-0ff2fc1d.js"),require("./index-cc5674d0.js"),require("./icon-d0e921c9.js");class InputColorController extends controllerIcon.InputIconController{constructor(t,e,i){super(t,e,i),this.component=t}validateAutoComplete(t){prop_validators.watchValidator(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){prop_validators.watchJsonArrayString(this.component,"_list",(t=>"string"==typeof t),t)}validateValue(t){prop_validators.watchString(this.component,"_value",t)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateList(this.component._list),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:var(--kolibri-color-text)}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}kol-input{display:grid;gap:calc(2 * var(--kolibri-spacing))}input,select,textarea{background-color:white;border-color:var(--kolibri-border-color);border-radius:var(--kolibri-border-radius);border-style:solid;border-width:var(--kolibri-border-width);font-size:1em;font-family:var(--kolibri-font-family-sans);line-height:2.5em;overflow:hidden;width:100%}input,select:not([multiple]){height:2.75em}input::placeholder{color:var(--kolibri-color-normal)}input:hover{border-color:var(--kolibri-color-primary)}input:not([type='color']):read-only,input:disabled,select:read-only,select:disabled,textarea:read-only,textarea:disabled{cursor:not-allowed}.required label>span::after{content:'*';padding-left:var(--kolibri-spacing)}.icons{display:flex;justify-content:space-between;height:0}.icons>kol-icon{display:grid;height:44px;padding:0 0.75em;place-items:center}.icon-left input,.icon-left select{padding-left:2em}.icon-right input,.icon-right select{padding-right:2em}kol-button-wc{position:relative;float:right;z-index:1000;margin-top:-44px}kol-button-wc button{background-color:transparent;display:inline-block;min-height:44px;min-width:44px}.icon-right kol-button-wc{margin-right:44px}.disabled{opacity:0.5}select[multiple],textarea{overflow:auto}textarea{display:block}select option{margin:var(--kolibri-spacing) 0;padding:0.5em;border-radius:0.25em;cursor:pointer}select option:disabled{cursor:not-allowed}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled){background-color:var(--kolibri-color-primary);color:white}",KolInputColor=class{render(){const{ariaDiscribedBy:t}=controller.getRenderStates(this.state),e=Array.isArray(this.state._list)&&this.state._list.length>0;return index.h(index.Host,null,index.h("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_smartButton:this.state._smartButton,_touched:this.state._touched},index.h("span",{slot:"label"},index.h("slot",null)),index.h("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.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:e?`${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){index.registerInstance(this,t),this.catchRef=t=>{this.ref=t,reuse.propergateFocus(this.host,this.ref)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._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:"⚠",_list:[]},this.controller=new InputColorController(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)}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 index.getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};KolInputColor.style={default:defaultStyleCss},exports.kol_input_color=KolInputColor;

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

@@ -1 +1 @@
-{"file":"kol-input-color.entry.cjs.js","mappings":"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","names":["InputIconController","watchValidator","watchJsonArrayString","watchString","getRenderStates","h","Host","propergateFocus"],"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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateList(this.component._list);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import '../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';\n\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputColorController } from './controller';\nimport { ComponentApi, States } from './types';\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\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_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>\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled === 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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt 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 einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t\t_list: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputColorController(this, 'color', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n}\n"],"version":3}
+{"file":"kol-input-color.entry.cjs.js","mappings":"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","names":["InputIconController","watchValidator","watchJsonArrayString","watchString","getRenderStates","h","Host","propergateFocus"],"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\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateList(this.component._list);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import '../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';\n\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { propergateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputColorController } from './controller';\nimport { ComponentApi, States } from './types';\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\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_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>\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled === 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 * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt 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 einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: '⚠',\n\t\t_list: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputColorController(this, 'color', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t}\n}\n"],"version":3}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),prop_validators=require("./prop.validators-7154e3f9.js"),reuse=require("./reuse-bbd0b4e7.js");require("./index-cc5674d0.js"),require("./a11y.tipps-4af0092d.js"),require("./dev.utils-7123fb34.js");const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:#999}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}kol-input{display:grid;gap:calc(2 * var(--kolibri-spacing))}input,select,textarea{background-color:white;border-color:var(--kolibri-border-color);border-radius:var(--kolibri-border-radius);border-style:solid;border-width:var(--kolibri-border-width);font-size:1em;font-family:var(--kolibri-font-family-sans);line-height:2.5em;overflow:hidden;width:100%}input,select:not([multiple]){height:2.75em}input::placeholder{color:var(--kolibri-color-normal)}input:hover{border-color:var(--kolibri-color-primary)}input:not([type='color']):read-only,input:disabled,select:read-only,select:disabled,textarea:read-only,textarea:disabled{cursor:not-allowed}.required label>span::after{content:'*';padding-left:var(--kolibri-spacing)}.icons{display:flex;justify-content:space-between;height:0}.icons>kol-icon{display:grid;height:44px;padding:0 0.75em;place-items:center}.icon-left input,.icon-left select{padding-left:2em}.icon-right input,.icon-right select{padding-right:2em}kol-button-wc{position:relative;float:right;z-index:1000;margin-top:-44px}kol-button-wc button{background-color:transparent;display:inline-block;min-height:44px;min-width:44px}.icon-right kol-button-wc{margin-right:44px}.disabled{opacity:0.5}select[multiple],textarea{overflow:auto}textarea{display:block}select option{margin:var(--kolibri-spacing) 0;padding:0.5em;border-radius:0.25em;cursor:pointer}select option:disabled{cursor:not-allowed}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled){background-color:var(--kolibri-color-primary);color:white}kol-input-number{display:block}",KolInputDate=class{constructor(e){index.registerInstance(this,e),this.catchRef=e=>{this.ref=e,reuse.propergateFocus(this.host,this.ref)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="date",this._value=void 0,this.state={}}render(){return index.h(index.Host,null,index.h("kol-input-number",{ref:this.catchRef,_accessKey:this._accessKey,_alert:this._alert,_autoComplete:this._autoComplete,_disabled:this._disabled,_error:this._error,_hideLabel:this._hideLabel,_hint:this._hint,_icon:this._icon,_id:this._id,_list:this._list,_max:this.state._max,_min:this.state._min,_name:this._name,_on:this.state._on,_readOnly:this._readOnly,_required:this._required,_smartButton:this._smartButton,_step:this._step,_tabIndex:this._tabIndex,_touched:this._touched,_type:this._type,_value:this.state._value},index.h("slot",null)))}valueAsIsoDate(e,t){const i=null!=e?e:t;if("string"==typeof i)return i;if("object"==typeof i&&i instanceof Date)switch(this._type){case"date":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}`;case"datetime-local":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}T${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"month":return`${i.getFullYear()}-${i.getMonth()+1}`;case"time":return void 0===this._step||"string"==typeof this._step&&"60"===this._step||"number"==typeof this._step&&60===this._step?`${i.getHours()}:${i.getMinutes()}`:`${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"week":throw new Error("Auto convert to week is not supported!")}return null===e?null:void 0}validateDateString(e){switch(this._type){case"date":return KolInputDate.isoDateRegex.test(e);case"datetime-local":return KolInputDate.isoLocalDateTimeRegex.test(e);case"month":return KolInputDate.isoMonthRegex.test(e);case"time":return KolInputDate.isoTimeRegex.test(e);case"week":return KolInputDate.isoWeekRegex.test(e)}}validateOn(e){prop_validators.setState(this,"_on",Object.assign(Object.assign({},e),{onChange:(t,i)=>{this._value=i,(null==e?void 0:e.onChange)&&e.onChange(t,i)}}))}validateMax(e){prop_validators.watchValidator(this,"_max",(e=>void 0===e||null!==e&&this.validateDateString(e)),new Set(["Iso8601","Date"]),this.valueAsIsoDate(e,"date"===this._type||"month"===this._type||"datetime-local"===this._type?KolInputDate.DEFAULT_MAX_DATE:void 0))}validateMin(e){prop_validators.watchValidator(this,"_min",(e=>void 0===e||null!==e&&this.validateDateString(e)),new Set(["Iso8601","Date"]),this.valueAsIsoDate(e))}validateValue(e){prop_validators.watchValidator(this,"_value",(e=>null==e||this.validateDateString(e)),new Set(["Iso8601","Date"]),this.valueAsIsoDate(e))}componentWillLoad(){this.validateOn(this._on),this.validateMax(this._max),this.validateMin(this._min),this.validateValue(this._value)}get host(){return index.getElement(this)}static get watchers(){return{_on:["validateOn"],_max:["validateMax"],_min:["validateMin"],_value:["validateValue"]}}};KolInputDate.DEFAULT_MAX_DATE=new Date(9999,11,31,23,59,59),KolInputDate.isoDateRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])/,KolInputDate.isoLocalDateTimeRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])[T ][0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,KolInputDate.isoMonthRegex=/^\d{4}-([0]\d|1[0-2])/,KolInputDate.isoTimeRegex=/^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,KolInputDate.isoWeekRegex=/^\d{4}-W(?:[0-4]\d|5[0-3])$/,KolInputDate.style={default:defaultStyleCss},exports.kol_input_date=KolInputDate;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),prop_validators=require("./prop.validators-7154e3f9.js"),reuse=require("./reuse-bbd0b4e7.js");require("./index-cc5674d0.js"),require("./a11y.tipps-4af0092d.js"),require("./dev.utils-7123fb34.js");const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:var(--kolibri-color-text)}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}kol-input{display:grid;gap:calc(2 * var(--kolibri-spacing))}input,select,textarea{background-color:white;border-color:var(--kolibri-border-color);border-radius:var(--kolibri-border-radius);border-style:solid;border-width:var(--kolibri-border-width);font-size:1em;font-family:var(--kolibri-font-family-sans);line-height:2.5em;overflow:hidden;width:100%}input,select:not([multiple]){height:2.75em}input::placeholder{color:var(--kolibri-color-normal)}input:hover{border-color:var(--kolibri-color-primary)}input:not([type='color']):read-only,input:disabled,select:read-only,select:disabled,textarea:read-only,textarea:disabled{cursor:not-allowed}.required label>span::after{content:'*';padding-left:var(--kolibri-spacing)}.icons{display:flex;justify-content:space-between;height:0}.icons>kol-icon{display:grid;height:44px;padding:0 0.75em;place-items:center}.icon-left input,.icon-left select{padding-left:2em}.icon-right input,.icon-right select{padding-right:2em}kol-button-wc{position:relative;float:right;z-index:1000;margin-top:-44px}kol-button-wc button{background-color:transparent;display:inline-block;min-height:44px;min-width:44px}.icon-right kol-button-wc{margin-right:44px}.disabled{opacity:0.5}select[multiple],textarea{overflow:auto}textarea{display:block}select option{margin:var(--kolibri-spacing) 0;padding:0.5em;border-radius:0.25em;cursor:pointer}select option:disabled{cursor:not-allowed}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled){background-color:var(--kolibri-color-primary);color:white}kol-input-number{display:block}",KolInputDate=class{constructor(e){index.registerInstance(this,e),this.catchRef=e=>{this.ref=e,reuse.propergateFocus(this.host,this.ref)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="date",this._value=void 0,this.state={}}render(){return index.h(index.Host,null,index.h("kol-input-number",{ref:this.catchRef,_accessKey:this._accessKey,_alert:this._alert,_autoComplete:this._autoComplete,_disabled:this._disabled,_error:this._error,_hideLabel:this._hideLabel,_hint:this._hint,_icon:this._icon,_id:this._id,_list:this._list,_max:this.state._max,_min:this.state._min,_name:this._name,_on:this.state._on,_readOnly:this._readOnly,_required:this._required,_smartButton:this._smartButton,_step:this._step,_tabIndex:this._tabIndex,_touched:this._touched,_type:this._type,_value:this.state._value},index.h("slot",null)))}valueAsIsoDate(e,t){const i=null!=e?e:t;if("string"==typeof i)return i;if("object"==typeof i&&i instanceof Date)switch(this._type){case"date":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}`;case"datetime-local":return`${i.getFullYear()}-${i.getMonth()+1}-${i.getDate()}T${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"month":return`${i.getFullYear()}-${i.getMonth()+1}`;case"time":return void 0===this._step||"string"==typeof this._step&&"60"===this._step||"number"==typeof this._step&&60===this._step?`${i.getHours()}:${i.getMinutes()}`:`${i.getHours()}:${i.getMinutes()}:${i.getSeconds()}`;case"week":throw new Error("Auto convert to week is not supported!")}return null===e?null:void 0}validateDateString(e){switch(this._type){case"date":return KolInputDate.isoDateRegex.test(e);case"datetime-local":return KolInputDate.isoLocalDateTimeRegex.test(e);case"month":return KolInputDate.isoMonthRegex.test(e);case"time":return KolInputDate.isoTimeRegex.test(e);case"week":return KolInputDate.isoWeekRegex.test(e)}}validateOn(e){prop_validators.setState(this,"_on",Object.assign(Object.assign({},e),{onChange:(t,i)=>{!!i!=!!this._value&&(this._value=i),(null==e?void 0:e.onChange)&&e.onChange(t,i)}}))}validateMax(e){prop_validators.watchValidator(this,"_max",(e=>void 0===e||null!==e&&this.validateDateString(e)),new Set(["Iso8601","Date"]),this.valueAsIsoDate(e,"date"===this._type||"month"===this._type||"datetime-local"===this._type?KolInputDate.DEFAULT_MAX_DATE:void 0))}validateMin(e){prop_validators.watchValidator(this,"_min",(e=>void 0===e||null!==e&&this.validateDateString(e)),new Set(["Iso8601","Date"]),this.valueAsIsoDate(e))}validateValue(e){prop_validators.watchValidator(this,"_value",(e=>null==e||this.validateDateString(e)),new Set(["Iso8601","Date"]),this.valueAsIsoDate(e))}componentWillLoad(){this.validateOn(this._on),this.validateMax(this._max),this.validateMin(this._min),this.validateValue(this._value)}get host(){return index.getElement(this)}static get watchers(){return{_on:["validateOn"],_max:["validateMax"],_min:["validateMin"],_value:["validateValue"]}}};KolInputDate.DEFAULT_MAX_DATE=new Date(9999,11,31,23,59,59),KolInputDate.isoDateRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])/,KolInputDate.isoLocalDateTimeRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])[T ][0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,KolInputDate.isoMonthRegex=/^\d{4}-([0]\d|1[0-2])/,KolInputDate.isoTimeRegex=/^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,KolInputDate.isoWeekRegex=/^\d{4}-W(?:[0-4]\d|5[0-3])$/,KolInputDate.style={default:defaultStyleCss},exports.kol_input_date=KolInputDate;

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

@@ -1 +1 @@
-{"file":"kol-input-date.entry.cjs.js","mappings":";;;;;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,khJAAkhJ;;MCkB7hJ,YAAY;;;IAaP,aAAQ,GAAG,CAAC,GAA+B;MAC3D,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;MACfA,qBAAe,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;KACrC,CAAC;;kBA4CgE,IAAI;;;;;iBAyBtC,EAAE;;;;;;;;;;;;;oBAiEkC,KAAK;iBAKnC,MAAM;;iBAUZ,EAAE;;EAnJ3B,MAAM;IACZ,QACCC,QAACC,UAAI,QACJD,8BACC,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,IAEzBA,qBAAQ,CACU,CACb,EACN;GACF;EAqHO,cAAc,CAAC,KAA6B,EAAE,YAAmB;IACxE,MAAM,CAAC,GAA+B,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,YAAY,CAAC;IAC5D,IAAI,OAAO,CAAC,KAAK,QAAQ,EAAE;MAC1B,OAAO,CAAC,CAAC;KACT;IACD,IAAI,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,YAAY,IAAI,EAAE;MAC/C,QAAQ,IAAI,CAAC,KAAK;QACjB,KAAK,MAAM;UACV,OAAO,GAAG,CAAC,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC;QAChE,KAAK,gBAAgB;UACpB,OAAO,GAAG,CAAC,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC;QACpH,KAAK,OAAO;UACX,OAAO,GAAG,CAAC,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,EAAE,CAAC;QACjD,KAAK,MAAM;UAEV,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,KAAK,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC,EAAE;YACjJ,OAAO,GAAG,CAAC,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC;WAC3C;eAAM;YACN,OAAO,GAAG,CAAC,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC;WAC7D;QACF,KAAK,MAAM;UACV,MAAM,IAAI,KAAK,CAAC,wCAAwC,CAAC,CAAC;OAC3D;KACD;IACD,IAAI,KAAK,KAAK,IAAI,EAAE;MACnB,OAAO,IAAI,CAAC;KACZ;IACD,OAAO,SAAS,CAAC;GACjB;EAEO,kBAAkB,CAAC,KAAc;IACxC,QAAQ,IAAI,CAAC,KAAK;MACjB,KAAK,MAAM;QACV,OAAO,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MAC9C,KAAK,gBAAgB;QACpB,OAAO,YAAY,CAAC,qBAAqB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MACvD,KAAK,OAAO;QACX,OAAO,YAAY,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MAC/C,KAAK,MAAM;QACV,OAAO,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MAC9C,KAAK,MAAM;QACV,OAAO,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC9C;GACD;EAGM,UAAU,CAAC,KAA0B;IAC3CE,wBAAQ,CAAC,IAAI,EAAE,KAAK,kCAChB,KAAK,KACR,QAAQ,EAAE,CAAC,CAAQ,EAAE,CAAU;QAC9B,IAAI,CAAC,MAAM,GAAG,CAAY,CAAC;QAC3B,IAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,EAAE;UACpB,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;SACrB;OACD,IACA,CAAC;GACH;EAMM,WAAW,CAAC,KAAsB;IACxCC,8BAAc,CACb,IAAI,EACJ,MAAM,EACN,CAAC,KAAK,KAAc,KAAK,KAAK,SAAS,KAAK,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,EAC7F,IAAI,GAAG,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,EAC5B,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,KAAK,MAAM,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,IAAI,IAAI,CAAC,KAAK,KAAK,gBAAgB,GAAG,YAAY,CAAC,gBAAgB,GAAG,SAAS,CAAC,CAC1J,CAAC;GACF;EAMM,WAAW,CAAC,KAAsB;IACxCA,8BAAc,CACb,IAAI,EACJ,MAAM,EACN,CAAC,KAAK,KAAc,KAAK,KAAK,SAAS,KAAK,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,EAC7F,IAAI,GAAG,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,EAC5B,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAC1B,CAAC;GACF;EAMM,aAAa,CAAC,KAA6B;IACjDA,8BAAc,CACb,IAAI,EACJ,QAAQ,EACR,CAAC,KAAK,KAAc,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAC3F,IAAI,GAAG,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,EAC5B,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAC1B,CAAC;GACF;EAKM,iBAAiB;IACvB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC1B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;;;;;;;;;AA/QuB,6BAAgB,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;AAGtD,yBAAY,GAAG,uCAAuC,CAAC;AACvD,kCAAqB,GAAG,+EAA+E,CAAC;AACxG,0BAAa,GAAG,uBAAuB,CAAC;AACxC,yBAAY,GAAG,uCAAuC,CAAC;AACvD,yBAAY,GAAG,6BAA6B,CAAC;;;;;;;","names":["propergateFocus","h","Host","setState","watchValidator"],"sources":["./src/components/input-date/style.css?tag=kol-input-date&mode=default&encapsulation=shadow","./src/components/input-date/component.tsx"],"sourcesContent":["@import '../input-line.css';\n\nkol-input-number {\n\tdisplay: block;\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 { InputDateType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { setState, watchValidator } from '../../utils/prop.validators';\nimport { propergateFocus } from '../../utils/reuse';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-date',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputDate implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputDateElement;\n\tprivate ref?: HTMLKolInputNumberElement;\n\n\tprivate static readonly DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);\n\n\t// test: https://regex101.com/r/NTVh4L/1\n\tprivate static readonly isoDateRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])/;\n\tprivate static readonly isoLocalDateTimeRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])[T ][0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoMonthRegex = /^\\d{4}-([0]\\d|1[0-2])/;\n\tprivate static readonly isoTimeRegex = /^[0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoWeekRegex = /^\\d{4}-W(?:[0-4]\\d|5[0-3])$/;\n\n\tprivate readonly catchRef = (ref?: HTMLKolInputNumberElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input-number\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_alert={this._alert}\n\t\t\t\t\t_autoComplete={this._autoComplete}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_error={this._error}\n\t\t\t\t\t_hideLabel={this._hideLabel}\n\t\t\t\t\t_hint={this._hint}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_list={this._list}\n\t\t\t\t\t_max={this.state._max}\n\t\t\t\t\t_min={this.state._min}\n\t\t\t\t\t_name={this._name}\n\t\t\t\t\t_on={this.state._on}\n\t\t\t\t\t_readOnly={this._readOnly}\n\t\t\t\t\t_required={this._required}\n\t\t\t\t\t_smartButton={this._smartButton}\n\t\t\t\t\t_step={this._step}\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_touched={this._touched}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this.state._value}\n\t\t\t\t>\n\t\t\t\t\t<slot />\n\t\t\t\t</kol-input-number>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Datumswert an.\n\t */\n\t@Prop() public _max?: Iso8601 | Date;\n\n\t/**\n\t * Gibt den kleinstmöglichen Datumswert an.\n\t */\n\t@Prop() public _min?: Iso8601 | Date;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt die Schrittweite der Wertveränderung an\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Typ des Eingabefeldes an.\n\t */\n\t@Prop() public _type: InputDateType = 'date';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: Iso8601 | Date | null;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {};\n\n\tprivate valueAsIsoDate(value?: Iso8601 | Date | null, defaultValue?: Date): Iso8601 | null | undefined {\n\t\tconst v: Iso8601 | Date | undefined = value ?? defaultValue;\n\t\tif (typeof v === 'string') {\n\t\t\treturn v;\n\t\t}\n\t\tif (typeof v === 'object' && v instanceof Date) {\n\t\t\tswitch (this._type) {\n\t\t\t\tcase 'date':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}`;\n\t\t\t\tcase 'datetime-local':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}T${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\tcase 'month':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}`;\n\t\t\t\tcase 'time':\n\t\t\t\t\t// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time#using_the_step_attribute\n\t\t\t\t\tif (this._step === undefined || (typeof this._step === 'string' && this._step === '60') || (typeof this._step === 'number' && this._step === 60)) {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\t\t}\n\t\t\t\tcase 'week':\n\t\t\t\t\tthrow new Error('Auto convert to week is not supported!');\n\t\t\t}\n\t\t}\n\t\tif (value === null) {\n\t\t\treturn null;\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tprivate validateDateString(value: Iso8601): boolean {\n\t\tswitch (this._type) {\n\t\t\tcase 'date':\n\t\t\t\treturn KolInputDate.isoDateRegex.test(value);\n\t\t\tcase 'datetime-local':\n\t\t\t\treturn KolInputDate.isoLocalDateTimeRegex.test(value);\n\t\t\tcase 'month':\n\t\t\t\treturn KolInputDate.isoMonthRegex.test(value);\n\t\t\tcase 'time':\n\t\t\t\treturn KolInputDate.isoTimeRegex.test(value);\n\t\t\tcase 'week':\n\t\t\t\treturn KolInputDate.isoWeekRegex.test(value);\n\t\t}\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault) {\n\t\tsetState(this, '_on', {\n\t\t\t...value,\n\t\t\tonChange: (e: Event, v: unknown) => {\n\t\t\t\tthis._value = v as Iso8601;\n\t\t\t\tif (value?.onChange) {\n\t\t\t\t\tvalue.onChange(e, v);\n\t\t\t\t}\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_max',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.valueAsIsoDate(value, this._type === 'date' || this._type === 'month' || this._type === 'datetime-local' ? KolInputDate.DEFAULT_MAX_DATE : undefined)\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_min')\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_min',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.valueAsIsoDate(value)\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_value',\n\t\t\t(value): boolean => value === undefined || value === null || this.validateDateString(value),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.valueAsIsoDate(value)\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOn(this._on);\n\t\tthis.validateMax(this._max);\n\t\tthis.validateMin(this._min);\n\t\tthis.validateValue(this._value);\n\t}\n}\n"],"version":3}
+{"file":"kol-input-date.entry.cjs.js","mappings":"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","names":["propergateFocus","h","Host","setState","watchValidator"],"sources":["./src/components/input-date/style.css?tag=kol-input-date&mode=default&encapsulation=shadow","./src/components/input-date/component.tsx"],"sourcesContent":["@import '../input-line.css';\n\nkol-input-number {\n\tdisplay: block;\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 { InputDateType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { setState, watchValidator } from '../../utils/prop.validators';\nimport { propergateFocus } from '../../utils/reuse';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { ComponentApi, States } from './types';\n\n@Component({\n\ttag: 'kol-input-date',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputDate implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputDateElement;\n\tprivate ref?: HTMLKolInputNumberElement;\n\n\tprivate static readonly DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);\n\n\t// test: https://regex101.com/r/NTVh4L/1\n\tprivate static readonly isoDateRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])/;\n\tprivate static readonly isoLocalDateTimeRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])[T ][0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoMonthRegex = /^\\d{4}-([0]\\d|1[0-2])/;\n\tprivate static readonly isoTimeRegex = /^[0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoWeekRegex = /^\\d{4}-W(?:[0-4]\\d|5[0-3])$/;\n\n\tprivate readonly catchRef = (ref?: HTMLKolInputNumberElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input-number\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_alert={this._alert}\n\t\t\t\t\t_autoComplete={this._autoComplete}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_error={this._error}\n\t\t\t\t\t_hideLabel={this._hideLabel}\n\t\t\t\t\t_hint={this._hint}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_list={this._list}\n\t\t\t\t\t_max={this.state._max}\n\t\t\t\t\t_min={this.state._min}\n\t\t\t\t\t_name={this._name}\n\t\t\t\t\t_on={this.state._on}\n\t\t\t\t\t_readOnly={this._readOnly}\n\t\t\t\t\t_required={this._required}\n\t\t\t\t\t_smartButton={this._smartButton}\n\t\t\t\t\t_step={this._step}\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_touched={this._touched}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this.state._value}\n\t\t\t\t>\n\t\t\t\t\t<slot />\n\t\t\t\t</kol-input-number>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Datumswert an.\n\t */\n\t@Prop() public _max?: Iso8601 | Date;\n\n\t/**\n\t * Gibt den kleinstmöglichen Datumswert an.\n\t */\n\t@Prop() public _min?: Iso8601 | Date;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt die Schrittweite der Wertveränderung an\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Typ des Eingabefeldes an.\n\t */\n\t@Prop() public _type: InputDateType = 'date';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true }) public _value?: Iso8601 | Date | null;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {};\n\n\tprivate valueAsIsoDate(value?: Iso8601 | Date | null, defaultValue?: Date): Iso8601 | null | undefined {\n\t\tconst v: Iso8601 | Date | undefined = value ?? defaultValue;\n\t\tif (typeof v === 'string') {\n\t\t\treturn v;\n\t\t}\n\t\tif (typeof v === 'object' && v instanceof Date) {\n\t\t\tswitch (this._type) {\n\t\t\t\tcase 'date':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}`;\n\t\t\t\tcase 'datetime-local':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}-${v.getDate()}T${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\tcase 'month':\n\t\t\t\t\treturn `${v.getFullYear()}-${v.getMonth() + 1}`;\n\t\t\t\tcase 'time':\n\t\t\t\t\t// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time#using_the_step_attribute\n\t\t\t\t\tif (this._step === undefined || (typeof this._step === 'string' && this._step === '60') || (typeof this._step === 'number' && this._step === 60)) {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn `${v.getHours()}:${v.getMinutes()}:${v.getSeconds()}`;\n\t\t\t\t\t}\n\t\t\t\tcase 'week':\n\t\t\t\t\tthrow new Error('Auto convert to week is not supported!');\n\t\t\t}\n\t\t}\n\t\tif (value === null) {\n\t\t\treturn null;\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tprivate validateDateString(value: Iso8601): boolean {\n\t\tswitch (this._type) {\n\t\t\tcase 'date':\n\t\t\t\treturn KolInputDate.isoDateRegex.test(value);\n\t\t\tcase 'datetime-local':\n\t\t\t\treturn KolInputDate.isoLocalDateTimeRegex.test(value);\n\t\t\tcase 'month':\n\t\t\t\treturn KolInputDate.isoMonthRegex.test(value);\n\t\t\tcase 'time':\n\t\t\t\treturn KolInputDate.isoTimeRegex.test(value);\n\t\t\tcase 'week':\n\t\t\t\treturn KolInputDate.isoWeekRegex.test(value);\n\t\t}\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault) {\n\t\tsetState(this, '_on', {\n\t\t\t...value,\n\t\t\tonChange: (e: Event, v: unknown) => {\n\t\t\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\t\t\tif (!!v !== !!this._value) {\n\t\t\t\t\tthis._value = v as Iso8601;\n\t\t\t\t}\n\n\t\t\t\tif (value?.onChange) {\n\t\t\t\t\tvalue.onChange(e, v);\n\t\t\t\t}\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_max',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.valueAsIsoDate(value, this._type === 'date' || this._type === 'month' || this._type === 'datetime-local' ? KolInputDate.DEFAULT_MAX_DATE : undefined)\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_min')\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_min',\n\t\t\t(value): boolean => value === undefined || (value !== null && this.validateDateString(value)),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.valueAsIsoDate(value)\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_value',\n\t\t\t(value): boolean => value === undefined || value === null || this.validateDateString(value),\n\t\t\tnew Set(['Iso8601', 'Date']),\n\t\t\tthis.valueAsIsoDate(value)\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOn(this._on);\n\t\tthis.validateMax(this._max);\n\t\tthis.validateMin(this._min);\n\t\tthis.validateValue(this._value);\n\t}\n}\n"],"version":3}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),reuse=require("./reuse-bbd0b4e7.js"),controller$1=require("./controller-7254416e.js"),controller$2=require("./controller-1c9293c6.js"),prop_validators=require("./prop.validators-7154e3f9.js"),controller=require("./controller-af70d3a1.js");require("./a11y.tipps-4af0092d.js"),require("./dev.utils-7123fb34.js"),require("./tab-index-0ff2fc1d.js"),require("./index-cc5674d0.js"),require("./controller-2176883f.js"),require("./controller-icon-7980fc53.js"),require("./icon-d0e921c9.js");class InputEmailController extends controller.InputTextEmailController{constructor(e,t,i){super(e,t,i),this.component=e}validateMultiple(e){prop_validators.watchBoolean(this.component,"_multiple",e)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:#999}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}kol-input{display:grid;gap:calc(2 * var(--kolibri-spacing))}input,select,textarea{background-color:white;border-color:var(--kolibri-border-color);border-radius:var(--kolibri-border-radius);border-style:solid;border-width:var(--kolibri-border-width);font-size:1em;font-family:var(--kolibri-font-family-sans);line-height:2.5em;overflow:hidden;width:100%}input,select:not([multiple]){height:2.75em}input::placeholder{color:var(--kolibri-color-normal)}input:hover{border-color:var(--kolibri-color-primary)}input:not([type='color']):read-only,input:disabled,select:read-only,select:disabled,textarea:read-only,textarea:disabled{cursor:not-allowed}.required label>span::after{content:'*';padding-left:var(--kolibri-spacing)}.icons{display:flex;justify-content:space-between;height:0}.icons>kol-icon{display:grid;height:44px;padding:0 0.75em;place-items:center}.icon-left input,.icon-left select{padding-left:2em}.icon-right input,.icon-right select{padding-right:2em}kol-button-wc{position:relative;float:right;z-index:1000;margin-top:-44px}kol-button-wc button{background-color:transparent;display:inline-block;min-height:44px;min-width:44px}.icon-right kol-button-wc{margin-right:44px}.disabled{opacity:0.5}select[multiple],textarea{overflow:auto}textarea{display:block}select option{margin:var(--kolibri-spacing) 0;padding:0.5em;border-radius:0.25em;cursor:pointer}select option:disabled{cursor:not-allowed}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled){background-color:var(--kolibri-color-primary);color:white}",KolInputEmail=class{render(){const{ariaDiscribedBy:e}=controller$2.getRenderStates(this.state),t=Array.isArray(this.state._list)&&this.state._list.length>0;return index.h(index.Host,null,index.h("kol-input",{_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},index.h("span",{slot:"label"},index.h("slot",null)),index.h("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,multiple:this.state._multiple,id:this.state._id,list:t?`${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(e){index.registerInstance(this,e),this.catchRef=e=>{this.ref=e,reuse.propergateFocus(this.host,this.ref)},this.onKeyUp=e=>{"Enter"===e.code?controller$1.propergateSubmitEventToForm({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(e)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._maxLength=void 0,this._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",_id:"⚠",_list:[]},this.controller=new InputEmailController(this,"email",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateAutoComplete(e){this.controller.validateAutoComplete(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcon(e){this.controller.validateIcon(e)}validateId(e){this.controller.validateId(e)}validateList(e){this.controller.validateList(e)}validateMaxLength(e){this.controller.validateMaxLength(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validatePattern(e){this.controller.validatePattern(e)}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateReadOnly(e){this.controller.validateReadOnly(e)}validateRequired(e){this.controller.validateRequired(e)}validateSize(e){this.controller.validateSize(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return index.getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_maxLength:["validateMaxLength"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};KolInputEmail.style={default:defaultStyleCss},exports.kol_input_email=KolInputEmail;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const index=require("./index-29c5d3c6.js"),reuse=require("./reuse-bbd0b4e7.js"),controller$1=require("./controller-7254416e.js"),controller$2=require("./controller-1c9293c6.js"),prop_validators=require("./prop.validators-7154e3f9.js"),controller=require("./controller-af70d3a1.js");require("./a11y.tipps-4af0092d.js"),require("./dev.utils-7123fb34.js"),require("./tab-index-0ff2fc1d.js"),require("./index-cc5674d0.js"),require("./controller-2176883f.js"),require("./controller-icon-7980fc53.js"),require("./icon-d0e921c9.js");class InputEmailController extends controller.InputTextEmailController{constructor(e,t,i){super(e,t,i),this.component=e}validateMultiple(e){prop_validators.watchBoolean(this.component,"_multiple",e)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const defaultStyleCss=":host{--kolibri-border-color:#666;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}:host{font-family:inherit;font-size:inherit}:host *{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}:host{display:inline-block}a,button{background-color:transparent;border:none;font-size:inherit;margin:0;padding:0;transition-duration:0.5s;transition-property:background-color, color, border-color}:host{font-family:var(--kolibri-font-family);font-size:inherit}*{box-sizing:border-box}kol-icon{color:inherit}kol-span-wc{display:grid;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}kol-span-wc>kol-icon,kol-span-wc>span>kol-icon{display:inline-grid;place-items:center;width:1em;height:1em}a,button,input,select,textarea{appearance:none;cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}h1,h2,h3,h4,h5,h6{font-family:var(--kolibri-font-family);font-size:var(--kolibri-font-size);margin:0;padding:0}.kol-required span::after{content:'*'}.kol-disabled{opacity:0.5}.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}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,textarea{background-color:white;display:block;font-size:1rem;line-height:1.5em;min-height:44px;padding:0.5em 0.75em}input[type='color']{height:2.5em;padding:0.25em 0.5em}textarea{padding:0.5em}input,select,textarea{border-color:var(--kolibri-border-color);border-style:solid;border-width:calc(var(--kolibri-spacing) / 2)}input input.error,input select.error,input textarea.error,select input.error,select select.error,select textarea.error,textarea input.error,textarea select.error,textarea textarea.error{border-color:var(--kolibri-border-error)}input input:focus,input input:hover,input select:focus,input select:hover,input textarea:focus,input textarea:hover,select input:focus,select input:hover,select select:focus,select select:hover,select textarea:focus,select textarea:hover,textarea input:focus,textarea input:hover,textarea select:focus,textarea select:hover,textarea textarea:focus,textarea textarea:hover{border-color:var(--kolibri-color-text)}input:not([type='checkbox']),option,select,textarea{font-size:inherit;letter-spacing:inherit;word-spacing:inherit}kol-input{display:grid;gap:calc(2 * var(--kolibri-spacing))}input,select,textarea{background-color:white;border-color:var(--kolibri-border-color);border-radius:var(--kolibri-border-radius);border-style:solid;border-width:var(--kolibri-border-width);font-size:1em;font-family:var(--kolibri-font-family-sans);line-height:2.5em;overflow:hidden;width:100%}input,select:not([multiple]){height:2.75em}input::placeholder{color:var(--kolibri-color-normal)}input:hover{border-color:var(--kolibri-color-primary)}input:not([type='color']):read-only,input:disabled,select:read-only,select:disabled,textarea:read-only,textarea:disabled{cursor:not-allowed}.required label>span::after{content:'*';padding-left:var(--kolibri-spacing)}.icons{display:flex;justify-content:space-between;height:0}.icons>kol-icon{display:grid;height:44px;padding:0 0.75em;place-items:center}.icon-left input,.icon-left select{padding-left:2em}.icon-right input,.icon-right select{padding-right:2em}kol-button-wc{position:relative;float:right;z-index:1000;margin-top:-44px}kol-button-wc button{background-color:transparent;display:inline-block;min-height:44px;min-width:44px}.icon-right kol-button-wc{margin-right:44px}.disabled{opacity:0.5}select[multiple],textarea{overflow:auto}textarea{display:block}select option{margin:var(--kolibri-spacing) 0;padding:0.5em;border-radius:0.25em;cursor:pointer}select option:disabled{cursor:not-allowed}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled){background-color:var(--kolibri-color-primary);color:white}",KolInputEmail=class{render(){const{ariaDiscribedBy:e}=controller$2.getRenderStates(this.state),t=Array.isArray(this.state._list)&&this.state._list.length>0;return index.h(index.Host,null,index.h("kol-input",{_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},index.h("span",{slot:"label"},index.h("slot",null)),index.h("input",Object.assign({ref:this.catchRef,part:"input",title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,multiple:this.state._multiple,id:this.state._id,list:t?`${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(e){index.registerInstance(this,e),this.catchRef=e=>{this.ref=e,reuse.propergateFocus(this.host,this.ref)},this.onKeyUp=e=>{"Enter"===e.code?controller$1.propergateSubmitEventToForm({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(e)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._maxLength=void 0,this._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",_id:"⚠",_list:[]},this.controller=new InputEmailController(this,"email",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateAutoComplete(e){this.controller.validateAutoComplete(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcon(e){this.controller.validateIcon(e)}validateId(e){this.controller.validateId(e)}validateList(e){this.controller.validateList(e)}validateMaxLength(e){this.controller.validateMaxLength(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validatePattern(e){this.controller.validatePattern(e)}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateReadOnly(e){this.controller.validateReadOnly(e)}validateRequired(e){this.controller.validateRequired(e)}validateSize(e){this.controller.validateSize(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return index.getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_maxLength:["validateMaxLength"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};KolInputEmail.style={default:defaultStyleCss},exports.kol_input_email=KolInputEmail;