@nysds/nys-textarea 1.11.4 → 1.12.0

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.
@@ -1,33 +1,24 @@
1
1
  import { LitElement as y, unsafeCSS as u, html as p } from "lit";
2
2
  import { property as a } from "lit/decorators.js";
3
- import { ifDefined as l } from "lit/directives/if-defined.js";
3
+ import { ifDefined as o } from "lit/directives/if-defined.js";
4
4
  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}';
5
- var f = Object.defineProperty, x = Object.getOwnPropertyDescriptor, s = (c, e, t, o) => {
6
- for (var n = o > 1 ? void 0 : o ? x(e, t) : e, h = c.length - 1, d; h >= 0; h--)
7
- (d = c[h]) && (n = (o ? d(e, t, n) : d(n)) || n);
8
- return o && n && f(e, t, n), n;
5
+ var f = Object.defineProperty, s = (c, e, r, l) => {
6
+ for (var i = void 0, d = c.length - 1, n; d >= 0; d--)
7
+ (n = c[d]) && (i = n(e, r, i) || i);
8
+ return i && f(e, r, i), i;
9
9
  };
10
- let _ = 0;
11
- var i;
12
- const r = (i = class extends y {
10
+ let x = 0;
11
+ const h = class h extends y {
13
12
  // allows use of elementInternals' API
14
13
  constructor() {
15
- 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();
16
- }
17
- get resize() {
18
- return this._resize;
19
- }
20
- set resize(e) {
21
- this._resize = i.VALID_RESIZE.includes(
22
- e
23
- ) ? e : "vertical";
14
+ 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();
24
15
  }
25
16
  async updated(e) {
26
- 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);
17
+ await Promise.resolve(), e.has("rows") && (this.rows = this.rows ?? 4);
27
18
  }
28
19
  // Generate a unique ID if one is not provided
29
20
  connectedCallback() {
30
- super.connectedCallback(), this.id || (this.id = `nys-textarea-${Date.now()}-${_++}`), this.addEventListener("invalid", this._handleInvalid);
21
+ super.connectedCallback(), this.id || (this.id = `nys-textarea-${Date.now()}-${x++}`), this.addEventListener("invalid", this._handleInvalid);
31
22
  }
32
23
  disconnectedCallback() {
33
24
  super.disconnectedCallback(), this.removeEventListener("invalid", this._handleInvalid);
@@ -39,31 +30,31 @@ const r = (i = class extends y {
39
30
  formResetCallback() {
40
31
  this.value = "";
41
32
  }
42
- /********************** Form Integration **********************/
33
+ // Form Integration
43
34
  _setValue() {
44
35
  this._internals.setFormValue(this.value), this._manageRequire();
45
36
  }
46
37
  _manageRequire() {
47
38
  const e = this.shadowRoot?.querySelector("textarea");
48
39
  if (!e) return;
49
- const t = this.errorMessage || "This field is required";
50
- 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);
40
+ const r = this.errorMessage || "This field is required";
41
+ 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);
51
42
  }
52
43
  _setValidityMessage(e = "") {
53
- const t = this.shadowRoot?.querySelector("textarea");
54
- t && (this.showError = !!e, this.errorMessage?.trim() && e !== "" && (e = this.errorMessage), this._internals.setValidity(
44
+ const r = this.shadowRoot?.querySelector("textarea");
45
+ r && (this.showError = !!e, this.errorMessage?.trim() && e !== "" && (e = this.errorMessage), this._internals.setValidity(
55
46
  e ? { customError: !0 } : {},
56
47
  e,
57
- t
48
+ r
58
49
  ));
59
50
  }
60
51
  _validate() {
61
52
  const e = this.shadowRoot?.querySelector("textarea");
62
53
  if (!e) return;
63
- let t = e.validationMessage;
64
- this._setValidityMessage(t);
54
+ let r = e.validationMessage;
55
+ this._setValidityMessage(r);
65
56
  }
66
- /********************** Functions **********************/
57
+ // Functions
67
58
  // This helper function is called to perform the element's native validation.
68
59
  checkValidity() {
69
60
  const e = this.shadowRoot?.querySelector("textarea");
@@ -71,19 +62,19 @@ const r = (i = class extends y {
71
62
  }
72
63
  _handleInvalid(e) {
73
64
  e.preventDefault(), this._hasUserInteracted = !0, this._validate();
74
- const t = this.shadowRoot?.querySelector("textarea");
75
- if (t) {
76
- const o = this._internals.form;
77
- o ? Array.from(o.elements).find(
78
- (d) => typeof d.checkValidity == "function" && !d.checkValidity()
79
- ) === this && t.focus() : t.focus();
65
+ const r = this.shadowRoot?.querySelector("textarea");
66
+ if (r) {
67
+ const l = this._internals.form;
68
+ l ? Array.from(l.elements).find(
69
+ (n) => typeof n.checkValidity == "function" && !n.checkValidity()
70
+ ) === this && r.focus() : r.focus();
80
71
  }
81
72
  }
82
- /******************** Event Handlers ********************/
73
+ // Event Handlers
83
74
  // Handle input event to check pattern validity
84
75
  _handleInput(e) {
85
- const t = e.target;
86
- this.value = t.value, this._internals.setFormValue(this.value), this._hasUserInteracted && this._validate(), this.dispatchEvent(
76
+ const r = e.target;
77
+ this.value = r.value, this._internals.setFormValue(this.value), this._hasUserInteracted && this._validate(), this.dispatchEvent(
87
78
  new CustomEvent("nys-input", {
88
79
  detail: { id: this.id, value: this.value },
89
80
  bubbles: !0,
@@ -100,8 +91,8 @@ const r = (i = class extends y {
100
91
  this._hasUserInteracted || (this._hasUserInteracted = !0), this._validate(), this.dispatchEvent(new Event("nys-blur"));
101
92
  }
102
93
  _handleSelect(e) {
103
- const t = e.target;
104
- this.value = t.value, this.dispatchEvent(
94
+ const r = e.target;
95
+ this.value = r.value, this.dispatchEvent(
105
96
  new CustomEvent("nys-select", {
106
97
  detail: { value: this.value },
107
98
  bubbles: !0,
@@ -110,8 +101,8 @@ const r = (i = class extends y {
110
101
  );
111
102
  }
112
103
  _handleSelectionChange(e) {
113
- const t = e.target;
114
- this.value = t.value, this.dispatchEvent(
104
+ const r = e.target;
105
+ this.value = r.value, this.dispatchEvent(
115
106
  new CustomEvent("nys-selectionchange", {
116
107
  detail: { id: this.id, value: this.value },
117
108
  bubbles: !0,
@@ -127,7 +118,7 @@ const r = (i = class extends y {
127
118
  label=${this.label}
128
119
  description=${this.description}
129
120
  flag=${this.required ? "required" : this.optional ? "optional" : ""}
130
- _tooltip=${this._tooltip}
121
+ tooltip=${this.tooltip}
131
122
  ?inverted=${this.inverted}
132
123
  >
133
124
  <slot name="description" slot="description">${this.description}</slot>
@@ -140,16 +131,16 @@ const r = (i = class extends y {
140
131
  ?disabled=${this.disabled}
141
132
  ?required=${this.required}
142
133
  ?readonly=${this.readonly}
143
- aria-disabled=${l(this.disabled ? "true" : void 0)}
144
- aria-required=${l(this.required ? "true" : void 0)}
145
- aria-label=${l(this.label || void 0)}
146
- aria-description=${l(this.description || void 0)}
147
- placeholder=${l(
134
+ aria-disabled=${o(this.disabled ? "true" : void 0)}
135
+ aria-required=${o(this.required ? "true" : void 0)}
136
+ aria-label=${o(this.label || void 0)}
137
+ aria-description=${o(this.description || void 0)}
138
+ placeholder=${o(
148
139
  this.placeholder ? this.placeholder : void 0
149
140
  )}
150
- maxlength=${l(this.maxlength ?? void 0)}
141
+ maxlength=${o(this.maxlength ?? void 0)}
151
142
  .rows=${this.rows}
152
- form=${l(this.form || void 0)}
143
+ form=${o(this.form || void 0)}
153
144
  @input=${this._handleInput}
154
145
  @focus="${this._handleFocus}"
155
146
  @blur="${this._handleBlur}"
@@ -163,67 +154,68 @@ const r = (i = class extends y {
163
154
  </label>
164
155
  `;
165
156
  }
166
- }, i.styles = u(v), i.VALID_WIDTHS = ["sm", "md", "lg", "full"], i.VALID_RESIZE = ["vertical", "none"], i.formAssociated = !0, i);
157
+ };
158
+ h.styles = u(v), h.formAssociated = !0;
159
+ let t = h;
167
160
  s([
168
161
  a({ type: String, reflect: !0 })
169
- ], r.prototype, "id", 2);
162
+ ], t.prototype, "id");
170
163
  s([
171
164
  a({ type: String, reflect: !0 })
172
- ], r.prototype, "name", 2);
165
+ ], t.prototype, "name");
173
166
  s([
174
167
  a({ type: String })
175
- ], r.prototype, "label", 2);
168
+ ], t.prototype, "label");
176
169
  s([
177
170
  a({ type: String })
178
- ], r.prototype, "description", 2);
171
+ ], t.prototype, "description");
179
172
  s([
180
173
  a({ type: String })
181
- ], r.prototype, "placeholder", 2);
174
+ ], t.prototype, "placeholder");
182
175
  s([
183
176
  a({ type: String })
184
- ], r.prototype, "value", 2);
177
+ ], t.prototype, "value");
185
178
  s([
186
179
  a({ type: Boolean, reflect: !0 })
187
- ], r.prototype, "disabled", 2);
180
+ ], t.prototype, "disabled");
188
181
  s([
189
182
  a({ type: Boolean, reflect: !0 })
190
- ], r.prototype, "readonly", 2);
183
+ ], t.prototype, "readonly");
191
184
  s([
192
185
  a({ type: Boolean, reflect: !0 })
193
- ], r.prototype, "required", 2);
186
+ ], t.prototype, "required");
194
187
  s([
195
188
  a({ type: Boolean, reflect: !0 })
196
- ], r.prototype, "optional", 2);
189
+ ], t.prototype, "optional");
197
190
  s([
198
191
  a({ type: String })
199
- ], r.prototype, "_tooltip", 2);
192
+ ], t.prototype, "tooltip");
200
193
  s([
201
194
  a({ type: Boolean, reflect: !0 })
202
- ], r.prototype, "inverted", 2);
195
+ ], t.prototype, "inverted");
203
196
  s([
204
197
  a({ type: String, reflect: !0 })
205
- ], r.prototype, "form", 2);
198
+ ], t.prototype, "form");
206
199
  s([
207
200
  a({ type: Number })
208
- ], r.prototype, "maxlength", 2);
201
+ ], t.prototype, "maxlength");
209
202
  s([
210
- a({ reflect: !0 })
211
- ], r.prototype, "width", 2);
203
+ a({ type: String, reflect: !0 })
204
+ ], t.prototype, "width");
212
205
  s([
213
206
  a({ type: Number })
214
- ], r.prototype, "rows", 2);
207
+ ], t.prototype, "rows");
215
208
  s([
216
- a({ reflect: !0 })
217
- ], r.prototype, "resize", 1);
209
+ a({ type: String, reflect: !0 })
210
+ ], t.prototype, "resize");
218
211
  s([
219
212
  a({ type: Boolean, reflect: !0 })
220
- ], r.prototype, "showError", 2);
213
+ ], t.prototype, "showError");
221
214
  s([
222
215
  a({ type: String })
223
- ], r.prototype, "errorMessage", 2);
224
- let b = r;
225
- customElements.get("nys-textarea") || customElements.define("nys-textarea", b);
216
+ ], t.prototype, "errorMessage");
217
+ customElements.get("nys-textarea") || customElements.define("nys-textarea", t);
226
218
  export {
227
- b as NysTextarea
219
+ t as NysTextarea
228
220
  };
229
221
  //# sourceMappingURL=nys-textarea.js.map
@@ -1 +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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"}
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 @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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nysds/nys-textarea",
3
- "version": "1.11.4",
3
+ "version": "1.12.0",
4
4
  "description": "The Textarea component from the NYS Design System.",
5
5
  "module": "dist/nys-textarea.js",
6
6
  "types": "dist/index.d.ts",
@@ -23,9 +23,9 @@
23
23
  "lit-analyze": "lit-analyzer '**/*.ts'"
24
24
  },
25
25
  "dependencies": {
26
- "@nysds/nys-icon": "^1.11.4",
27
- "@nysds/nys-label": "^1.11.4",
28
- "@nysds/nys-errormessage": "^1.11.4"
26
+ "@nysds/nys-icon": "^1.12.0",
27
+ "@nysds/nys-label": "^1.12.0",
28
+ "@nysds/nys-errormessage": "^1.12.0"
29
29
  },
30
30
  "devDependencies": {
31
31
  "lit": "^3.3.1",