@nysds/nys-textarea 1.11.3 → 1.12.0

package/dist/nys-textarea.js

@@ -1,33 +1,24 @@
 import { LitElement as y, unsafeCSS as u, html as p } from "lit";
 import { property as a } from "lit/decorators.js";
-import { ifDefined as l } from "lit/directives/if-defined.js";
+import { ifDefined as o } from "lit/directives/if-defined.js";
 const v = ':host{--_nys-textarea-width: 100%;--_nys-textarea-border-radius: var(--nys-radius-md, 4px);--_nys-textarea-border-width: var(--nys-border-width-sm, 1px);--_nys-textarea-border-color: var(--nys-color-neutral-400, #909395);--_nys-textarea-padding: var(--nys-space-100, 8px);--_nys-textarea-gap: var(--nys-space-50, 4px);--_nys-textarea-color: var(--nys-color-ink, #1b1b1b);--_nys-textarea-color--placeholder: var( --nys-color-text-weaker, var(--nys-color-neutral-500, #797c7f) );--_nys-textarea-outline-color--hover: var(--nys-color-neutral-900, #1b1b1b);--_nys-textarea-outline-width: var(--nys-border-width-sm, 1px);--_nys-textarea-outline-color--focus: var(--nys-color-focus, #004dd1);--_nys-textarea-background-color--disabled: var( --nys-color-neutral-10, #f6f6f6 );--_nys-textarea-border-color--disabled: var( --nys-color-neutral-200, #bec0c1 );--_nys-textarea-color--disabled: var( --nys-color-text-disabled, var(--nys-color-neutral-200, #bec0c1) );--_nys-textarea-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-textarea-font-size: var(--nys-font-size-ui-md, 16px);--_nys-textarea-font-weight: var(--nys-font-weight-regular, 400);--_nys-textarea-line-height: var(--nys-font-lineheight-ui-md, 24px);--nys-textarea-letterspacing-ui: var( --nys-font-letterspacing-ui-md, var(--nys-font-letterspacing-400, .044px) )}:host([width=sm]){--_nys-textarea-width: var(--nys-form-width-sm, 88px)}:host([width=md]){--_nys-textarea-width: var(--nys-form-width-md, 200px)}:host([width=lg]){--_nys-textarea-width: var(--nys-form-width-lg, 384px)}:host([width=full]){--_nys-textarea-width: 100%;flex:1}:host([showError]){--_nys-textarea-border-color: var(--nys-color-danger, #b52c2c)}.nys-textarea{font-weight:var(--_nys-textarea-font-weight);font-family:var(--_nys-textarea-font-family);line-height:var(--_nys-textarea-line-height);letter-spacing:var(--nys-textarea-letterspacing-ui);color:var(--_nys-textarea-color);gap:var(--_nys-textarea-gap);display:flex;flex-direction:column}.nys-textarea__textarea{color:var(--_nys-textarea-color);font-size:var(--_nys-textarea-font-size);font-family:var(--_nys-textarea-font-family);border-radius:var(--_nys-textarea-border-radius);border:solid var(--_nys-textarea-border-color) var(--_nys-textarea-border-width);padding:var(--_nys-textarea-padding);width:var(--_nys-textarea-width);line-height:var(--_nys-textarea-line-height);max-width:var(--_nys-textarea-width);box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.nys-textarea__textarea::placeholder{color:var(--_nys-textarea-color--placeholder)}.nys-textarea__textarea.none{resize:none}.nys-textarea__textarea:hover:not(:disabled):not(:focus){outline:solid var(--_nys-textarea-outline-width) var(--_nys-textarea-outline-color--hover);border-color:var(--_nys-textarea-outline-color--hover)}.nys-textarea__textarea:focus{outline:solid var(--_nys-textarea-outline-width) var(--_nys-textarea-outline-color--focus);border-color:var(--_nys-textarea-outline-color--focus);caret-color:var(--_nys-textarea-outline-color--focus)}.nys-textarea__textarea:disabled,.nys-textarea__textarea:disabled::placeholder{background-color:var(--_nys-textarea-background-color--disabled);border-color:var(--_nys-textarea-border-color--disabled);color:var(--_nys-textarea-color--disabled);cursor:not-allowed}';
