@sky.ui/core 0.0.53 → 0.0.55

package/dist/sky-input/sky-input.js

@@ -1,4 +1,4 @@
-import{css as t,LitElement as e,html as i,nothing as a}from"lit";import{ifDefined as s}from"lit/directives/if-defined.js";import{styleMap as r}from"lit/directives/style-map.js";import{property as n,state as o,query as l,customElement as p}from"lit/decorators.js";import{resolveColor as d}from"../helper/utils/color-resolver.js";import{PresetController as h}from"../helper/controllers/preset-controller.js";import{live as c}from"lit/directives/live.js";import{FormControlBase as u}from"../helper/internals/form-control-base.js";import{SkyIcon as y}from"../sky-icon/sky-icon.js";var v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,m=(t,e,i,a)=>{for(var s,r=a>1?void 0:a?f(e,i):e,n=t.length-1;n>=0;n--)(s=t[n])&&(r=(a?s(e,i,r):s(r))||r);return a&&r&&v(e,i,r),r};let g=class extends u{constructor(){super(...arguments),this.value="",this.placeholder="",this.label="",this.type="text",this.suffix="",this.prefix="",this.prefixColor="",this.suffixColor="",this.color="primary",this._validations=[],this.compact=!1,this.loading=!1,this.showErrors=!1,this.clearable=!1,this.errorDisplayMode="single",this.required=!1,this.step=null,this.min=null,this.max=null,this.autocapitalize="off",this.autocomplete="off",this.spellcheck=!1,this.dir="ltr",this.rows=6,this.resizable="none",this.accept="",this.multiple=!1,this.inputmode=null,this.enterkeyhint=null,this.pattern=null,this.minlength=null,this.maxlength=null,this.list=null,this.size=null,this.cols=null,this.autofocus=!1,this.capture=!1,this.inputRole=null,this.ariaLabel=null,this.ariaLabelledby=null,this.ariaDescribedby=null,this.showNumberButtons=!1,this.showPasswordToggle=!0,this.passwordVisibleIcon="material-symbols:visibility-off",this.passwordHiddenIcon="material-symbols:visibility",this.validationActive=!1,this.invalid=!1,this.variant="default",this.preset="",this._presets=new h(this),this.selectedFileName="",this.selectedFiles=[],this.focused=!1,this.validationStatus=[],this.validationErrors=[],this.typingStarted=!1,this.autofillIconSlot="left",this.autofillGuardActive=!1,this.showPassword=!1,this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null,this._leftIconSlot=null,this._rightIconSlot=null,this._iconClickWired=new WeakSet,this._onLeftIconSlotChange=()=>this._wireIconSlot("left",this._leftIconSlot),this._onRightIconSlotChange=()=>this._wireIconSlot("right",this._rightIconSlot),this.keepInputFocused=t=>{t.preventDefault(),t.stopPropagation(),this.refocusInput()}}get validations(){return this._validations}set validations(t){const e=this._validations;this._validations=Array.isArray(t)?t:[],this.requestUpdate("validations",e)}connectedCallback(){super.connectedCallback(),this.autofillGuardActive="search"===this.type,this.hasAttribute("tabindex")||(this.tabIndex=this.disabled?-1:0),this.hasUpdated&&this._setupIconSlots()}disconnectedCallback(){this._leftIconSlot?.removeEventListener("slotchange",this._onLeftIconSlotChange),this._rightIconSlot?.removeEventListener("slotchange",this._onRightIconSlotChange),this._leftIconSlot=null,this._rightIconSlot=null,super.disconnectedCallback()}_setupIconSlots(){this._leftIconSlot||(this._leftIconSlot=this.shadowRoot?.querySelector('slot[name="icon-left"]')??null,this._leftIconSlot?.addEventListener("slotchange",this._onLeftIconSlotChange)),this._rightIconSlot||(this._rightIconSlot=this.shadowRoot?.querySelector('slot[name="icon-right"]')??null,this._rightIconSlot?.addEventListener("slotchange",this._onRightIconSlotChange)),this._wireIconSlot("left",this._leftIconSlot),this._wireIconSlot("right",this._rightIconSlot)}_wireIconSlot(t,e){if(e)for(const i of e.assignedElements({flatten:!0}))i instanceof HTMLElement&&(this._iconClickWired.has(i)||(this._iconClickWired.add(i),i.addEventListener("click",()=>this.handleIconClick(t))))}firstUpdated(t){super.firstUpdated(t),this.captureDefaultValue(this.value),this.syncFormValue(),this.syncValidity(),this._setupIconSlots()}willUpdate(t){t.has("validations")&&Array.isArray(this.validations)&&(this.validationStatus=this.validations.map(()=>!1)),t.has("value")&&"file"===this.type&&(null==this.value||""===String(this.value).trim()?(this.selectedFileName="",this.selectedFiles=[],this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null):this.selectedFileName||(this.selectedFileName=this.value)),t.has("type")&&"search"===this.type&&(this.autofillGuardActive=!0)}updated(t){if(super.updated(t),this.setAttribute("data-sky-variant",this.variant),this.toggleAttribute("data-sky-compact",this.compact),this.color&&this.style.setProperty("--sky-input-color",d(this.color)),t.has("rows")){const t=this.inputWrapperEl;t&&t.style.setProperty("--rows",String(this.rows))}(t.has("value")||t.has("selectedFiles")||t.has("selectedFileName")||t.has("type")||t.has("multiple")||t.has("name")||t.has("disabled"))&&this.syncFormValue(),(t.has("value")||t.has("selectedFiles")||t.has("selectedFileName")||t.has("validationErrors")||t.has("required")||t.has("disabled")||t.has("readonly"))&&this.syncValidity()}getFormValue(){if(!this.name)return null;if("file"===this.type){if(!this.selectedFiles||0===this.selectedFiles.length)return null;if(this.multiple){const t=new FormData;for(const e of this.selectedFiles)t.append(this.name,e);return t}return this.selectedFiles[0]}return this.value??""}setValueFromFormState(t){"string"!=typeof t?(this.value="",this.selectedFileName="",this.selectedFiles=[],this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null):this.value=t}getValidityAnchor(){return this}isEmpty(){return"file"===this.type?!this.selectedFiles||0===this.selectedFiles.length:!this.value||""===this.value.toString().trim()}getCustomErrorMessage(){return this.validationErrors?.length?"all"===this.errorDisplayMode?this.validationErrors.join("\n"):this.validationErrors[0]:""}getNativeControl(){return"textarea"===this.type?this.shadowRoot?.querySelector("textarea"):this.shadowRoot?.querySelector("input")}onNativeValueMutated(t){"file"!==this.type&&(this.value=t?.value??""),this.validateInput()}reset(){this.value="",this.selectedFileName="",this.filePreview=null,this.selectedFiles=[],this.selectedFileCount=0,this.validationErrors=[],this.typingStarted=!1,this.validationActive=!1,this.selectedFileCount=0,this.totalFileSize=0}get nativeRequiredMessage(){return this.validationActive?this.disabled?"":this.required&&this.isEmpty()?this.requiredMessage||"This field is required.":"":""}getEmittedValue(){if("number"!==this.type)return this.value;if(""===this.value||null==this.value)return"";const t=Number(this.value);return Number.isFinite(t)?t:this.value}handleClear(){this.disabled||this.readonly||(this.reset(),this.validationActive=!0,this.validateInput(),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("value-cleared",{detail:{value:this.getEmittedValue()},bubbles:!0,composed:!0})))}handleFileChange(t){if(this.disabled||this.readonly)return;const e=t.target.files;if(e&&e.length){const i=Array.from(e);this.selectedFiles=i,this.selectedFileName=i.map(t=>t.name).join(", "),this.value=this.selectedFileName,this.syncFormValue(),this.syncValidity();const a=i.reduce((t,e)=>t+e.size,0);if(this.totalFileSize=a,this.selectedFileCount=i.length,i[0].type.startsWith("image/")){const t=new FileReader;t.onload=t=>{t.target&&(this.filePreview=t.target.result)},t.readAsDataURL(i[0])}else this.filePreview=null;this.reemitNativeEvent("change",t),this.reemitNativeEvent("input",t),this.dispatchEvent(new CustomEvent("file-selected",{detail:{files:i,fileName:this.selectedFileName,totalSize:a,fileCount:this.selectedFileCount},bubbles:!0,composed:!0})),this.validateInput()}else this.value="",this.filePreview=null,this.totalFileSize=0,this.selectedFileCount=0,this.selectedFiles=[],this.validateInput()}handleKeydown(t){this.disabled||this.readonly||"Enter"===t.key&&"file"===this.type&&(t.preventDefault(),t.stopPropagation(),this.triggerNativeDropdown())}get preview(){return this.filePreview}handleInput(t){t.stopPropagation(),this.disabled||this.readonly?t.preventDefault():(this.value=t.target.value,this.syncFormValue(),this.syncValidity(),this.typingStarted||(this.typingStarted=!0),this.validateInput(),this.reemitNativeEvent("input",t),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()},bubbles:!0,composed:!0})))}handleFocus(t){t.stopPropagation(),this.releaseAutofillGuard(),this.focused=!0,this.reemitNativeEvent("focus",t)}releaseAutofillGuard(){this.autofillGuardActive&&(this.autofillGuardActive=!1)}handleAutofillGuardPointerDown(t){this.releaseAutofillGuard(),t.stopPropagation()}onFormReset(){this.setValueFromFormState(this.defaultValue),this.validationActive=!1,this.invalid=!1,this.typingStarted=!1,this.validationErrors=[],this.validationStatus=[],"file"===this.type&&(this.selectedFiles=[],this.selectedFileName="",this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null),"search"===this.type&&(this.autofillGuardActive=!0)}handleBlur(t){t.stopPropagation(),this.validationActive=!0,this.focused=!1,this.reemitNativeEvent("blur",t)}validateForForm(){const t="file"===this.type?this.selectedFiles??[]:this.value??"";for(const e of this.validations??[]){const i=e(t);if(!0!==i)return"string"==typeof i?i:"Invalid value."}return""}validateInput(){this.validationErrors=[],this.validationStatus=[];const t="file"===this.type,e=t?!this.selectedFiles||0===this.selectedFiles.length:!this.value||""===this.value.toString().trim();if(this.required&&e&&this.syncValidity(),Array.isArray(this.validations)&&this.validations.length){const e=t?this.selectedFiles??[]:this.value??"";this.validationStatus=this.validations.map((t,i)=>{try{if("function"!=typeof t)throw new Error(`Validation at index ${i} must be a function.`);const a=t(e);return!0===a||(this.validationErrors.push("string"==typeof a?a:`Validation ${i} failed.`),!1)}catch(t){const e="object"==typeof t&&null!==t&&"message"in t?String(t.message):"string"==typeof t?t:"Unknown error";return this.validationErrors.push(`Error in validation ${i}: ${e}`),!1}})}this.dispatchEvent(new CustomEvent("validation-error",{detail:{errors:this.validationErrors},bubbles:!0,composed:!0})),this.syncValidity();const i=0===this.validationErrors.length;return this.invalid=!i,i}getErrorMessages(){switch(this.errorDisplayMode){case"single":return this.validationErrors.slice(0,1);case"all":return this.validationErrors;default:return[]}}handleIconClick(t,e=null){this.dispatchEvent(new CustomEvent(`${t}-icon-click`,{detail:{position:t,eventType:e?e.type:null,eventData:e},bubbles:!0,composed:!0}))}formatFileSize(t){if(0===t)return"0 Bytes";const e=Math.floor(Math.log(t)/Math.log(1024));return`${parseFloat((t/Math.pow(1024,e)).toFixed(2))} ${["Bytes","KB","MB","GB","TB"][e]}`}incrementValue(){if(this.disabled||this.readonly)return;const t=parseFloat(this.value)||0,e=parseFloat(this.step??"")||1;t+e<=(this.max?parseFloat(this.max):1/0)&&(this.value=(t+e).toString(),this.validateInput(),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()}}))),this.refocusInput()}decrementValue(){if(this.disabled||this.readonly)return;const t=parseFloat(this.value)||0,e=parseFloat(this.step??"")||1;t-e>=(this.min?parseFloat(this.min):-1/0)&&(this.value=(t-e).toString(),this.validateInput(),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()}}))),this.refocusInput()}renderValidationErrors(){if(!this.showErrors||!this.validationActive)return null;const t=this.nativeRequiredMessage,e=this.getErrorMessages();let a=[];if("single"===this.errorDisplayMode?t?a=[t]:e.length&&(a=[e[0]]):a=t?[t,...e]:e,!a.length)return null;const s=`${this.id||"sky-input"}-errors`;return i`
+import{css as t,LitElement as e,html as i,nothing as a}from"lit";import{ifDefined as s}from"lit/directives/if-defined.js";import{styleMap as r}from"lit/directives/style-map.js";import{property as n,state as o,query as l,customElement as p}from"lit/decorators.js";import{resolveColor as d}from"../helper/utils/color-resolver.js";import{PresetController as h}from"../helper/controllers/preset-controller.js";import{live as c}from"lit/directives/live.js";import{FormControlBase as u}from"../helper/internals/form-control-base.js";import{SkyIcon as y}from"../sky-icon/sky-icon.js";var v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,m=(t,e,i,a)=>{for(var s,r=a>1?void 0:a?f(e,i):e,n=t.length-1;n>=0;n--)(s=t[n])&&(r=(a?s(e,i,r):s(r))||r);return a&&r&&v(e,i,r),r};const g=Object.freeze([]);function b(t,e){if(t===e)return!0;if(t.length!==e.length)return!1;for(let i=0;i<t.length;i++)if(t[i]!==e[i])return!1;return!0}let k=class extends u{constructor(){super(...arguments),this.value="",this.placeholder="",this.label="",this.type="text",this.suffix="",this.prefix="",this.prefixColor="",this.suffixColor="",this.color="primary",this._validations=g,this.compact=!1,this.loading=!1,this.showErrors=!1,this.clearable=!1,this.errorDisplayMode="single",this.required=!1,this.step=null,this.min=null,this.max=null,this.autocapitalize="off",this.autocomplete="off",this.spellcheck=!1,this.dir="ltr",this.rows=6,this.resizable="none",this.accept="",this.multiple=!1,this.inputmode=null,this.enterkeyhint=null,this.pattern=null,this.minlength=null,this.maxlength=null,this.list=null,this.size=null,this.cols=null,this.autofocus=!1,this.capture=!1,this.inputRole=null,this.ariaLabel=null,this.ariaLabelledby=null,this.ariaDescribedby=null,this.showNumberButtons=!1,this.showPasswordToggle=!0,this.passwordVisibleIcon="material-symbols:visibility-off",this.passwordHiddenIcon="material-symbols:visibility",this.validationActive=!1,this.invalid=!1,this.variant="default",this.preset="",this._presets=new h(this),this.selectedFileName="",this.selectedFiles=[],this.focused=!1,this.validationStatus=[],this.validationErrors=[],this.typingStarted=!1,this.autofillIconSlot="left",this.autofillGuardActive=!1,this.showPassword=!1,this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null,this._leftIconSlot=null,this._rightIconSlot=null,this._iconClickWired=new WeakSet,this._onLeftIconSlotChange=()=>this._wireIconSlot("left",this._leftIconSlot),this._onRightIconSlotChange=()=>this._wireIconSlot("right",this._rightIconSlot),this.keepInputFocused=t=>{t.preventDefault(),t.stopPropagation(),this.refocusInput()}}get validations(){return this._validations}set validations(t){this._validations=Array.isArray(t)&&t.length>0?t:g}connectedCallback(){super.connectedCallback(),this.autofillGuardActive="search"===this.type,this.hasAttribute("tabindex")||(this.tabIndex=this.disabled?-1:0),this.hasUpdated&&this._setupIconSlots()}disconnectedCallback(){this._leftIconSlot?.removeEventListener("slotchange",this._onLeftIconSlotChange),this._rightIconSlot?.removeEventListener("slotchange",this._onRightIconSlotChange),this._leftIconSlot=null,this._rightIconSlot=null,super.disconnectedCallback()}_setupIconSlots(){this._leftIconSlot||(this._leftIconSlot=this.shadowRoot?.querySelector('slot[name="icon-left"]')??null,this._leftIconSlot?.addEventListener("slotchange",this._onLeftIconSlotChange)),this._rightIconSlot||(this._rightIconSlot=this.shadowRoot?.querySelector('slot[name="icon-right"]')??null,this._rightIconSlot?.addEventListener("slotchange",this._onRightIconSlotChange)),this._wireIconSlot("left",this._leftIconSlot),this._wireIconSlot("right",this._rightIconSlot)}_wireIconSlot(t,e){if(e)for(const i of e.assignedElements({flatten:!0}))i instanceof HTMLElement&&(this._iconClickWired.has(i)||(this._iconClickWired.add(i),i.addEventListener("click",()=>this.handleIconClick(t))))}firstUpdated(t){super.firstUpdated(t),this.captureDefaultValue(this.value),this.syncFormValue(),this.syncValidity(),this._setupIconSlots()}willUpdate(t){t.has("validations")&&Array.isArray(this.validations)&&(this.validationStatus=this.validations.map(()=>!1)),t.has("value")&&"file"===this.type&&(null==this.value||""===String(this.value).trim()?(this.selectedFileName="",this.selectedFiles=[],this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null):this.selectedFileName||(this.selectedFileName=this.value)),t.has("type")&&"search"===this.type&&(this.autofillGuardActive=!0)}updated(t){if(super.updated(t),this.setAttribute("data-sky-variant",this.variant),this.toggleAttribute("data-sky-compact",this.compact),this.color&&this.style.setProperty("--sky-input-color",d(this.color)),t.has("rows")){const t=this.inputWrapperEl;t&&t.style.setProperty("--rows",String(this.rows))}(t.has("value")||t.has("selectedFiles")||t.has("selectedFileName")||t.has("type")||t.has("multiple")||t.has("name")||t.has("disabled"))&&this.syncFormValue(),(t.has("value")||t.has("selectedFiles")||t.has("selectedFileName")||t.has("validationErrors")||t.has("required")||t.has("disabled")||t.has("readonly"))&&this.syncValidity()}getFormValue(){if(!this.name)return null;if("file"===this.type){if(!this.selectedFiles||0===this.selectedFiles.length)return null;if(this.multiple){const t=new FormData;for(const e of this.selectedFiles)t.append(this.name,e);return t}return this.selectedFiles[0]}return this.value??""}setValueFromFormState(t){"string"!=typeof t?(this.value="",this.selectedFileName="",this.selectedFiles=[],this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null):this.value=t}getValidityAnchor(){return this}isEmpty(){return"file"===this.type?!this.selectedFiles||0===this.selectedFiles.length:!this.value||""===this.value.toString().trim()}getCustomErrorMessage(){return this.validationErrors?.length?"all"===this.errorDisplayMode?this.validationErrors.join("\n"):this.validationErrors[0]:""}getNativeControl(){return"textarea"===this.type?this.shadowRoot?.querySelector("textarea"):this.shadowRoot?.querySelector("input")}onNativeValueMutated(t){"file"!==this.type&&(this.value=t?.value??""),this.validateInput()}reset(){this.value="",this.selectedFileName="",this.filePreview=null,this.selectedFiles=[],this.selectedFileCount=0,this.validationErrors=[],this.typingStarted=!1,this.validationActive=!1,this.selectedFileCount=0,this.totalFileSize=0}get nativeRequiredMessage(){return this.validationActive?this.disabled?"":this.required&&this.isEmpty()?this.requiredMessage||"This field is required.":"":""}getEmittedValue(){if("number"!==this.type)return this.value;if(""===this.value||null==this.value)return"";const t=Number(this.value);return Number.isFinite(t)?t:this.value}handleClear(){this.disabled||this.readonly||(this.reset(),this.validationActive=!0,this.validateInput(),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("value-cleared",{detail:{value:this.getEmittedValue()},bubbles:!0,composed:!0})))}handleFileChange(t){if(this.disabled||this.readonly)return;const e=t.target.files;if(e&&e.length){const i=Array.from(e);this.selectedFiles=i,this.selectedFileName=i.map(t=>t.name).join(", "),this.value=this.selectedFileName,this.syncFormValue(),this.syncValidity();const a=i.reduce((t,e)=>t+e.size,0);if(this.totalFileSize=a,this.selectedFileCount=i.length,i[0].type.startsWith("image/")){const t=new FileReader;t.onload=t=>{t.target&&(this.filePreview=t.target.result)},t.readAsDataURL(i[0])}else this.filePreview=null;this.reemitNativeEvent("change",t),this.reemitNativeEvent("input",t),this.dispatchEvent(new CustomEvent("file-selected",{detail:{files:i,fileName:this.selectedFileName,totalSize:a,fileCount:this.selectedFileCount},bubbles:!0,composed:!0})),this.validateInput()}else this.value="",this.filePreview=null,this.totalFileSize=0,this.selectedFileCount=0,this.selectedFiles=[],this.validateInput()}handleKeydown(t){this.disabled||this.readonly||"Enter"===t.key&&"file"===this.type&&(t.preventDefault(),t.stopPropagation(),this.triggerNativeDropdown())}get preview(){return this.filePreview}handleInput(t){t.stopPropagation(),this.disabled||this.readonly?t.preventDefault():(this.value=t.target.value,this.syncFormValue(),this.syncValidity(),this.typingStarted||(this.typingStarted=!0),this.validationActive&&this.validateInput(),this.reemitNativeEvent("input",t),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()},bubbles:!0,composed:!0})))}handleFocus(t){t.stopPropagation(),this.releaseAutofillGuard(),this.focused=!0,this.reemitNativeEvent("focus",t)}releaseAutofillGuard(){this.autofillGuardActive&&(this.autofillGuardActive=!1)}handleAutofillGuardPointerDown(t){this.releaseAutofillGuard(),t.stopPropagation()}onFormReset(){this.setValueFromFormState(this.defaultValue),this.validationActive=!1,this.invalid=!1,this.typingStarted=!1,this.validationErrors=[],this.validationStatus=[],"file"===this.type&&(this.selectedFiles=[],this.selectedFileName="",this.totalFileSize=0,this.selectedFileCount=0,this.filePreview=null),"search"===this.type&&(this.autofillGuardActive=!0)}handleBlur(t){t.stopPropagation(),this.validationActive=!0,this.focused=!1,this.reemitNativeEvent("blur",t)}validateForForm(){const t="file"===this.type?this.selectedFiles??[]:this.value??"";for(const e of this.validations??[]){const i=e(t);if(!0!==i)return"string"==typeof i?i:"Invalid value."}return""}validateInput(){const t=[],e=[],i="file"===this.type,a=i?!this.selectedFiles||0===this.selectedFiles.length:!this.value||""===this.value.toString().trim();if(this.required&&a&&this.syncValidity(),Array.isArray(this.validations)&&this.validations.length){const a=i?this.selectedFiles??[]:this.value??"";for(let i=0;i<this.validations.length;i++){const s=this.validations[i];try{if("function"!=typeof s)throw new Error(`Validation at index ${i} must be a function.`);const r=s(a);!0!==r?(t.push("string"==typeof r?r:`Validation ${i} failed.`),e.push(!1)):e.push(!0)}catch(a){const s="object"==typeof a&&null!==a&&"message"in a?String(a.message):"string"==typeof a?a:"Unknown error";t.push(`Error in validation ${i}: ${s}`),e.push(!1)}}}const s=!b(this.validationErrors,t),r=!b(this.validationStatus,e);s&&(this.validationErrors=t),r&&(this.validationStatus=e),s&&this.dispatchEvent(new CustomEvent("validation-error",{detail:{errors:this.validationErrors},bubbles:!0,composed:!0})),this.syncValidity();const n=0===t.length;return this.invalid!==!n&&(this.invalid=!n),n}getErrorMessages(){switch(this.errorDisplayMode){case"single":return this.validationErrors.slice(0,1);case"all":return this.validationErrors;default:return[]}}handleIconClick(t,e=null){this.dispatchEvent(new CustomEvent(`${t}-icon-click`,{detail:{position:t,eventType:e?e.type:null,eventData:e},bubbles:!0,composed:!0}))}formatFileSize(t){if(0===t)return"0 Bytes";const e=Math.floor(Math.log(t)/Math.log(1024));return`${parseFloat((t/Math.pow(1024,e)).toFixed(2))} ${["Bytes","KB","MB","GB","TB"][e]}`}incrementValue(){if(this.disabled||this.readonly)return;const t=parseFloat(this.value)||0,e=parseFloat(this.step??"")||1;t+e<=(this.max?parseFloat(this.max):1/0)&&(this.value=(t+e).toString(),this.validateInput(),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()}}))),this.refocusInput()}decrementValue(){if(this.disabled||this.readonly)return;const t=parseFloat(this.value)||0,e=parseFloat(this.step??"")||1;t-e>=(this.min?parseFloat(this.min):-1/0)&&(this.value=(t-e).toString(),this.validateInput(),this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:this.getEmittedValue()}}))),this.refocusInput()}renderValidationErrors(){if(!this.showErrors||!this.validationActive)return null;const t=this.nativeRequiredMessage,e=this.getErrorMessages();let a=[];if("single"===this.errorDisplayMode?t?a=[t]:e.length&&(a=[e[0]]):a=t?[t,...e]:e,!a.length)return null;const s=`${this.id||"sky-input"}-errors`;return i`
       <div class="progress-message">
         <ul id=${s} class="error-list" part="error-list">
           ${a.map(t=>i`<li class="error" part="error">${t}</li>`)}
@@ -196,14 +196,14 @@ import{css as t,LitElement as e,html as i,nothing as a}from"lit";import{ifDefine
       ${o?this.renderInputAffix("suffix"):a}
       ${x()} ${w()}
       ${$()}
-    `,C=i`
+    `,A=i`
       ${f()}
       ${o?this.renderInputAffix("prefix"):a}
       ${S()}
       ${o?this.renderInputAffix("suffix"):a}
       ${x()} ${w()}
       ${$()} ${m()}
-    `,A=i`
+    `,C=i`
       ${f()}
       <div class="input-inside-main">
         ${z}
@@ -238,7 +238,7 @@ import{css as t,LitElement as e,html as i,nothing as a}from"lit";import{ifDefine
               ?compact=${this.compact}
               ?loading=${this.loading}
             >
-              ${I?A:C}
+              ${I?C:A}
             </div>`}
 
         ${(()=>t&&this.totalFileSize?i`
@@ -251,7 +251,7 @@ import{css as t,LitElement as e,html as i,nothing as a}from"lit";import{ifDefine
             </div>
           `:null)()} ${this.renderValidationErrors()}
       </div>
-    `}};g.dependencies={"sky-icon":y},g.styles=t`
+    `}};k.dependencies={"sky-icon":y},k.styles=t`
     :host {
       display: block;
       font-family: var(--sky-font);
@@ -1099,5 +1099,5 @@ import{css as t,LitElement as e,html as i,nothing as a}from"lit";import{ifDefine
         transition: none;
       }
     }
-  `,g.shadowRootOptions={...e.shadowRootOptions,delegatesFocus:!0},m([n({type:String})],g.prototype,"value",2),m([n({type:String})],g.prototype,"placeholder",2),m([n({type:String})],g.prototype,"label",2),m([n({type:String})],g.prototype,"type",2),m([n({type:String})],g.prototype,"suffix",2),m([n({type:String})],g.prototype,"prefix",2),m([n({type:String})],g.prototype,"prefixColor",2),m([n({type:String})],g.prototype,"suffixColor",2),m([n({type:String})],g.prototype,"color",2),m([n({type:Array})],g.prototype,"validations",1),m([n({type:Boolean,reflect:!0})],g.prototype,"compact",2),m([n({type:Boolean,reflect:!0})],g.prototype,"loading",2),m([n({type:Boolean})],g.prototype,"showErrors",2),m([n({type:Boolean,reflect:!0})],g.prototype,"clearable",2),m([n({type:String})],g.prototype,"errorDisplayMode",2),m([n({type:Boolean,reflect:!0})],g.prototype,"required",2),m([n({type:String})],g.prototype,"step",2),m([n({type:String})],g.prototype,"min",2),m([n({type:String})],g.prototype,"max",2),m([n({type:String})],g.prototype,"autocapitalize",2),m([n({type:String})],g.prototype,"autocomplete",2),m([n({type:Boolean})],g.prototype,"spellcheck",2),m([n({type:String})],g.prototype,"dir",2),m([n({type:Number})],g.prototype,"rows",2),m([n({type:String})],g.prototype,"resizable",2),m([n({type:String})],g.prototype,"accept",2),m([n({type:Boolean})],g.prototype,"multiple",2),m([n({type:String})],g.prototype,"inputmode",2),m([n({type:String})],g.prototype,"enterkeyhint",2),m([n({type:String})],g.prototype,"pattern",2),m([n({type:Number})],g.prototype,"minlength",2),m([n({type:Number})],g.prototype,"maxlength",2),m([n({type:String})],g.prototype,"list",2),m([n({type:Number})],g.prototype,"size",2),m([n({type:Number})],g.prototype,"cols",2),m([n({type:Boolean})],g.prototype,"autofocus",2),m([n({type:Boolean})],g.prototype,"capture",2),m([n({type:String})],g.prototype,"inputRole",2),m([n({type:String})],g.prototype,"ariaLabel",2),m([n({type:String})],g.prototype,"ariaLabelledby",2),m([n({type:String})],g.prototype,"ariaDescribedby",2),m([n({type:Boolean})],g.prototype,"showNumberButtons",2),m([n({type:Boolean})],g.prototype,"showPasswordToggle",2),m([n({type:String})],g.prototype,"passwordVisibleIcon",2),m([n({type:String})],g.prototype,"passwordHiddenIcon",2),m([n({type:Boolean,reflect:!0})],g.prototype,"validationActive",2),m([n({type:Boolean,reflect:!0})],g.prototype,"invalid",2),m([n({type:String,reflect:!0})],g.prototype,"variant",2),m([n({type:String,reflect:!0})],g.prototype,"preset",2),m([o()],g.prototype,"selectedFileName",2),m([o()],g.prototype,"selectedFiles",2),m([o()],g.prototype,"focused",2),m([o()],g.prototype,"validationStatus",2),m([o()],g.prototype,"validationErrors",2),m([o()],g.prototype,"typingStarted",2),m([o()],g.prototype,"autofillIconSlot",2),m([o()],g.prototype,"autofillGuardActive",2),m([o()],g.prototype,"showPassword",2),m([o()],g.prototype,"totalFileSize",2),m([o()],g.prototype,"selectedFileCount",2),m([o()],g.prototype,"filePreview",2),m([l(".input-wrapper")],g.prototype,"inputWrapperEl",2),m([l("input, textarea")],g.prototype,"nativeInputEl",2),g=m([p("sky-input")],g);export{g as SkyInput};
+  `,k.shadowRootOptions={...e.shadowRootOptions,delegatesFocus:!0},m([n({type:String})],k.prototype,"value",2),m([n({type:String})],k.prototype,"placeholder",2),m([n({type:String})],k.prototype,"label",2),m([n({type:String})],k.prototype,"type",2),m([n({type:String})],k.prototype,"suffix",2),m([n({type:String})],k.prototype,"prefix",2),m([n({type:String})],k.prototype,"prefixColor",2),m([n({type:String})],k.prototype,"suffixColor",2),m([n({type:String})],k.prototype,"color",2),m([n({type:Array,hasChanged:function(t,e){const i=Array.isArray(t)?t:g,a=Array.isArray(e)?e:g;return i!==a&&(0!==i.length||0!==a.length)}})],k.prototype,"validations",1),m([n({type:Boolean,reflect:!0})],k.prototype,"compact",2),m([n({type:Boolean,reflect:!0})],k.prototype,"loading",2),m([n({type:Boolean})],k.prototype,"showErrors",2),m([n({type:Boolean,reflect:!0})],k.prototype,"clearable",2),m([n({type:String})],k.prototype,"errorDisplayMode",2),m([n({type:Boolean,reflect:!0})],k.prototype,"required",2),m([n({type:String})],k.prototype,"step",2),m([n({type:String})],k.prototype,"min",2),m([n({type:String})],k.prototype,"max",2),m([n({type:String})],k.prototype,"autocapitalize",2),m([n({type:String})],k.prototype,"autocomplete",2),m([n({type:Boolean})],k.prototype,"spellcheck",2),m([n({type:String})],k.prototype,"dir",2),m([n({type:Number})],k.prototype,"rows",2),m([n({type:String})],k.prototype,"resizable",2),m([n({type:String})],k.prototype,"accept",2),m([n({type:Boolean})],k.prototype,"multiple",2),m([n({type:String})],k.prototype,"inputmode",2),m([n({type:String})],k.prototype,"enterkeyhint",2),m([n({type:String})],k.prototype,"pattern",2),m([n({type:Number})],k.prototype,"minlength",2),m([n({type:Number})],k.prototype,"maxlength",2),m([n({type:String})],k.prototype,"list",2),m([n({type:Number})],k.prototype,"size",2),m([n({type:Number})],k.prototype,"cols",2),m([n({type:Boolean})],k.prototype,"autofocus",2),m([n({type:Boolean})],k.prototype,"capture",2),m([n({type:String})],k.prototype,"inputRole",2),m([n({type:String})],k.prototype,"ariaLabel",2),m([n({type:String})],k.prototype,"ariaLabelledby",2),m([n({type:String})],k.prototype,"ariaDescribedby",2),m([n({type:Boolean})],k.prototype,"showNumberButtons",2),m([n({type:Boolean})],k.prototype,"showPasswordToggle",2),m([n({type:String})],k.prototype,"passwordVisibleIcon",2),m([n({type:String})],k.prototype,"passwordHiddenIcon",2),m([n({type:Boolean,reflect:!0})],k.prototype,"validationActive",2),m([n({type:Boolean,reflect:!0})],k.prototype,"invalid",2),m([n({type:String,reflect:!0})],k.prototype,"variant",2),m([n({type:String,reflect:!0})],k.prototype,"preset",2),m([o()],k.prototype,"selectedFileName",2),m([o()],k.prototype,"selectedFiles",2),m([o()],k.prototype,"focused",2),m([o()],k.prototype,"validationStatus",2),m([o()],k.prototype,"validationErrors",2),m([o()],k.prototype,"typingStarted",2),m([o()],k.prototype,"autofillIconSlot",2),m([o()],k.prototype,"autofillGuardActive",2),m([o()],k.prototype,"showPassword",2),m([o()],k.prototype,"totalFileSize",2),m([o()],k.prototype,"selectedFileCount",2),m([o()],k.prototype,"filePreview",2),m([l(".input-wrapper")],k.prototype,"inputWrapperEl",2),m([l("input, textarea")],k.prototype,"nativeInputEl",2),k=m([p("sky-input")],k);export{k as SkyInput};
 //# sourceMappingURL=sky-input.js.map