npm - @nysds/nys-textinput - Versions diffs - 1.13.0 → 1.13.1 - Mend

@nysds/nys-textinput 1.13.0 → 1.13.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/dist/nys-textinput.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import { LitElement as y, unsafeCSS as c, html as h } from "lit";
+import { LitElement as y, unsafeCSS as c, html as p } from "lit";
 import { property as o, state as _ } from "lit/decorators.js";
 import { ifDefined as u } from "lit/directives/if-defined.js";
 const v = ':host{--_nys-textinput-width: 100%;--_nys-textinput-height: var(--nys-size-500, 40px);--_nys-textinput-border-radius: var(--nys-radius-md, 4px);--_nys-textinput-border-width: var(--nys-border-width-sm, 1px);--_nys-textinput-border-color: var(--nys-color-neutral-400, #909395);--_nys-textinput-color: var( --nys-color-text, var(--nys-color-neutral-900, #1b1b1b) );--_nys-textinput-color--placeholder: var( --nys-color-text-weaker, var(--nys-color-neutral-500, #797c7f) );--_nys-textinput-padding: var(--nys-space-100, 8px);--_nys-textinput-gap: var(--nys-space-50, 4px);--_nys-textinput-background-color: var( --nys-color-ink-reverse, var(--nys-color-white, #ffffff) );--_nys-textinput-color: var( --nys-color-ink, var(--nys-color-neutral-900, #1b1b1b) );--_nys-textinput-outline-color--hover: var( --nys-color-neutral-900, #1b1b1b );--_nys-textinput-outline-width: var(--nys-border-width-sm, 1px);--_nys-textinput-outline-color--focus: var(--nys-color-focus, #004dd1);--_nys-textinput-background-color--disabled: var( --nys-color-neutral-10, #f6f6f6 );--_nys-textinput-border-color--disabled: var( --nys-color-neutral-200, #bec0c1 );--_nys-textinput-color--disabled: var( --nys-color-text-disabled, var(--nys-color-neutral-200, #bec0c1) );--_nys-textinput-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-textinput-font-size: var(--nys-font-size-ui-md, 16px);--_nys-textinput-font-weight: var(--nys-font-weight-regular, 400);--_nys-textinput-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-textinput-letter-spacing: var( --nys-font-letterspacing-ui-md, var(--nys-font-letterspacing-400, .044px) )}:host([width=sm]){--_nys-textinput-width: var(--nys-form-width-sm, 88px)}:host([width=md]){--_nys-textinput-width: var(--nys-form-width-md, 200px)}:host([width=lg]){--_nys-textinput-width: var(--nys-form-width-lg, 384px)}:host([width=full]){--_nys-textinput-width: 100%;flex:1}:host([showError]){--_nys-textinput-border-color: var(--nys-color-danger, #b52c2c)}.nys-textinput{font-weight:var(--_nys-textinput-font-weight);font-family:var(--_nys-textinput-font-family);font-size:var(--_nys-textinput-font-size);line-height:var(--_nys-textinput-line-height);letter-spacing:var(--_nys-textinput-letter-spacing);color:var(--_nys-textinput-color);gap:var(--_nys-textinput-gap);display:flex;flex-direction:column}.nys-textinput__mask-overlay{position:absolute;margin:calc(var(--_nys-textinput-padding) + var(--_nys-textinput-border-width));color:var(--nys-color-text-weaker, #797c7f);display:inline;overflow:hidden;white-space:nowrap;font:inherit;letter-spacing:normal}.nys-textinput__input{color:var(--_nys-textinput-color);border-radius:var(--_nys-textinput-border-radius);border:solid var(--_nys-textinput-border-color) var(--_nys-textinput-border-width);outline-color:transparent;outline-width:var(--_nys-textinput-outline-width);outline-style:solid;padding:var(--_nys-textinput-padding);width:100%;height:var(--_nys-textinput-height);box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;background-color:transparent;position:relative;font:inherit}.nys-textinput__input::placeholder{color:var(--_nys-textinput-color--placeholder)}.nys-textinput__buttoncontainer{width:var(--_nys-textinput-width);max-width:100%;display:flex}.nys-textinput__buttoncontainer.has-end-button .nys-textinput__input{border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none}.nys-textinput__buttoncontainer.has-start-button .nys-textinput__input{border-start-start-radius:0;border-end-start-radius:0;border-inline-start:none}.nys-textinput__container{position:relative;display:flex;align-items:center;width:100%;background-color:var(--_nys-textinput-background-color);border-radius:var(--_nys-textinput-border-radius)}::slotted(nys-button){--_nys-button-height: var(--_nys-textinput-height);--_nys-button-border-radius--start: var(--_nys-textinput-border-radius);--_nys-button-border-radius--end: var(--_nys-textinput-border-radius);--_nys-button-background-color--disabled: var( --_nys-textinput-background-color--disabled );--_nys-button-border-color--disabled: var(--_nys-textinput-color--disabled);--_nys-button-color--disabled: var(--_nys-textinput-color--disabled);--_nys-button-border-width: var(--_nys-textinput-border-width);z-index:1}.nys-textinput__buttoncontainer.has-start-button ::slotted(nys-button){--_nys-button-border-radius--end: 0}.nys-textinput__buttoncontainer.has-end-button ::slotted(nys-button){--_nys-button-border-radius--start: 0}.eye-icon{position:absolute;right:var(--nys-space-50, 4px);top:50%;transform:translateY(-50%);cursor:pointer;color:var(--_nys-textinput-color--icon);--nys-button-background-color: var(--_nys-textinput-background-color);--nys-button-background-color--hover: var( --_nys-textinput-background-color );--nys-button-background-color--active: var( --_nys-textinput-background-color );--_nys-button-outline-focus: calc( var(--_nys-button-outline-width) * -1 );--_nys-button-padding--y: var(--nys-space-50, 4px);--_nys-button-padding--x: var(--nys-space-50, 4px);--_nys-button-height: var(--nys-size-300, 32px);--_nys-button-width: var(--nys-size-400, 32px)}.nys-textinput__input:hover:not(:disabled):not(:focus):not([readonly]){outline-color:var(--_nys-textinput-outline-color--hover);border-color:var(--_nys-textinput-outline-color--hover)}.nys-textinput__input:focus:not([readonly]){outline-color:var(--_nys-textinput-outline-color--focus);border-color:var(--_nys-textinput-outline-color--focus);caret-color:var(--_nys-textinput-outline-color--focus)}.nys-textinput__input:disabled,.nys-textinput__input:disabled::placeholder,.nys-textinput__input:disabled+.eye-icon{background-color:var(--_nys-textinput-background-color--disabled);border-color:var(--_nys-textinput-border-color--disabled);color:var(--_nys-textinput-color--disabled);cursor:not-allowed}';