-var f = Object.defineProperty, x = Object.getOwnPropertyDescriptor, s = (c, e, t, o) => {
-  for (var n = o > 1 ? void 0 : o ? x(e, t) : e, h = c.length - 1, d; h >= 0; h--)
-    (d = c[h]) && (n = (o ? d(e, t, n) : d(n)) || n);
-  return o && n && f(e, t, n), n;
+var f = Object.defineProperty, s = (c, e, r, l) => {
+  for (var i = void 0, d = c.length - 1, n; d >= 0; d--)
+    (n = c[d]) && (i = n(e, r, i) || i);
+  return i && f(e, r, i), i;
 };
-let _ = 0;
-var i;
-const r = (i = class extends y {
+let x = 0;
+const h = class h extends y {
   // allows use of elementInternals' API
   constructor() {
-    super(), this.id = "", this.name = "", this.label = "", this.description = "", this.placeholder = "", this.value = "", this.disabled = !1, this.readonly = !1, this.required = !1, this.optional = !1, this._tooltip = "", this.inverted = !1, this.form = null, this.maxlength = null, this.width = "full", this.rows = 4, this._resize = "vertical", this.showError = !1, this.errorMessage = "", this._hasUserInteracted = !1, this._internals = this.attachInternals();
-  }
-  get resize() {
-    return this._resize;
-  }
-  set resize(e) {
-    this._resize = i.VALID_RESIZE.includes(
-      e
-    ) ? e : "vertical";
+    super(), this.id = "", this.name = "", this.label = "", this.description = "", this.placeholder = "", this.value = "", this.disabled = !1, this.readonly = !1, this.required = !1, this.optional = !1, this.tooltip = "", this.inverted = !1, this.form = null, this.maxlength = null, this.width = "full", this.rows = 4, this.resize = "vertical", this.showError = !1, this.errorMessage = "", this._hasUserInteracted = !1, this._internals = this.attachInternals();
   }
   async updated(e) {
-    await Promise.resolve(), e.has("width") && (this.width = i.VALID_WIDTHS.includes(this.width) ? this.width : "full"), e.has("rows") && (this.rows = this.rows ?? 4);
+    await Promise.resolve(), e.has("rows") && (this.rows = this.rows ?? 4);
   }
   // Generate a unique ID if one is not provided
   connectedCallback() {
-    super.connectedCallback(), this.id || (this.id = `nys-textarea-${Date.now()}-${_++}`), this.addEventListener("invalid", this._handleInvalid);
+    super.connectedCallback(), this.id || (this.id = `nys-textarea-${Date.now()}-${x++}`), this.addEventListener("invalid", this._handleInvalid);
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this.removeEventListener("invalid", this._handleInvalid);
@@ -39,31 +30,31 @@ const r = (i = class extends y {
   formResetCallback() {
     this.value = "";
   }
-  /********************** Form Integration **********************/
+  // Form Integration
   _setValue() {
     this._internals.setFormValue(this.value), this._manageRequire();
   }
   _manageRequire() {
     const e = this.shadowRoot?.querySelector("textarea");
     if (!e) return;
-    const t = this.errorMessage || "This field is required";
-    this.required && !this.value ? (this._internals.ariaRequired = "true", this._internals.setValidity({ valueMissing: !0 }, t, e)) : (this._internals.ariaRequired = "false", this._internals.setValidity({}), this._hasUserInteracted = !1);
+    const r = this.errorMessage || "This field is required";
+    this.required && !this.value ? (this._internals.ariaRequired = "true", this._internals.setValidity({ valueMissing: !0 }, r, e)) : (this._internals.ariaRequired = "false", this._internals.setValidity({}), this._hasUserInteracted = !1);
   }
   _setValidityMessage(e = "") {
-    const t = this.shadowRoot?.querySelector("textarea");
-    t && (this.showError = !!e, this.errorMessage?.trim() && e !== "" && (e = this.errorMessage), this._internals.setValidity(
+    const r = this.shadowRoot?.querySelector("textarea");
+    r && (this.showError = !!e, this.errorMessage?.trim() && e !== "" && (e = this.errorMessage), this._internals.setValidity(
       e ? { customError: !0 } : {},
       e,
-      t
+      r
     ));
   }
   _validate() {
     const e = this.shadowRoot?.querySelector("textarea");
     if (!e) return;
-    let t = e.validationMessage;
-    this._setValidityMessage(t);
+    let r = e.validationMessage;
+    this._setValidityMessage(r);
   }
-  /********************** Functions **********************/
+  // Functions
   // This helper function is called to perform the element's native validation.
   checkValidity() {
     const e = this.shadowRoot?.querySelector("textarea");
@@ -71,19 +62,19 @@ const r = (i = class extends y {
   }
   _handleInvalid(e) {
     e.preventDefault(), this._hasUserInteracted = !0, this._validate();
-    const t = this.shadowRoot?.querySelector("textarea");
-    if (t) {
-      const o = this._internals.form;
-      o ? Array.from(o.elements).find(
-        (d) => typeof d.checkValidity == "function" && !d.checkValidity()
-      ) === this && t.focus() : t.focus();
+    const r = this.shadowRoot?.querySelector("textarea");
+    if (r) {
+      const l = this._internals.form;
+      l ? Array.from(l.elements).find(
+        (n) => typeof n.checkValidity == "function" && !n.checkValidity()
+      ) === this && r.focus() : r.focus();
     }
   }
-  /******************** Event Handlers ********************/
+  // Event Handlers
   // Handle input event to check pattern validity
   _handleInput(e) {
-    const t = e.target;
-    this.value = t.value, this._internals.setFormValue(this.value), this._hasUserInteracted && this._validate(), this.dispatchEvent(
+    const r = e.target;
+    this.value = r.value, this._internals.setFormValue(this.value), this._hasUserInteracted && this._validate(), this.dispatchEvent(
       new CustomEvent("nys-input", {
         detail: { id: this.id, value: this.value },
         bubbles: !0,
@@ -100,8 +91,8 @@ const r = (i = class extends y {
     this._hasUserInteracted || (this._hasUserInteracted = !0), this._validate(), this.dispatchEvent(new Event("nys-blur"));
   }
   _handleSelect(e) {
-    const t = e.target;
-    this.value = t.value, this.dispatchEvent(
+    const r = e.target;
+    this.value = r.value, this.dispatchEvent(
       new CustomEvent("nys-select", {
         detail: { value: this.value },
         bubbles: !0,
@@ -110,8 +101,8 @@ const r = (i = class extends y {
     );
   }
   _handleSelectionChange(e) {
-    const t = e.target;
-    this.value = t.value, this.dispatchEvent(
+    const r = e.target;
+    this.value = r.value, this.dispatchEvent(
       new CustomEvent("nys-selectionchange", {
         detail: { id: this.id, value: this.value },
         bubbles: !0,
@@ -127,7 +118,7 @@ const r = (i = class extends y {
           label=${this.label}
           description=${this.description}
           flag=${this.required ? "required" : this.optional ? "optional" : ""}
-          _tooltip=${this._tooltip}
+          tooltip=${this.tooltip}
           ?inverted=${this.inverted}
         >
           <slot name="description" slot="description">${this.description}</slot>
@@ -140,16 +131,16 @@ const r = (i = class extends y {
           ?disabled=${this.disabled}
           ?required=${this.required}
           ?readonly=${this.readonly}
-          aria-disabled=${l(this.disabled ? "true" : void 0)}
-          aria-required=${l(this.required ? "true" : void 0)}
-          aria-label=${l(this.label || void 0)}
-          aria-description=${l(this.description || void 0)}
-          placeholder=${l(
+          aria-disabled=${o(this.disabled ? "true" : void 0)}
+          aria-required=${o(this.required ? "true" : void 0)}
+          aria-label=${o(this.label || void 0)}
+          aria-description=${o(this.description || void 0)}
+          placeholder=${o(
       this.placeholder ? this.placeholder : void 0
     )}
-          maxlength=${l(this.maxlength ?? void 0)}
+          maxlength=${o(this.maxlength ?? void 0)}
           .rows=${this.rows}
-          form=${l(this.form || void 0)}
+          form=${o(this.form || void 0)}
           @input=${this._handleInput}
           @focus="${this._handleFocus}"
           @blur="${this._handleBlur}"
@@ -163,67 +154,68 @@ const r = (i = class extends y {
       </label>
     `;
   }
-}, i.styles = u(v), i.VALID_WIDTHS = ["sm", "md", "lg", "full"], i.VALID_RESIZE = ["vertical", "none"], i.formAssociated = !0, i);
+};
+h.styles = u(v), h.formAssociated = !0;
+let t = h;
 s([
   a({ type: String, reflect: !0 })
-], r.prototype, "id", 2);
+], t.prototype, "id");
 s([
   a({ type: String, reflect: !0 })
-], r.prototype, "name", 2);
+], t.prototype, "name");
 s([
   a({ type: String })
-], r.prototype, "label", 2);
+], t.prototype, "label");
 s([
   a({ type: String })
-], r.prototype, "description", 2);
+], t.prototype, "description");
 s([
   a({ type: String })
-], r.prototype, "placeholder", 2);
+], t.prototype, "placeholder");
 s([
   a({ type: String })
-], r.prototype, "value", 2);
+], t.prototype, "value");
 s([
   a({ type: Boolean, reflect: !0 })
-], r.prototype, "disabled", 2);
+], t.prototype, "disabled");
 s([
   a({ type: Boolean, reflect: !0 })
-], r.prototype, "readonly", 2);
+], t.prototype, "readonly");
 s([
   a({ type: Boolean, reflect: !0 })
-], r.prototype, "required", 2);
+], t.prototype, "required");
 s([
   a({ type: Boolean, reflect: !0 })
-], r.prototype, "optional", 2);
+], t.prototype, "optional");
 s([
   a({ type: String })
-], r.prototype, "_tooltip", 2);
+], t.prototype, "tooltip");
 s([
   a({ type: Boolean, reflect: !0 })
-], r.prototype, "inverted", 2);
+], t.prototype, "inverted");
 s([
   a({ type: String, reflect: !0 })
-], r.prototype, "form", 2);
+], t.prototype, "form");
 s([
   a({ type: Number })
-], r.prototype, "maxlength", 2);
+], t.prototype, "maxlength");
 s([
-  a({ reflect: !0 })
-], r.prototype, "width", 2);
+  a({ type: String, reflect: !0 })
+], t.prototype, "width");
 s([
   a({ type: Number })
-], r.prototype, "rows", 2);
+], t.prototype, "rows");
 s([
-  a({ reflect: !0 })
-], r.prototype, "resize", 1);
+  a({ type: String, reflect: !0 })
+], t.prototype, "resize");
 s([
   a({ type: Boolean, reflect: !0 })
-], r.prototype, "showError", 2);
+], t.prototype, "showError");
 s([
   a({ type: String })
-], r.prototype, "errorMessage", 2);
-let b = r;
-customElements.get("nys-textarea") || customElements.define("nys-textarea", b);
+], t.prototype, "errorMessage");
+customElements.get("nys-textarea") || customElements.define("nys-textarea", t);
 export {
-  b as NysTextarea
+  t as NysTextarea
 };
 //# sourceMappingURL=nys-textarea.js.map

package/dist/nys-textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"nys-textarea.js","sources":["../src/nys-textarea.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } 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-textarea.scss?inline\";\n\nlet textareaIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysTextarea 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 }) 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: Boolean, reflect: true }) inverted = false;\n  @property({ type: String, reflect: true }) form: string | null = null;\n  @property({ type: Number }) maxlength: number | null = null;\n  private static readonly VALID_WIDTHS = [\"sm\", \"md\", \"lg\", \"full\"] as const;\n  @property({ reflect: true })\n  width: (typeof NysTextarea.VALID_WIDTHS)[number] = \"full\";\n  @property({ type: Number }) rows = 4;\n  private static readonly VALID_RESIZE = [\"vertical\", \"none\"] as const;\n\n  // Use `typeof` to dynamically infer the allowed types\n  private _resize: (typeof NysTextarea.VALID_RESIZE)[number] = \"vertical\";\n\n  // Getter and setter for the `resize` property\n  @property({ reflect: true })\n  get resize(): (typeof NysTextarea.VALID_RESIZE)[number] {\n    return this._resize;\n  }\n\n  set resize(value: string) {\n    this._resize = NysTextarea.VALID_RESIZE.includes(\n      value as (typeof NysTextarea.VALID_RESIZE)[number],\n    )\n      ? (value as (typeof NysTextarea.VALID_RESIZE)[number])\n      : \"vertical\";\n  }\n  @property({ type: Boolean, reflect: true }) showError = false;\n  @property({ type: String }) errorMessage = \"\";\n\n  async updated(changedProperties: Map<string | number | symbol, unknown>) {\n    await Promise.resolve();\n    if (changedProperties.has(\"width\")) {\n      this.width = NysTextarea.VALID_WIDTHS.includes(this.width)\n        ? this.width\n        : \"full\";\n    }\n    if (changedProperties.has(\"rows\")) {\n      this.rows = this.rows ?? 4;\n    }\n  }\n\n  private _hasUserInteracted = false; // need this flag for \"eager mode\"\n  private _internals: ElementInternals;\n\n  /********************** Lifecycle updates **********************/\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-textarea-${Date.now()}-${textareaIdCounter++}`;\n    }\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  // This callback is automatically called when the parent form is reset.\n  formResetCallback() {\n    this.value = \"\";\n  }\n\n  /********************** Form Integration **********************/\n  private _setValue() {\n    this._internals.setFormValue(this.value);\n    this._manageRequire();\n  }\n\n  private _manageRequire() {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n\n    if (!textarea) return;\n\n    const message = this.errorMessage || \"This field is required\";\n    const isInvalid = this.required && !this.value;\n\n    if (isInvalid) {\n      this._internals.ariaRequired = \"true\";\n      this._internals.setValidity({ valueMissing: true }, message, textarea);\n    } else {\n      this._internals.ariaRequired = \"false\"; // Reset when valid\n      this._internals.setValidity({});\n      this._hasUserInteracted = false; // Reset lazy validation when valid\n    }\n  }\n\n  private _setValidityMessage(message: string = \"\") {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n    if (!textarea) return;\n\n    // Toggle the HTML <div> tag error message\n    this.showError = !!message;\n    // If user sets errorMessage, this will always override the native validation message\n    if (this.errorMessage?.trim() && message !== \"\") {\n      message = this.errorMessage;\n    }\n\n    this._internals.setValidity(\n      message ? { customError: true } : {},\n      message,\n      textarea,\n    );\n  }\n\n  private _validate() {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n    if (!textarea) return;\n\n    // Get the native validation state\n    let message = textarea.validationMessage;\n\n    this._setValidityMessage(message);\n  }\n\n  /********************** Functions **********************/\n  // This helper function is called to perform the element's native validation.\n  checkValidity(): boolean {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n    return textarea ? textarea.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 textarea = this.shadowRoot?.querySelector(\"textarea\");\n    if (textarea) {\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          textarea.focus();\n        }\n      } else {\n        // If not part of a form, simply focus.\n        textarea.focus();\n      }\n    }\n  }\n\n  /******************** Event Handlers ********************/\n  // Handle input event to check pattern validity\n  private _handleInput(event: Event) {\n    const textarea = event.target as HTMLInputElement;\n    this.value = textarea.value;\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 textarea is invalid, start aggressive mode\n    }\n\n    this._validate();\n    this.dispatchEvent(new Event(\"nys-blur\"));\n  }\n\n  private _handleSelect(e: Event) {\n    const select = e.target as HTMLSelectElement;\n    this.value = select.value;\n    this.dispatchEvent(\n      new CustomEvent(\"nys-select\", {\n        detail: { value: this.value },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _handleSelectionChange(e: Event) {\n    const select = e.target as HTMLSelectElement;\n    this.value = select.value;\n    this.dispatchEvent(\n      new CustomEvent(\"nys-selectionchange\", {\n        detail: { id: this.id, value: this.value },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  render() {\n    return html`\n      <label class=\"nys-textarea\">\n        <nys-label\n          for=${this.id + \"--native\"}\n          label=${this.label}\n          description=${this.description}\n          flag=${this.required ? \"required\" : this.optional ? \"optional\" : \"\"}\n          _tooltip=${this._tooltip}\n          ?inverted=${this.inverted}\n        >\n          <slot name=\"description\" slot=\"description\">${this.description}</slot>\n        </nys-label>\n        <textarea\n          class=\"nys-textarea__textarea ${this.resize}\"\n          name=${this.name}\n          id=${this.id + \"--native\"}\n          .value=${this.value}\n          ?disabled=${this.disabled}\n          ?required=${this.required}\n          ?readonly=${this.readonly}\n          aria-disabled=${ifDefined(this.disabled ? \"true\" : undefined)}\n          aria-required=${ifDefined(this.required ? \"true\" : undefined)}\n          aria-label=${ifDefined(this.label || undefined)}\n          aria-description=${ifDefined(this.description || undefined)}\n          placeholder=${ifDefined(\n            this.placeholder ? this.placeholder : undefined,\n          )}\n          maxlength=${ifDefined(this.maxlength ?? undefined)}\n          .rows=${this.rows}\n          form=${ifDefined(this.form || undefined)}\n          @input=${this._handleInput}\n          @focus=\"${this._handleFocus}\"\n          @blur=\"${this._handleBlur}\"\n          @select=\"${this._handleSelect}\"\n          @selectionchange=\"${this._handleSelectionChange}\"\n        ></textarea>\n        <nys-errormessage\n          ?showError=${this.showError}\n          errorMessage=${this._internals.validationMessage || this.errorMessage}\n        ></nys-errormessage>\n      </label>\n    `;\n  }\n}\n\nif (!customElements.get(\"nys-textarea\")) {\n  customElements.define(\"nys-textarea\", NysTextarea);\n}\n"],"names":["textareaIdCounter","_NysTextarea","_a","LitElement","value","changedProperties","textarea","message","event","form","element","select","html","ifDefined","unsafeCSS","styles","__decorateClass","property","NysTextarea"],"mappings":"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"}
+{"version":3,"file":"nys-textarea.js","sources":["../src/nys-textarea.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } 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-textarea.scss?inline\";\n\nlet textareaIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysTextarea 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 }) 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: Boolean, reflect: true }) inverted = false;\n  @property({ type: String, reflect: true }) form: string | null = null;\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 }) rows = 4;\n  @property({ type: String, reflect: true }) resize: \"vertical\" | \"none\" =\n    \"vertical\";\n  @property({ type: Boolean, reflect: true }) showError = false;\n  @property({ type: String }) errorMessage = \"\";\n\n  async updated(changedProperties: Map<string | number | symbol, unknown>) {\n    await Promise.resolve();\n    if (changedProperties.has(\"rows\")) {\n      this.rows = this.rows ?? 4;\n    }\n  }\n\n  private _hasUserInteracted = false; // need this flag for \"eager mode\"\n  private _internals: ElementInternals;\n\n  // Lifecycle updates\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-textarea-${Date.now()}-${textareaIdCounter++}`;\n    }\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  // This callback is automatically called when the parent form is reset.\n  formResetCallback() {\n    this.value = \"\";\n  }\n\n  // Form Integration\n  private _setValue() {\n    this._internals.setFormValue(this.value);\n    this._manageRequire();\n  }\n\n  private _manageRequire() {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n\n    if (!textarea) return;\n\n    const message = this.errorMessage || \"This field is required\";\n    const isInvalid = this.required && !this.value;\n\n    if (isInvalid) {\n      this._internals.ariaRequired = \"true\";\n      this._internals.setValidity({ valueMissing: true }, message, textarea);\n    } else {\n      this._internals.ariaRequired = \"false\"; // Reset when valid\n      this._internals.setValidity({});\n      this._hasUserInteracted = false; // Reset lazy validation when valid\n    }\n  }\n\n  private _setValidityMessage(message: string = \"\") {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n    if (!textarea) return;\n\n    // Toggle the HTML <div> tag error message\n    this.showError = !!message;\n    // If user sets errorMessage, this will always override the native validation message\n    if (this.errorMessage?.trim() && message !== \"\") {\n      message = this.errorMessage;\n    }\n\n    this._internals.setValidity(\n      message ? { customError: true } : {},\n      message,\n      textarea,\n    );\n  }\n\n  private _validate() {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n    if (!textarea) return;\n\n    // Get the native validation state\n    let message = textarea.validationMessage;\n\n    this._setValidityMessage(message);\n  }\n\n  // Functions\n  // This helper function is called to perform the element's native validation.\n  checkValidity(): boolean {\n    const textarea = this.shadowRoot?.querySelector(\"textarea\");\n    return textarea ? textarea.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 textarea = this.shadowRoot?.querySelector(\"textarea\");\n    if (textarea) {\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          textarea.focus();\n        }\n      } else {\n        // If not part of a form, simply focus.\n        textarea.focus();\n      }\n    }\n  }\n\n  // Event Handlers\n  // Handle input event to check pattern validity\n  private _handleInput(event: Event) {\n    const textarea = event.target as HTMLInputElement;\n    this.value = textarea.value;\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 textarea is invalid, start aggressive mode\n    }\n\n    this._validate();\n    this.dispatchEvent(new Event(\"nys-blur\"));\n  }\n\n  private _handleSelect(e: Event) {\n    const select = e.target as HTMLSelectElement;\n    this.value = select.value;\n    this.dispatchEvent(\n      new CustomEvent(\"nys-select\", {\n        detail: { value: this.value },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _handleSelectionChange(e: Event) {\n    const select = e.target as HTMLSelectElement;\n    this.value = select.value;\n    this.dispatchEvent(\n      new CustomEvent(\"nys-selectionchange\", {\n        detail: { id: this.id, value: this.value },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  render() {\n    return html`\n      <label class=\"nys-textarea\">\n        <nys-label\n          for=${this.id + \"--native\"}\n          label=${this.label}\n          description=${this.description}\n          flag=${this.required ? \"required\" : this.optional ? \"optional\" : \"\"}\n          tooltip=${this.tooltip}\n          ?inverted=${this.inverted}\n        >\n          <slot name=\"description\" slot=\"description\">${this.description}</slot>\n        </nys-label>\n        <textarea\n          class=\"nys-textarea__textarea ${this.resize}\"\n          name=${this.name}\n          id=${this.id + \"--native\"}\n          .value=${this.value}\n          ?disabled=${this.disabled}\n          ?required=${this.required}\n          ?readonly=${this.readonly}\n          aria-disabled=${ifDefined(this.disabled ? \"true\" : undefined)}\n          aria-required=${ifDefined(this.required ? \"true\" : undefined)}\n          aria-label=${ifDefined(this.label || undefined)}\n          aria-description=${ifDefined(this.description || undefined)}\n          placeholder=${ifDefined(\n            this.placeholder ? this.placeholder : undefined,\n          )}\n          maxlength=${ifDefined(this.maxlength ?? undefined)}\n          .rows=${this.rows}\n          form=${ifDefined(this.form || undefined)}\n          @input=${this._handleInput}\n          @focus=\"${this._handleFocus}\"\n          @blur=\"${this._handleBlur}\"\n          @select=\"${this._handleSelect}\"\n          @selectionchange=\"${this._handleSelectionChange}\"\n        ></textarea>\n        <nys-errormessage\n          ?showError=${this.showError}\n          errorMessage=${this._internals.validationMessage || this.errorMessage}\n        ></nys-errormessage>\n      </label>\n    `;\n  }\n}\n\nif (!customElements.get(\"nys-textarea\")) {\n  customElements.define(\"nys-textarea\", NysTextarea);\n}\n"],"names":["textareaIdCounter","_NysTextarea","LitElement","changedProperties","textarea","message","event","form","element","select","html","ifDefined","unsafeCSS","styles","NysTextarea","__decorateClass","property"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nysds/nys-textarea",
-  "version": "1.11.3",
+  "version": "1.12.0",
   "description": "The Textarea component from the NYS Design System.",
   "module": "dist/nys-textarea.js",
   "types": "dist/index.d.ts",
@@ -23,9 +23,9 @@
     "lit-analyze": "lit-analyzer '**/*.ts'"
   },
   "dependencies": {
-    "@nysds/nys-icon": "^1.11.3",
-    "@nysds/nys-label": "^1.11.3",
-    "@nysds/nys-errormessage": "^1.11.3"
+    "@nysds/nys-icon": "^1.12.0",
+    "@nysds/nys-label": "^1.12.0",
+    "@nysds/nys-errormessage": "^1.12.0"
   },
   "devDependencies": {
     "lit": "^3.3.1",