@cas-smartdesign/lit-input 7.3.1 → 7.4.1

package/dist/input.mjs

@@ -1,42 +1,41 @@
-import { LitElement as f, css as m, unsafeCSS as b, html as d, nothing as y } from "lit";
-import { property as a } from "lit/decorators/property.js";
-import { ifDefined as r } from "lit/directives/if-defined.js";
+import { LitElement as f, unsafeCSS as m, css as b, html as d, nothing as y } from "lit";
+import { property as i } from "lit/decorators/property.js";
+import { ifDefined as l } from "lit/directives/if-defined.js";
 import { ValidationLevel as g } from "@cas-smartdesign/field-validation-message";
-const x = ":host{display:inline-flex;position:relative;cursor:text;font-family:Segoe UI,Lucida Sans,Arial,sans-serif;font-size:16px;color:#111;contain:layout style;flex-direction:column}:host([hidden]),:host([type=hidden]){display:none!important}:host([effective-disabled]){opacity:.6;cursor:default;filter:grayscale(100%)}:host([effective-disabled]) .unfocused-line,:host([effective-disabled]) .focused-line{border-bottom-style:dashed}:host(:not([effective-disabled]):focus) .focused-line,:host(:not([effective-disabled])[focused]) .focused-line{transform:none;transition:transform .25s}:host(:not([effective-disabled]):focus) .label.float,:host(:not([effective-disabled])[focused]) .label.float{color:var(--sd-input-focused-color, #1467ba)}:host([inactive]) .input{pointer-events:none}:host([effective-disabled]:focus),:host([effective-disabled][focused]){box-shadow:0 0 0 1px #111}:host(:not([effective-disabled])[validationlevel]) .focused-line,:host(:not([effective-disabled]):invalid) .focused-line{transform:none;transition:transform .25s}:host([validationlevel=warn i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #555555)}:host([validationlevel=warn i]) .label,:host([validationlevel=warn i]) .validation-message{color:var(--sd-input-validation-color, #555555)!important}:host([validationlevel=suggest i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #bf8800)}:host([validationlevel=suggest i]) .label,:host([validationlevel=suggest i]) .validation-message{color:var(--sd-input-validation-color, #bf8800)!important}:host([validationlevel=error i]) .focused-line,:host(:not([validationlevel]):invalid) .focused-line{border-bottom-color:var(--sd-input-validation-color, #cc0017)}:host([validationlevel=error i]) .label,:host([validationlevel=error i]) .validation-message,:host(:not([validationlevel]):invalid) .label,:host(:not([validationlevel]):invalid) .validation-message{color:var(--sd-input-validation-color, #cc0017)!important}.validation-message-wrapper{min-height:var(--sd-input-validation-message-minheight, 0px);position:relative;font-size:0}.validation-message{position:relative;position:var(--sd-input-validation-message-minheight, absolute);left:0;right:0}.label.float{transform:translateY(-75%) scale(.75);width:133%}.label:not(.float){max-width:100%}.floated-label-placeholder{height:20px;width:100%}.label{position:absolute;top:0;left:0;line-height:24px;pointer-events:none;color:var(--sd-input-color, #767676);transition:transform .25s,width .25s;transform-origin:left top}.input-wrapper{position:relative;display:flex;flex-direction:row;align-items:center;background-color:var(--input-wrapper-background-color)}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-wrapper{flex-direction:column;align-items:baseline}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-container{width:100%}:host([extended-prefix]:not(:focus-within)) .input-container,:host([extended-prefix][effective-disabled]) .input-container{width:0px}.input-container{line-height:var(--sd-input-line-height, 24px);flex:1 1 auto}.input{width:100%;background:var(--sd-input-background, transparent);font-family:inherit;font-size:inherit;text-align:inherit;color:inherit;border:none;outline:none;resize:none;padding-left:0;padding-right:0}.input:-webkit-autofill{animation-name:onautofillstart}.input:not(:-webkit-autofill){animation-name:onautofillcancel}@keyframes onautofillstart{0%{outline:none}}@keyframes onautofillcancel{0%{outline:none}}.label,input.input{text-overflow:ellipsis;overflow-x:hidden;white-space:nowrap}.validation-message{text-overflow:ellipsis;overflow-x:hidden;white-space:normal;white-space:var(--sd-input-validation-message-minheight, nowrap)}.input::placeholder{color:var(--sd-input-color, #767676)}.underline{height:2px;width:100%;position:relative}.unfocused-line,.focused-line{position:absolute;top:0;right:0;bottom:0;left:0}.unfocused-line{border-bottom:1px solid var(--sd-input-underline-color, #959595)}.focused-line{border-bottom:2px solid var(--sd-input-focused-color, #1467ba);transform-origin:center center;transform:scale3d(0,1,1)}.prefix,.suffix{display:flex;flex-wrap:nowrap;max-width:100%}.prefix ::slotted(*),.suffix ::slotted(*){display:flex}";
-var w = Object.defineProperty, E = Object.getOwnPropertyDescriptor, s = (u, t, e, o) => {
-  for (var l = o > 1 ? void 0 : o ? E(t, e) : t, h = u.length - 1, p; h >= 0; h--)
-    (p = u[h]) && (l = (o ? p(t, e, l) : p(l)) || l);
-  return o && l && w(t, e, l), l;
+const x = ":host{display:inline-flex;position:relative;cursor:text;font-family:Segoe UI,Lucida Sans,Arial,sans-serif;font-size:16px;color:#111;contain:layout style;flex-direction:column}:host([hidden]),:host([type=hidden]){display:none!important}:host([effective-disabled]){opacity:.6;cursor:default;filter:grayscale(100%)}:host([effective-disabled]) .unfocused-line,:host([effective-disabled]) .focused-line{border-bottom-style:dashed}:host(:not([effective-disabled]):focus) .focused-line,:host(:not([effective-disabled])[focused]) .focused-line{transform:none;transition:transform .25s}:host(:not([effective-disabled]):focus) .label.float,:host(:not([effective-disabled])[focused]) .label.float{color:var(--sd-input-focused-color, #1467ba)}:host([inactive]) .input{pointer-events:none}:host([effective-disabled]:focus),:host([effective-disabled][focused]){box-shadow:0 0 0 1px #111}:host(:not([effective-disabled])[validationlevel]) .focused-line,:host(:not([effective-disabled]):invalid) .focused-line{transform:none;transition:transform .25s}:host([validationlevel=warn i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #555555)}:host([validationlevel=warn i]) .label,:host([validationlevel=warn i]) .validation-message{color:var(--sd-input-validation-color, #555555)!important}:host([validationlevel=suggest i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #bf8800)}:host([validationlevel=suggest i]) .label,:host([validationlevel=suggest i]) .validation-message{color:var(--sd-input-validation-color, #bf8800)!important}:host([validationlevel=error i]) .focused-line,:host(:not([validationlevel]):invalid) .focused-line{border-bottom-color:var(--sd-input-validation-color, #cc0017)}:host([validationlevel=error i]) .label,:host([validationlevel=error i]) .validation-message,:host(:not([validationlevel]):invalid) .label,:host(:not([validationlevel]):invalid) .validation-message{color:var(--sd-input-validation-color, #cc0017)!important}.validation-message-wrapper{min-height:var(--sd-input-validation-message-minheight, 0px);position:relative;font-size:0}.validation-message{position:relative;position:var(--sd-input-validation-message-minheight, absolute);left:0;right:0}.label.float{transform:translateY(-75%) scale(.75);width:133%}.label:not(.float){max-width:100%}.floated-label-placeholder{height:20px;width:100%}.label{position:absolute;top:0;left:0;line-height:24px;pointer-events:none;color:var(--sd-input-color, #767676);transition:transform .25s,width .25s;transform-origin:left top}.input-wrapper{position:relative;display:flex;flex-direction:row;align-items:center;background-color:var(--input-wrapper-background-color)}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-wrapper{flex-direction:column;align-items:baseline}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-container{width:100%}:host([extended-prefix]:not(:focus-within)) .input-container,:host([extended-prefix][effective-disabled]) .input-container{width:0px}.input-container{line-height:var(--sd-input-line-height, 24px);flex:1 1 auto}.input{width:100%;background:var(--sd-input-background, transparent);font-family:inherit;font-size:inherit;text-align:inherit;color:inherit;border:none;outline:none;resize:none;padding-left:0;padding-right:0}.input:-webkit-autofill{animation-name:onautofillstart}.input:not(:-webkit-autofill){animation-name:onautofillcancel}@keyframes onautofillstart{0%{outline:none}}@keyframes onautofillcancel{0%{outline:none}}.label,input.input{text-overflow:ellipsis;overflow-x:hidden;white-space:nowrap}.validation-message{text-overflow:ellipsis;overflow-x:hidden;white-space:normal;white-space:var(--sd-input-validation-message-minheight, nowrap)}.input::placeholder{color:var(--sd-input-color, #767676)}.underline{height:2px;width:100%;position:relative}.unfocused-line,.focused-line{position:absolute;inset:0}.unfocused-line{border-bottom:1px solid var(--sd-input-underline-color, #959595)}.focused-line{border-bottom:2px solid var(--sd-input-focused-color, #1467ba);transform-origin:center center;transform:scale3d(0,1,1)}.prefix,.suffix{display:flex;flex-wrap:nowrap;max-width:100%}.prefix ::slotted(*),.suffix ::slotted(*){display:flex}";
+var w = Object.defineProperty, a = (u, t, s, n) => {
+  for (var r = void 0, h = u.length - 1, c; h >= 0; h--)
+    (c = u[h]) && (r = c(t, s, r) || r);
+  return r && w(t, s, r), r;
 };
-const $ = "sd-lit-input", v = "delegatesFocus" in window.ShadowRoot.prototype;
-let S = 0;
-var n;
-const i = (n = class extends f {
+const E = "sd-lit-input", v = "delegatesFocus" in window.ShadowRoot.prototype;
+let $ = 0;
+var o;
+const e = (o = class extends f {
   constructor() {
     super(), this.rows = 1, this.effectiveDisabled = !1, this.type = "text", this.autocomplete = "off";
-    const t = S++;
-    this._validationMessageId = n.ID + "_message_" + t, this._inputId = n.ID + "_input_" + t, this.attachInternals && !this.activeShadyDOM && (this._internals = this.attachInternals());
+    const t = $++;
+    this._validationMessageId = o.ID + "_message_" + t, this._inputId = o.ID + "_input_" + t, this.attachInternals && !this.activeShadyDOM && (this._internals = this.attachInternals());
   }
   connectedCallback() {
     super.connectedCallback(), this.hasAttribute("tabIndex") || (this.tabIndex = 0);
   }
   firstUpdated(t) {
-    super.firstUpdated(t), this.initAutocompleted(this.inputElement), this.updateInitialValue(), this.updateFormValidity(), this.hasAttribute("disabled") && (this.disabled = !0), this.inputElement.oninput = (e) => {
-      this.autocompleted = e.inputType === "insertReplacementText" || !("data" in e), this.currentText = this.inputElement.value, this.fireValueChange(!0);
-    }, this.inputElement.onchange = () => this.fireValueChange(), v || (this.inputElement.onfocus = () => this.setAttribute("focused", ""), this.inputElement.onblur = () => this.removeAttribute("focused"), this.addEventListener("focus", (e) => {
-      e.target === this && this.inputElement.focus();
+    super.firstUpdated(t), this.initAutocompleted(this.inputElement), this.updateInitialValue(), this.updateFormValidity(), this.hasAttribute("disabled") && (this.disabled = !0), this.inputElement.oninput = (s) => {
+      this.autocompleted = s.inputType === "insertReplacementText" || !("data" in s), this.currentText = this.inputElement.value, this.fireValueChange(!0);
+    }, this.inputElement.onchange = () => this.fireValueChange(), v || (this.inputElement.onfocus = () => this.setAttribute("focused", ""), this.inputElement.onblur = () => this.removeAttribute("focused"), this.addEventListener("focus", (s) => {
+      s.target === this && this.inputElement.focus();
     })), this.inputElement.addEventListener("keyup", () => {
       this.updateFormValidity();
-    }), this.addEventListener("keydown", (e) => {
-      var o, l;
-      e.key == "Enter" && ((l = (o = this._internals) == null ? void 0 : o.form) == null || l.requestSubmit());
+    }), this.addEventListener("keydown", (s) => {
+      s.key == "Enter" && this._internals?.form?.requestSubmit();
     }), this._initialized = !0;
   }
   initAutocompleted(t) {
-    const e = (o) => {
-      /^onautofillstart(-sd-lit-input-\d+|\s?)$/.test(o.animationName) ? this.autocompleted = !0 : /^onautofillcancel(-sd-lit-input-\d+|\s?)$/.test(o.animationName) && (this.autocompleted = !1);
+    const s = (n) => {
+      /^onautofillstart(-sd-lit-input-\d+|\s?)$/.test(n.animationName) ? this.autocompleted = !0 : /^onautofillcancel(-sd-lit-input-\d+|\s?)$/.test(n.animationName) && (this.autocompleted = !1);
     };
-    this.activeShadyDOM ? (this._needsAutocompletedCheck = !0, this.activeShadyDOM.nativeMethods.addEventListener.call(t, "animationstart", e)) : t.addEventListener("animationstart", e);
+    this.activeShadyDOM ? (this._needsAutocompletedCheck = !0, this.activeShadyDOM.nativeMethods.addEventListener.call(t, "animationstart", s)) : t.addEventListener("animationstart", s);
   }
   get activeShadyDOM() {
     const t = window.ShadyDOM;
@@ -70,58 +69,57 @@ const i = (n = class extends f {
   select() {
     this.inputElement && this.inputElement.select();
   }
-  setSelectionRange(t, e) {
+  setSelectionRange(t, s) {
     this.updateComplete.then(() => {
-      this.inputElement && this.inputElement.setSelectionRange(t, e);
+      this.inputElement && this.inputElement.setSelectionRange(t, s);
     });
   }
   static get styles() {
     return [
-      m`
-                ${b(x)}
+      b`
+                ${m(x)}
             `
     ];
   }
   render() {
-    var l;
     let t;
-    const e = this.validationMessage || ((l = this.inputElement) == null ? void 0 : l.validationMessage), o = e || this.validationLevel != null;
+    const s = this.validationMessage || this.inputElement?.validationMessage, n = s || this.validationLevel != null;
     return this.rows === 1 ? t = d`
                 <input
                     id=${this._inputId}
                     class="input"
                     .type=${this.type}
-                    placeholder=${r(this.placeholder || void 0)}
-                    name=${r(this.name || void 0)}
+                    placeholder=${l(this.placeholder || void 0)}
+                    name=${l(this.name || void 0)}
                     aria-disabled=${this.effectiveDisabled}
                     autocomplete=${this.autocomplete}
                     ?disabled=${this.inactive}
                     ?readonly=${this.readonly || this.effectiveDisabled}
                     ?required=${this.required}
-                    maxlength=${this.maxlength > 0 ? this.maxlength : n.DEFAULT_MAX_LENGTH}
+                    maxlength=${this.maxlength > 0 ? this.maxlength : o.DEFAULT_MAX_LENGTH}
                     aria-describedby=${this._validationMessageId}
-                    aria-invalid=${r(o)}
-                    aria-label=${r(this.sdAriaLabel || void 0)}
-                    min=${r(this.min || void 0)}
-                    max=${r(this.max || void 0)}
-                    pattern=${r(this.pattern || void 0)}
+                    aria-invalid=${l(n)}
+                    aria-label=${l(this.sdAriaLabel || void 0)}
+                    min=${l(this.min || void 0)}
+                    max=${l(this.max || void 0)}
+                    pattern=${l(this.pattern || void 0)}
                 />
             ` : t = d`
                 <textarea
                     id=${this._inputId}
                     class="input"
-                    placeholder=${r(this.placeholder || void 0)}
-                    name=${r(this.name || void 0)}
+                    placeholder=${l(this.placeholder || void 0)}
+                    name=${l(this.name || void 0)}
                     aria-disabled=${this.effectiveDisabled}
                     autocomplete=${this.autocomplete}
                     ?disabled=${this.inactive}
                     ?readonly=${this.readonly || this.effectiveDisabled}
                     ?required=${this.required}
-                    maxlength=${this.maxlength > 0 ? this.maxlength : n.DEFAULT_MAX_LENGTH}
+                    maxlength=${this.maxlength > 0 ? this.maxlength : o.DEFAULT_MAX_LENGTH}
                     rows=${this.rows}
                     aria-describedby=${this._validationMessageId}
-                    aria-invalid=${r(o)}
-                    aria-label=${r(this.sdAriaLabel || void 0)}
+                    aria-invalid=${l(n)}
+                    aria-label=${l(this.sdAriaLabel || void 0)}
                 ></textarea>
             `, d`
             ${this.label ? d` <div class="floated-label-placeholder" aria-hidden="true">&nbsp;</div> ` : y}
@@ -142,11 +140,11 @@ const i = (n = class extends f {
                 <div class="focused-line"></div>
             </div>
             <div class="validation-message-wrapper" aria-hidden="true">
-                ${(e || this.validationIconSrc) && d`
+                ${(s || this.validationIconSrc) && d`
                     <sd-field-validation-message
                         id=${this._validationMessageId}
                         class="validation-message"
-                        .message=${e}
+                        .message=${s}
                         .icon=${this.validationIconSrc}
                         .level=${this.validationLevel}
                     >
@@ -164,8 +162,7 @@ const i = (n = class extends f {
     }, 0), this.rows > 1 && ((t.has("min") || t.has("max") || t.has("pattern")) && console.warn("min, max & pattern attributes are not supported with multiple rows configuration."), this.type != "text" && console.warn(`type: ${this.type} is not supported with multiple rows configuration.`));
   }
   update(t) {
-    var e, o;
-    if (super.update(t), t.has("validationMessage") && (this.validationMessage ? (e = this._internals) == null || e.setValidity({ customError: !0 }, this.validationMessage) : (o = this._internals) == null || o.setValidity(this.inputElement.validity, this.inputElement.validationMessage)), this._initialized && t.has("rows"))
+    if (super.update(t), t.has("validationMessage") && (this.validationMessage ? this._internals?.setValidity({ customError: !0 }, this.validationMessage) : this._internals?.setValidity(this.inputElement.validity, this.inputElement.validationMessage)), this._initialized && t.has("rows"))
       throw Error("rows attribute cannot be changed after the input is attached to the DOM");
   }
   fireValueChange(t) {
@@ -173,7 +170,7 @@ const i = (n = class extends f {
       new CustomEvent(`${t ? "immediate-" : ""}value-change`, {
         detail: { value: this.value }
       })
-    ), this.setFormValue(this.value), this.updateFormValidity();
+    ), this.setFormValue(this.value);
   }
   updateFormValidity() {
     if (this.validationMessage == null) {
@@ -186,8 +183,7 @@ const i = (n = class extends f {
     return this.alwaysFloatLabel || this.currentText || this.placeholder || this.autocompleted || this.type === "date";
   }
   setFormValue(t) {
-    var e;
-    (e = this._internals) == null || e.setFormValue(t);
+    this._internals?.setFormValue(t), this.updateFormValidity();
   }
   formResetCallback() {
     this.value = this._initialValue;
@@ -198,87 +194,87 @@ const i = (n = class extends f {
   formAssociatedCallback(t) {
     this._needsAutocompletedCheck = !0;
   }
-  formStateRestoreCallback(t, e) {
+  formStateRestoreCallback(t, s) {
     typeof t == "string" && (this.value = t);
   }
-}, n.ID = $, n.DEFAULT_MAX_LENGTH = 524288, n.formAssociated = !0, n.shadowRootOptions = {
+}, o.ID = E, o.DEFAULT_MAX_LENGTH = 524288, o.formAssociated = !0, o.shadowRootOptions = {
   ...f.shadowRootOptions,
   delegatesFocus: v
-}, n);
-s([
-  a({ type: String, reflect: !0 })
-], i.prototype, "label", 2);
-s([
-  a({ type: String, attribute: !0 })
-], i.prototype, "validationMessage", 2);
-s([
-  a({ type: String, attribute: !0 })
-], i.prototype, "validationIconSrc", 2);
-s([
-  a({ type: g, attribute: !0, reflect: !0 })
-], i.prototype, "validationLevel", 2);
-s([
-  a({
+}, o);
+a([
+  i({ type: String, reflect: !0 })
+], e.prototype, "label");
+a([
+  i({ type: String, attribute: !0 })
+], e.prototype, "validationMessage");
+a([
+  i({ type: String, attribute: !0 })
+], e.prototype, "validationIconSrc");
+a([
+  i({ type: g, attribute: !0, reflect: !0 })
+], e.prototype, "validationLevel");
+a([
+  i({
     type: String,
     hasChanged(u, t) {
       return t != null && t != u;
     }
   })
-], i.prototype, "currentText", 2);
-s([
-  a({ type: Boolean, attribute: !0 })
-], i.prototype, "alwaysFloatLabel", 2);
-s([
-  a({ type: Boolean, attribute: !0 })
-], i.prototype, "autocompleted", 2);
-s([
-  a({ type: Number, attribute: !0 })
-], i.prototype, "rows", 2);
-s([
-  a({ type: Boolean, reflect: !0, attribute: "effective-disabled" })
-], i.prototype, "effectiveDisabled", 2);
-s([
-  a({ type: Boolean, reflect: !0, attribute: "extended-prefix" })
-], i.prototype, "extendedPrefix", 2);
-s([
-  a({ type: String, reflect: !0 })
-], i.prototype, "type", 2);
-s([
-  a({ type: String, reflect: !0 })
-], i.prototype, "placeholder", 2);
-s([
-  a({ type: String, reflect: !0 })
-], i.prototype, "sdAriaLabel", 2);
-s([
-  a({ type: Number, reflect: !0 })
-], i.prototype, "maxlength", 2);
-s([
-  a({ type: Boolean, reflect: !0 })
-], i.prototype, "readonly", 2);
-s([
-  a({ type: Boolean, reflect: !0 })
-], i.prototype, "required", 2);
-s([
-  a({ type: String, reflect: !0 })
-], i.prototype, "name", 2);
-s([
-  a({ type: Boolean, reflect: !0 })
-], i.prototype, "inactive", 2);
-s([
-  a({ type: String, attribute: !0 })
-], i.prototype, "autocomplete", 2);
-s([
-  a({ type: String, attribute: !0 })
-], i.prototype, "min", 2);
-s([
-  a({ type: String, attribute: !0 })
-], i.prototype, "max", 2);
-s([
-  a({ type: String, attribute: !0 })
-], i.prototype, "pattern", 2);
-let c = i;
-customElements.get(c.ID) || customElements.define(c.ID, c);
+], e.prototype, "currentText");
+a([
+  i({ type: Boolean, attribute: !0 })
+], e.prototype, "alwaysFloatLabel");
+a([
+  i({ type: Boolean, attribute: !0 })
+], e.prototype, "autocompleted");
+a([
+  i({ type: Number, attribute: !0 })
+], e.prototype, "rows");
+a([
+  i({ type: Boolean, reflect: !0, attribute: "effective-disabled" })
+], e.prototype, "effectiveDisabled");
+a([
+  i({ type: Boolean, reflect: !0, attribute: "extended-prefix" })
+], e.prototype, "extendedPrefix");
+a([
+  i({ type: String, reflect: !0 })
+], e.prototype, "type");
+a([
+  i({ type: String, reflect: !0 })
+], e.prototype, "placeholder");
+a([
+  i({ type: String, reflect: !0 })
+], e.prototype, "sdAriaLabel");
+a([
+  i({ type: Number, reflect: !0 })
+], e.prototype, "maxlength");
+a([
+  i({ type: Boolean, reflect: !0 })
+], e.prototype, "readonly");
+a([
+  i({ type: Boolean, reflect: !0 })
+], e.prototype, "required");
+a([
+  i({ type: String, reflect: !0 })
+], e.prototype, "name");
+a([
+  i({ type: Boolean, reflect: !0 })
+], e.prototype, "inactive");
+a([
+  i({ type: String, attribute: !0 })
+], e.prototype, "autocomplete");
+a([
+  i({ type: String, attribute: !0 })
+], e.prototype, "min");
+a([
+  i({ type: String, attribute: !0 })
+], e.prototype, "max");
+a([
+  i({ type: String, attribute: !0 })
+], e.prototype, "pattern");
+let p = e;
+customElements.get(p.ID) || customElements.define(p.ID, p);
 export {
-  c as default
+  p as default
 };
 //# sourceMappingURL=input.mjs.map

package/dist/input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input.mjs","sources":["../input.ts"],"sourcesContent":["import { LitElement, html, PropertyValues, unsafeCSS, TemplateResult, css, nothing } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\n\nconst TAG_NAME = \"sd-lit-input\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [TAG_NAME]: SDInput;\n    }\n}\n\nimport style from \"./style.scss?inline\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst delegatesFocus = \"delegatesFocus\" in (window as any).ShadowRoot.prototype;\n\nlet idCounter = 0;\n\nexport interface IValueChangeEvent {\n    value: string;\n}\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n    \"immediate-value-change\": CustomEvent<IValueChangeEvent>;\n    \"value-change\": CustomEvent<IValueChangeEvent>;\n}\n\nexport default interface SDInput {\n    addEventListener<K extends keyof CustomEventMap>(\n        event: K,\n        listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    addEventListener(\n        type: string,\n        callback: EventListenerOrEventListenerObject | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    removeEventListener<K extends keyof CustomEventMap>(\n        type: K,\n        listener: (this: this, ev: CustomEventMap[K]) => unknown,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    removeEventListener(\n        type: string,\n        listener: EventListenerOrEventListenerObject,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport default class SDInput extends LitElement {\n    public static readonly ID: string = TAG_NAME;\n    private static readonly DEFAULT_MAX_LENGTH: number = 524288;\n    static formAssociated = true;\n\n    @property({ type: String, reflect: true })\n    public label: string;\n    @property({ type: String, attribute: true })\n    public validationMessage: string;\n    @property({ type: String, attribute: true })\n    public validationIconSrc: string;\n    @property({ type: ValidationLevel, attribute: true, reflect: true })\n    public validationLevel: ValidationLevel;\n    @property({\n        type: String,\n        hasChanged(value, oldValue) {\n            return oldValue != undefined && oldValue != value;\n        },\n    })\n    public currentText;\n    @property({ type: Boolean, attribute: true })\n    public alwaysFloatLabel: boolean;\n    @property({ type: Boolean, attribute: true })\n    public autocompleted: boolean;\n    @property({ type: Number, attribute: true })\n    public rows = 1;\n    @property({ type: Boolean, reflect: true, attribute: \"effective-disabled\" })\n    public effectiveDisabled: boolean = false;\n    @property({ type: Boolean, reflect: true, attribute: \"extended-prefix\" })\n    public extendedPrefix: boolean;\n\n    // delegated settings to input\n    @property({ type: String, reflect: true })\n    public type = \"text\";\n    @property({ type: String, reflect: true })\n    public placeholder: string;\n    @property({ type: String, reflect: true })\n    public sdAriaLabel: string;\n    @property({ type: Number, reflect: true })\n    public maxlength: number;\n    @property({ type: Boolean, reflect: true })\n    public readonly: boolean;\n    @property({ type: Boolean, reflect: true })\n    public required: boolean;\n    @property({ type: String, reflect: true })\n    public name: string;\n    @property({ type: Boolean, reflect: true })\n    public inactive: boolean;\n    @property({ type: String, attribute: true })\n    public autocomplete: AutoFill = \"off\";\n    @property({ type: String, attribute: true })\n    public min: string;\n    @property({ type: String, attribute: true })\n    public max: string;\n    @property({ type: String, attribute: true })\n    public pattern: string;\n\n    private _inputElement: HTMLInputElement;\n    private _initialized: boolean;\n    private _needsAutocompletedCheck: boolean;\n    private _validationMessageId: string;\n    private _inputId: string;\n    private _internals: ElementInternals;\n    private _initialValue: string;\n\n    static shadowRootOptions: ShadowRootInit = {\n        ...LitElement.shadowRootOptions,\n        delegatesFocus,\n    };\n\n    constructor() {\n        super();\n        const nextIdNumber = idCounter++;\n        this._validationMessageId = SDInput.ID + \"_message_\" + nextIdNumber;\n        this._inputId = SDInput.ID + \"_input_\" + nextIdNumber;\n        if (this.attachInternals && !this.activeShadyDOM) {\n            this._internals = this.attachInternals();\n        }\n    }\n\n    connectedCallback(): void {\n        super.connectedCallback();\n        if (!this.hasAttribute(\"tabIndex\")) {\n            this.tabIndex = 0;\n        }\n    }\n\n    protected firstUpdated(changedProperties: PropertyValues): void {\n        super.firstUpdated(changedProperties);\n        this.initAutocompleted(this.inputElement);\n        this.updateInitialValue();\n        this.updateFormValidity();\n\n        if (this.hasAttribute(\"disabled\")) {\n            this.disabled = true;\n        }\n\n        this.inputElement.oninput = (event: InputEvent) => {\n            this.autocompleted = \"insertReplacementText\" === event.inputType || !(\"data\" in event);\n            this.currentText = this.inputElement.value;\n            this.fireValueChange(true);\n        };\n        this.inputElement.onchange = () => this.fireValueChange();\n        if (!delegatesFocus) {\n            // Provide a limited \"delegatesFocus\" behavior where it is not supported.\n            // Note that clicking on non-focusable elements inside the shadow root\n            // does not focus the first focusable element as it would have been expected.\n            this.inputElement.onfocus = () => this.setAttribute(\"focused\", \"\");\n            this.inputElement.onblur = () => this.removeAttribute(\"focused\");\n            this.addEventListener(\"focus\", (event) => {\n                if (event.target === this) {\n                    this.inputElement.focus();\n                }\n            });\n        }\n        // An input with 'type: date' may not dispatch change or input events in partially filled state\n        this.inputElement.addEventListener(\"keyup\", () => {\n            this.updateFormValidity();\n        });\n        this.addEventListener(\"keydown\", (event) => {\n            if (event.key == \"Enter\") {\n                this._internals?.form?.requestSubmit();\n            }\n        });\n        this._initialized = true;\n    }\n\n    private initAutocompleted(target: HTMLElement) {\n        const listener = (event) => {\n            if (/^onautofillstart(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n                this.autocompleted = true;\n            } else if (/^onautofillcancel(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n                this.autocompleted = false;\n            }\n        };\n        if (this.activeShadyDOM) {\n            this._needsAutocompletedCheck = true;\n            this.activeShadyDOM.nativeMethods.addEventListener.call(target, \"animationstart\", listener);\n        } else {\n            target.addEventListener(\"animationstart\", listener);\n        }\n    }\n\n    private get activeShadyDOM(): { nativeMethods } | null {\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        const shadyDOM = (window as any).ShadyDOM;\n        return shadyDOM && shadyDOM.inUse ? shadyDOM : null;\n    }\n\n    private updateInitialValue(): void {\n        if (typeof this.currentText !== \"undefined\") {\n            this.value = this.currentText;\n        } else {\n            this.value = this.getAttribute(\"value\");\n        }\n        if (this.value) {\n            this.currentText = this.inputElement.value;\n        }\n        this._initialValue = this.value;\n    }\n\n    public get disabled(): boolean {\n        return this.hasAttribute(\"disabled\");\n    }\n\n    public set disabled(disabled: boolean) {\n        if (disabled) {\n            this.setAttribute(\"disabled\", \"\");\n        } else {\n            this.removeAttribute(\"disabled\");\n        }\n        if (!this._internals) {\n            this.effectiveDisabled = disabled;\n        }\n    }\n\n    // It is public as hacking around due to IE 11 is a common task to do.\n    public get inputElement(): HTMLInputElement {\n        if (this.shadowRoot && !this._inputElement) {\n            this._inputElement = this.shadowRoot.querySelector(\".input\");\n        }\n        return this._inputElement;\n    }\n\n    public get value(): string {\n        return this.inputElement && this.inputElement.value;\n    }\n\n    public set value(newValue: string) {\n        this.currentText = newValue || \"\";\n        if (this.inputElement) {\n            this.inputElement.value = this.currentText;\n        }\n        this.setFormValue(this.currentText);\n    }\n\n    public get selectionStart(): number {\n        return this.inputElement ? this.inputElement.selectionStart : 0;\n    }\n\n    public focus(): void {\n        if (this.inputElement) {\n            this.inputElement.focus();\n        } else {\n            super.focus();\n        }\n    }\n\n    public select(): void {\n        if (this.inputElement) {\n            this.inputElement.select();\n        }\n    }\n\n    public setSelectionRange(start: number, end: number): void {\n        this.updateComplete.then(() => {\n            if (this.inputElement) {\n                this.inputElement.setSelectionRange(start, end);\n            }\n        });\n    }\n\n    static get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n\n    public render(): TemplateResult {\n        let inputPart;\n        const valMessage = this.validationMessage || this.inputElement?.validationMessage;\n        const isInvalid = valMessage || this.validationLevel != null;\n        if (this.rows === 1) {\n            inputPart = html`\n                <input\n                    id=${this._inputId}\n                    class=\"input\"\n                    .type=${this.type}\n                    placeholder=${ifDefined(this.placeholder || undefined)}\n                    name=${ifDefined(this.name || undefined)}\n                    aria-disabled=${this.effectiveDisabled}\n                    autocomplete=${this.autocomplete}\n                    ?disabled=${this.inactive}\n                    ?readonly=${this.readonly || this.effectiveDisabled}\n                    ?required=${this.required}\n                    maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n                    aria-describedby=${this._validationMessageId}\n                    aria-invalid=${ifDefined(isInvalid)}\n                    aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n                    min=${ifDefined(this.min || undefined)}\n                    max=${ifDefined(this.max || undefined)}\n                    pattern=${ifDefined(this.pattern || undefined)}\n                />\n            `;\n        } else {\n            inputPart = html`\n                <textarea\n                    id=${this._inputId}\n                    class=\"input\"\n                    placeholder=${ifDefined(this.placeholder || undefined)}\n                    name=${ifDefined(this.name || undefined)}\n                    aria-disabled=${this.effectiveDisabled}\n                    autocomplete=${this.autocomplete}\n                    ?disabled=${this.inactive}\n                    ?readonly=${this.readonly || this.effectiveDisabled}\n                    ?required=${this.required}\n                    maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n                    rows=${this.rows}\n                    aria-describedby=${this._validationMessageId}\n                    aria-invalid=${ifDefined(isInvalid)}\n                    aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n                ></textarea>\n            `;\n        }\n\n        return html`\n            ${this.label ? html` <div class=\"floated-label-placeholder\" aria-hidden=\"true\">&nbsp;</div> ` : nothing}\n            <div class=\"input-wrapper\">\n                <span class=\"prefix\"><slot name=\"prefix\"></slot></span>\n                <div class=\"input-container\" style=\"position:${this.shouldFloat() ? \"static\" : \"relative\"};\">\n                    ${this.label &&\n                    html`\n                        <label for=\"${this._inputId}\" class=\"label ${this.shouldFloat() ? \"float\" : \"\"}\"\n                            >${this.label}</label\n                        >\n                    `}\n                    ${inputPart}\n                </div>\n                <span class=\"suffix\"><slot name=\"suffix\"></slot></span>\n            </div>\n            <div class=\"underline\" aria-hidden=\"true\">\n                <div class=\"unfocused-line\"></div>\n                <div class=\"focused-line\"></div>\n            </div>\n            <div class=\"validation-message-wrapper\" aria-hidden=\"true\">\n                ${(valMessage || this.validationIconSrc) &&\n                html`\n                    <sd-field-validation-message\n                        id=${this._validationMessageId}\n                        class=\"validation-message\"\n                        .message=${valMessage}\n                        .icon=${this.validationIconSrc}\n                        .level=${this.validationLevel}\n                    >\n                    </sd-field-validation-message>\n                `}\n            </div>\n        `;\n    }\n\n    protected updated(changedProperties: PropertyValues): void {\n        super.updated(changedProperties);\n        if (this._needsAutocompletedCheck && !this.autocompleted) {\n            setTimeout(() => {\n                try {\n                    // In certain cases there is no animation event dispatched even if the animation itself is done (it is visible also in dev tools) when an autofill is done.\n                    this.autocompleted = this.autocompleted || !!this.shadowRoot.querySelector(\":-webkit-autofill\");\n                } catch (ignored) {\n                    // the above used selector is not supported for example in Firefox\n                }\n            }, 0);\n        }\n        if (this.rows > 1) {\n            if (changedProperties.has(\"min\") || changedProperties.has(\"max\") || changedProperties.has(\"pattern\")) {\n                console.warn(\"min, max & pattern attributes are not supported with multiple rows configuration.\");\n            }\n            if (\"text\" != this.type) {\n                console.warn(`type: ${this.type} is not supported with multiple rows configuration.`);\n            }\n        }\n    }\n\n    public update(changedProperties: PropertyValues): void {\n        super.update(changedProperties);\n        if (changedProperties.has(\"validationMessage\")) {\n            if (this.validationMessage) {\n                this._internals?.setValidity({ customError: true }, this.validationMessage);\n            } else {\n                this._internals?.setValidity(this.inputElement.validity, this.inputElement.validationMessage);\n            }\n        }\n        if (this._initialized && changedProperties.has(\"rows\")) {\n            throw Error(\"rows attribute cannot be changed after the input is attached to the DOM\");\n        }\n    }\n\n    protected fireValueChange(immediate?: boolean): void {\n        this.dispatchEvent(\n            new CustomEvent<IValueChangeEvent>(`${immediate ? \"immediate-\" : \"\"}value-change`, {\n                detail: { value: this.value },\n            }),\n        );\n        this.setFormValue(this.value);\n        this.updateFormValidity();\n    }\n\n    private updateFormValidity() {\n        if (this.validationMessage == null) {\n            this._internals.setValidity(this.inputElement.validity, this.inputElement.validationMessage);\n            const valMessageEl = this.shadowRoot.querySelector(\"sd-field-validation-message\");\n            this.requestUpdate(\"validationMessage\", valMessageEl == null ? null : valMessageEl.message);\n        }\n    }\n\n    protected shouldFloat() {\n        return (\n            this.alwaysFloatLabel || this.currentText || this.placeholder || this.autocompleted || this.type === \"date\"\n        );\n    }\n\n    protected setFormValue(value: string | File | FormData) {\n        this._internals?.setFormValue(value);\n    }\n\n    protected formResetCallback() {\n        this.value = this._initialValue;\n    }\n\n    protected formDisabledCallback(disabled: boolean) {\n        this.effectiveDisabled = disabled || this.hasAttribute(\"disabled\");\n    }\n\n    protected formAssociatedCallback(_form: HTMLFormElement) {\n        this._needsAutocompletedCheck = true;\n    }\n\n    protected formStateRestoreCallback(state: File | string | FormData | null, reason: unknown) {\n        if (typeof state == \"string\") {\n            this.value = state;\n        }\n    }\n}\n\nif (!customElements.get(SDInput.ID)) {\n    customElements.define(SDInput.ID, SDInput);\n}\n"],"names":["TAG_NAME","delegatesFocus","idCounter","_SDInput","_a","LitElement","nextIdNumber","changedProperties","event","_b","target","listener","shadyDOM","disabled","newValue","start","end","css","unsafeCSS","style","inputPart","valMessage","isInvalid","html","ifDefined","nothing","immediate","valMessageEl","value","_form","state","reason","__decorateClass","property","ValidationLevel","oldValue","SDInput"],"mappings":";;;;;;;;;;AAKA,MAAMA,IAAW,gBAWXC,IAAiB,oBAAqB,OAAe,WAAW;AAEtE,IAAIC,IAAY;;AAmChB,MAAqBC,KAArBC,IAAA,cAAqCC,EAAW;AAAA,EAsE5C,cAAc;AACJ,aA9CV,KAAO,OAAO,GAEd,KAAO,oBAA6B,IAMpC,KAAO,OAAO,QAgBd,KAAO,eAAyB;AAuB5B,UAAMC,IAAeJ;AAChB,SAAA,uBAAuBE,EAAQ,KAAK,cAAcE,GAClD,KAAA,WAAWF,EAAQ,KAAK,YAAYE,GACrC,KAAK,mBAAmB,CAAC,KAAK,mBACzB,KAAA,aAAa,KAAK;EAE/B;AAAA,EAEA,oBAA0B;AACtB,UAAM,kBAAkB,GACnB,KAAK,aAAa,UAAU,MAC7B,KAAK,WAAW;AAAA,EAExB;AAAA,EAEU,aAAaC,GAAyC;AAC5D,UAAM,aAAaA,CAAiB,GAC/B,KAAA,kBAAkB,KAAK,YAAY,GACxC,KAAK,mBAAmB,GACxB,KAAK,mBAAmB,GAEpB,KAAK,aAAa,UAAU,MAC5B,KAAK,WAAW,KAGf,KAAA,aAAa,UAAU,CAACC,MAAsB;AAC/C,WAAK,gBAA4CA,EAAM,cAAlC,2BAA+C,EAAE,UAAUA,IAC3E,KAAA,cAAc,KAAK,aAAa,OACrC,KAAK,gBAAgB,EAAI;AAAA,IAAA,GAE7B,KAAK,aAAa,WAAW,MAAM,KAAK,gBAAgB,GACnDP,MAID,KAAK,aAAa,UAAU,MAAM,KAAK,aAAa,WAAW,EAAE,GACjE,KAAK,aAAa,SAAS,MAAM,KAAK,gBAAgB,SAAS,GAC1D,KAAA,iBAAiB,SAAS,CAACO,MAAU;AAClC,MAAAA,EAAM,WAAW,QACjB,KAAK,aAAa;IACtB,CACH,IAGA,KAAA,aAAa,iBAAiB,SAAS,MAAM;AAC9C,WAAK,mBAAmB;AAAA,IAAA,CAC3B,GACI,KAAA,iBAAiB,WAAW,CAACA,MAAU;;AACpC,MAAAA,EAAM,OAAO,aACRC,KAAAL,IAAA,KAAA,eAAA,gBAAAA,EAAY,SAAZ,QAAAK,EAAkB;AAAA,IAC3B,CACH,GACD,KAAK,eAAe;AAAA,EACxB;AAAA,EAEQ,kBAAkBC,GAAqB;AACrC,UAAAC,IAAW,CAACH,MAAU;AACxB,MAAI,2CAA2C,KAAKA,EAAM,aAAa,IACnE,KAAK,gBAAgB,KACd,4CAA4C,KAAKA,EAAM,aAAa,MAC3E,KAAK,gBAAgB;AAAA,IACzB;AAEJ,IAAI,KAAK,kBACL,KAAK,2BAA2B,IAChC,KAAK,eAAe,cAAc,iBAAiB,KAAKE,GAAQ,kBAAkBC,CAAQ,KAEnFD,EAAA,iBAAiB,kBAAkBC,CAAQ;AAAA,EAE1D;AAAA,EAEA,IAAY,iBAA2C;AAEnD,UAAMC,IAAY,OAAe;AAC1B,WAAAA,KAAYA,EAAS,QAAQA,IAAW;AAAA,EACnD;AAAA,EAEQ,qBAA2B;AAC3B,IAAA,OAAO,KAAK,cAAgB,MAC5B,KAAK,QAAQ,KAAK,cAEb,KAAA,QAAQ,KAAK,aAAa,OAAO,GAEtC,KAAK,UACA,KAAA,cAAc,KAAK,aAAa,QAEzC,KAAK,gBAAgB,KAAK;AAAA,EAC9B;AAAA,EAEA,IAAW,WAAoB;AACpB,WAAA,KAAK,aAAa,UAAU;AAAA,EACvC;AAAA,EAEA,IAAW,SAASC,GAAmB;AACnC,IAAIA,IACK,KAAA,aAAa,YAAY,EAAE,IAEhC,KAAK,gBAAgB,UAAU,GAE9B,KAAK,eACN,KAAK,oBAAoBA;AAAA,EAEjC;AAAA;AAAA,EAGA,IAAW,eAAiC;AACxC,WAAI,KAAK,cAAc,CAAC,KAAK,kBACzB,KAAK,gBAAgB,KAAK,WAAW,cAAc,QAAQ,IAExD,KAAK;AAAA,EAChB;AAAA,EAEA,IAAW,QAAgB;AAChB,WAAA,KAAK,gBAAgB,KAAK,aAAa;AAAA,EAClD;AAAA,EAEA,IAAW,MAAMC,GAAkB;AAC/B,SAAK,cAAcA,KAAY,IAC3B,KAAK,iBACA,KAAA,aAAa,QAAQ,KAAK,cAE9B,KAAA,aAAa,KAAK,WAAW;AAAA,EACtC;AAAA,EAEA,IAAW,iBAAyB;AAChC,WAAO,KAAK,eAAe,KAAK,aAAa,iBAAiB;AAAA,EAClE;AAAA,EAEO,QAAc;AACjB,IAAI,KAAK,eACL,KAAK,aAAa,UAElB,MAAM,MAAM;AAAA,EAEpB;AAAA,EAEO,SAAe;AAClB,IAAI,KAAK,gBACL,KAAK,aAAa;EAE1B;AAAA,EAEO,kBAAkBC,GAAeC,GAAmB;AAClD,SAAA,eAAe,KAAK,MAAM;AAC3B,MAAI,KAAK,gBACA,KAAA,aAAa,kBAAkBD,GAAOC,CAAG;AAAA,IAClD,CACH;AAAA,EACL;AAAA,EAEA,WAAW,SAAS;AACT,WAAA;AAAA,MACHC;AAAA,kBACMC,EAAUC,CAAK,CAAC;AAAA;AAAA,IAAA;AAAA,EAG9B;AAAA,EAEO,SAAyB;;AACxB,QAAAC;AACJ,UAAMC,IAAa,KAAK,uBAAqBjB,IAAA,KAAK,iBAAL,gBAAAA,EAAmB,oBAC1DkB,IAAYD,KAAc,KAAK,mBAAmB;AACpD,WAAA,KAAK,SAAS,IACFD,IAAAG;AAAA;AAAA,yBAEC,KAAK,QAAQ;AAAA;AAAA,4BAEV,KAAK,IAAI;AAAA,kCACHC,EAAU,KAAK,eAAe,MAAS,CAAC;AAAA,2BAC/CA,EAAU,KAAK,QAAQ,MAAS,CAAC;AAAA,oCACxB,KAAK,iBAAiB;AAAA,mCACvB,KAAK,YAAY;AAAA,gCACpB,KAAK,QAAQ;AAAA,gCACb,KAAK,YAAY,KAAK,iBAAiB;AAAA,gCACvC,KAAK,QAAQ;AAAA,gCACb,KAAK,YAAY,IAAI,KAAK,YAAYpB,EAAQ,kBAAkB;AAAA,uCACzD,KAAK,oBAAoB;AAAA,mCAC7BoB,EAAUF,CAAS,CAAC;AAAA,iCACtBE,EAAU,KAAK,eAAe,MAAS,CAAC;AAAA,0BAC/CA,EAAU,KAAK,OAAO,MAAS,CAAC;AAAA,0BAChCA,EAAU,KAAK,OAAO,MAAS,CAAC;AAAA,8BAC5BA,EAAU,KAAK,WAAW,MAAS,CAAC;AAAA;AAAA,gBAI1CJ,IAAAG;AAAA;AAAA,yBAEC,KAAK,QAAQ;AAAA;AAAA,kCAEJC,EAAU,KAAK,eAAe,MAAS,CAAC;AAAA,2BAC/CA,EAAU,KAAK,QAAQ,MAAS,CAAC;AAAA,oCACxB,KAAK,iBAAiB;AAAA,mCACvB,KAAK,YAAY;AAAA,gCACpB,KAAK,QAAQ;AAAA,gCACb,KAAK,YAAY,KAAK,iBAAiB;AAAA,gCACvC,KAAK,QAAQ;AAAA,gCACb,KAAK,YAAY,IAAI,KAAK,YAAYpB,EAAQ,kBAAkB;AAAA,2BACrE,KAAK,IAAI;AAAA,uCACG,KAAK,oBAAoB;AAAA,mCAC7BoB,EAAUF,CAAS,CAAC;AAAA,iCACtBE,EAAU,KAAK,eAAe,MAAS,CAAC;AAAA;AAAA,eAK1DD;AAAA,cACD,KAAK,QAAQA,8EAAiFE,CAAO;AAAA;AAAA;AAAA,+DAGpD,KAAK,gBAAgB,WAAW,UAAU;AAAA,sBACnF,KAAK,SACPF;AAAA,sCACkB,KAAK,QAAQ,kBAAkB,KAAK,YAAY,IAAI,UAAU,EAAE;AAAA,+BACvE,KAAK,KAAK;AAAA;AAAA,qBAEpB;AAAA,sBACCH,CAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBASZC,KAAc,KAAK,sBACtBE;AAAA;AAAA,6BAEa,KAAK,oBAAoB;AAAA;AAAA,mCAEnBF,CAAU;AAAA,gCACb,KAAK,iBAAiB;AAAA,iCACrB,KAAK,eAAe;AAAA;AAAA;AAAA,iBAGpC;AAAA;AAAA;AAAA,EAGb;AAAA,EAEU,QAAQd,GAAyC;AACvD,UAAM,QAAQA,CAAiB,GAC3B,KAAK,4BAA4B,CAAC,KAAK,iBACvC,WAAW,MAAM;AACT,UAAA;AAEK,aAAA,gBAAgB,KAAK,iBAAiB,CAAC,CAAC,KAAK,WAAW,cAAc,mBAAmB;AAAA,cAChF;AAAA,MAElB;AAAA,OACD,CAAC,GAEJ,KAAK,OAAO,OACRA,EAAkB,IAAI,KAAK,KAAKA,EAAkB,IAAI,KAAK,KAAKA,EAAkB,IAAI,SAAS,MAC/F,QAAQ,KAAK,mFAAmF,GAEtF,KAAK,QAAf,UACA,QAAQ,KAAK,SAAS,KAAK,IAAI,qDAAqD;AAAA,EAGhG;AAAA,EAEO,OAAOA,GAAyC;;AASnD,QARA,MAAM,OAAOA,CAAiB,GAC1BA,EAAkB,IAAI,mBAAmB,MACrC,KAAK,qBACLH,IAAA,KAAK,eAAL,QAAAA,EAAiB,YAAY,EAAE,aAAa,MAAQ,KAAK,sBAEzDK,IAAA,KAAK,eAAL,QAAAA,EAAiB,YAAY,KAAK,aAAa,UAAU,KAAK,aAAa,qBAG/E,KAAK,gBAAgBF,EAAkB,IAAI,MAAM;AACjD,YAAM,MAAM,yEAAyE;AAAA,EAE7F;AAAA,EAEU,gBAAgBmB,GAA2B;AAC5C,SAAA;AAAA,MACD,IAAI,YAA+B,GAAGA,IAAY,eAAe,EAAE,gBAAgB;AAAA,QAC/E,QAAQ,EAAE,OAAO,KAAK,MAAM;AAAA,MAAA,CAC/B;AAAA,IAAA,GAEA,KAAA,aAAa,KAAK,KAAK,GAC5B,KAAK,mBAAmB;AAAA,EAC5B;AAAA,EAEQ,qBAAqB;AACrB,QAAA,KAAK,qBAAqB,MAAM;AAChC,WAAK,WAAW,YAAY,KAAK,aAAa,UAAU,KAAK,aAAa,iBAAiB;AAC3F,YAAMC,IAAe,KAAK,WAAW,cAAc,6BAA6B;AAChF,WAAK,cAAc,qBAAqBA,KAAgB,OAAO,OAAOA,EAAa,OAAO;AAAA,IAC9F;AAAA,EACJ;AAAA,EAEU,cAAc;AAEhB,WAAA,KAAK,oBAAoB,KAAK,eAAe,KAAK,eAAe,KAAK,iBAAiB,KAAK,SAAS;AAAA,EAE7G;AAAA,EAEU,aAAaC,GAAiC;;AAC/C,KAAAxB,IAAA,KAAA,eAAA,QAAAA,EAAY,aAAawB;AAAA,EAClC;AAAA,EAEU,oBAAoB;AAC1B,SAAK,QAAQ,KAAK;AAAA,EACtB;AAAA,EAEU,qBAAqBf,GAAmB;AAC9C,SAAK,oBAAoBA,KAAY,KAAK,aAAa,UAAU;AAAA,EACrE;AAAA,EAEU,uBAAuBgB,GAAwB;AACrD,SAAK,2BAA2B;AAAA,EACpC;AAAA,EAEU,yBAAyBC,GAAwCC,GAAiB;AACpF,IAAA,OAAOD,KAAS,aAChB,KAAK,QAAQA;AAAA,EAErB;AACJ,GAxYI1B,EAAuB,KAAaJ,GACpCI,EAAwB,qBAA6B,QACrDA,EAAO,iBAAiB,IA8DxBA,EAAO,oBAAoC;AAAA,EACvC,GAAGC,EAAW;AAAA,EACd,gBAAAJ;AAAA,GAnERG;AAMW4B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GALxB9B,EAMV,WAAA,SAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAP1B9B,EAQV,WAAA,qBAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAT1B9B,EAUV,WAAA,qBAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAMC,GAAiB,WAAW,IAAM,SAAS,IAAM;AAAA,GAXlD/B,EAYV,WAAA,mBAAA,CAAA;AAOA6B,EAAA;AAAA,EANNC,EAAS;AAAA,IACN,MAAM;AAAA,IACN,WAAWL,GAAOO,GAAU;AACjB,aAAAA,KAAY,QAAaA,KAAYP;AAAA,IAChD;AAAA,EAAA,CACH;AAAA,GAlBgBzB,EAmBV,WAAA,eAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,WAAW,IAAM;AAAA,GApB3B9B,EAqBV,WAAA,oBAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,WAAW,IAAM;AAAA,GAtB3B9B,EAuBV,WAAA,iBAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAxB1B9B,EAyBV,WAAA,QAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM,WAAW,sBAAsB;AAAA,GA1B1D9B,EA2BV,WAAA,qBAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM,WAAW,mBAAmB;AAAA,GA5BvD9B,EA6BV,WAAA,kBAAA,CAAA;AAIA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAhCxB9B,EAiCV,WAAA,QAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAlCxB9B,EAmCV,WAAA,eAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GApCxB9B,EAqCV,WAAA,eAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAtCxB9B,EAuCV,WAAA,aAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAxCzB9B,EAyCV,WAAA,YAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA1CzB9B,EA2CV,WAAA,YAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GA5CxB9B,EA6CV,WAAA,QAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA9CzB9B,EA+CV,WAAA,YAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAhD1B9B,EAiDV,WAAA,gBAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAlD1B9B,EAmDV,WAAA,OAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GApD1B9B,EAqDV,WAAA,OAAA,CAAA;AAEA6B,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAtD1B9B,EAuDV,WAAA,WAAA,CAAA;AAvDX,IAAqBiC,IAArBjC;AA2YK,eAAe,IAAIiC,EAAQ,EAAE,KACf,eAAA,OAAOA,EAAQ,IAAIA,CAAO;"}
+{"version":3,"file":"input.mjs","sources":["../input.ts"],"sourcesContent":["import { LitElement, html, PropertyValues, unsafeCSS, TemplateResult, css, nothing } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\n\nconst TAG_NAME = \"sd-lit-input\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [TAG_NAME]: SDInput;\n    }\n}\n\nimport style from \"./style.scss?inline\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst delegatesFocus = \"delegatesFocus\" in (window as any).ShadowRoot.prototype;\n\nlet idCounter = 0;\n\nexport interface IValueChangeEvent {\n    value: string;\n}\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n    \"immediate-value-change\": CustomEvent<IValueChangeEvent>;\n    \"value-change\": CustomEvent<IValueChangeEvent>;\n}\n\nexport default interface SDInput {\n    addEventListener<K extends keyof CustomEventMap>(\n        event: K,\n        listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    addEventListener(\n        type: string,\n        callback: EventListenerOrEventListenerObject | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    removeEventListener<K extends keyof CustomEventMap>(\n        type: K,\n        listener: (this: this, ev: CustomEventMap[K]) => unknown,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    removeEventListener(\n        type: string,\n        listener: EventListenerOrEventListenerObject,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport default class SDInput extends LitElement {\n    public static readonly ID: string = TAG_NAME;\n    private static readonly DEFAULT_MAX_LENGTH: number = 524288;\n    static formAssociated = true;\n\n    @property({ type: String, reflect: true })\n    public label: string;\n    @property({ type: String, attribute: true })\n    public validationMessage: string;\n    @property({ type: String, attribute: true })\n    public validationIconSrc: string;\n    @property({ type: ValidationLevel, attribute: true, reflect: true })\n    public validationLevel: ValidationLevel;\n    @property({\n        type: String,\n        hasChanged(value, oldValue) {\n            return oldValue != undefined && oldValue != value;\n        },\n    })\n    public currentText;\n    @property({ type: Boolean, attribute: true })\n    public alwaysFloatLabel: boolean;\n    @property({ type: Boolean, attribute: true })\n    public autocompleted: boolean;\n    @property({ type: Number, attribute: true })\n    public rows = 1;\n    @property({ type: Boolean, reflect: true, attribute: \"effective-disabled\" })\n    public effectiveDisabled: boolean = false;\n    @property({ type: Boolean, reflect: true, attribute: \"extended-prefix\" })\n    public extendedPrefix: boolean;\n\n    // delegated settings to input\n    @property({ type: String, reflect: true })\n    public type = \"text\";\n    @property({ type: String, reflect: true })\n    public placeholder: string;\n    @property({ type: String, reflect: true })\n    public sdAriaLabel: string;\n    @property({ type: Number, reflect: true })\n    public maxlength: number;\n    @property({ type: Boolean, reflect: true })\n    public readonly: boolean;\n    @property({ type: Boolean, reflect: true })\n    public required: boolean;\n    @property({ type: String, reflect: true })\n    public name: string;\n    @property({ type: Boolean, reflect: true })\n    public inactive: boolean;\n    @property({ type: String, attribute: true })\n    public autocomplete: AutoFill = \"off\";\n    @property({ type: String, attribute: true })\n    public min: string;\n    @property({ type: String, attribute: true })\n    public max: string;\n    @property({ type: String, attribute: true })\n    public pattern: string;\n\n    private _inputElement: HTMLInputElement;\n    private _initialized: boolean;\n    private _needsAutocompletedCheck: boolean;\n    private _validationMessageId: string;\n    private _inputId: string;\n    private _internals: ElementInternals;\n    private _initialValue: string;\n\n    static shadowRootOptions: ShadowRootInit = {\n        ...LitElement.shadowRootOptions,\n        delegatesFocus,\n    };\n\n    constructor() {\n        super();\n        const nextIdNumber = idCounter++;\n        this._validationMessageId = SDInput.ID + \"_message_\" + nextIdNumber;\n        this._inputId = SDInput.ID + \"_input_\" + nextIdNumber;\n        if (this.attachInternals && !this.activeShadyDOM) {\n            this._internals = this.attachInternals();\n        }\n    }\n\n    connectedCallback(): void {\n        super.connectedCallback();\n        if (!this.hasAttribute(\"tabIndex\")) {\n            this.tabIndex = 0;\n        }\n    }\n\n    protected firstUpdated(changedProperties: PropertyValues): void {\n        super.firstUpdated(changedProperties);\n        this.initAutocompleted(this.inputElement);\n        this.updateInitialValue();\n        this.updateFormValidity();\n\n        if (this.hasAttribute(\"disabled\")) {\n            this.disabled = true;\n        }\n\n        this.inputElement.oninput = (event: InputEvent) => {\n            this.autocompleted = \"insertReplacementText\" === event.inputType || !(\"data\" in event);\n            this.currentText = this.inputElement.value;\n            this.fireValueChange(true);\n        };\n        this.inputElement.onchange = () => this.fireValueChange();\n        if (!delegatesFocus) {\n            // Provide a limited \"delegatesFocus\" behavior where it is not supported.\n            // Note that clicking on non-focusable elements inside the shadow root\n            // does not focus the first focusable element as it would have been expected.\n            this.inputElement.onfocus = () => this.setAttribute(\"focused\", \"\");\n            this.inputElement.onblur = () => this.removeAttribute(\"focused\");\n            this.addEventListener(\"focus\", (event) => {\n                if (event.target === this) {\n                    this.inputElement.focus();\n                }\n            });\n        }\n        // An input with 'type: date' may not dispatch change or input events in partially filled state\n        this.inputElement.addEventListener(\"keyup\", () => {\n            this.updateFormValidity();\n        });\n        this.addEventListener(\"keydown\", (event) => {\n            if (event.key == \"Enter\") {\n                this._internals?.form?.requestSubmit();\n            }\n        });\n        this._initialized = true;\n    }\n\n    private initAutocompleted(target: HTMLElement) {\n        const listener = (event) => {\n            if (/^onautofillstart(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n                this.autocompleted = true;\n            } else if (/^onautofillcancel(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n                this.autocompleted = false;\n            }\n        };\n        if (this.activeShadyDOM) {\n            this._needsAutocompletedCheck = true;\n            this.activeShadyDOM.nativeMethods.addEventListener.call(target, \"animationstart\", listener);\n        } else {\n            target.addEventListener(\"animationstart\", listener);\n        }\n    }\n\n    private get activeShadyDOM(): { nativeMethods } | null {\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        const shadyDOM = (window as any).ShadyDOM;\n        return shadyDOM && shadyDOM.inUse ? shadyDOM : null;\n    }\n\n    private updateInitialValue(): void {\n        if (typeof this.currentText !== \"undefined\") {\n            this.value = this.currentText;\n        } else {\n            this.value = this.getAttribute(\"value\");\n        }\n        if (this.value) {\n            this.currentText = this.inputElement.value;\n        }\n        this._initialValue = this.value;\n    }\n\n    public get disabled(): boolean {\n        return this.hasAttribute(\"disabled\");\n    }\n\n    public set disabled(disabled: boolean) {\n        if (disabled) {\n            this.setAttribute(\"disabled\", \"\");\n        } else {\n            this.removeAttribute(\"disabled\");\n        }\n        if (!this._internals) {\n            this.effectiveDisabled = disabled;\n        }\n    }\n\n    // It is public as hacking around due to IE 11 is a common task to do.\n    public get inputElement(): HTMLInputElement {\n        if (this.shadowRoot && !this._inputElement) {\n            this._inputElement = this.shadowRoot.querySelector(\".input\");\n        }\n        return this._inputElement;\n    }\n\n    public get value(): string {\n        return this.inputElement && this.inputElement.value;\n    }\n\n    public set value(newValue: string) {\n        this.currentText = newValue || \"\";\n        if (this.inputElement) {\n            this.inputElement.value = this.currentText;\n        }\n        this.setFormValue(this.currentText);\n    }\n\n    public get selectionStart(): number {\n        return this.inputElement ? this.inputElement.selectionStart : 0;\n    }\n\n    public focus(): void {\n        if (this.inputElement) {\n            this.inputElement.focus();\n        } else {\n            super.focus();\n        }\n    }\n\n    public select(): void {\n        if (this.inputElement) {\n            this.inputElement.select();\n        }\n    }\n\n    public setSelectionRange(start: number, end: number): void {\n        this.updateComplete.then(() => {\n            if (this.inputElement) {\n                this.inputElement.setSelectionRange(start, end);\n            }\n        });\n    }\n\n    static get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n\n    public render(): TemplateResult {\n        let inputPart;\n        const valMessage = this.validationMessage || this.inputElement?.validationMessage;\n        const isInvalid = valMessage || this.validationLevel != null;\n        if (this.rows === 1) {\n            inputPart = html`\n                <input\n                    id=${this._inputId}\n                    class=\"input\"\n                    .type=${this.type}\n                    placeholder=${ifDefined(this.placeholder || undefined)}\n                    name=${ifDefined(this.name || undefined)}\n                    aria-disabled=${this.effectiveDisabled}\n                    autocomplete=${this.autocomplete}\n                    ?disabled=${this.inactive}\n                    ?readonly=${this.readonly || this.effectiveDisabled}\n                    ?required=${this.required}\n                    maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n                    aria-describedby=${this._validationMessageId}\n                    aria-invalid=${ifDefined(isInvalid)}\n                    aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n                    min=${ifDefined(this.min || undefined)}\n                    max=${ifDefined(this.max || undefined)}\n                    pattern=${ifDefined(this.pattern || undefined)}\n                />\n            `;\n        } else {\n            inputPart = html`\n                <textarea\n                    id=${this._inputId}\n                    class=\"input\"\n                    placeholder=${ifDefined(this.placeholder || undefined)}\n                    name=${ifDefined(this.name || undefined)}\n                    aria-disabled=${this.effectiveDisabled}\n                    autocomplete=${this.autocomplete}\n                    ?disabled=${this.inactive}\n                    ?readonly=${this.readonly || this.effectiveDisabled}\n                    ?required=${this.required}\n                    maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n                    rows=${this.rows}\n                    aria-describedby=${this._validationMessageId}\n                    aria-invalid=${ifDefined(isInvalid)}\n                    aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n                ></textarea>\n            `;\n        }\n\n        return html`\n            ${this.label ? html` <div class=\"floated-label-placeholder\" aria-hidden=\"true\">&nbsp;</div> ` : nothing}\n            <div class=\"input-wrapper\">\n                <span class=\"prefix\"><slot name=\"prefix\"></slot></span>\n                <div class=\"input-container\" style=\"position:${this.shouldFloat() ? \"static\" : \"relative\"};\">\n                    ${this.label &&\n                    html`\n                        <label for=\"${this._inputId}\" class=\"label ${this.shouldFloat() ? \"float\" : \"\"}\"\n                            >${this.label}</label\n                        >\n                    `}\n                    ${inputPart}\n                </div>\n                <span class=\"suffix\"><slot name=\"suffix\"></slot></span>\n            </div>\n            <div class=\"underline\" aria-hidden=\"true\">\n                <div class=\"unfocused-line\"></div>\n                <div class=\"focused-line\"></div>\n            </div>\n            <div class=\"validation-message-wrapper\" aria-hidden=\"true\">\n                ${(valMessage || this.validationIconSrc) &&\n                html`\n                    <sd-field-validation-message\n                        id=${this._validationMessageId}\n                        class=\"validation-message\"\n                        .message=${valMessage}\n                        .icon=${this.validationIconSrc}\n                        .level=${this.validationLevel}\n                    >\n                    </sd-field-validation-message>\n                `}\n            </div>\n        `;\n    }\n\n    protected updated(changedProperties: PropertyValues): void {\n        super.updated(changedProperties);\n        if (this._needsAutocompletedCheck && !this.autocompleted) {\n            setTimeout(() => {\n                try {\n                    // In certain cases there is no animation event dispatched even if the animation itself is done (it is visible also in dev tools) when an autofill is done.\n                    this.autocompleted = this.autocompleted || !!this.shadowRoot.querySelector(\":-webkit-autofill\");\n                } catch (ignored) {\n                    // the above used selector is not supported for example in Firefox\n                }\n            }, 0);\n        }\n        if (this.rows > 1) {\n            if (changedProperties.has(\"min\") || changedProperties.has(\"max\") || changedProperties.has(\"pattern\")) {\n                console.warn(\"min, max & pattern attributes are not supported with multiple rows configuration.\");\n            }\n            if (\"text\" != this.type) {\n                console.warn(`type: ${this.type} is not supported with multiple rows configuration.`);\n            }\n        }\n    }\n\n    public update(changedProperties: PropertyValues): void {\n        super.update(changedProperties);\n        if (changedProperties.has(\"validationMessage\")) {\n            if (this.validationMessage) {\n                this._internals?.setValidity({ customError: true }, this.validationMessage);\n            } else {\n                this._internals?.setValidity(this.inputElement.validity, this.inputElement.validationMessage);\n            }\n        }\n        if (this._initialized && changedProperties.has(\"rows\")) {\n            throw Error(\"rows attribute cannot be changed after the input is attached to the DOM\");\n        }\n    }\n\n    protected fireValueChange(immediate?: boolean): void {\n        this.dispatchEvent(\n            new CustomEvent<IValueChangeEvent>(`${immediate ? \"immediate-\" : \"\"}value-change`, {\n                detail: { value: this.value },\n            }),\n        );\n        this.setFormValue(this.value);\n    }\n\n    private updateFormValidity() {\n        if (this.validationMessage == null) {\n            this._internals.setValidity(this.inputElement.validity, this.inputElement.validationMessage);\n            const valMessageEl = this.shadowRoot.querySelector(\"sd-field-validation-message\");\n            this.requestUpdate(\"validationMessage\", valMessageEl == null ? null : valMessageEl.message);\n        }\n    }\n\n    protected shouldFloat() {\n        return (\n            this.alwaysFloatLabel || this.currentText || this.placeholder || this.autocompleted || this.type === \"date\"\n        );\n    }\n\n    protected setFormValue(value: string | File | FormData) {\n        this._internals?.setFormValue(value);\n        this.updateFormValidity();\n    }\n\n    protected formResetCallback() {\n        this.value = this._initialValue;\n    }\n\n    protected formDisabledCallback(disabled: boolean) {\n        this.effectiveDisabled = disabled || this.hasAttribute(\"disabled\");\n    }\n\n    protected formAssociatedCallback(_form: HTMLFormElement) {\n        this._needsAutocompletedCheck = true;\n    }\n\n    protected formStateRestoreCallback(state: File | string | FormData | null, reason: unknown) {\n        if (typeof state == \"string\") {\n            this.value = state;\n        }\n    }\n}\n\nif (!customElements.get(SDInput.ID)) {\n    customElements.define(SDInput.ID, SDInput);\n}\n"],"names":["TAG_NAME","delegatesFocus","idCounter","_SDInput","_a","LitElement","nextIdNumber","changedProperties","event","target","listener","shadyDOM","disabled","newValue","start","end","css","unsafeCSS","style","inputPart","valMessage","isInvalid","html","ifDefined","nothing","immediate","valMessageEl","value","_form","state","reason","__decorateClass","property","ValidationLevel","oldValue","SDInput"],"mappings":"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"}