-var b = Object.defineProperty, r = (p, s, e, t) => {
-  for (var i = void 0, l = p.length - 1, a; l >= 0; l--)
-    (a = p[l]) && (i = a(s, e, i) || i);
-  return i && b(s, e, i), i;
+var b = Object.defineProperty, r = (h, e, s, t) => {
+  for (var i = void 0, l = h.length - 1, a; l >= 0; l--)
+    (a = h[l]) && (i = a(e, s, i) || i);
+  return i && b(e, s, i), i;
 };
 let f = 0;
 const d = class d extends y {
@@ -26,12 +26,12 @@ const d = class d extends y {
     this._setValue();
   }
   // Ensure the "width" property is valid after updates
-  async updated(s) {
-    if (s.has("disabled") && (this._validateButtonSlot("startButton"), this._validateButtonSlot("endButton")), s.has("type")) {
-      const e = this._maskPatterns[this.type], t = this.shadowRoot?.querySelector("input");
+  async updated(e) {
+    if (e.has("disabled") && (this._validateButtonSlot("startButton"), this._validateButtonSlot("endButton")), e.has("type")) {
+      const s = this._maskPatterns[this.type], t = this.shadowRoot?.querySelector("input");
       if (t)
-        if (e)
-          t.maxLength = e.length, this._updateOverlay(t.value, e);
+        if (s)
+          t.maxLength = s.length, this._updateOverlay(t.value, s);
         else {
           t.removeAttribute("maxLength");
           const i = this.shadowRoot?.querySelector(
@@ -40,9 +40,9 @@ const d = class d extends y {
           i && (i.textContent = "");
         }
     }
-    if (s.has("readonly") || s.has("required")) {
-      const e = this.shadowRoot?.querySelector("input");
-      e && (e.required = this.required && !this.readonly);
+    if (e.has("readonly") || e.has("required")) {
+      const s = this.shadowRoot?.querySelector("input");
+      s && (s.required = this.required && !this.readonly);
     }
   }
   /**
@@ -53,28 +53,30 @@ const d = class d extends y {
     this._internals.setFormValue(this.value), this._manageRequire();
   }
   _manageRequire() {
-    const s = this.shadowRoot?.querySelector("input");
-    if (!s) return;
-    const e = this.errorMessage || "This field is required";
-    this.required && (!this.value || this.value?.trim() === "") ? (this._internals.ariaRequired = "true", this._internals.setValidity({ valueMissing: !0 }, e, s)) : (this._internals.ariaRequired = "false", this._internals.setValidity({}), this._hasUserInteracted = !1);
-  }
-  _setValidityMessage(s = "") {
     const e = this.shadowRoot?.querySelector("input");
     if (!e) return;
-    this.showError = !!s, this._originalErrorMessage?.trim() && s !== "" ? this.errorMessage = this._originalErrorMessage : this.errorMessage = s;
-    const t = s ? { customError: !0 } : {};
-    this._internals.setValidity(t, this.errorMessage, e);
+    const s = this.errorMessage || "This field is required";
+    this.required && (!this.value || this.value?.trim() === "") ? (this._internals.ariaRequired = "true", this._internals.setValidity({ valueMissing: !0 }, s, e)) : (this._internals.ariaRequired = "false", this._internals.setValidity({}), this._hasUserInteracted = !1);
   }
-  _validate() {
+  _setValidityMessage(e = "") {
     const s = this.shadowRoot?.querySelector("input");
     if (!s) return;
-    const e = s.validity;
+    this.showError = !!e, this._originalErrorMessage?.trim() && e !== "" ? this.errorMessage = this._originalErrorMessage : this.errorMessage = e;
+    const t = e ? { customError: !0 } : {};
+    this._internals.setValidity(t, this.errorMessage, s);
+  }
+  _validate() {
+    const e = this.shadowRoot?.querySelector("input");
+    if (!e) return;
+    const s = e.validity;
     let t = "";
-    e.valueMissing ? t = "This field is required" : e.typeMismatch ? t = "Invalid format for this type" : e.patternMismatch ? t = "Invalid format" : e.tooShort ? t = `Value is too short. Minimum length is ${s.minLength}` : e.tooLong ? t = `Value is too long. Maximum length is ${s.maxLength}` : e.rangeUnderflow ? t = `Value must be at least ${s.min}` : e.rangeOverflow ? t = `Value must be at most ${s.max}` : e.stepMismatch ? t = "Invalid step value" : t = s.validationMessage, this._setValidityMessage(t);
+    s.valueMissing ? t = "This field is required" : s.typeMismatch ? t = "Invalid format for this type" : s.patternMismatch ? t = "Invalid format" : s.tooShort ? t = `Value is too short. Minimum length is ${e.minLength}` : s.tooLong ? t = `Value is too long. Maximum length is ${e.maxLength}` : s.rangeUnderflow ? t = `Value must be at least ${e.min}` : s.rangeOverflow ? t = `Value must be at most ${e.max}` : s.stepMismatch ? t = "Invalid step value" : t = e.validationMessage, this._setValidityMessage(t);
   }
   // This callback is automatically called when the parent form is reset.
   formResetCallback() {
     this.value = "";
+    const e = this.shadowRoot?.querySelector("input");
+    e && (e.value = ""), this._internals.setFormValue(""), this.showError = !1, this.errorMessage = "", this._internals.setValidity({}), this.showPassword = !1, this.requestUpdate();
   }
   /**
    * Functions
@@ -82,44 +84,44 @@ const d = class d extends y {
    */
   // This helper function is called to perform the element's native validation.
   checkValidity() {
-    const s = this.shadowRoot?.querySelector("input");
-    return s ? s.checkValidity() : !0;
-  }
-  _handleInvalid(s) {
-    s.preventDefault(), this._hasUserInteracted = !0, this._validate();
     const e = this.shadowRoot?.querySelector("input");
-    if (e) {
+    return e ? e.checkValidity() : !0;
+  }
+  _handleInvalid(e) {
+    e.preventDefault(), this._hasUserInteracted = !0, this._validate();
+    const s = this.shadowRoot?.querySelector("input");
+    if (s) {
       const t = this._internals.form;
       t ? Array.from(t.elements).find(
         (a) => typeof a.checkValidity == "function" && !a.checkValidity()
-      ) === this && e.focus() : e.focus();
+      ) === this && s.focus() : s.focus();
     }
   }
   _togglePasswordVisibility() {
     this.showPassword = !this.showPassword;
   }
-  _updateOverlay(s, e) {
+  _updateOverlay(e, s) {
     const t = this.shadowRoot?.querySelector(
       ".nys-textinput__mask-overlay"
     );
     if (!t) return;
-    const i = s, l = e.slice(i.length);
+    const i = e, l = s.slice(i.length);
     t.textContent = i + l;
   }
-  _applyMask(s, e) {
-    const t = s.replace(/\D/g, "");
+  _applyMask(e, s) {
+    const t = e.replace(/\D/g, "");
     let i = "";
     if (this.type === "tel")
       return t.length > 0 && (i = "(" + t.substring(0, 3)), t.length >= 4 && (i += ") " + t.substring(3, 6)), t.length > 6 && (i += "-" + t.substring(6, 10)), i;
     let l = 0;
-    for (let a = 0; a < e.length; a++)
-      if (e[a] === "_" || e[a].match(/[d9]/i))
+    for (let a = 0; a < s.length; a++)
+      if (s[a] === "_" || s[a].match(/[d9]/i))
         if (l < t.length)
           i += t[l++];
         else
           break;
       else
-        i += e[a];
+        i += s[a];
     return i;
   }
   /**
@@ -127,11 +129,11 @@ const d = class d extends y {
    * --------------------------------------------------------------------------
    */
   // Handle input event to check pattern validity
-  _handleInput(s) {
-    const e = s.target;
-    let t = e.value;
+  _handleInput(e) {
+    const s = e.target;
+    let t = s.value;
     const i = this._maskPatterns[this.type];
-    i && (t = this._applyMask(t, i), e.value = t, this._updateOverlay(t, i)), this.value = t, this._internals.setFormValue(this.value), this._hasUserInteracted && this._validate(), this.dispatchEvent(
+    i && (t = this._applyMask(t, i), s.value = t, this._updateOverlay(t, i)), this.value = t, this._internals.setFormValue(this.value), this._hasUserInteracted && this._validate(), this.dispatchEvent(
       new CustomEvent("nys-input", {
         detail: { id: this.id, value: this.value },
         bubbles: !0,
@@ -147,24 +149,24 @@ const d = class d extends y {
   _handleBlur() {
     this._hasUserInteracted || (this._hasUserInteracted = !0), this._validate(), this.dispatchEvent(new Event("nys-blur"));
   }
-  _validateButtonSlot(s) {
-    const e = this.shadowRoot?.querySelector(
-      'slot[name="' + s + '"]'
+  _validateButtonSlot(e) {
+    const s = this.shadowRoot?.querySelector(
+      'slot[name="' + e + '"]'
     ), t = this.shadowRoot?.querySelector(
       ".nys-textinput__buttoncontainer"
     );
-    if (!e || !t) return;
-    const i = e.assignedElements();
+    if (!s || !t) return;
+    const i = s.assignedElements();
     let l = !1;
     i.forEach((a) => {
       a instanceof HTMLElement && a.tagName.toLowerCase() === "nys-button" && !l ? (l = !0, a.setAttribute("size", "sm"), a.setAttribute("variant", "primary"), this.disabled ? a.setAttribute("disabled", "true") : a.removeAttribute("disabled")) : (console.warn(
-        "The '" + s + "' slot only accepts a single <nys-button> element. Removing invalid or extra node:",
+        "The '" + e + "' slot only accepts a single <nys-button> element. Removing invalid or extra node:",
         a
       ), a.remove());
-    }), s === "startButton" ? t.classList.toggle("has-start-button", l) : s === "endButton" && t.classList.toggle("has-end-button", l);
+    }), e === "startButton" ? t.classList.toggle("has-start-button", l) : e === "endButton" && t.classList.toggle("has-end-button", l);
   }
   render() {
-    return h`
+    return p`
       <div class="nys-textinput">
         <nys-label
           for=${this.id + "--native"}
@@ -210,7 +212,7 @@ const d = class d extends y {
               @focus="${this._handleFocus}"
               @blur="${this._handleBlur}"
             />
-            ${this.type === "password" ? h` <nys-button
+            ${this.type === "password" ? p` <nys-button
                   class="eye-icon"
                   id="password-toggle"
                   suffixIcon="slotted"

package/dist/nys-textinput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nys-textinput.js","sources":["../src/nys-textinput.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-textinput.scss?inline\";\n\nlet textinputIdCounter = 0;\n\n/*\n `<nys-textinput>` is a form-enabled text input with validation, optional\n * masking, password toggle, accessibility support, and live error messages.\n * Works with forms via ElementInternals.\n \n @slot description - Optional custom description content below the label.\n * @slot startButton - Slot for a single <nys-button> at the start of the input.\n * @slot endButton - Slot for a single <nys-button> at the end of the input.\n \n @fires nys-input - Fired on input change. Detail: `{ id, value }`.\n * @fires nys-focus - Fired when input receives focus.\n * @fires nys-blur - Fired when input loses focus.\n /\n\nexport class NysTextinput extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: String, reflect: true }) type:\n \| \"email\"\n \| \"number\"\n \| \"password\"\n \| \"search\"\n \| \"tel\"\n \| \"text\"\n \| \"url\" = \"text\";\n @property({ type: String }) label = \"\";\n @property({ type: String }) description = \"\";\n @property({ type: String }) placeholder = \"\";\n @property({ type: String }) value = \"\";\n @property({ type: Boolean, reflect: true }) disabled = false;\n @property({ type: Boolean, reflect: true }) readonly = false;\n @property({ type: Boolean, reflect: true }) required = false;\n @property({ type: Boolean, reflect: true }) optional = false;\n @property({ type: String }) tooltip = \"\";\n @property({ type: String, reflect: true }) form: string \| null = null;\n @property({ type: String }) pattern = \"\";\n @property({ type: Number }) maxlength: number \| null = null;\n @property({ type: String, reflect: true }) width:\n \| \"sm\"\n \| \"md\"\n \| \"lg\"\n \| \"full\" = \"full\";\n @property({ type: Number }) step: number \| null = null;\n @property({ type: Number }) min: number \| null = null;\n @property({ type: Number }) max: number \| null = null;\n @property({ type: Boolean, reflect: true }) inverted = false;\n @property({ type: Boolean, reflect: true }) showError = false;\n @property({ type: String }) errorMessage = \"\";\n @state() private showPassword = false;\n\n private _originalErrorMessage = \"\";\n private _hasUserInteracted = false; // need this flag for \"eager mode\"\n private _internals: ElementInternals;\n\n private _maskPatterns: Record<string, string> = {\n tel: \"(___) ___-____\",\n };\n\n /\n Lifecycle methods\n * --------------------------------------------------------------------------\n /\n static formAssociated = true; // allows use of elementInternals' API\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n // Generate a unique ID if one is not provided\n connectedCallback() {\n super.connectedCallback();\n if (!this.id) {\n this.id = `nys-textinput-${Date.now()}-${textinputIdCounter++}`;\n }\n\n this._originalErrorMessage = this.errorMessage ?? \"\";\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n firstUpdated() {\n // This ensures our element always participates in the form\n this._setValue();\n }\n\n // Ensure the \"width\" property is valid after updates\n async updated(changedProperties: Map<string \| number \| symbol, unknown>) {\n if (changedProperties.has(\"disabled\")) {\n this._validateButtonSlot(\"startButton\");\n this._validateButtonSlot(\"endButton\");\n }\n\n if (changedProperties.has(\"type\")) {\n const mask = this._maskPatterns[this.type];\n const input = this.shadowRoot?.querySelector(\"input\");\n\n if (input) {\n if (mask) {\n input.maxLength = mask.length;\n this._updateOverlay(input.value, mask);\n } else {\n input.removeAttribute(\"maxLength\");\n const overlay = this.shadowRoot?.querySelector(\n \".nys-textinput__mask-overlay\",\n );\n if (overlay) overlay.textContent = \"\";\n }\n }\n }\n if (\n changedProperties.has(\"readonly\") \|\|\n changedProperties.has(\"required\")\n ) {\n const input = this.shadowRoot?.querySelector(\"input\");\n\n if (input) input.required = this.required && !this.readonly;\n }\n }\n\n /\n Form Integration\n * --------------------------------------------------------------------------\n /\n\n private _setValue() {\n this._internals.setFormValue(this.value);\n this._manageRequire(); // Update validation\n }\n\n private _manageRequire() {\n const input = this.shadowRoot?.querySelector(\"input\");\n\n if (!input) return;\n\n const message = this.errorMessage \|\| \"This field is required\";\n const isInvalid =\n this.required && (!this.value \|\| this.value?.trim() === \"\"); // Check for blank as well\n\n if (isInvalid) {\n this._internals.ariaRequired = \"true\";\n this._internals.setValidity({ valueMissing: true }, message, input);\n } else {\n this._internals.ariaRequired = \"false\";\n this._internals.setValidity({});\n this._hasUserInteracted = false; // Reset eager/lazy checking\n }\n }\n\n private _setValidityMessage(message: string = \"\") {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Always show the visual error if there is a message\n this.showError = !!message;\n\n // Use the original errorMessage if defined, or keep the message from validation\n if (this._originalErrorMessage?.trim() && message !== \"\") {\n this.errorMessage = this._originalErrorMessage;\n } else {\n this.errorMessage = message;\n }\n\n const validityState = message ? { customError: true } : {};\n this._internals.setValidity(validityState, this.errorMessage, input);\n }\n\n private _validate() {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Get the native validation state\n const validity = input.validity;\n let message = \"\";\n\n // Check each possible validation error\n if (validity.valueMissing) {\n message = \"This field is required\";\n } else if (validity.typeMismatch) {\n message = \"Invalid format for this type\";\n } else if (validity.patternMismatch) {\n message = \"Invalid format\";\n } else if (validity.tooShort) {\n message = `Value is too short. Minimum length is ${input.minLength}`;\n } else if (validity.tooLong) {\n message = `Value is too long. Maximum length is ${input.maxLength}`;\n } else if (validity.rangeUnderflow) {\n message = `Value must be at least ${input.min}`;\n } else if (validity.rangeOverflow) {\n message = `Value must be at most ${input.max}`;\n } else if (validity.stepMismatch) {\n message = \"Invalid step value\";\n } else {\n message = input.validationMessage;\n }\n\n this._setValidityMessage(message);\n }\n\n // This callback is automatically called when the parent form is reset.\n formResetCallback() {\n this.value = \"\";\n }\n\n /\n Functions\n * --------------------------------------------------------------------------\n /\n\n // This helper function is called to perform the element's native validation.\n checkValidity(): boolean {\n const input = this.shadowRoot?.querySelector(\"input\");\n return input ? input.checkValidity() : true;\n }\n\n private _handleInvalid(event: Event) {\n event.preventDefault();\n this._hasUserInteracted = true; // Start aggressive mode due to form submission\n this._validate();\n\n const input = this.shadowRoot?.querySelector(\"input\");\n if (input) {\n // Focus only if this is the first invalid element (top-down approach)\n const form = this._internals.form;\n if (form) {\n const elements = Array.from(form.elements) as Array<\n HTMLElement & { checkValidity?: () => boolean }\n >;\n // Find the first element in the form that is invalid\n const firstInvalidElement = elements.find(\n (element) =>\n typeof element.checkValidity === \"function\" &&\n !element.checkValidity(),\n );\n if (firstInvalidElement === this) {\n input.focus();\n }\n } else {\n // If not part of a form, simply focus.\n input.focus();\n }\n }\n }\n\n private _togglePasswordVisibility() {\n this.showPassword = !this.showPassword;\n }\n\n private _updateOverlay(value: string, mask: string) {\n const overlay = this.shadowRoot?.querySelector(\n \".nys-textinput__mask-overlay\",\n ) as HTMLElement;\n if (!overlay) return;\n\n const filled = value;\n const remaining = mask.slice(filled.length);\n overlay.textContent = filled + remaining;\n }\n\n private _applyMask(value: string, mask: string): string {\n const digits = value.replace(/\\D/g, \"\");\n let result = \"\";\n\n // Special handling for tel to avoid trailing dash\n if (this.type === \"tel\") {\n if (digits.length > 0) {\n result = \"(\" + digits.substring(0, 3);\n }\n if (digits.length >= 4) {\n result += \") \" + digits.substring(3, 6);\n }\n // Add dash if there are more than 6 digits\n if (digits.length > 6) {\n result += \"-\" + digits.substring(6, 10);\n }\n return result;\n }\n\n // Default generic masking logic\n let digitIndex = 0;\n for (let i = 0; i < mask.length; i++) {\n if (mask[i] === \"_\" \|\| mask[i].match(/[d9]/i)) {\n if (digitIndex < digits.length) {\n result += digits[digitIndex++];\n } else {\n break;\n }\n } else {\n result += mask[i]; // keep formatting symbols\n }\n }\n\n return result;\n }\n\n /\n Event Handlers\n * --------------------------------------------------------------------------\n */\n\n // Handle input event to check pattern validity\n private _handleInput(event: Event) {\n const input = event.target as HTMLInputElement;\n let newValue = input.value;\n\n const mask = this._maskPatterns[this.type];\n if (mask) {\n newValue = this._applyMask(newValue, mask);\n input.value = newValue; // ensure input reflects masked value\n this._updateOverlay(newValue, mask);\n }\n\n this.value = newValue;\n this._internals.setFormValue(this.value);\n\n // Field is invalid after unfocused, validate aggressively on each input (e.g. Eager mode: a combination of aggressive and lazy.)\n if (this._hasUserInteracted) {\n this._validate();\n }\n\n this.dispatchEvent(\n new CustomEvent(\"nys-input\", {\n detail: { id: this.id, value: this.value },\n bubbles: true,\n composed: true,\n }),\n );\n }\n\n // Handle focus event\n private _handleFocus() {\n this.dispatchEvent(new Event(\"nys-focus\"));\n }\n\n // Handle blur event\n private _handleBlur() {\n if (!this._hasUserInteracted) {\n this._hasUserInteracted = true; // At initial unfocus: if input is invalid, start aggressive mode\n }\n this._validate();\n\n this.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n private _validateButtonSlot(slotName: string) {\n const slot = this.shadowRoot?.querySelector(\n 'slot[name=\"' + slotName + '\"]',\n ) as HTMLSlotElement;\n const container = this.shadowRoot?.querySelector(\n \".nys-textinput__buttoncontainer\",\n );\n\n if (!slot \|\| !container) return;\n\n const assignedElements = slot.assignedElements();\n\n let foundValidButton = false;\n\n assignedElements.forEach((node) => {\n const isNysButton =\n node instanceof HTMLElement &&\n node.tagName.toLowerCase() === \"nys-button\";\n\n if (isNysButton && !foundValidButton) {\n // First valid nys-button found\n foundValidButton = true;\n node.setAttribute(\"size\", \"sm\");\n node.setAttribute(\"variant\", \"primary\");\n //set button to be disabled if the input is disabled\n if (this.disabled) {\n node.setAttribute(\"disabled\", \"true\");\n } else {\n node.removeAttribute(\"disabled\");\n }\n } else {\n console.warn(\n \"The '\" +\n slotName +\n \"' slot only accepts a single <nys-button> element. Removing invalid or extra node:\",\n node,\n );\n node.remove();\n }\n });\n\n if (slotName === \"startButton\") {\n container.classList.toggle(\"has-start-button\", foundValidButton);\n } else if (slotName === \"endButton\") {\n container.classList.toggle(\"has-end-button\", foundValidButton);\n }\n }\n\n render() {\n return html`\n <div class=\"nys-textinput\">\n <nys-label\n for=${this.id + \"--native\"}\n label=${this.label}\n description=${this.description}\n flag=${this.required && !this.readonly\n ? \"required\"\n : this.optional\n ? \"optional\"\n : \"\"}\n tooltip=${this.tooltip}\n ?inverted=${this.inverted}\n >\n <slot name=\"description\" slot=\"description\">${this.description}</slot>\n </nys-label>\n <div class=\"nys-textinput__buttoncontainer\">\n <slot\n name=\"startButton\"\n @slotchange=${() => this._validateButtonSlot(\"startButton\")}\n ></slot>\n <div class=\"nys-textinput__container\">\n <span class=\"nys-textinput__mask-overlay\"></span>\n <input\n class=\"nys-textinput__input\"\n type=${this.type === \"password\"\n ? this.showPassword\n ? \"text\"\n : \"password\"\n : this.type}\n name=${this.name}\n id=${this.id + \"--native\"}\n ?disabled=${this.disabled}\n ?required=${this.required && !this.readonly}\n ?readonly=${this.readonly}\n aria-required=${this.required}\n aria-disabled=\"${this.disabled}\"\n aria-label=\"${[this.label, this.description]\n .filter(Boolean)\n .join(\" \")}\"\n .value=${this.value}\n placeholder=${ifDefined(\n this.placeholder ? this.placeholder : undefined,\n )}\n pattern=${ifDefined(this.pattern ? this.pattern : undefined)}\n min=${ifDefined(this.min !== null ? this.min : undefined)}\n maxlength=${ifDefined(\n this.maxlength !== null ? this.maxlength : undefined,\n )}\n step=${ifDefined(this.step !== null ? this.step : undefined)}\n max=${ifDefined(this.max !== null ? this.max : undefined)}\n form=${ifDefined(this.form \|\| undefined)}\n @input=${this._handleInput}\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n />\n ${this.type === \"password\"\n ? html` <nys-button\n class=\"eye-icon\"\n id=\"password-toggle\"\n suffixIcon=\"slotted\"\n ariaLabel=\"password toggle\"\n variant=\"ghost\"\n size=\"sm\"\n @nys-click=${() =>\n !this.disabled && this._togglePasswordVisibility()}\n >\n <nys-icon\n slot=\"suffix-icon\"\n size=\"2xl\"\n name=${this.showPassword ? \"visibility_off\" : \"visibility\"}\n ></nys-icon>\n </nys-button>`\n : \"\"}\n </div>\n <slot\n name=\"endButton\"\n @slotchange=${() => this._validateButtonSlot(\"endButton\")}\n ></slot>\n </div>\n <nys-errormessage\n ?showError=${this.showError}\n errorMessage=${this.errorMessage}\n ></nys-errormessage>\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-textinput\")) {\n customElements.define(\"nys-textinput\", NysTextinput);\n}\n"],"names":["textinputIdCounter","_NysTextinput","LitElement","changedProperties","mask","input","overlay","message","validityState","validity","event","form","element","value","filled","remaining","digits","result","digitIndex","i","newValue","slotName","slot","container","assignedElements","foundValidButton","node","html","ifDefined","unsafeCSS","styles","NysTextinput","__decorateClass","property","state"],"mappings":"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"}
1	+ {"version":3,"file":"nys-textinput.js","sources":["../src/nys-textinput.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-textinput.scss?inline\";\n\nlet textinputIdCounter = 0;\n\n/*\n A text input for collecting short, single-line data. Supports validation, input masking (tel),\n * password visibility toggle, and live error messaging. Form-associated via ElementInternals.\n \n Use for names, emails, passwords, phone numbers. For multi-line input, use `nys-textarea` instead.\n * For predefined options, use `nys-select`, `nys-radiobutton`, or `nys-checkbox`.\n \n @summary Text input for short single-line data with validation and masking support.\n * @element nys-textinput\n \n @slot description - Custom HTML description content below the label.\n * @slot startButton - Button at input start. Use single `nys-button` only.\n * @slot endButton - Button at input end. Use single `nys-button` only.\n \n @fires nys-input - Fired on input change. Detail: `{id, value}`.\n * @fires nys-focus - Fired when input gains focus.\n * @fires nys-blur - Fired when input loses focus. Triggers validation.\n \n @example Basic text input\n * ```html\n * <nys-textinput label=\"Full Name\" required></nys-textinput>\n * ```\n \n @example Email with validation\n * ```html\n * <nys-textinput type=\"email\" label=\"Email Address\" required></nys-textinput>\n * ```\n \n @example Phone with masking\n * ```html\n * <nys-textinput type=\"tel\" label=\"Phone Number\"></nys-textinput>\n * ```\n \n @example Search with button\n * ```html\n * <nys-textinput type=\"search\" placeholder=\"Search\">\n * <nys-button slot=\"endButton\" label=\"Search\" prefixIcon=\"search\"></nys-button>\n * </nys-textinput>\n * ```\n /\n\nexport class NysTextinput extends LitElement {\n static styles = unsafeCSS(styles);\n\n /* Unique identifier. Auto-generated if not provided. /\n @property({ type: String, reflect: true }) id = \"\";\n\n /* Name for form submission. /\n @property({ type: String, reflect: true }) name = \"\";\n\n /\n Input type: `text` (default), `email`, `number`, `password`, `search`, `tel` (auto-masked), `url`.\n * @default \"text\"\n /\n @property({ type: String, reflect: true }) type:\n \| \"email\"\n \| \"number\"\n \| \"password\"\n \| \"search\"\n \| \"tel\"\n \| \"text\"\n \| \"url\" = \"text\";\n\n /* Visible label text. Required for accessibility. /\n @property({ type: String }) label = \"\";\n\n /* Helper text below label. Use slot for custom HTML. /\n @property({ type: String }) description = \"\";\n\n /* Placeholder text. Don't use as label replacement. /\n @property({ type: String }) placeholder = \"\";\n\n /* Current input value. /\n @property({ type: String }) value = \"\";\n\n /* Prevents interaction. /\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /* Makes input read-only but focusable. /\n @property({ type: Boolean, reflect: true }) readonly = false;\n\n /* Marks as required. Shows \"Required\" flag and validates on blur. /\n @property({ type: Boolean, reflect: true }) required = false;\n\n /* Shows \"Optional\" flag. Use when most fields are required. /\n @property({ type: Boolean, reflect: true }) optional = false;\n\n /* Tooltip text shown on hover/focus of info icon. /\n @property({ type: String }) tooltip = \"\";\n\n /* Form `id` to associate with when input is outside form element. /\n @property({ type: String, reflect: true }) form: string \| null = null;\n\n /* Regex pattern for validation. Shows error on mismatch. /\n @property({ type: String }) pattern = \"\";\n\n /* Maximum character length. /\n @property({ type: Number }) maxlength: number \| null = null;\n\n /\n Input width: `sm` (88px), `md` (200px), `lg` (384px), `full` (100%, default).\n * @default \"full\"\n /\n @property({ type: String, reflect: true }) width:\n \| \"sm\"\n \| \"md\"\n \| \"lg\"\n \| \"full\" = \"full\";\n\n /* Step increment for `type=\"number\"`. /\n @property({ type: Number }) step: number \| null = null;\n\n /* Minimum value for `type=\"number\"`. /\n @property({ type: Number }) min: number \| null = null;\n\n /* Maximum value for `type=\"number\"`. /\n @property({ type: Number }) max: number \| null = null;\n\n /* Adjusts colors for dark backgrounds. /\n @property({ type: Boolean, reflect: true }) inverted = false;\n\n /* Shows error message when true. Set by validation or manually. /\n @property({ type: Boolean, reflect: true }) showError = false;\n\n /* Error message text. Shown only when `showError` is true. /\n @property({ type: String }) errorMessage = \"\";\n @state() private showPassword = false;\n\n private _originalErrorMessage = \"\";\n private _hasUserInteracted = false; // need this flag for \"eager mode\"\n private _internals: ElementInternals;\n\n private _maskPatterns: Record<string, string> = {\n tel: \"(___) ___-____\",\n };\n\n /\n Lifecycle methods\n * --------------------------------------------------------------------------\n /\n static formAssociated = true; // allows use of elementInternals' API\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n // Generate a unique ID if one is not provided\n connectedCallback() {\n super.connectedCallback();\n if (!this.id) {\n this.id = `nys-textinput-${Date.now()}-${textinputIdCounter++}`;\n }\n\n this._originalErrorMessage = this.errorMessage ?? \"\";\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n firstUpdated() {\n // This ensures our element always participates in the form\n this._setValue();\n }\n\n // Ensure the \"width\" property is valid after updates\n async updated(changedProperties: Map<string \| number \| symbol, unknown>) {\n if (changedProperties.has(\"disabled\")) {\n this._validateButtonSlot(\"startButton\");\n this._validateButtonSlot(\"endButton\");\n }\n\n if (changedProperties.has(\"type\")) {\n const mask = this._maskPatterns[this.type];\n const input = this.shadowRoot?.querySelector(\"input\");\n\n if (input) {\n if (mask) {\n input.maxLength = mask.length;\n this._updateOverlay(input.value, mask);\n } else {\n input.removeAttribute(\"maxLength\");\n const overlay = this.shadowRoot?.querySelector(\n \".nys-textinput__mask-overlay\",\n );\n if (overlay) overlay.textContent = \"\";\n }\n }\n }\n if (\n changedProperties.has(\"readonly\") \|\|\n changedProperties.has(\"required\")\n ) {\n const input = this.shadowRoot?.querySelector(\"input\");\n\n if (input) input.required = this.required && !this.readonly;\n }\n }\n\n /\n Form Integration\n * --------------------------------------------------------------------------\n /\n\n private _setValue() {\n this._internals.setFormValue(this.value);\n this._manageRequire(); // Update validation\n }\n\n private _manageRequire() {\n const input = this.shadowRoot?.querySelector(\"input\");\n\n if (!input) return;\n\n const message = this.errorMessage \|\| \"This field is required\";\n const isInvalid =\n this.required && (!this.value \|\| this.value?.trim() === \"\"); // Check for blank as well\n\n if (isInvalid) {\n this._internals.ariaRequired = \"true\";\n this._internals.setValidity({ valueMissing: true }, message, input);\n } else {\n this._internals.ariaRequired = \"false\";\n this._internals.setValidity({});\n this._hasUserInteracted = false; // Reset eager/lazy checking\n }\n }\n\n private _setValidityMessage(message: string = \"\") {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Always show the visual error if there is a message\n this.showError = !!message;\n\n // Use the original errorMessage if defined, or keep the message from validation\n if (this._originalErrorMessage?.trim() && message !== \"\") {\n this.errorMessage = this._originalErrorMessage;\n } else {\n this.errorMessage = message;\n }\n\n const validityState = message ? { customError: true } : {};\n this._internals.setValidity(validityState, this.errorMessage, input);\n }\n\n private _validate() {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Get the native validation state\n const validity = input.validity;\n let message = \"\";\n\n // Check each possible validation error\n if (validity.valueMissing) {\n message = \"This field is required\";\n } else if (validity.typeMismatch) {\n message = \"Invalid format for this type\";\n } else if (validity.patternMismatch) {\n message = \"Invalid format\";\n } else if (validity.tooShort) {\n message = `Value is too short. Minimum length is ${input.minLength}`;\n } else if (validity.tooLong) {\n message = `Value is too long. Maximum length is ${input.maxLength}`;\n } else if (validity.rangeUnderflow) {\n message = `Value must be at least ${input.min}`;\n } else if (validity.rangeOverflow) {\n message = `Value must be at most ${input.max}`;\n } else if (validity.stepMismatch) {\n message = \"Invalid step value\";\n } else {\n message = input.validationMessage;\n }\n\n this._setValidityMessage(message);\n }\n\n // This callback is automatically called when the parent form is reset.\n public formResetCallback() {\n this.value = \"\";\n\n const input = this.shadowRoot?.querySelector(\"input\");\n if (input) {\n input.value = \"\";\n }\n\n this._internals.setFormValue(\"\");\n\n // Reset validation UI\n this.showError = false;\n this.errorMessage = \"\";\n this._internals.setValidity({});\n\n this.showPassword = false;\n\n // Re-render UI\n this.requestUpdate();\n }\n\n /\n Functions\n * --------------------------------------------------------------------------\n /\n\n // This helper function is called to perform the element's native validation.\n checkValidity(): boolean {\n const input = this.shadowRoot?.querySelector(\"input\");\n return input ? input.checkValidity() : true;\n }\n\n private _handleInvalid(event: Event) {\n event.preventDefault();\n this._hasUserInteracted = true; // Start aggressive mode due to form submission\n this._validate();\n\n const input = this.shadowRoot?.querySelector(\"input\");\n if (input) {\n // Focus only if this is the first invalid element (top-down approach)\n const form = this._internals.form;\n if (form) {\n const elements = Array.from(form.elements) as Array<\n HTMLElement & { checkValidity?: () => boolean }\n >;\n // Find the first element in the form that is invalid\n const firstInvalidElement = elements.find(\n (element) =>\n typeof element.checkValidity === \"function\" &&\n !element.checkValidity(),\n );\n if (firstInvalidElement === this) {\n input.focus();\n }\n } else {\n // If not part of a form, simply focus.\n input.focus();\n }\n }\n }\n\n private _togglePasswordVisibility() {\n this.showPassword = !this.showPassword;\n }\n\n private _updateOverlay(value: string, mask: string) {\n const overlay = this.shadowRoot?.querySelector(\n \".nys-textinput__mask-overlay\",\n ) as HTMLElement;\n if (!overlay) return;\n\n const filled = value;\n const remaining = mask.slice(filled.length);\n overlay.textContent = filled + remaining;\n }\n\n private _applyMask(value: string, mask: string): string {\n const digits = value.replace(/\\D/g, \"\");\n let result = \"\";\n\n // Special handling for tel to avoid trailing dash\n if (this.type === \"tel\") {\n if (digits.length > 0) {\n result = \"(\" + digits.substring(0, 3);\n }\n if (digits.length >= 4) {\n result += \") \" + digits.substring(3, 6);\n }\n // Add dash if there are more than 6 digits\n if (digits.length > 6) {\n result += \"-\" + digits.substring(6, 10);\n }\n return result;\n }\n\n // Default generic masking logic\n let digitIndex = 0;\n for (let i = 0; i < mask.length; i++) {\n if (mask[i] === \"_\" \|\| mask[i].match(/[d9]/i)) {\n if (digitIndex < digits.length) {\n result += digits[digitIndex++];\n } else {\n break;\n }\n } else {\n result += mask[i]; // keep formatting symbols\n }\n }\n\n return result;\n }\n\n /\n Event Handlers\n * --------------------------------------------------------------------------\n */\n\n // Handle input event to check pattern validity\n private _handleInput(event: Event) {\n const input = event.target as HTMLInputElement;\n let newValue = input.value;\n\n const mask = this._maskPatterns[this.type];\n if (mask) {\n newValue = this._applyMask(newValue, mask);\n input.value = newValue; // ensure input reflects masked value\n this._updateOverlay(newValue, mask);\n }\n\n this.value = newValue;\n this._internals.setFormValue(this.value);\n\n // Field is invalid after unfocused, validate aggressively on each input (e.g. Eager mode: a combination of aggressive and lazy.)\n if (this._hasUserInteracted) {\n this._validate();\n }\n\n this.dispatchEvent(\n new CustomEvent(\"nys-input\", {\n detail: { id: this.id, value: this.value },\n bubbles: true,\n composed: true,\n }),\n );\n }\n\n // Handle focus event\n private _handleFocus() {\n this.dispatchEvent(new Event(\"nys-focus\"));\n }\n\n // Handle blur event\n private _handleBlur() {\n if (!this._hasUserInteracted) {\n this._hasUserInteracted = true; // At initial unfocus: if input is invalid, start aggressive mode\n }\n this._validate();\n\n this.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n private _validateButtonSlot(slotName: string) {\n const slot = this.shadowRoot?.querySelector(\n 'slot[name=\"' + slotName + '\"]',\n ) as HTMLSlotElement;\n const container = this.shadowRoot?.querySelector(\n \".nys-textinput__buttoncontainer\",\n );\n\n if (!slot \|\| !container) return;\n\n const assignedElements = slot.assignedElements();\n\n let foundValidButton = false;\n\n assignedElements.forEach((node) => {\n const isNysButton =\n node instanceof HTMLElement &&\n node.tagName.toLowerCase() === \"nys-button\";\n\n if (isNysButton && !foundValidButton) {\n // First valid nys-button found\n foundValidButton = true;\n node.setAttribute(\"size\", \"sm\");\n node.setAttribute(\"variant\", \"primary\");\n //set button to be disabled if the input is disabled\n if (this.disabled) {\n node.setAttribute(\"disabled\", \"true\");\n } else {\n node.removeAttribute(\"disabled\");\n }\n } else {\n console.warn(\n \"The '\" +\n slotName +\n \"' slot only accepts a single <nys-button> element. Removing invalid or extra node:\",\n node,\n );\n node.remove();\n }\n });\n\n if (slotName === \"startButton\") {\n container.classList.toggle(\"has-start-button\", foundValidButton);\n } else if (slotName === \"endButton\") {\n container.classList.toggle(\"has-end-button\", foundValidButton);\n }\n }\n\n render() {\n return html`\n <div class=\"nys-textinput\">\n <nys-label\n for=${this.id + \"--native\"}\n label=${this.label}\n description=${this.description}\n flag=${this.required && !this.readonly\n ? \"required\"\n : this.optional\n ? \"optional\"\n : \"\"}\n tooltip=${this.tooltip}\n ?inverted=${this.inverted}\n >\n <slot name=\"description\" slot=\"description\">${this.description}</slot>\n </nys-label>\n <div class=\"nys-textinput__buttoncontainer\">\n <slot\n name=\"startButton\"\n @slotchange=${() => this._validateButtonSlot(\"startButton\")}\n ></slot>\n <div class=\"nys-textinput__container\">\n <span class=\"nys-textinput__mask-overlay\"></span>\n <input\n class=\"nys-textinput__input\"\n type=${this.type === \"password\"\n ? this.showPassword\n ? \"text\"\n : \"password\"\n : this.type}\n name=${this.name}\n id=${this.id + \"--native\"}\n ?disabled=${this.disabled}\n ?required=${this.required && !this.readonly}\n ?readonly=${this.readonly}\n aria-required=${this.required}\n aria-disabled=\"${this.disabled}\"\n aria-label=\"${[this.label, this.description]\n .filter(Boolean)\n .join(\" \")}\"\n .value=${this.value}\n placeholder=${ifDefined(\n this.placeholder ? this.placeholder : undefined,\n )}\n pattern=${ifDefined(this.pattern ? this.pattern : undefined)}\n min=${ifDefined(this.min !== null ? this.min : undefined)}\n maxlength=${ifDefined(\n this.maxlength !== null ? this.maxlength : undefined,\n )}\n step=${ifDefined(this.step !== null ? this.step : undefined)}\n max=${ifDefined(this.max !== null ? this.max : undefined)}\n form=${ifDefined(this.form \|\| undefined)}\n @input=${this._handleInput}\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n />\n ${this.type === \"password\"\n ? html` <nys-button\n class=\"eye-icon\"\n id=\"password-toggle\"\n suffixIcon=\"slotted\"\n ariaLabel=\"password toggle\"\n variant=\"ghost\"\n size=\"sm\"\n @nys-click=${() =>\n !this.disabled && this._togglePasswordVisibility()}\n >\n <nys-icon\n slot=\"suffix-icon\"\n size=\"2xl\"\n name=${this.showPassword ? \"visibility_off\" : \"visibility\"}\n ></nys-icon>\n </nys-button>`\n : \"\"}\n </div>\n <slot\n name=\"endButton\"\n @slotchange=${() => this._validateButtonSlot(\"endButton\")}\n ></slot>\n </div>\n <nys-errormessage\n ?showError=${this.showError}\n errorMessage=${this.errorMessage}\n ></nys-errormessage>\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-textinput\")) {\n customElements.define(\"nys-textinput\", NysTextinput);\n}\n"],"names":["textinputIdCounter","_NysTextinput","LitElement","changedProperties","mask","input","overlay","message","validityState","validity","event","form","element","value","filled","remaining","digits","result","digitIndex","i","newValue","slotName","slot","container","assignedElements","foundValidButton","node","html","ifDefined","unsafeCSS","styles","NysTextinput","__decorateClass","property","state"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@nysds/nys-textinput",
-  "version": "1.13.0",
+  "version": "1.13.1",
   "description": "The Textinput component from the NYS Design System.",
   "module": "dist/nys-textinput.js",
   "exports": {
@@ -22,9 +22,9 @@
     "lit-analyze": "lit-analyzer '**/*.ts'"
   },
   "dependencies": {
-    "@nysds/nys-icon": "^1.13.0",
-    "@nysds/nys-label": "^1.13.0",
-    "@nysds/nys-errormessage": "^1.13.0"
+    "@nysds/nys-icon": "^1.13.1",
+    "@nysds/nys-label": "^1.13.1",
+    "@nysds/nys-errormessage": "^1.13.1"
   },
   "devDependencies": {
     "lit": "^3.3.1",