@public-ui/components 3.0.1-7c24654fbf351e04b5635c30d957697951f63331.0 → 3.0.1

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h,r as registerInstance,g as getElement}from"./index-aceb5633.js";import{c as clsx}from"./clsx-09a06a12.js";import{h as watchBoolean,w as watchValidator,k as setState,H as deprecatedHint}from"./index-88dea7b1.js";import{n as nonce}from"./dev.utils-9e6009ff.js";import{p as propagateSubmitEventToForm}from"./controller-4227bd3b.js";import{F as FormFieldStateWrapper}from"./getRenderStates-c9074761.js";import{I as InputStateWrapper}from"./InputStateWrapper-9982ec35.js";import{I as InputIconController,a as InputContainerStateWrapperFc}from"./controller-icon-75bb95e9.js";import{v as validateSuggestions}from"./suggestions-021d2964.js";import"./component-names-799e91e2.js";import"./events-5886c68b.js";import"./associated.controller-4efb16f5.js";import"./bootstrap-874afb5b.js";import"./i18n-45224cc3.js";import"./access-and-short-key-753466cb.js";import"./tooltip-align-4c18152e.js";import"./align-a05c3d17.js";import"./hide-label-418cc5c0.js";import"./label-5982d241.js";import"./tslib.es6-1173d062.js";import"./Alert-bb061e95.js";import"./i18n-01abf777.js";import"./bem-e4c3a2e6.js";import"./browser-f629a56a.js";import"./Heading-598a07b9.js";import"./InternalUnderlinedBadgeText-2c119ff7.js";import"./isArray-7a60fa7f.js";import"./Input-56e72e4d.js";import"./Icon-0b8e0b26.js";import"./isObject-ffcbbb76.js";import"./icons-acf365fd.js";const validateReadOnly=(t,e)=>{watchBoolean(t,"_readOnly",e)},inputDateTypeOptions=["date","datetime-local","month","time","week"];class InputDateController extends InputIconController{constructor(t,e,n){super(t,e,n),this.validateIso8601=(t,e,n)=>watchValidator(this.component,t,(t=>void 0===t||null==t||""===t||this.validateDateString(t)),new Set(["Date","string{ISO-8601}"]),InputDateController.tryParseToString(e,this.component._type,this.component._step),{hooks:{afterPatch:t=>{"string"==typeof t&&n&&n(t)}}}),this.component=t}validateAutoComplete(t){watchValidator(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateSuggestions(t){validateSuggestions(this.component,t)}static tryParseToString(t,e,n){if("string"==typeof t||null===t)return t;if("object"==typeof t&&t instanceof Date){const i=t.getFullYear(),a=String(t.getMonth()+1).padStart(2,"0"),o=String(t.getDate()).padStart(2,"0"),l=String(t.getHours()).padStart(2,"0"),s=String(t.getMinutes()).padStart(2,"0"),r=String(t.getSeconds()).padStart(2,"0"),d=[i,a,o].join("-"),c=[l,s,r].join(":");switch(e){case"date":return d;case"datetime-local":return`${d}T${c}`;case"month":return`${i}-${a}`;case"time":return void 0===n||"60"===String(n)?`${l}:${s}`:c;case"week":return`${i}-W${this.getWeekNumberOfDate(t)}`}}}static getWeekNumberOfDate(t){const e=new Date(t),n=(e.getDay()+6)%7;e.setDate(e.getDate()-n+3);const i=e.valueOf();e.setMonth(0,1),4!==e.getDay()&&e.setMonth(0,1+(4-e.getDay()+7)%7);return(1+Math.ceil((i-e.valueOf())/6048e5)).toString().padStart(2,"0")}validateDateString(t){switch(this.component._type){case"date":return InputDateController.isoDateRegex.test(t);case"datetime-local":return InputDateController.isoLocalDateTimeRegex.test(t);case"month":return InputDateController.isoMonthRegex.test(t);case"time":return InputDateController.isoTimeRegex.test(t);case"week":return InputDateController.isoWeekRegex.test(t);default:return!1}}onBlur(t){super.onBlur(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){const e=null!=t||"date"!==this.component._type&&"month"!==this.component._type&&"datetime-local"!==this.component._type?t:InputDateController.DEFAULT_MAX_DATE;this.validateIso8601("_max",e)}validateMin(t){this.validateIso8601("_min",t)}validateOn(t){setState(this.component,"_on",Object.assign(Object.assign({},t),{onChange:(e,n)=>{!!n!=!!this.component._value&&(this.component._value=n),(null==t?void 0:t.onChange)&&t.onChange(e,n)}}))}validateReadOnly(t){validateReadOnly(this.component,t)}validateRequired(t){watchBoolean(this.component,"_required",t)}validateStep(t){this.validateNumber("_step",t)}validateType(t){watchValidator(this.component,"_type",(t=>"string"==typeof t&&inputDateTypeOptions.includes(t)),new Set([`String {${inputDateTypeOptions.join(", ")}`]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateLabel(this.component._label),this.validateSuggestions(this.component._suggestions),this.validateOn(this.component._on),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}InputDateController.isoDateRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])/,InputDateController.isoLocalDateTimeRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])[T ][0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,InputDateController.isoMonthRegex=/^\d{4}-([0]\d|1[0-2])/,InputDateController.isoTimeRegex=/^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,InputDateController.isoWeekRegex=/^\d{4}-W(?:[0-4]\d|5[0-3])$/,InputDateController.DEFAULT_MAX_DATE=new Date(9999,11,31,23,59,59);const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    background-color: lightgray;\n    color: black;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.25s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}",KolInputDateDefaultStyle0=defaultStyleCss,KolInputDate=class{async getValue(){var t;return this.inputRef&&this.remapValue(null===(t=this.inputRef)||void 0===t?void 0:t.value)}async kolFocus(){var t;null===(t=this.inputRef)||void 0===t||t.focus()}async reset(){this.state=Object.assign(Object.assign({},this.state),{_value:null}),this.controller.setFormAssociatedValue(""),this.inputRef&&(this.inputRef.value="")}setInitialValueType(t){t instanceof Date?this._initialValueType="Date":this._initialValueType="string"==typeof t?"String":null}remapValue(t){return""===t?null:"Date"===this._initialValueType?new Date(t):t}getFormFieldProps(){return{state:this.state,class:clsx("kol-input-date",this.state._type,{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,onClick:()=>{var t;return null===(t=this.inputRef)||void 0===t?void 0:t.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state},this.controller.onFacade),{onBlur:this.onBlur,onFocus:this.onFocus,onKeyDown:this.onKeyDown,onChange:this.onChange,onInput:this.onInput})}render(){return h(FormFieldStateWrapper,Object.assign({key:"ac7f8fd7609b8b4d6413bf6eca8312510b79bb2f"},this.getFormFieldProps()),h(InputContainerStateWrapperFc,{key:"591c94a645aed027dcbe71d36961cd5af27e1519",state:this.state},h(InputStateWrapper,Object.assign({key:"9de3fc6749e333dc59202452773517b64f90e79c"},this.getInputProps()))))}constructor(t){registerInstance(this,t),this.catchRef=t=>{this.inputRef=t},this.onBlur=t=>{this.controller.onFacade.onBlur(t),this.inputHasFocus=!1},this.onFocus=t=>{this.controller.onFacade.onFocus(t),this.inputHasFocus=!0},this.onChange=t=>{const e=t.target.value,n=this.remapValue(e);this.controller.onFacade.onChange(t,n)},this.onInput=t=>{const e=t.target.value,n=this.remapValue(e);this._value=n,this.controller.onFacade.onInput(t,!0,n)},this.onKeyDown=t=>{"Enter"!==t.code&&"NumpadEnter"!==t.code||propagateSubmitEventToForm({form:this.host,ref:this.inputRef})},this._initialValueType=null,this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._max=void 0,this._min=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._readOnly=!1,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._step=void 0,this._tooltipAlign="top",this._touched=!1,this._type="date",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_hideMsg:!1,_id:`id-${nonce()}`,_label:"",_suggestions:[],_type:"datetime-local"},this.inputHasFocus=!1,this.controller=new InputDateController(this,"date",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateHideMsg(t){this.controller.validateHideMsg(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcons(t){this.controller.validateIcons(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateMsg(t){this.controller.validateMsg(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateShortKey(t){this.controller.validateShortKey(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateStep(t){this.controller.validateStep(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){t instanceof Date&&deprecatedHint("Date type will be removed in v3. Use `Iso8601` instead."),this.controller.validateValueEx(t),null!=t&&this.setInitialValueType(t)}componentWillLoad(){void 0!==this._value&&this.setInitialValueType(this._value),this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}static get delegatesFocus(){return!0}get host(){return getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_max:["validateMax"],_min:["validateMin"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_step:["validateStep"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};KolInputDate.style={default:KolInputDateDefaultStyle0};export{KolInputDate as kol_input_date};
+import{h,r as registerInstance,g as getElement}from"./index-1ed13705.js";import{c as clsx}from"./clsx-09a06a12.js";import{i as watchBoolean,w as watchValidator,l as setState,H as deprecatedHint}from"./index-ebe5a881.js";import{n as nonce}from"./dev.utils-cb61837d.js";import{p as propagateSubmitEventToForm}from"./controller-91a4c3ba.js";import{F as FormFieldStateWrapper}from"./getRenderStates-c4b5c6cb.js";import{I as InputStateWrapper}from"./InputStateWrapper-9b8419a8.js";import{I as InputIconController,a as InputContainerStateWrapperFc}from"./controller-icon-de12de48.js";import{v as validateSuggestions}from"./suggestions-198125b7.js";import"./component-names-7924d82a.js";import"./events-bad0a075.js";import"./associated.controller-92af2554.js";import"./bootstrap-93c7a706.js";import"./i18n-45224cc3.js";import"./access-and-short-key-f743a5c4.js";import"./tooltip-align-465a8590.js";import"./align-d2572387.js";import"./hide-label-8b3a8709.js";import"./label-bf9966d0.js";import"./tslib.es6-1173d062.js";import"./Alert-112aec59.js";import"./i18n-260f0fe9.js";import"./bem-e4c3a2e6.js";import"./browser-f629a56a.js";import"./Heading-733c8dda.js";import"./InternalUnderlinedBadgeText-781ef373.js";import"./isArray-7a60fa7f.js";import"./Input-8502a991.js";import"./Icon-446dff9e.js";import"./isObject-ffcbbb76.js";import"./icons-a9c52ed8.js";const validateReadOnly=(t,e)=>{watchBoolean(t,"_readOnly",e)},inputDateTypeOptions=["date","datetime-local","month","time","week"];class InputDateController extends InputIconController{constructor(t,e,n){super(t,e,n),this.validateIso8601=(t,e,n)=>watchValidator(this.component,t,(t=>null==t||""===t||this.validateDateString(t)),new Set(["Date","string{ISO-8601}"]),InputDateController.tryParseToString(e,this.component._type,this.component._step),{hooks:{afterPatch:t=>{"string"==typeof t&&n&&n(t)}}}),this.component=t}validateAutoComplete(t){watchValidator(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateSuggestions(t){validateSuggestions(this.component,t)}static tryParseToString(t,e,n){if("string"==typeof t||null===t)return t;if("object"==typeof t&&t instanceof Date){const a=t.getFullYear(),i=String(t.getMonth()+1).padStart(2,"0"),o=String(t.getDate()).padStart(2,"0"),l=String(t.getHours()).padStart(2,"0"),s=String(t.getMinutes()).padStart(2,"0"),r=String(t.getSeconds()).padStart(2,"0"),d=[a,i,o].join("-"),c=[l,s,r].join(":");switch(e){case"date":return d;case"datetime-local":return`${d}T${c}`;case"month":return`${a}-${i}`;case"time":return void 0===n||"60"===String(n)?`${l}:${s}`:c;case"week":return`${a}-W${this.getWeekNumberOfDate(t)}`}}}static getWeekNumberOfDate(t){const e=new Date(t),n=(e.getDay()+6)%7;e.setDate(e.getDate()-n+3);const a=e.valueOf();e.setMonth(0,1),4!==e.getDay()&&e.setMonth(0,1+(4-e.getDay()+7)%7);return(1+Math.ceil((a-e.valueOf())/6048e5)).toString().padStart(2,"0")}validateDateString(t){switch(this.component._type){case"date":return InputDateController.isoDateRegex.test(t);case"datetime-local":return InputDateController.isoLocalDateTimeRegex.test(t);case"month":return InputDateController.isoMonthRegex.test(t);case"time":return InputDateController.isoTimeRegex.test(t);case"week":return InputDateController.isoWeekRegex.test(t);default:return!1}}onBlur(t){super.onBlur(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){const e=null!=t||"date"!==this.component._type&&"month"!==this.component._type&&"datetime-local"!==this.component._type?t:InputDateController.DEFAULT_MAX_DATE;this.validateIso8601("_max",e)}validateMin(t){this.validateIso8601("_min",t)}validateOn(t){setState(this.component,"_on",Object.assign(Object.assign({},t),{onChange:(e,n)=>{!!n!=!!this.component._value&&(this.component._value=n),(null==t?void 0:t.onChange)&&t.onChange(e,n)}}))}validateReadOnly(t){validateReadOnly(this.component,t)}validateRequired(t){watchBoolean(this.component,"_required",t)}validateStep(t){this.validateNumber("_step",t)}validateType(t){watchValidator(this.component,"_type",(t=>"string"==typeof t&&inputDateTypeOptions.includes(t)),new Set([`String {${inputDateTypeOptions.join(", ")}`]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateLabel(this.component._label),this.validateSuggestions(this.component._suggestions),this.validateOn(this.component._on),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}InputDateController.isoDateRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])/,InputDateController.isoLocalDateTimeRegex=/^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])[T ][0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,InputDateController.isoMonthRegex=/^\d{4}-([0]\d|1[0-2])/,InputDateController.isoTimeRegex=/^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/,InputDateController.isoWeekRegex=/^\d{4}-W(?:[0-4]\d|5[0-3])$/,InputDateController.DEFAULT_MAX_DATE=new Date(9999,11,31,23,59,59);const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    background-color: lightgray;\n    color: black;\n  }\n}\n@layer kol-global {\n  :host {\n    font-size: rem(16);\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.25s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}",KolInputDateDefaultStyle0=defaultStyleCss,KolInputDate=class{async getValue(){var t;return this.inputRef&&this.remapValue(null===(t=this.inputRef)||void 0===t?void 0:t.value)}async kolFocus(){var t;null===(t=this.inputRef)||void 0===t||t.focus()}async reset(){this.state=Object.assign(Object.assign({},this.state),{_value:null}),this.controller.setFormAssociatedValue(""),this.inputRef&&(this.inputRef.value="")}setInitialValueType(t){t instanceof Date?this._initialValueType="Date":this._initialValueType="string"==typeof t?"String":null}remapValue(t){return""===t?null:"Date"===this._initialValueType?new Date(t):t}getFormFieldProps(){return{state:this.state,class:clsx("kol-input-date",this.state._type,{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,onClick:()=>{var t;return null===(t=this.inputRef)||void 0===t?void 0:t.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state},this.controller.onFacade),{onBlur:this.onBlur,onFocus:this.onFocus,onKeyDown:this.onKeyDown,onChange:this.onChange,onInput:this.onInput})}render(){return h(FormFieldStateWrapper,Object.assign({key:"ac7f8fd7609b8b4d6413bf6eca8312510b79bb2f"},this.getFormFieldProps()),h(InputContainerStateWrapperFc,{key:"591c94a645aed027dcbe71d36961cd5af27e1519",state:this.state},h(InputStateWrapper,Object.assign({key:"9de3fc6749e333dc59202452773517b64f90e79c"},this.getInputProps()))))}constructor(t){registerInstance(this,t),this.catchRef=t=>{this.inputRef=t},this.onBlur=t=>{this.controller.onFacade.onBlur(t),this.inputHasFocus=!1},this.onFocus=t=>{this.controller.onFacade.onFocus(t),this.inputHasFocus=!0},this.onChange=t=>{const e=t.target.value,n=this.remapValue(e);this.controller.onFacade.onChange(t,n)},this.onInput=t=>{const e=t.target.value,n=this.remapValue(e);this._value=n,this.controller.onFacade.onInput(t,!0,n)},this.onKeyDown=t=>{"Enter"!==t.code&&"NumpadEnter"!==t.code||propagateSubmitEventToForm({form:this.host,ref:this.inputRef})},this._initialValueType=null,this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._max=void 0,this._min=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._readOnly=!1,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._step=void 0,this._tooltipAlign="top",this._touched=!1,this._type="date",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_hideMsg:!1,_id:`id-${nonce()}`,_label:"",_suggestions:[],_type:"datetime-local"},this.inputHasFocus=!1,this.controller=new InputDateController(this,"date",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateHideMsg(t){this.controller.validateHideMsg(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcons(t){this.controller.validateIcons(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateMsg(t){this.controller.validateMsg(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateShortKey(t){this.controller.validateShortKey(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateStep(t){this.controller.validateStep(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){t instanceof Date&&deprecatedHint("Date type will be removed in v3. Use `Iso8601` instead."),this.controller.validateValueEx(t),null!=t&&this.setInitialValueType(t)}componentWillLoad(){void 0!==this._value&&this.setInitialValueType(this._value),this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}static get delegatesFocus(){return!0}get host(){return getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_max:["validateMax"],_min:["validateMin"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_step:["validateStep"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};KolInputDate.style={default:KolInputDateDefaultStyle0};export{KolInputDate as kol_input_date};

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

@@ -1 +1 @@
-{"file":"kol-input-date.entry.js","mappings":"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","names":["KolFormFieldStateWrapperFc","KolInputContainerFc","KolInputStateWrapperFc"],"sources":["src/schema/props/read-only.ts","src/schema/types/input/control/number.ts","src/components/input-date/controller.ts","src/components/input-date/style.scss?tag=kol-input-date&mode=default&encapsulation=shadow","src/components/input-date/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\n\nimport { watchBoolean } from '../utils';\n\n/* types */\nexport type ReadOnlyPropType = boolean;\n\n/**\n * Makes the input element read only.\n */\nexport type PropReadOnly = {\n\treadOnly: ReadOnlyPropType;\n};\n\n/* validator */\nexport const validateReadOnly = (component: Generic.Element.Component, value?: ReadOnlyPropType): void => {\n\twatchBoolean(component, '_readOnly', value);\n};\n","import type { Stringified } from '../../common';\nimport type { PropHorizontalIcons } from '../../../props';\nimport type { ButtonProps } from '../../../components';\nimport type { InputTypeOnDefault, InputTypeOnOff } from '../types';\nimport type { NumberString } from '../numberString';\n\nexport const inputDateTypeOptions = ['date', 'datetime-local', 'month', 'time', 'week'] as const;\nexport type InputDateType = (typeof inputDateTypeOptions)[number];\n\nexport type OptionalInputProps<T> = {\n\taccessKey: string;\n\tautoComplete: InputTypeOnOff;\n\tdisabled: boolean;\n\thideLabel: boolean;\n\thint: string;\n\tmax: T;\n\tmin: T;\n\tname: string;\n\ton: InputTypeOnDefault;\n\treadOnly: boolean;\n\trequired: boolean;\n\tsmartButton: Stringified<ButtonProps>;\n\tstep: number | NumberString;\n\ttouched: boolean;\n\tvalue: T | null;\n} & PropHorizontalIcons;\n","import type {\n\tInputDateProps,\n\tInputDateType,\n\tInputDateWatches,\n\tInputTypeOnDefault,\n\tInputTypeOnOff,\n\tIso8601,\n\tNumberString,\n\tReadOnlyPropType,\n\tSuggestionsPropType,\n} from '../../schema';\nimport { inputDateTypeOptions, setState, validateReadOnly, validateSuggestions, watchBoolean, watchValidator } from '../../schema';\n\nimport { InputIconController } from '../@deprecated/input/controller-icon';\n\nimport type { Generic } from 'adopted-style-sheets';\n\nexport class InputDateController extends InputIconController implements InputDateWatches {\n\t// test: https://regex101.com/r/NTVh4L/1\n\tprivate static readonly isoDateRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])/;\n\tprivate static readonly isoLocalDateTimeRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])[T ][0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoMonthRegex = /^\\d{4}-([0]\\d|1[0-2])/;\n\tprivate static readonly isoTimeRegex = /^[0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoWeekRegex = /^\\d{4}-W(?:[0-4]\\d|5[0-3])$/;\n\n\tprivate static readonly DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);\n\n\tprotected readonly component: Generic.Element.Component & InputDateProps;\n\n\tpublic constructor(component: Generic.Element.Component & InputDateProps, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue,\n\t\t);\n\t}\n\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tvalidateSuggestions(this.component, value);\n\t}\n\n\tpublic static tryParseToString(value: Iso8601 | Date | null | undefined, type?: InputDateType, step?: string | number): string | null | undefined {\n\t\tif (typeof value === 'string' || value === null) {\n\t\t\treturn value;\n\t\t}\n\n\t\tif (typeof value === 'object' && value instanceof Date) {\n\t\t\tconst formattedYear = value.getFullYear();\n\t\t\tconst formattedMonth = String(value.getMonth() + 1).padStart(2, '0');\n\t\t\tconst formattedDay = String(value.getDate()).padStart(2, '0');\n\t\t\tconst formattedHours = String(value.getHours()).padStart(2, '0');\n\t\t\tconst formattedMinutes = String(value.getMinutes()).padStart(2, '0');\n\t\t\tconst formattedSeconds = String(value.getSeconds()).padStart(2, '0');\n\n\t\t\tconst formattedDate = [formattedYear, formattedMonth, formattedDay].join('-');\n\t\t\tconst formattedTimeWithSeconds = [formattedHours, formattedMinutes, formattedSeconds].join(':');\n\n\t\t\tswitch (type) {\n\t\t\t\tcase 'date':\n\t\t\t\t\treturn formattedDate;\n\t\t\t\tcase 'datetime-local':\n\t\t\t\t\treturn `${formattedDate}T${formattedTimeWithSeconds}`;\n\t\t\t\tcase 'month':\n\t\t\t\t\treturn `${formattedYear}-${formattedMonth}`;\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 (step === undefined || String(step) === '60') {\n\t\t\t\t\t\treturn `${formattedHours}:${formattedMinutes}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn formattedTimeWithSeconds;\n\t\t\t\t\t}\n\t\t\t\tcase 'week':\n\t\t\t\t\treturn `${formattedYear}-W${this.getWeekNumberOfDate(value)}`;\n\t\t\t}\n\t\t}\n\t}\n\n\tstatic getWeekNumberOfDate(date: Date): string {\n\t\tconst copiedDate = new Date(date);\n\n\t\t// ISO week date weeks start on Monday, so correct the day number\n\t\tconst nDay = (copiedDate.getDay() + 6) % 7;\n\n\t\t// ISO 8601 states that week 1 is the week with the first Thursday of that year\n\t\t// Set the target date to the Thursday in the target week\n\t\tcopiedDate.setDate(copiedDate.getDate() - nDay + 3);\n\n\t\t// Store the millisecond value of the target date\n\t\tconst n1stThursday = copiedDate.valueOf();\n\n\t\t// Set the target to the first Thursday of the year\n\t\t// First, set the target to January 1st\n\t\tcopiedDate.setMonth(0, 1);\n\n\t\t// Not a Thursday? Correct the date to the next Thursday\n\t\tif (copiedDate.getDay() !== 4) {\n\t\t\tcopiedDate.setMonth(0, 1 + ((4 - copiedDate.getDay() + 7) % 7));\n\t\t}\n\n\t\t// The week number is the number of weeks between the first Thursday of the year\n\t\t// and the Thursday in the target week (604800000 = 7 * 24 * 3600 * 1000)\n\t\tconst dayOfYear = 1 + Math.ceil((n1stThursday - copiedDate.valueOf()) / 604800000);\n\n\t\treturn dayOfYear.toString().padStart(2, '0');\n\t}\n\n\tprivate validateDateString(value: string): boolean {\n\t\tswitch (this.component._type) {\n\t\t\tcase 'date':\n\t\t\t\treturn InputDateController.isoDateRegex.test(value);\n\t\t\tcase 'datetime-local':\n\t\t\t\treturn InputDateController.isoLocalDateTimeRegex.test(value);\n\t\t\tcase 'month':\n\t\t\t\treturn InputDateController.isoMonthRegex.test(value);\n\t\t\tcase 'time':\n\t\t\t\treturn InputDateController.isoTimeRegex.test(value);\n\t\t\tcase 'week':\n\t\t\t\treturn InputDateController.isoWeekRegex.test(value);\n\t\t\tdefault:\n\t\t\t\treturn false;\n\t\t}\n\t}\n\n\tprivate readonly validateIso8601 = (propName: string, value?: Date | Iso8601 | null, afterPatch?: (v: string) => void) => {\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || value == null || value === '' || this.validateDateString(value),\n\t\t\tnew Set(['Date', 'string{ISO-8601}']),\n\t\t\tInputDateController.tryParseToString(value, this.component._type, this.component._step),\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t},\n\t\t);\n\t};\n\n\tprotected onBlur(event: Event): void {\n\t\tsuper.onBlur(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\tconst ensuredValue =\n\t\t\t(value === undefined || value === null) &&\n\t\t\t(this.component._type === 'date' || this.component._type === 'month' || this.component._type === 'datetime-local')\n\t\t\t\t? InputDateController.DEFAULT_MAX_DATE\n\t\t\t\t: value;\n\n\t\tthis.validateIso8601('_max', ensuredValue);\n\t}\n\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\tpublic validateOn(value?: InputTypeOnDefault) {\n\t\tsetState(this.component, '_on', {\n\t\t\t...value,\n\t\t\tonChange: (e: Event, v: unknown) => {\n\t\t\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\t\t\tif (!!v !== !!this.component._value) {\n\t\t\t\t\tthis.component._value = v as Iso8601;\n\t\t\t\t}\n\n\t\t\t\tif (value?.onChange) {\n\t\t\t\t\tvalue.onChange(e, v);\n\t\t\t\t}\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tvalidateReadOnly(this.component, value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number | NumberString): void {\n\t\tthis.validateNumber('_step', value);\n\t}\n\n\tpublic validateType(value?: InputDateType): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_type',\n\t\t\t(value): boolean => typeof value === 'string' && inputDateTypeOptions.includes(value),\n\t\t\tnew Set([`String {${inputDateTypeOptions.join(', ')}`]),\n\t\t\tvalue,\n\t\t);\n\t}\n\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: Iso8601 | Date | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateLabel(this.component._label);\n\t\tthis.validateSuggestions(this.component._suggestions);\n\t\tthis.validateOn(this.component._on);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateType(this.component._type);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@use '../../styles/global' as *;\n@use '../../styles/kol-alert-mixin' as *;\n@use '../../styles/kol-form-field-mixin' as *;\n@use '../../styles/kol-input-container-mixin' as *;\n@use '../../styles/kol-input-mixin' as *;\n@use '../@shared/mixins' as *;\n\n@include kol-alert;\n@include kol-form-field;\n@include kol-input-container;\n@include kol-input;\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Method, Prop, State, Watch } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport type {\n\tButtonProps,\n\tFocusableElement,\n\tHideMsgPropType,\n\tIconsHorizontalPropType,\n\tIdPropType,\n\tInputDateAPI,\n\tInputDateStates,\n\tInputDateType,\n\tInputTypeOnDefault,\n\tInputTypeOnOff,\n\tIso8601,\n\tLabelWithExpertSlotPropType,\n\tMsgPropType,\n\tNamePropType,\n\tNumberString,\n\tReadOnlyPropType,\n\tShortKeyPropType,\n\tStringified,\n\tSuggestionsPropType,\n\tSyncValueBySelectorPropType,\n\tTooltipAlignPropType,\n} from '../../schema';\nimport { deprecatedHint } from '../../schema';\n\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport KolFormFieldStateWrapperFc, { type FormFieldStateWrapperProps } from '../../functional-component-wrappers/FormFieldStateWrapper';\nimport KolInputStateWrapperFc, { type InputStateWrapperProps } from '../../functional-component-wrappers/InputStateWrapper';\nimport KolInputContainerFc from '../../functional-component-wrappers/InputContainerStateWrapper';\nimport { InputDateController } from './controller';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-date',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: {\n\t\tdelegatesFocus: true,\n\t},\n})\nexport class KolInputDate implements InputDateAPI, FocusableElement {\n\t@Element() private readonly host?: HTMLKolInputDateElement;\n\tprivate inputRef?: HTMLInputElement;\n\n\t@State() private _initialValueType: 'Date' | 'String' | null = null;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.inputRef = ref;\n\t};\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async getValue(): Promise<string | Date | undefined | null> {\n\t\treturn this.inputRef && this.remapValue(this.inputRef?.value);\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async kolFocus() {\n\t\tthis.inputRef?.focus();\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async reset() {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_value: null,\n\t\t};\n\t\tthis.controller.setFormAssociatedValue('');\n\n\t\t// Setting the state value might not trigger a state change and rerender if the previous value is already an empty string,\n\t\t// which can occur during an incomplete input. Directly setting the DOM property \"forces\" a reset of the native element.\n\t\tif (this.inputRef) {\n\t\t\tthis.inputRef.value = '';\n\t\t}\n\t}\n\n\tprivate setInitialValueType(value: Iso8601 | Date | null) {\n\t\tif (value instanceof Date) {\n\t\t\tthis._initialValueType = 'Date';\n\t\t} else if (typeof value === 'string') {\n\t\t\tthis._initialValueType = 'String';\n\t\t} else {\n\t\t\tthis._initialValueType = null;\n\t\t}\n\t}\n\tprivate remapValue(newValue: string): Date | Iso8601 | null {\n\t\tif (newValue === '') {\n\t\t\treturn null;\n\t\t}\n\t\treturn this._initialValueType === 'Date' ? new Date(newValue) : (newValue as Iso8601);\n\t}\n\n\tprivate readonly onBlur = (event: Event) => {\n\t\tthis.controller.onFacade.onBlur(event);\n\t\tthis.inputHasFocus = false;\n\t};\n\n\tprivate readonly onFocus = (event: Event) => {\n\t\tthis.controller.onFacade.onFocus(event);\n\t\tthis.inputHasFocus = true;\n\t};\n\n\tprivate readonly onChange = (event: Event) => {\n\t\tconst newValue = (event.target as HTMLInputElement).value;\n\t\tconst remappedValue = this.remapValue(newValue);\n\t\tthis.controller.onFacade.onChange(event, remappedValue);\n\t};\n\n\tprivate readonly onInput = (event: Event) => {\n\t\tconst newValue = (event.target as HTMLInputElement).value;\n\t\tconst remappedValue = this.remapValue(newValue);\n\t\tthis._value = remappedValue;\n\t\tthis.controller.onFacade.onInput(event, true, remappedValue);\n\t};\n\n\tprivate readonly onKeyDown = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter' || event.code === 'NumpadEnter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.inputRef,\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate getFormFieldProps(): FormFieldStateWrapperProps {\n\t\treturn {\n\t\t\tstate: this.state,\n\t\t\tclass: clsx('kol-input-date', this.state._type as string, {\n\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t}),\n\t\t\ttooltipAlign: this._tooltipAlign,\n\t\t\tonClick: () => this.inputRef?.focus(),\n\t\t\talert: this.showAsAlert(),\n\t\t};\n\t}\n\n\tprivate getInputProps(): InputStateWrapperProps {\n\t\treturn {\n\t\t\tref: this.catchRef,\n\t\t\tstate: this.state,\n\t\t\t...this.controller.onFacade,\n\t\t\tonBlur: this.onBlur,\n\t\t\tonFocus: this.onFocus,\n\t\t\tonKeyDown: this.onKeyDown,\n\t\t\tonChange: this.onChange,\n\t\t\tonInput: this.onInput,\n\t\t};\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolFormFieldStateWrapperFc {...this.getFormFieldProps()}>\n\t\t\t\t<KolInputContainerFc state={this.state}>\n\t\t\t\t\t<KolInputStateWrapperFc {...this.getInputProps()} />\n\t\t\t\t</KolInputContainerFc>\n\t\t\t</KolFormFieldStateWrapperFc>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputDateController;\n\n\t/**\n\t * Defines which key combination can be used to trigger or focus the interactive element of the component.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Defines whether the input can be auto-completed.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * @TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Hides the error message but leaves it in the DOM for the input's aria-describedby.\n\t * @TODO: Change type back to `HideMsgPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _hideMsg?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the hint text.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: IconsHorizontalPropType;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Defines the largest possible input value.\n\t */\n\t@Prop() public _max?: Iso8601 | Date;\n\n\t/**\n\t * Defines the smallest possible input value.\n\t */\n\t@Prop() public _min?: Iso8601 | Date;\n\n\t/**\n\t * Defines the properties for a message rendered as Alert component.\n\t */\n\t@Prop() public _msg?: Stringified<MsgPropType>;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Makes the input element read only.\n\t * @TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _readOnly?: boolean = false;\n\n\t/**\n\t * Makes the input element required.\n\t * @TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _required?: boolean = false;\n\n\t/**\n\t * Adds a visual short key hint to the component.\n\t */\n\t@Prop() public _shortKey?: ShortKeyPropType;\n\n\t/**\n\t * Allows to add a button with an arbitrary action within the element (_hide-label only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Defines the step size for value changes.\n\t */\n\t@Prop() public _step?: number | NumberString;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * @TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Defines either the type of the component or of the components interactive element.\n\t */\n\t@Prop() public _type: InputDateType = 'date';\n\n\t/**\n\t * Defines the value of the input.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _value?: Iso8601 | Date | null;\n\n\t@State() public state: InputDateStates = {\n\t\t_autoComplete: 'off',\n\t\t_hasValue: false,\n\t\t_hideMsg: false,\n\t\t_id: `id-${nonce()}`,\n\t\t_label: '', // ⚠ required\n\t\t_suggestions: [],\n\t\t_type: 'datetime-local',\n\t};\n\n\t@State() private inputHasFocus = false;\n\n\tpublic constructor() {\n\t\tthis.controller = new InputDateController(this, 'date', this.host);\n\t}\n\n\tprivate showAsAlert(): boolean {\n\t\treturn Boolean(this.state._touched) && !this.inputHasFocus;\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_hideMsg')\n\tpublic validateHideMsg(value?: HideMsgPropType): void {\n\t\tthis.controller.validateHideMsg(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icons')\n\tpublic validateIcons(value?: IconsHorizontalPropType): void {\n\t\tthis.controller.validateIcons(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_msg')\n\tpublic validateMsg(value?: Stringified<MsgPropType>): void {\n\t\tthis.controller.validateMsg(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_shortKey')\n\tpublic validateShortKey(value?: ShortKeyPropType): void {\n\t\tthis.controller.validateShortKey(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number | NumberString): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: InputDateType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tif (value instanceof Date) {\n\t\t\tdeprecatedHint('Date type will be removed in v3. Use `Iso8601` instead.');\n\t\t}\n\t\tthis.controller.validateValueEx(value);\n\t\tif (value !== undefined && value !== null) {\n\t\t\t// Don't switch type when value was reset to null\n\t\t\tthis.setInitialValueType(value);\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tif (this._value !== undefined) this.setInitialValueType(this._value);\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"version":3}
+{"file":"kol-input-date.entry.js","mappings":"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","names":["KolFormFieldStateWrapperFc","KolInputContainerFc","KolInputStateWrapperFc"],"sources":["src/schema/props/read-only.ts","src/schema/types/input/control/number.ts","src/components/input-date/controller.ts","src/components/input-date/style.scss?tag=kol-input-date&mode=default&encapsulation=shadow","src/components/input-date/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\n\nimport { watchBoolean } from '../utils';\n\n/* types */\nexport type ReadOnlyPropType = boolean;\n\n/**\n * Makes the input element read only.\n */\nexport type PropReadOnly = {\n\treadOnly: ReadOnlyPropType;\n};\n\n/* validator */\nexport const validateReadOnly = (component: Generic.Element.Component, value?: ReadOnlyPropType): void => {\n\twatchBoolean(component, '_readOnly', value);\n};\n","import type { Stringified } from '../../common';\nimport type { PropHorizontalIcons } from '../../../props';\nimport type { ButtonProps } from '../../../components';\nimport type { InputTypeOnDefault, InputTypeOnOff } from '../types';\nimport type { NumberString } from '../numberString';\n\nexport const inputDateTypeOptions = ['date', 'datetime-local', 'month', 'time', 'week'] as const;\nexport type InputDateType = (typeof inputDateTypeOptions)[number];\n\nexport type OptionalInputProps<T> = {\n\taccessKey: string;\n\tautoComplete: InputTypeOnOff;\n\tdisabled: boolean;\n\thideLabel: boolean;\n\thint: string;\n\tmax: T;\n\tmin: T;\n\tname: string;\n\ton: InputTypeOnDefault;\n\treadOnly: boolean;\n\trequired: boolean;\n\tsmartButton: Stringified<ButtonProps>;\n\tstep: number | NumberString;\n\ttouched: boolean;\n\tvalue: T | null;\n} & PropHorizontalIcons;\n","import type {\n\tInputDateProps,\n\tInputDateType,\n\tInputDateWatches,\n\tInputTypeOnDefault,\n\tInputTypeOnOff,\n\tIso8601,\n\tNumberString,\n\tReadOnlyPropType,\n\tSuggestionsPropType,\n} from '../../schema';\nimport { inputDateTypeOptions, setState, validateReadOnly, validateSuggestions, watchBoolean, watchValidator } from '../../schema';\n\nimport { InputIconController } from '../@deprecated/input/controller-icon';\n\nimport type { Generic } from 'adopted-style-sheets';\n\nexport class InputDateController extends InputIconController implements InputDateWatches {\n\t// test: https://regex101.com/r/NTVh4L/1\n\tprivate static readonly isoDateRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])/;\n\tprivate static readonly isoLocalDateTimeRegex = /^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])[T ][0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoMonthRegex = /^\\d{4}-([0]\\d|1[0-2])/;\n\tprivate static readonly isoTimeRegex = /^[0-2]\\d:[0-5]\\d(:[0-5]\\d(?:\\.\\d+)?)?/;\n\tprivate static readonly isoWeekRegex = /^\\d{4}-W(?:[0-4]\\d|5[0-3])$/;\n\n\tprivate static readonly DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);\n\n\tprotected readonly component: Generic.Element.Component & InputDateProps;\n\n\tpublic constructor(component: Generic.Element.Component & InputDateProps, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue,\n\t\t);\n\t}\n\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tvalidateSuggestions(this.component, value);\n\t}\n\n\tpublic static tryParseToString(value: Iso8601 | Date | null | undefined, type?: InputDateType, step?: string | number): string | null | undefined {\n\t\tif (typeof value === 'string' || value === null) {\n\t\t\treturn value;\n\t\t}\n\n\t\tif (typeof value === 'object' && value instanceof Date) {\n\t\t\tconst formattedYear = value.getFullYear();\n\t\t\tconst formattedMonth = String(value.getMonth() + 1).padStart(2, '0');\n\t\t\tconst formattedDay = String(value.getDate()).padStart(2, '0');\n\t\t\tconst formattedHours = String(value.getHours()).padStart(2, '0');\n\t\t\tconst formattedMinutes = String(value.getMinutes()).padStart(2, '0');\n\t\t\tconst formattedSeconds = String(value.getSeconds()).padStart(2, '0');\n\n\t\t\tconst formattedDate = [formattedYear, formattedMonth, formattedDay].join('-');\n\t\t\tconst formattedTimeWithSeconds = [formattedHours, formattedMinutes, formattedSeconds].join(':');\n\n\t\t\tswitch (type) {\n\t\t\t\tcase 'date':\n\t\t\t\t\treturn formattedDate;\n\t\t\t\tcase 'datetime-local':\n\t\t\t\t\treturn `${formattedDate}T${formattedTimeWithSeconds}`;\n\t\t\t\tcase 'month':\n\t\t\t\t\treturn `${formattedYear}-${formattedMonth}`;\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 (step === undefined || String(step) === '60') {\n\t\t\t\t\t\treturn `${formattedHours}:${formattedMinutes}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn formattedTimeWithSeconds;\n\t\t\t\t\t}\n\t\t\t\tcase 'week':\n\t\t\t\t\treturn `${formattedYear}-W${this.getWeekNumberOfDate(value)}`;\n\t\t\t}\n\t\t}\n\t}\n\n\tstatic getWeekNumberOfDate(date: Date): string {\n\t\tconst copiedDate = new Date(date);\n\n\t\t// ISO week date weeks start on Monday, so correct the day number\n\t\tconst nDay = (copiedDate.getDay() + 6) % 7;\n\n\t\t// ISO 8601 states that week 1 is the week with the first Thursday of that year\n\t\t// Set the target date to the Thursday in the target week\n\t\tcopiedDate.setDate(copiedDate.getDate() - nDay + 3);\n\n\t\t// Store the millisecond value of the target date\n\t\tconst n1stThursday = copiedDate.valueOf();\n\n\t\t// Set the target to the first Thursday of the year\n\t\t// First, set the target to January 1st\n\t\tcopiedDate.setMonth(0, 1);\n\n\t\t// Not a Thursday? Correct the date to the next Thursday\n\t\tif (copiedDate.getDay() !== 4) {\n\t\t\tcopiedDate.setMonth(0, 1 + ((4 - copiedDate.getDay() + 7) % 7));\n\t\t}\n\n\t\t// The week number is the number of weeks between the first Thursday of the year\n\t\t// and the Thursday in the target week (604800000 = 7 * 24 * 3600 * 1000)\n\t\tconst dayOfYear = 1 + Math.ceil((n1stThursday - copiedDate.valueOf()) / 604800000);\n\n\t\treturn dayOfYear.toString().padStart(2, '0');\n\t}\n\n\tprivate validateDateString(value: string): boolean {\n\t\tswitch (this.component._type) {\n\t\t\tcase 'date':\n\t\t\t\treturn InputDateController.isoDateRegex.test(value);\n\t\t\tcase 'datetime-local':\n\t\t\t\treturn InputDateController.isoLocalDateTimeRegex.test(value);\n\t\t\tcase 'month':\n\t\t\t\treturn InputDateController.isoMonthRegex.test(value);\n\t\t\tcase 'time':\n\t\t\t\treturn InputDateController.isoTimeRegex.test(value);\n\t\t\tcase 'week':\n\t\t\t\treturn InputDateController.isoWeekRegex.test(value);\n\t\t\tdefault:\n\t\t\t\treturn false;\n\t\t}\n\t}\n\n\tprivate readonly validateIso8601 = (propName: string, value?: Date | Iso8601 | null, afterPatch?: (v: string) => void) => {\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || value === null || value === '' || this.validateDateString(value),\n\t\t\tnew Set(['Date', 'string{ISO-8601}']),\n\t\t\tInputDateController.tryParseToString(value, this.component._type, this.component._step),\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t},\n\t\t);\n\t};\n\n\tprotected onBlur(event: Event): void {\n\t\tsuper.onBlur(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\tconst ensuredValue =\n\t\t\t(value === undefined || value === null) &&\n\t\t\t(this.component._type === 'date' || this.component._type === 'month' || this.component._type === 'datetime-local')\n\t\t\t\t? InputDateController.DEFAULT_MAX_DATE\n\t\t\t\t: value;\n\n\t\tthis.validateIso8601('_max', ensuredValue);\n\t}\n\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\tpublic validateOn(value?: InputTypeOnDefault) {\n\t\tsetState(this.component, '_on', {\n\t\t\t...value,\n\t\t\tonChange: (e: Event, v: unknown) => {\n\t\t\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\t\t\tif (!!v !== !!this.component._value) {\n\t\t\t\t\tthis.component._value = v as Iso8601;\n\t\t\t\t}\n\n\t\t\t\tif (value?.onChange) {\n\t\t\t\t\tvalue.onChange(e, v);\n\t\t\t\t}\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tvalidateReadOnly(this.component, value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number | NumberString): void {\n\t\tthis.validateNumber('_step', value);\n\t}\n\n\tpublic validateType(value?: InputDateType): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_type',\n\t\t\t(value): boolean => typeof value === 'string' && inputDateTypeOptions.includes(value),\n\t\t\tnew Set([`String {${inputDateTypeOptions.join(', ')}`]),\n\t\t\tvalue,\n\t\t);\n\t}\n\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: Iso8601 | Date | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateLabel(this.component._label);\n\t\tthis.validateSuggestions(this.component._suggestions);\n\t\tthis.validateOn(this.component._on);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateType(this.component._type);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@use '../../styles/global' as *;\n@use '../../styles/kol-alert-mixin' as *;\n@use '../../styles/kol-form-field-mixin' as *;\n@use '../../styles/kol-input-container-mixin' as *;\n@use '../../styles/kol-input-mixin' as *;\n@use '../@shared/mixins' as *;\n\n@include kol-alert;\n@include kol-form-field;\n@include kol-input-container;\n@include kol-input;\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Method, Prop, State, Watch } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport type {\n\tButtonProps,\n\tFocusableElement,\n\tHideMsgPropType,\n\tIconsHorizontalPropType,\n\tIdPropType,\n\tInputDateAPI,\n\tInputDateStates,\n\tInputDateType,\n\tInputTypeOnDefault,\n\tInputTypeOnOff,\n\tIso8601,\n\tLabelWithExpertSlotPropType,\n\tMsgPropType,\n\tNamePropType,\n\tNumberString,\n\tReadOnlyPropType,\n\tShortKeyPropType,\n\tStringified,\n\tSuggestionsPropType,\n\tSyncValueBySelectorPropType,\n\tTooltipAlignPropType,\n} from '../../schema';\nimport { deprecatedHint } from '../../schema';\n\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport KolFormFieldStateWrapperFc, { type FormFieldStateWrapperProps } from '../../functional-component-wrappers/FormFieldStateWrapper';\nimport KolInputStateWrapperFc, { type InputStateWrapperProps } from '../../functional-component-wrappers/InputStateWrapper';\nimport KolInputContainerFc from '../../functional-component-wrappers/InputContainerStateWrapper';\nimport { InputDateController } from './controller';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-date',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: {\n\t\tdelegatesFocus: true,\n\t},\n})\nexport class KolInputDate implements InputDateAPI, FocusableElement {\n\t@Element() private readonly host?: HTMLKolInputDateElement;\n\tprivate inputRef?: HTMLInputElement;\n\n\t@State() private _initialValueType: 'Date' | 'String' | null = null;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.inputRef = ref;\n\t};\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async getValue(): Promise<string | Date | undefined | null> {\n\t\treturn this.inputRef && this.remapValue(this.inputRef?.value);\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async kolFocus() {\n\t\tthis.inputRef?.focus();\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async reset() {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_value: null,\n\t\t};\n\t\tthis.controller.setFormAssociatedValue('');\n\n\t\t// Setting the state value might not trigger a state change and rerender if the previous value is already an empty string,\n\t\t// which can occur during an incomplete input. Directly setting the DOM property \"forces\" a reset of the native element.\n\t\tif (this.inputRef) {\n\t\t\tthis.inputRef.value = '';\n\t\t}\n\t}\n\n\tprivate setInitialValueType(value: Iso8601 | Date | null) {\n\t\tif (value instanceof Date) {\n\t\t\tthis._initialValueType = 'Date';\n\t\t} else if (typeof value === 'string') {\n\t\t\tthis._initialValueType = 'String';\n\t\t} else {\n\t\t\tthis._initialValueType = null;\n\t\t}\n\t}\n\tprivate remapValue(newValue: string): Date | Iso8601 | null {\n\t\tif (newValue === '') {\n\t\t\treturn null;\n\t\t}\n\t\treturn this._initialValueType === 'Date' ? new Date(newValue) : (newValue as Iso8601);\n\t}\n\n\tprivate readonly onBlur = (event: Event) => {\n\t\tthis.controller.onFacade.onBlur(event);\n\t\tthis.inputHasFocus = false;\n\t};\n\n\tprivate readonly onFocus = (event: Event) => {\n\t\tthis.controller.onFacade.onFocus(event);\n\t\tthis.inputHasFocus = true;\n\t};\n\n\tprivate readonly onChange = (event: Event) => {\n\t\tconst newValue = (event.target as HTMLInputElement).value;\n\t\tconst remappedValue = this.remapValue(newValue);\n\t\tthis.controller.onFacade.onChange(event, remappedValue);\n\t};\n\n\tprivate readonly onInput = (event: Event) => {\n\t\tconst newValue = (event.target as HTMLInputElement).value;\n\t\tconst remappedValue = this.remapValue(newValue);\n\t\tthis._value = remappedValue;\n\t\tthis.controller.onFacade.onInput(event, true, remappedValue);\n\t};\n\n\tprivate readonly onKeyDown = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter' || event.code === 'NumpadEnter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.inputRef,\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate getFormFieldProps(): FormFieldStateWrapperProps {\n\t\treturn {\n\t\t\tstate: this.state,\n\t\t\tclass: clsx('kol-input-date', this.state._type as string, {\n\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t}),\n\t\t\ttooltipAlign: this._tooltipAlign,\n\t\t\tonClick: () => this.inputRef?.focus(),\n\t\t\talert: this.showAsAlert(),\n\t\t};\n\t}\n\n\tprivate getInputProps(): InputStateWrapperProps {\n\t\treturn {\n\t\t\tref: this.catchRef,\n\t\t\tstate: this.state,\n\t\t\t...this.controller.onFacade,\n\t\t\tonBlur: this.onBlur,\n\t\t\tonFocus: this.onFocus,\n\t\t\tonKeyDown: this.onKeyDown,\n\t\t\tonChange: this.onChange,\n\t\t\tonInput: this.onInput,\n\t\t};\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolFormFieldStateWrapperFc {...this.getFormFieldProps()}>\n\t\t\t\t<KolInputContainerFc state={this.state}>\n\t\t\t\t\t<KolInputStateWrapperFc {...this.getInputProps()} />\n\t\t\t\t</KolInputContainerFc>\n\t\t\t</KolFormFieldStateWrapperFc>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputDateController;\n\n\t/**\n\t * Defines which key combination can be used to trigger or focus the interactive element of the component.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Defines whether the input can be auto-completed.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * @TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Hides the error message but leaves it in the DOM for the input's aria-describedby.\n\t * @TODO: Change type back to `HideMsgPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _hideMsg?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the hint text.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: IconsHorizontalPropType;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Defines the largest possible input value.\n\t */\n\t@Prop() public _max?: Iso8601 | Date;\n\n\t/**\n\t * Defines the smallest possible input value.\n\t */\n\t@Prop() public _min?: Iso8601 | Date;\n\n\t/**\n\t * Defines the properties for a message rendered as Alert component.\n\t */\n\t@Prop() public _msg?: Stringified<MsgPropType>;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Makes the input element read only.\n\t * @TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _readOnly?: boolean = false;\n\n\t/**\n\t * Makes the input element required.\n\t * @TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _required?: boolean = false;\n\n\t/**\n\t * Adds a visual short key hint to the component.\n\t */\n\t@Prop() public _shortKey?: ShortKeyPropType;\n\n\t/**\n\t * Allows to add a button with an arbitrary action within the element (_hide-label only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Defines the step size for value changes.\n\t */\n\t@Prop() public _step?: number | NumberString;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * @TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Defines either the type of the component or of the components interactive element.\n\t */\n\t@Prop() public _type: InputDateType = 'date';\n\n\t/**\n\t * Defines the value of the input.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _value?: Iso8601 | Date | null;\n\n\t@State() public state: InputDateStates = {\n\t\t_autoComplete: 'off',\n\t\t_hasValue: false,\n\t\t_hideMsg: false,\n\t\t_id: `id-${nonce()}`,\n\t\t_label: '', // ⚠ required\n\t\t_suggestions: [],\n\t\t_type: 'datetime-local',\n\t};\n\n\t@State() private inputHasFocus = false;\n\n\tpublic constructor() {\n\t\tthis.controller = new InputDateController(this, 'date', this.host);\n\t}\n\n\tprivate showAsAlert(): boolean {\n\t\treturn Boolean(this.state._touched) && !this.inputHasFocus;\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_hideMsg')\n\tpublic validateHideMsg(value?: HideMsgPropType): void {\n\t\tthis.controller.validateHideMsg(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icons')\n\tpublic validateIcons(value?: IconsHorizontalPropType): void {\n\t\tthis.controller.validateIcons(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: Iso8601 | Date): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_msg')\n\tpublic validateMsg(value?: Stringified<MsgPropType>): void {\n\t\tthis.controller.validateMsg(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: ReadOnlyPropType): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_shortKey')\n\tpublic validateShortKey(value?: ShortKeyPropType): void {\n\t\tthis.controller.validateShortKey(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number | NumberString): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: InputDateType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Iso8601 | Date | null): void {\n\t\tif (value instanceof Date) {\n\t\t\tdeprecatedHint('Date type will be removed in v3. Use `Iso8601` instead.');\n\t\t}\n\t\tthis.controller.validateValueEx(value);\n\t\tif (value !== undefined && value !== null) {\n\t\t\t// Don't switch type when value was reset to null\n\t\t\tthis.setInitialValueType(value);\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tif (this._value !== undefined) this.setInitialValueType(this._value);\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"version":3}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h,r as registerInstance,g as getElement}from"./index-aceb5633.js";import{c as clsx}from"./clsx-09a06a12.js";import{h as watchBoolean,k as setState}from"./index-88dea7b1.js";import{n as nonce}from"./dev.utils-9e6009ff.js";import{p as propagateSubmitEventToForm}from"./controller-4227bd3b.js";import{F as FormFieldStateWrapper}from"./getRenderStates-c9074761.js";import{I as InputStateWrapper}from"./InputStateWrapper-9982ec35.js";import{a as InputContainerStateWrapperFc}from"./controller-icon-75bb95e9.js";import{I as InputTextEmailController}from"./controller-e8cb3cac.js";import"./component-names-799e91e2.js";import"./events-5886c68b.js";import"./associated.controller-4efb16f5.js";import"./bootstrap-874afb5b.js";import"./i18n-45224cc3.js";import"./access-and-short-key-753466cb.js";import"./tooltip-align-4c18152e.js";import"./align-a05c3d17.js";import"./hide-label-418cc5c0.js";import"./label-5982d241.js";import"./tslib.es6-1173d062.js";import"./Alert-bb061e95.js";import"./i18n-01abf777.js";import"./bem-e4c3a2e6.js";import"./browser-f629a56a.js";import"./Heading-598a07b9.js";import"./InternalUnderlinedBadgeText-2c119ff7.js";import"./isArray-7a60fa7f.js";import"./Input-56e72e4d.js";import"./Icon-0b8e0b26.js";import"./isObject-ffcbbb76.js";import"./icons-acf365fd.js";import"./controller-faa5fff2.js";import"./has-counter-a7dccaa5.js";import"./spell-check-3f34625f.js";import"./suggestions-021d2964.js";const validateMultiple=(t,e)=>{watchBoolean(t,"_multiple",e)};class InputEmailController extends InputTextEmailController{constructor(t,e,n){super(t,e,n),this.component=t}validateMultiple(t){validateMultiple(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    background-color: lightgray;\n    color: black;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.25s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}",KolInputEmailDefaultStyle0=defaultStyleCss,KolInputEmail=class{async getValue(){var t;return null===(t=this.inputRef)||void 0===t?void 0:t.value}async kolFocus(){var t;null===(t=this.inputRef)||void 0===t||t.focus()}getFormFieldProps(){return{state:this.state,class:clsx("kol-input-email","email",{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,onClick:()=>{var t;return null===(t=this.inputRef)||void 0===t?void 0:t.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"email"},this.controller.onFacade),{onInput:this.onInput,onKeyDown:this.onKeyDown,onFocus:t=>{this.controller.onFacade.onFocus(t),this.inputHasFocus=!0},onBlur:t=>{this.controller.onFacade.onBlur(t),this.inputHasFocus=!1}})}render(){return h(FormFieldStateWrapper,Object.assign({key:"45f5d7733d0a437342c2e8bb1ce1775d0e7c9120"},this.getFormFieldProps()),h(InputContainerStateWrapperFc,{key:"2a8defce2681140146403050a95d4b06fa317d94",state:this.state},h(InputStateWrapper,Object.assign({key:"a7cc60872de4bb3da384bb0241bcaed3920574dc"},this.getInputProps()))))}constructor(t){registerInstance(this,t),this.catchRef=t=>{this.inputRef=t},this.onKeyDown=t=>{"Enter"!==t.code&&"NumpadEnter"!==t.code||propagateSubmitEventToForm({form:this.host,ref:this.inputRef})},this.onInput=t=>{const e=t.target.value;setState(this,"_currentLength",e.length),this._value=e,this.controller.onFacade.onInput(t)},this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hasCounter=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._maxLength=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=!1,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_hasValue:!1,_hideMsg:!1,_id:`id-${nonce()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new InputEmailController(this,"email",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideMsg(t){this.controller.validateHideMsg(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcons(t){this.controller.validateIcons(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateMsg(t){this.controller.validateMsg(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePattern(t){this.controller.validatePattern(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateShortKey(t){this.controller.validateShortKey(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}static get delegatesFocus(){return!0}get host(){return getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hasCounter:["validateHasCounter"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"],_value:["validateValue"]}}};KolInputEmail.style={default:KolInputEmailDefaultStyle0};export{KolInputEmail as kol_input_email};
+import{h,r as registerInstance,g as getElement}from"./index-1ed13705.js";import{c as clsx}from"./clsx-09a06a12.js";import{i as watchBoolean,l as setState}from"./index-ebe5a881.js";import{n as nonce}from"./dev.utils-cb61837d.js";import{p as propagateSubmitEventToForm}from"./controller-91a4c3ba.js";import{F as FormFieldStateWrapper}from"./getRenderStates-c4b5c6cb.js";import{I as InputStateWrapper}from"./InputStateWrapper-9b8419a8.js";import{a as InputContainerStateWrapperFc}from"./controller-icon-de12de48.js";import{I as InputTextEmailController}from"./controller-f5a335ce.js";import"./component-names-7924d82a.js";import"./events-bad0a075.js";import"./associated.controller-92af2554.js";import"./bootstrap-93c7a706.js";import"./i18n-45224cc3.js";import"./access-and-short-key-f743a5c4.js";import"./tooltip-align-465a8590.js";import"./align-d2572387.js";import"./hide-label-8b3a8709.js";import"./label-bf9966d0.js";import"./tslib.es6-1173d062.js";import"./Alert-112aec59.js";import"./i18n-260f0fe9.js";import"./bem-e4c3a2e6.js";import"./browser-f629a56a.js";import"./Heading-733c8dda.js";import"./InternalUnderlinedBadgeText-781ef373.js";import"./isArray-7a60fa7f.js";import"./Input-8502a991.js";import"./Icon-446dff9e.js";import"./isObject-ffcbbb76.js";import"./icons-a9c52ed8.js";import"./controller-912bda08.js";import"./has-counter-3fc44829.js";import"./spell-check-5559a801.js";import"./suggestions-198125b7.js";const validateMultiple=(t,e)=>{watchBoolean(t,"_multiple",e)};class InputEmailController extends InputTextEmailController{constructor(t,e,n){super(t,e,n),this.component=t}validateMultiple(t){validateMultiple(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    background-color: lightgray;\n    color: black;\n  }\n}\n@layer kol-global {\n  :host {\n    font-size: rem(16);\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.25s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}",KolInputEmailDefaultStyle0=defaultStyleCss,KolInputEmail=class{async getValue(){var t;return null===(t=this.inputRef)||void 0===t?void 0:t.value}async kolFocus(){var t;null===(t=this.inputRef)||void 0===t||t.focus()}getFormFieldProps(){return{state:this.state,class:clsx("kol-input-email","email",{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,onClick:()=>{var t;return null===(t=this.inputRef)||void 0===t?void 0:t.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"email"},this.controller.onFacade),{onInput:this.onInput,onKeyDown:this.onKeyDown,onFocus:t=>{this.controller.onFacade.onFocus(t),this.inputHasFocus=!0},onBlur:t=>{this.controller.onFacade.onBlur(t),this.inputHasFocus=!1}})}render(){return h(FormFieldStateWrapper,Object.assign({key:"45f5d7733d0a437342c2e8bb1ce1775d0e7c9120"},this.getFormFieldProps()),h(InputContainerStateWrapperFc,{key:"2a8defce2681140146403050a95d4b06fa317d94",state:this.state},h(InputStateWrapper,Object.assign({key:"a7cc60872de4bb3da384bb0241bcaed3920574dc"},this.getInputProps()))))}constructor(t){registerInstance(this,t),this.catchRef=t=>{this.inputRef=t},this.onKeyDown=t=>{"Enter"!==t.code&&"NumpadEnter"!==t.code||propagateSubmitEventToForm({form:this.host,ref:this.inputRef})},this.onInput=t=>{const e=t.target.value;setState(this,"_currentLength",e.length),this._value=e,this.controller.onFacade.onInput(t)},this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hasCounter=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._maxLength=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=!1,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_hasValue:!1,_hideMsg:!1,_id:`id-${nonce()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new InputEmailController(this,"email",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideMsg(t){this.controller.validateHideMsg(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcons(t){this.controller.validateIcons(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateMsg(t){this.controller.validateMsg(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePattern(t){this.controller.validatePattern(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateShortKey(t){this.controller.validateShortKey(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}static get delegatesFocus(){return!0}get host(){return getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hasCounter:["validateHasCounter"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"],_value:["validateValue"]}}};KolInputEmail.style={default:KolInputEmailDefaultStyle0};export{KolInputEmail as kol_input_email};

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

@@ -1 +1 @@
-{"file":"kol-input-email.entry.js","mappings":"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","names":["KolFormFieldStateWrapperFc","KolInputContainerFc","KolInputStateWrapperFc"],"sources":["src/schema/props/multiple.ts","src/components/input-email/controller.ts","src/components/input-email/style.scss?tag=kol-input-email&mode=default&encapsulation=shadow","src/components/input-email/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\n\nimport { watchBoolean } from '../utils';\n\n/* types */\nexport type MultiplePropType = boolean;\n\n/**\n * Makes the input accept multiple inputs.\n */\nexport type PropMultiple = {\n\tmultiple: MultiplePropType;\n};\n\n/* validator */\nexport const validateMultiple = (component: Generic.Element.Component, value?: MultiplePropType): void => {\n\twatchBoolean(component, '_multiple', value);\n};\n","import type { Generic } from 'adopted-style-sheets';\n\nimport type { InputEmailProps, InputEmailWatches, MultiplePropType } from '../../schema';\nimport { validateMultiple } from '../../schema';\n\nimport { InputTextEmailController } from '../input-text/controller';\n\nexport class InputEmailController extends InputTextEmailController implements InputEmailWatches {\n\tprotected readonly component: Generic.Element.Component & InputEmailProps;\n\n\tpublic constructor(component: Generic.Element.Component & InputEmailProps, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tvalidateMultiple(this.component, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateMultiple(this.component._multiple);\n\t}\n}\n","@use '../../styles/global' as *;\n@use '../../styles/kol-alert-mixin' as *;\n@use '../../styles/kol-form-field-mixin' as *;\n@use '../../styles/kol-input-container-mixin' as *;\n@use '../../styles/kol-input-mixin' as *;\n@use '../@shared/mixins' as *;\n\n@include kol-alert;\n@include kol-form-field;\n@include kol-input-container;\n@include kol-input;\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Method, Prop, State, Watch } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport type {\n\tButtonProps,\n\tFocusableElement,\n\tHideMsgPropType,\n\tIconsHorizontalPropType,\n\tIdPropType,\n\tInputEmailAPI,\n\tInputEmailStates,\n\tInputTypeOnDefault,\n\tInputTypeOnOff,\n\tLabelWithExpertSlotPropType,\n\tMsgPropType,\n\tMultiplePropType,\n\tNamePropType,\n\tShortKeyPropType,\n\tStringified,\n\tSuggestionsPropType,\n\tSyncValueBySelectorPropType,\n\tTooltipAlignPropType,\n} from '../../schema';\nimport { setState } from '../../schema';\n\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport KolFormFieldStateWrapperFc, { type FormFieldStateWrapperProps } from '../../functional-component-wrappers/FormFieldStateWrapper';\nimport KolInputStateWrapperFc, { type InputStateWrapperProps } from '../../functional-component-wrappers/InputStateWrapper';\nimport KolInputContainerFc from '../../functional-component-wrappers/InputContainerStateWrapper';\nimport { InputEmailController } from './controller';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-email',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: {\n\t\tdelegatesFocus: true,\n\t},\n})\nexport class KolInputEmail implements InputEmailAPI, FocusableElement {\n\t@Element() private readonly host?: HTMLKolInputEmailElement;\n\tprivate inputRef?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.inputRef = ref;\n\t};\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async getValue(): Promise<string | undefined> {\n\t\treturn this.inputRef?.value;\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async kolFocus() {\n\t\tthis.inputRef?.focus();\n\t}\n\n\tprivate readonly onKeyDown = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter' || event.code === 'NumpadEnter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.inputRef,\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate readonly onInput = (event: InputEvent) => {\n\t\tconst value = (event.target as HTMLInputElement).value;\n\t\tsetState(this, '_currentLength', value.length);\n\t\tthis._value = value;\n\t\tthis.controller.onFacade.onInput(event);\n\t};\n\n\tprivate getFormFieldProps(): FormFieldStateWrapperProps {\n\t\treturn {\n\t\t\tstate: this.state,\n\t\t\tclass: clsx('kol-input-email', 'email', {\n\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t}),\n\t\t\ttooltipAlign: this._tooltipAlign,\n\t\t\tonClick: () => this.inputRef?.focus(),\n\t\t\talert: this.showAsAlert(),\n\t\t};\n\t}\n\n\tprivate getInputProps(): InputStateWrapperProps {\n\t\treturn {\n\t\t\tref: this.catchRef,\n\t\t\tstate: this.state,\n\t\t\ttype: 'email',\n\t\t\t...this.controller.onFacade,\n\t\t\tonInput: this.onInput,\n\t\t\tonKeyDown: this.onKeyDown,\n\t\t\tonFocus: (event: Event) => {\n\t\t\t\tthis.controller.onFacade.onFocus(event);\n\t\t\t\tthis.inputHasFocus = true;\n\t\t\t},\n\t\t\tonBlur: (event: Event) => {\n\t\t\t\tthis.controller.onFacade.onBlur(event);\n\t\t\t\tthis.inputHasFocus = false;\n\t\t\t},\n\t\t};\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolFormFieldStateWrapperFc {...this.getFormFieldProps()}>\n\t\t\t\t<KolInputContainerFc state={this.state}>\n\t\t\t\t\t<KolInputStateWrapperFc {...this.getInputProps()} />\n\t\t\t\t</KolInputContainerFc>\n\t\t\t</KolFormFieldStateWrapperFc>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputEmailController;\n\n\t/**\n\t * Defines which key combination can be used to trigger or focus the interactive element of the component.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Defines whether the input can be auto-completed.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * @TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Shows the character count on the lower border of the input.\n\t * @TODO: Change type back to `HasCounterPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hasCounter?: boolean = false;\n\n\t/**\n\t * Hides the error message but leaves it in the DOM for the input's aria-describedby.\n\t * @TODO: Change type back to `HideMsgPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _hideMsg?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the hint text.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: IconsHorizontalPropType;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Defines the maximum number of input characters.\n\t */\n\t@Prop() public _maxLength?: number;\n\n\t/**\n\t * Defines the properties for a message rendered as Alert component.\n\t */\n\t@Prop() public _msg?: Stringified<MsgPropType>;\n\n\t/**\n\t * Makes the input accept multiple inputs.\n\t * @TODO: Change type back to `MultiplePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _multiple?: boolean = false;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Defines a validation pattern for the input field.\n\t */\n\t@Prop() public _pattern?: string;\n\n\t/**\n\t * Defines the placeholder for input field. To be shown when there's no value.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Makes the input element read only.\n\t * @TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _readOnly?: boolean = false;\n\n\t/**\n\t * Makes the input element required.\n\t * @TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _required?: boolean = false;\n\n\t/**\n\t * Adds a visual short key hint to the component.\n\t */\n\t@Prop() public _shortKey?: ShortKeyPropType;\n\n\t/**\n\t * Allows to add a button with an arbitrary action within the element (_hide-label only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * @TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Defines the value of the input.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _value?: string;\n\n\t@State() public state: InputEmailStates = {\n\t\t_autoComplete: 'off',\n\t\t_currentLength: 0,\n\t\t_hasValue: false,\n\t\t_hideMsg: false,\n\t\t_id: `id-${nonce()}`,\n\t\t_label: '', // ⚠ required\n\t\t_suggestions: [],\n\t};\n\n\t@State() private inputHasFocus = false;\n\n\tpublic constructor() {\n\t\tthis.controller = new InputEmailController(this, 'email', this.host);\n\t}\n\n\tprivate showAsAlert(): boolean {\n\t\treturn Boolean(this.state._touched) && !this.inputHasFocus;\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tthis.controller.validateHasCounter(value);\n\t}\n\n\t@Watch('_hideMsg')\n\tpublic validateHideMsg(value?: HideMsgPropType): void {\n\t\tthis.controller.validateHideMsg(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icons')\n\tpublic validateIcons(value?: IconsHorizontalPropType): void {\n\t\tthis.controller.validateIcons(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t@Watch('_msg')\n\tpublic validateMsg(value?: Stringified<MsgPropType>): void {\n\t\tthis.controller.validateMsg(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_shortKey')\n\tpublic validateShortKey(value?: ShortKeyPropType): void {\n\t\tthis.controller.validateShortKey(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"version":3}
+{"file":"kol-input-email.entry.js","mappings":"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","names":["KolFormFieldStateWrapperFc","KolInputContainerFc","KolInputStateWrapperFc"],"sources":["src/schema/props/multiple.ts","src/components/input-email/controller.ts","src/components/input-email/style.scss?tag=kol-input-email&mode=default&encapsulation=shadow","src/components/input-email/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\n\nimport { watchBoolean } from '../utils';\n\n/* types */\nexport type MultiplePropType = boolean;\n\n/**\n * Makes the input accept multiple inputs.\n */\nexport type PropMultiple = {\n\tmultiple: MultiplePropType;\n};\n\n/* validator */\nexport const validateMultiple = (component: Generic.Element.Component, value?: MultiplePropType): void => {\n\twatchBoolean(component, '_multiple', value);\n};\n","import type { Generic } from 'adopted-style-sheets';\n\nimport type { InputEmailProps, InputEmailWatches, MultiplePropType } from '../../schema';\nimport { validateMultiple } from '../../schema';\n\nimport { InputTextEmailController } from '../input-text/controller';\n\nexport class InputEmailController extends InputTextEmailController implements InputEmailWatches {\n\tprotected readonly component: Generic.Element.Component & InputEmailProps;\n\n\tpublic constructor(component: Generic.Element.Component & InputEmailProps, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tvalidateMultiple(this.component, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateMultiple(this.component._multiple);\n\t}\n}\n","@use '../../styles/global' as *;\n@use '../../styles/kol-alert-mixin' as *;\n@use '../../styles/kol-form-field-mixin' as *;\n@use '../../styles/kol-input-container-mixin' as *;\n@use '../../styles/kol-input-mixin' as *;\n@use '../@shared/mixins' as *;\n\n@include kol-alert;\n@include kol-form-field;\n@include kol-input-container;\n@include kol-input;\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Method, Prop, State, Watch } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport type {\n\tButtonProps,\n\tFocusableElement,\n\tHideMsgPropType,\n\tIconsHorizontalPropType,\n\tIdPropType,\n\tInputEmailAPI,\n\tInputEmailStates,\n\tInputTypeOnDefault,\n\tInputTypeOnOff,\n\tLabelWithExpertSlotPropType,\n\tMsgPropType,\n\tMultiplePropType,\n\tNamePropType,\n\tShortKeyPropType,\n\tStringified,\n\tSuggestionsPropType,\n\tSyncValueBySelectorPropType,\n\tTooltipAlignPropType,\n} from '../../schema';\nimport { setState } from '../../schema';\n\nimport { nonce } from '../../utils/dev.utils';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport KolFormFieldStateWrapperFc, { type FormFieldStateWrapperProps } from '../../functional-component-wrappers/FormFieldStateWrapper';\nimport KolInputStateWrapperFc, { type InputStateWrapperProps } from '../../functional-component-wrappers/InputStateWrapper';\nimport KolInputContainerFc from '../../functional-component-wrappers/InputContainerStateWrapper';\nimport { InputEmailController } from './controller';\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-email',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: {\n\t\tdelegatesFocus: true,\n\t},\n})\nexport class KolInputEmail implements InputEmailAPI, FocusableElement {\n\t@Element() private readonly host?: HTMLKolInputEmailElement;\n\tprivate inputRef?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.inputRef = ref;\n\t};\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async getValue(): Promise<string | undefined> {\n\t\treturn this.inputRef?.value;\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async kolFocus() {\n\t\tthis.inputRef?.focus();\n\t}\n\n\tprivate readonly onKeyDown = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter' || event.code === 'NumpadEnter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.inputRef,\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate readonly onInput = (event: InputEvent) => {\n\t\tconst value = (event.target as HTMLInputElement).value;\n\t\tsetState(this, '_currentLength', value.length);\n\t\tthis._value = value;\n\t\tthis.controller.onFacade.onInput(event);\n\t};\n\n\tprivate getFormFieldProps(): FormFieldStateWrapperProps {\n\t\treturn {\n\t\t\tstate: this.state,\n\t\t\tclass: clsx('kol-input-email', 'email', {\n\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t}),\n\t\t\ttooltipAlign: this._tooltipAlign,\n\t\t\tonClick: () => this.inputRef?.focus(),\n\t\t\talert: this.showAsAlert(),\n\t\t};\n\t}\n\n\tprivate getInputProps(): InputStateWrapperProps {\n\t\treturn {\n\t\t\tref: this.catchRef,\n\t\t\tstate: this.state,\n\t\t\ttype: 'email',\n\t\t\t...this.controller.onFacade,\n\t\t\tonInput: this.onInput,\n\t\t\tonKeyDown: this.onKeyDown,\n\t\t\tonFocus: (event: Event) => {\n\t\t\t\tthis.controller.onFacade.onFocus(event);\n\t\t\t\tthis.inputHasFocus = true;\n\t\t\t},\n\t\t\tonBlur: (event: Event) => {\n\t\t\t\tthis.controller.onFacade.onBlur(event);\n\t\t\t\tthis.inputHasFocus = false;\n\t\t\t},\n\t\t};\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolFormFieldStateWrapperFc {...this.getFormFieldProps()}>\n\t\t\t\t<KolInputContainerFc state={this.state}>\n\t\t\t\t\t<KolInputStateWrapperFc {...this.getInputProps()} />\n\t\t\t\t</KolInputContainerFc>\n\t\t\t</KolFormFieldStateWrapperFc>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputEmailController;\n\n\t/**\n\t * Defines which key combination can be used to trigger or focus the interactive element of the component.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Defines whether the input can be auto-completed.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * @TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Shows the character count on the lower border of the input.\n\t * @TODO: Change type back to `HasCounterPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hasCounter?: boolean = false;\n\n\t/**\n\t * Hides the error message but leaves it in the DOM for the input's aria-describedby.\n\t * @TODO: Change type back to `HideMsgPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _hideMsg?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the hint text.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: IconsHorizontalPropType;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Defines the maximum number of input characters.\n\t */\n\t@Prop() public _maxLength?: number;\n\n\t/**\n\t * Defines the properties for a message rendered as Alert component.\n\t */\n\t@Prop() public _msg?: Stringified<MsgPropType>;\n\n\t/**\n\t * Makes the input accept multiple inputs.\n\t * @TODO: Change type back to `MultiplePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _multiple?: boolean = false;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Defines a validation pattern for the input field.\n\t */\n\t@Prop() public _pattern?: string;\n\n\t/**\n\t * Defines the placeholder for input field. To be shown when there's no value.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Makes the input element read only.\n\t * @TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _readOnly?: boolean = false;\n\n\t/**\n\t * Makes the input element required.\n\t * @TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _required?: boolean = false;\n\n\t/**\n\t * Adds a visual short key hint to the component.\n\t */\n\t@Prop() public _shortKey?: ShortKeyPropType;\n\n\t/**\n\t * Allows to add a button with an arbitrary action within the element (_hide-label only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * @TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Defines the value of the input.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _value?: string;\n\n\t@State() public state: InputEmailStates = {\n\t\t_autoComplete: 'off',\n\t\t_currentLength: 0,\n\t\t_hasValue: false,\n\t\t_hideMsg: false,\n\t\t_id: `id-${nonce()}`,\n\t\t_label: '', // ⚠ required\n\t\t_suggestions: [],\n\t};\n\n\t@State() private inputHasFocus = false;\n\n\tpublic constructor() {\n\t\tthis.controller = new InputEmailController(this, 'email', this.host);\n\t}\n\n\tprivate showAsAlert(): boolean {\n\t\treturn Boolean(this.state._touched) && !this.inputHasFocus;\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tthis.controller.validateHasCounter(value);\n\t}\n\n\t@Watch('_hideMsg')\n\tpublic validateHideMsg(value?: HideMsgPropType): void {\n\t\tthis.controller.validateHideMsg(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icons')\n\tpublic validateIcons(value?: IconsHorizontalPropType): void {\n\t\tthis.controller.validateIcons(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t@Watch('_msg')\n\tpublic validateMsg(value?: Stringified<MsgPropType>): void {\n\t\tthis.controller.validateMsg(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: MultiplePropType): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_pattern')\n\tpublic validatePattern(value?: string): void {\n\t\tthis.controller.validatePattern(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_shortKey')\n\tpublic validateShortKey(value?: ShortKeyPropType): void {\n\t\tthis.controller.validateShortKey(value);\n\t}\n\n\t@Watch('_suggestions')\n\tpublic validateSuggestions(value?: SuggestionsPropType): void {\n\t\tthis.controller.validateSuggestions(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"version":3}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h,r as registerInstance,g as getElement}from"./index-aceb5633.js";import{c as clsx}from"./clsx-09a06a12.js";import{n as nonce}from"./dev.utils-9e6009ff.js";import{F as FormFieldStateWrapper}from"./getRenderStates-c9074761.js";import{I as InputStateWrapper}from"./InputStateWrapper-9982ec35.js";import{I as InputIconController,a as InputContainerStateWrapperFc}from"./controller-icon-75bb95e9.js";import{A as watchString,h as watchBoolean}from"./index-88dea7b1.js";import{t as translate}from"./i18n-01abf777.js";import{a as KolButtonWcTag}from"./component-names-799e91e2.js";import"./events-5886c68b.js";import"./associated.controller-4efb16f5.js";import"./bootstrap-874afb5b.js";import"./i18n-45224cc3.js";import"./access-and-short-key-753466cb.js";import"./tooltip-align-4c18152e.js";import"./align-a05c3d17.js";import"./hide-label-418cc5c0.js";import"./label-5982d241.js";import"./tslib.es6-1173d062.js";import"./Alert-bb061e95.js";import"./bem-e4c3a2e6.js";import"./browser-f629a56a.js";import"./Heading-598a07b9.js";import"./InternalUnderlinedBadgeText-2c119ff7.js";import"./isArray-7a60fa7f.js";import"./Input-56e72e4d.js";import"./Icon-0b8e0b26.js";import"./isObject-ffcbbb76.js";import"./icons-acf365fd.js";class InputFileController extends InputIconController{constructor(n,e,t){super(n,e,t),this.component=n}validateAccept(n){watchString(this.component,"_accept",n)}validateMultiple(n){watchBoolean(this.component,"_multiple",n)}validateRequired(n){watchBoolean(this.component,"_required",n)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required)}}const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    background-color: lightgray;\n    color: black;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.25s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n    position: absolute;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n    cursor: pointer;\n  }\n  .kol-input::-webkit-file-upload-button, .kol-input::file-selector-button {\n    cursor: pointer;\n  }\n  .kol-input:disabled, .kol-input:disabled::-webkit-file-upload-button, .kol-input:disabled::file-selector-button {\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n  .kol-input-container__container {\n    display: flex;\n    align-items: center;\n    overflow: hidden;\n    height: var(--a11y-min-size);\n  }\n  .kol-input-container__filename {\n    flex-grow: 1;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    margin-left: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr;\n  }\n}",KolInputFileDefaultStyle0=defaultStyleCss,KolInputFile=class{async getValue(){var n;return null===(n=this.inputRef)||void 0===n?void 0:n.files}async kolFocus(){var n;null===(n=this.inputRef)||void 0===n||n.focus()}getFormFieldProps(){return{state:this.state,class:clsx("kol-input-file","file"),tooltipAlign:this._tooltipAlign,onClick:()=>{var n;return null===(n=this.inputRef)||void 0===n?void 0:n.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"file",accept:this.state._accept,multiple:this.state._multiple},this.controller.onFacade),{onChange:this.onChange,onInput:this.onInput,onFocus:n=>{this.controller.onFacade.onFocus(n),this.inputHasFocus=!0},onBlur:n=>{this.controller.onFacade.onBlur(n),this.inputHasFocus=!1}})}render(){return h(FormFieldStateWrapper,Object.assign({key:"6c81b473b7ba7db7b45405159e0ae33913fdea8a"},this.getFormFieldProps()),h(InputContainerStateWrapperFc,{key:"5e7229bb6eb56acb38c9354bd3a2f1d5e101aa93",state:this.state},h("span",{key:"3742d51be8c2cc4ee6723269a964589a990f9e23",class:clsx("kol-input-container__filename",{"kol-input-container__filename--has-file":this.hasFileSelected})},this.filename),h(InputStateWrapper,Object.assign({key:"a1f03cccb74166437976eea391187546537fdfff"},this.getInputProps())),h(KolButtonWcTag,{key:"97492f6a7ef31282d00a182281ea29571cd056a8",class:"kol-input-container__button",_label:translate("kol-data-browse-text"),_variant:"primary",_disabled:this._disabled})))}constructor(n){registerInstance(this,n),this.catchRef=n=>{this.inputRef=n},this.onDragOver=n=>{var e,t,i;n.preventDefault(),null===(i=null===(t=null===(e=this.inputRef)||void 0===e?void 0:e.parentElement)||void 0===t?void 0:t.parentElement)||void 0===i||i.classList.add("kol-input-container--is-dragover")},this.onDragLeave=()=>{var n,e,t;null===(t=null===(e=null===(n=this.inputRef)||void 0===n?void 0:n.parentElement)||void 0===e?void 0:e.parentElement)||void 0===t||t.classList.remove("kol-input-container--is-dragover")},this.onDrop=n=>{var e,t,i,o;if(n.preventDefault(),null===(i=null===(t=null===(e=this.inputRef)||void 0===e?void 0:e.parentElement)||void 0===t?void 0:t.parentElement)||void 0===i||i.classList.remove("kol-input-container--is-dragover"),null===(o=n.dataTransfer)||void 0===o?void 0:o.files.length){const e=n.dataTransfer.files;this.filename=Array.from(e).map((n=>n.name)).join(", "),this.controller.setFormAssociatedValue(e)}},this.onChange=n=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const e=this.inputRef.files;this.hasFileSelected=!!(null==e?void 0:e.length),this.filename=(null==e?void 0:e.length)?Array.from(e).map((n=>n.name)).join(", "):translate("kol-filename-text"),this.controller.onFacade.onChange(n,e),this.controller.setFormAssociatedValue(e)}},this.onInput=n=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const e=this.inputRef.files;this.controller.onFacade.onInput(n,!1,e)}},this._accept=void 0,this._accessKey=void 0,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tooltipAlign="top",this._touched=!1,this.filename=translate("kol-filename-text"),this.hasFileSelected=!1,this.state={_hideMsg:!1,_id:`id-${nonce()}`,_label:""},this.inputHasFocus=!1,this.controller=new InputFileController(this,"file",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccept(n){this.controller.validateAccept(n)}validateAccessKey(n){this.controller.validateAccessKey(n)}validateDisabled(n){this.controller.validateDisabled(n)}validateHideMsg(n){this.controller.validateHideMsg(n)}validateHideLabel(n){this.controller.validateHideLabel(n)}validateHint(n){this.controller.validateHint(n)}validateIcons(n){this.controller.validateIcons(n)}validateId(n){this.controller.validateId(n)}validateLabel(n){this.controller.validateLabel(n)}validateMsg(n){this.controller.validateMsg(n)}validateMultiple(n){this.controller.validateMultiple(n)}validateName(n){this.controller.validateName(n)}validateOn(n){this.controller.validateOn(n)}validateRequired(n){this.controller.validateRequired(n)}validateShortKey(n){this.controller.validateShortKey(n)}validateSmartButton(n){this.controller.validateSmartButton(n)}validateSyncValueBySelector(n){this.controller.validateSyncValueBySelector(n)}validateTouched(n){this.controller.validateTouched(n)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}componentDidLoad(){var n,e;const t=null===(e=null===(n=this.inputRef)||void 0===n?void 0:n.parentElement)||void 0===e?void 0:e.parentElement;null==t||t.addEventListener("dragover",this.onDragOver),null==t||t.addEventListener("dragleave",this.onDragLeave),null==t||t.addEventListener("drop",this.onDrop)}static get delegatesFocus(){return!0}get host(){return getElement(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"]}}};KolInputFile.style={default:KolInputFileDefaultStyle0};export{KolInputFile as kol_input_file};
+import{h,r as registerInstance,g as getElement}from"./index-1ed13705.js";import{c as clsx}from"./clsx-09a06a12.js";import{n as nonce}from"./dev.utils-cb61837d.js";import{F as FormFieldStateWrapper}from"./getRenderStates-c4b5c6cb.js";import{I as InputStateWrapper}from"./InputStateWrapper-9b8419a8.js";import{I as InputIconController,a as InputContainerStateWrapperFc}from"./controller-icon-de12de48.js";import{B as watchString,i as watchBoolean}from"./index-ebe5a881.js";import{t as translate}from"./i18n-260f0fe9.js";import{b as KolButtonWcTag}from"./component-names-7924d82a.js";import"./events-bad0a075.js";import"./associated.controller-92af2554.js";import"./bootstrap-93c7a706.js";import"./i18n-45224cc3.js";import"./access-and-short-key-f743a5c4.js";import"./tooltip-align-465a8590.js";import"./align-d2572387.js";import"./hide-label-8b3a8709.js";import"./label-bf9966d0.js";import"./tslib.es6-1173d062.js";import"./Alert-112aec59.js";import"./bem-e4c3a2e6.js";import"./browser-f629a56a.js";import"./Heading-733c8dda.js";import"./InternalUnderlinedBadgeText-781ef373.js";import"./isArray-7a60fa7f.js";import"./Input-8502a991.js";import"./Icon-446dff9e.js";import"./isObject-ffcbbb76.js";import"./icons-a9c52ed8.js";class InputFileController extends InputIconController{constructor(n,e,t){super(n,e,t),this.component=n}validateAccept(n){watchString(this.component,"_accept",n)}validateMultiple(n){watchBoolean(this.component,"_multiple",n)}validateRequired(n){watchBoolean(this.component,"_required",n)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required)}}const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    background-color: lightgray;\n    color: black;\n  }\n}\n@layer kol-global {\n  :host {\n    font-size: rem(16);\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.25s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n    position: absolute;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n    cursor: pointer;\n  }\n  .kol-input::-webkit-file-upload-button, .kol-input::file-selector-button {\n    cursor: pointer;\n  }\n  .kol-input:disabled, .kol-input:disabled::-webkit-file-upload-button, .kol-input:disabled::file-selector-button {\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n  .kol-input-container__container {\n    display: flex;\n    align-items: center;\n    overflow: hidden;\n    height: var(--a11y-min-size);\n  }\n  .kol-input-container__filename {\n    flex-grow: 1;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    margin-left: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr;\n  }\n}",KolInputFileDefaultStyle0=defaultStyleCss,KolInputFile=class{async getValue(){var n;return null===(n=this.inputRef)||void 0===n?void 0:n.files}async kolFocus(){var n;null===(n=this.inputRef)||void 0===n||n.focus()}getFormFieldProps(){return{state:this.state,class:clsx("kol-input-file","file"),tooltipAlign:this._tooltipAlign,onClick:()=>{var n;return null===(n=this.inputRef)||void 0===n?void 0:n.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"file",accept:this.state._accept,multiple:this.state._multiple},this.controller.onFacade),{onChange:this.onChange,onInput:this.onInput,onFocus:n=>{this.controller.onFacade.onFocus(n),this.inputHasFocus=!0},onBlur:n=>{this.controller.onFacade.onBlur(n),this.inputHasFocus=!1}})}render(){return h(FormFieldStateWrapper,Object.assign({key:"6c81b473b7ba7db7b45405159e0ae33913fdea8a"},this.getFormFieldProps()),h(InputContainerStateWrapperFc,{key:"5e7229bb6eb56acb38c9354bd3a2f1d5e101aa93",state:this.state},h("span",{key:"3742d51be8c2cc4ee6723269a964589a990f9e23",class:clsx("kol-input-container__filename",{"kol-input-container__filename--has-file":this.hasFileSelected})},this.filename),h(InputStateWrapper,Object.assign({key:"a1f03cccb74166437976eea391187546537fdfff"},this.getInputProps())),h(KolButtonWcTag,{key:"f4a981d962e7aa6b95c57629aa47c97eecec0483",class:"kol-input-container__button",_label:translate("kol-data-browse-text"),_buttonVariant:"primary",_disabled:this._disabled})))}constructor(n){registerInstance(this,n),this.catchRef=n=>{this.inputRef=n},this.onDragOver=n=>{var e,t,i;n.preventDefault(),null===(i=null===(t=null===(e=this.inputRef)||void 0===e?void 0:e.parentElement)||void 0===t?void 0:t.parentElement)||void 0===i||i.classList.add("kol-input-container--is-dragover")},this.onDragLeave=()=>{var n,e,t;null===(t=null===(e=null===(n=this.inputRef)||void 0===n?void 0:n.parentElement)||void 0===e?void 0:e.parentElement)||void 0===t||t.classList.remove("kol-input-container--is-dragover")},this.onDrop=n=>{var e,t,i,o;if(n.preventDefault(),null===(i=null===(t=null===(e=this.inputRef)||void 0===e?void 0:e.parentElement)||void 0===t?void 0:t.parentElement)||void 0===i||i.classList.remove("kol-input-container--is-dragover"),null===(o=n.dataTransfer)||void 0===o?void 0:o.files.length){const e=n.dataTransfer.files;this.filename=Array.from(e).map((n=>n.name)).join(", "),this.controller.setFormAssociatedValue(e)}},this.onChange=n=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const e=this.inputRef.files;this.hasFileSelected=!!(null==e?void 0:e.length),this.filename=(null==e?void 0:e.length)?Array.from(e).map((n=>n.name)).join(", "):translate("kol-filename-text"),this.controller.onFacade.onChange(n,e),this.controller.setFormAssociatedValue(e)}},this.onInput=n=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const e=this.inputRef.files;this.controller.onFacade.onInput(n,!1,e)}},this._accept=void 0,this._accessKey=void 0,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tooltipAlign="top",this._touched=!1,this.filename=translate("kol-filename-text"),this.hasFileSelected=!1,this.state={_hideMsg:!1,_id:`id-${nonce()}`,_label:""},this.inputHasFocus=!1,this.controller=new InputFileController(this,"file",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccept(n){this.controller.validateAccept(n)}validateAccessKey(n){this.controller.validateAccessKey(n)}validateDisabled(n){this.controller.validateDisabled(n)}validateHideMsg(n){this.controller.validateHideMsg(n)}validateHideLabel(n){this.controller.validateHideLabel(n)}validateHint(n){this.controller.validateHint(n)}validateIcons(n){this.controller.validateIcons(n)}validateId(n){this.controller.validateId(n)}validateLabel(n){this.controller.validateLabel(n)}validateMsg(n){this.controller.validateMsg(n)}validateMultiple(n){this.controller.validateMultiple(n)}validateName(n){this.controller.validateName(n)}validateOn(n){this.controller.validateOn(n)}validateRequired(n){this.controller.validateRequired(n)}validateShortKey(n){this.controller.validateShortKey(n)}validateSmartButton(n){this.controller.validateSmartButton(n)}validateSyncValueBySelector(n){this.controller.validateSyncValueBySelector(n)}validateTouched(n){this.controller.validateTouched(n)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}componentDidLoad(){var n,e;const t=null===(e=null===(n=this.inputRef)||void 0===n?void 0:n.parentElement)||void 0===e?void 0:e.parentElement;null==t||t.addEventListener("dragover",this.onDragOver),null==t||t.addEventListener("dragleave",this.onDragLeave),null==t||t.addEventListener("drop",this.onDrop)}static get delegatesFocus(){return!0}get host(){return getElement(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"]}}};KolInputFile.style={default:KolInputFileDefaultStyle0};export{KolInputFile as kol_input_file};