@nysds/nys-radiobutton 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.
- package/dist/nys-radiobutton.js +84 -99
- package/dist/nys-radiobutton.js.map +1 -1
- package/package.json +3 -3
package/dist/nys-radiobutton.js
CHANGED
|
@@ -2,29 +2,20 @@ import { LitElement as _, unsafeCSS as g, html as v } from "lit";
|
|
|
2
2
|
import { property as r, state as m } from "lit/decorators.js";
|
|
3
3
|
import { ifDefined as p } from "lit/directives/if-defined.js";
|
|
4
4
|
const k = `:host{--_nys-radiobutton-size: var(--nys-size-400, 32px);--_nys-radiobutton-border-radius: var(--nys-radius-md, 4px);--_nys-radiobutton-border-width: var(--nys-border-width-md, 2px);--_nys-radiobutton-outline-color: var(--nys-color-focus, #004dd1);--_nys-radiobutton-outline-width: var(--nys-border-width-md, 2px);--_nys-radiobutton-outline-offset: var(--nys-space-2px, 2px);--_nys-radiobutton-gap: var(--nys-space-150, 12px);--_nys-radiogroup-gap: var(--nys-space-200, 16px);--_nys-radiobutton-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-radiobutton-font-size: var(--nys-font-size-ui-md, 16px);--_nys-radiobutton-font-weight--label: var(--nys-font-weight-regular, 400);--_nys-radiobutton-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-radiobutton-color: var( --nys-color-text, var(--nys-color-neutral-900, #1b1b1b) );--_nys-radiobutton-background-color: var(--nys-color-ink-reverse, #ffffff);--_nys-radiobutton-border-color: var(--nys-color-neutral-600, #62666a);--_nys-radiobutton-background-color--hover: var( --nys-color-neutral-50, #ededed );--_nys-radiobutton-border-color--hover: var(--nys-color-ink, #1b1b1b);--_nys-radiobutton-background-color--active: var( --nys-color-neutral-100, #d0d0ce );--_nys-radiobutton-border-color--active: var(--nys-color-ink, #1b1b1b);--_nys-radiobutton-background-color--checked: var( --nys-color-theme, #154973 );--_nys-radiobutton-background-color--disabled: var( --nys-color-ink-reverse, #f0f0f0 );--_nys-radiobutton-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-radiobutton-border-color--disabled: var( --nys-color-neutral-100, #d0d0ce );--_nys-radiobutton-background-color--checked--disabled: var( --nys-color-neutral-100, #d0d0ce );--_nys-radiobutton-border-color--checked--disabled: var( --nys-color-neutral-100, #d0d0ce )}:host([size=sm]){--_nys-radiobutton-size: var(--nys-size-300, 24px);--_nys-radiobutton-border-radius: var(--nys-radius-sm, 2px);--_nys-radiogroup-gap: var(--nys-space-100, 8px);--_nys-radiobutton-gap: var(--nys-space-100, 8px)}:host([size=md]){--_nys-radiobutton-size: var(--nys-size-400, 32px);--_nys-radiobutton-border-radius: var(--nys-radius-md, 4px);--_nys-radiogroup-gap: var(--nys-space-200, 16px);--_nys-radiobutton-gap: var(--nys-space-150, 12px)}:host([tile]){--_nys-radiobutton-font-weight--label: var(--nys-font-weight-semibold, 600);--_nys-radiobutton-border-width--tile: var(--nys-border-width-sm, 1px);--_nys-radiobutton-border-radius--tile: var(--nys-radius-md, 4px);--_nys-radiobutton-border-color--tile: var( --nys-color-neutral-100, #d0d0ce );--_nys-radiobutton-background-color--tile: var( --nys-color-ink-reverse, #ffffff );--_nys-radiobutton-padding--x--tile: var(--nys-space-250, 20px);--_nys-radiobutton-padding--y--tile: var(--nys-space-200, 16px);--_nys-radiobutton-border-color--tile--hover: var( --nys-color-neutral-700, #4a4d4f );--_nys-radiobutton-background-color--tile--hover: var( --nys-color-ink-reverse, #ffffff );--_nys-radiobutton-border-color--tile--active: var( --nys-color-neutral-900, #1b1b1b );--_nys-radiobutton-background-color--tile--active: var( --nys-color-ink-reverse, #ffffff );--_nys-radiobutton-border-color--tile--checked: var( --nys-color-theme-mid, #457aa5 );--_nys-radiobutton-background-color--tile--checked: var( --nys-color-theme-faint, #f7fafd );--_nys-radiobutton-border-color--tile--disabled: var( --nys-color-ink-reverse, #f0f0f0 );--_nys-radiobutton-background-color--tile--disabled: var( --nys-color-neutral-100, #d0d0ce )}:host([tile][size=sm]){--_nys-radiobutton-padding--x--tile: var(--nys-space-200, 16px);--_nys-radiobutton-padding--y--tile: var(--nys-space-150, 12px)}:host([tile][showError]){--_nys-radiobutton-border-color--tile: var(--nys-color-danger, #b52c2c);--_nys-radiobutton-border-color--tile--hover: var( --nys-color-danger, #b52c2c );--_nys-radiobutton-border-color--tile--active: var( --nys-color-danger, #b52c2c );--_nys-radiobutton-border-color--tile--checked: var( --nys-color-danger, #b52c2c )}.nys-radiogroup{display:flex;flex-direction:column;gap:var(--nys-space-200, 16px);font-family:var(--_nys-radiobutton-font-family);font-size:var(--_nys-radiobutton-font-size);line-height:var(--_nys-radiobutton-line-height)}.nys-radiogroup__content{gap:var(--_nys-radiogroup-gap);display:flex;flex-direction:column}.nys-radiobutton{display:flex;align-items:center;font-family:var(--_nys-radiobutton-font-family);font-size:var(--_nys-radiobutton-font-size);line-height:var(--_nys-radiobutton-line-height);border-radius:var(--_nys-radiobutton-border-radius--tile);border:var(--_nys-radiobutton-border-width--tile) solid var(--_nys-radiobutton-border-color--tile);background-color:var(--_nys-radiobutton-background-color--tile);padding:var(--_nys-radiobutton-padding--y--tile) var(--_nys-radiobutton-padding--x--tile)}.nys-radiobutton__radio{appearance:none;width:var(--_nys-radiobutton-size);height:var(--_nys-radiobutton-size);min-width:var(--_nys-radiobutton-size);min-height:var(--_nys-radiobutton-size);max-width:var(--_nys-radiobutton-size);max-height:var(--_nys-radiobutton-size);border:solid var(--_nys-radiobutton-border-width) var(--_nys-radiobutton-border-color);background-color:var(--_nys-radiobutton-background-color);border-radius:100%;background-repeat:no-repeat;background-position:center;background-size:contain;outline-offset:var(--_nys-radiobutton-outline-offset);outline:none;margin:0 0 auto;box-sizing:border-box}.nys-radiobutton:hover,.nys-radiobutton:hover *{cursor:pointer}input:not(:disabled):checked+.nys-radiobutton .nys-radiobutton__radio{background-image:url('data:image/svg+xml;utf8,<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="11" cy="11" r="11" stroke="white" stroke-width="6"/></svg>');background-color:var(--_nys-radiobutton-background-color--checked)}:host([tile]) .nys-radiobutton:has(input:not(:disabled):checked)+.nys-radiobutton .nys-radiobutton__radio{border-color:var(--_nys-radiobutton-border-color--tile--checked);background-color:var(--_nys-radiobutton-background-color--tile--checked)}:host([tile]) .nys-radiobutton:has(input:not(:disabled):checked:hover)+.nys-radiobutton .nys-radiobutton__radio{cursor:default}input:disabled:checked+.nys-radiobutton .nys-radiobutton__radio{background-image:url('data:image/svg+xml;utf8,<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="11" cy="11" r="11" stroke="white" stroke-width="6"/></svg>');border-color:var(--_nys-radiobutton-border-color--checked--disabled);background-color:var(--_nys-radiobutton-background-color--checked--disabled)}:host([tile]) .nys-radiobutton:has(input:disabled:checked)+.nys-radiobutton .nys-radiobutton__radio{border-color:var(--_nys-radiobutton-background-color--tile--disabled);background-color:var(--_nys-radiobutton-border-color--tile--disabled)}input:disabled+.nys-radiobutton,input:disabled+.nys-radiobutton *{cursor:not-allowed}input:disabled+.nys-radiobutton .nys-radiobutton__radio{background-color:var(--_nys-radiobutton-background-color--disabled);border-color:var(--_nys-radiobutton-border-color--disabled);cursor:not-allowed}:host([tile]) .nys-radiobutton:has(input:disabled)+.nys-radiobutton .nys-radiobutton__radio{background-color:var(--_nys-radiobutton-background-color--disabled);border-color:var(--_nys-radiobutton-border-color--disabled);cursor:not-allowed}input:hover:not(:disabled):not(:checked)+.nys-radiobutton .nys-radiobutton__radio{border-color:var(--_nys-radiobutton-border-color--hover);background-color:var(--_nys-radiobutton-background-color--hover)}:host([tile]) .nys-radiobutton:has(input:hover:not(:disabled):not(:checked)+.nys-radiobutton .nys-radiobutton__radio){border-color:var(--_nys-radiobutton-border-color--tile--hover);background-color:var(--_nys-radiobutton-background-color--tile--hover);outline:solid var(--_nys-radiobutton-border-width--tile) var(--_nys-radiobutton-border-color--tile--hover)}input:active:not(:disabled):not(:checked)+.nys-radiobutton .nys-radiobutton__radio{border-color:var(--_nys-radiobutton-border-color--active);background-color:var(--_nys-radiobutton-background-color--active)}:host([tile]) .nys-radiobutton:has(input:active:not(:disabled):not(:checked)+.nys-radiobutton .nys-radiobutton__radio){border-color:var(--_nys-radiobutton-border-color--tile--active);background-color:var(--_nys-radiobutton-background-color--tile--active);outline:solid var(--_nys-radiobutton-border-width--tile) var(--_nys-radiobutton-border-color--tile--active)}:host:focus-visible,:host(.active-focus){outline:solid var(--_nys-radiobutton-outline-width) var(--_nys-radiobutton-outline-color)}.nys-radiobutton>nys-label{--_nys-label-font-weight: var(--_nys-radiobutton-font-weight--label);display:flex;padding-inline-start:var(--_nys-radiobutton-gap)}:host([tile]) .nys-radiobutton>nys-label{--_nys-description-font-style: normal}input:disabled+.nys-radiobutton>nys-label,input:disabled+.nys-radiobutton>nys-label *{cursor:not-allowed;--_nys-label-cursor: not-allowed;--_nys-label-color: var(--_nys-radiobutton-color--disabled);--_nys-description-color: var(--_nys-radiobutton-color--disabled);color:var(--_nys-radiobutton-color--disabled)}fieldset{all:unset;display:contents}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0}`;
|
|
5
|
-
var w = Object.defineProperty,
|
|
6
|
-
for (var
|
|
7
|
-
(
|
|
8
|
-
return
|
|
5
|
+
var w = Object.defineProperty, a = (h, t, e, o) => {
|
|
6
|
+
for (var n = void 0, c = h.length - 1, d; c >= 0; c--)
|
|
7
|
+
(d = h[c]) && (n = d(t, e, n) || n);
|
|
8
|
+
return n && w(t, e, n), n;
|
|
9
9
|
};
|
|
10
|
-
let
|
|
11
|
-
|
|
12
|
-
const a = (h = class extends _ {
|
|
10
|
+
let x = 0;
|
|
11
|
+
const b = class b extends _ {
|
|
13
12
|
// allows use of elementInternals' API
|
|
14
13
|
constructor() {
|
|
15
|
-
super(), this.id = "", this.name = "", this.required = !1, this.optional = !1, this.showError = !1, this.errorMessage = "", this.label = "", this.description = "", this.tile = !1, this.
|
|
16
|
-
}
|
|
17
|
-
get size() {
|
|
18
|
-
return this._size;
|
|
19
|
-
}
|
|
20
|
-
set size(t) {
|
|
21
|
-
this._size = h.VALID_SIZES.includes(
|
|
22
|
-
t
|
|
23
|
-
) ? t : "md";
|
|
14
|
+
super(), this.id = "", this.name = "", this.required = !1, this.optional = !1, this.showError = !1, this.errorMessage = "", this.label = "", this.description = "", this.tile = !1, this.tooltip = "", this.inverted = !1, this.form = null, this.size = "md", this.selectedValue = null, this._slottedDescriptionText = "", this._internals = this.attachInternals();
|
|
24
15
|
}
|
|
25
16
|
// Generate a unique ID if one is not provided
|
|
26
17
|
connectedCallback() {
|
|
27
|
-
super.connectedCallback(), this.id || (this.id = `nys-radiogroup-${Date.now()}-${
|
|
18
|
+
super.connectedCallback(), this.id || (this.id = `nys-radiogroup-${Date.now()}-${x++}`), this.addEventListener("nys-change", this._handleRadioButtonChange), this.addEventListener("invalid", this._handleInvalid);
|
|
28
19
|
}
|
|
29
20
|
disconnectedCallback() {
|
|
30
21
|
super.disconnectedCallback(), this.removeEventListener("nys-change", this._handleRadioButtonChange), this.removeEventListener("invalid", this._handleInvalid);
|
|
@@ -41,7 +32,7 @@ const a = (h = class extends _ {
|
|
|
41
32
|
e.formResetUpdate();
|
|
42
33
|
});
|
|
43
34
|
}
|
|
44
|
-
|
|
35
|
+
// Form Integration
|
|
45
36
|
_setValue() {
|
|
46
37
|
this._internals.setFormValue(this.selectedValue);
|
|
47
38
|
}
|
|
@@ -70,7 +61,7 @@ const a = (h = class extends _ {
|
|
|
70
61
|
const t = this.querySelector("nys-radiobutton[checked]");
|
|
71
62
|
t && (this.selectedValue = t.getAttribute("value"), this._internals.setFormValue(this.selectedValue));
|
|
72
63
|
}
|
|
73
|
-
|
|
64
|
+
// Core Keyboard & Click Logic
|
|
74
65
|
_getAllRadios() {
|
|
75
66
|
return Array.from(
|
|
76
67
|
this.querySelectorAll("nys-radiobutton")
|
|
@@ -87,10 +78,10 @@ const a = (h = class extends _ {
|
|
|
87
78
|
"Enter"
|
|
88
79
|
].includes(t.key)) return;
|
|
89
80
|
t.preventDefault();
|
|
90
|
-
const o = this._getAllRadios().filter((y) => !y.disabled),
|
|
91
|
-
let
|
|
92
|
-
|
|
93
|
-
const f = o[
|
|
81
|
+
const o = this._getAllRadios().filter((y) => !y.disabled), n = o.find((y) => y.checked) || o[0], c = t.key === " " || t.key === "Enter" ? 0 : ["ArrowUp", "ArrowLeft"].includes(t.key) ? -1 : 1;
|
|
82
|
+
let d = o.indexOf(n) + c;
|
|
83
|
+
d < 0 && (d = o.length - 1), d >= o.length && (d = 0);
|
|
84
|
+
const f = o[d];
|
|
94
85
|
(await f.getInputElement())?.click(), this._updateGroupTabIndex(), f.focus();
|
|
95
86
|
}
|
|
96
87
|
_updateGroupTabIndex() {
|
|
@@ -99,7 +90,7 @@ const a = (h = class extends _ {
|
|
|
99
90
|
o.disabled ? o.tabIndex = -1 : o.tabIndex = o === e ? 0 : -1, o.setAttribute("aria-checked", o.checked ? "true" : "false"), o.setAttribute("aria-disabled", o.disabled ? "true" : "false"), o.setAttribute("aria-required", this.required ? "true" : "false");
|
|
100
91
|
});
|
|
101
92
|
}
|
|
102
|
-
|
|
93
|
+
// Functions
|
|
103
94
|
// Apply ARIA & initial tabindex to each child radio
|
|
104
95
|
_initializeChildAttributes() {
|
|
105
96
|
this._getAllRadios().forEach((e) => {
|
|
@@ -139,11 +130,11 @@ const a = (h = class extends _ {
|
|
|
139
130
|
)?.assignedNodes({ flatten: !0 }) || [];
|
|
140
131
|
this._slottedDescriptionText = e.map((o) => o.textContent?.trim()).filter(Boolean).join(", ");
|
|
141
132
|
}
|
|
142
|
-
|
|
133
|
+
// Event Handlers
|
|
143
134
|
// Keeps radiogroup informed of the name and value of its current selected radiobutton at each change
|
|
144
135
|
_handleRadioButtonChange(t) {
|
|
145
|
-
const e = t, { name: o, value:
|
|
146
|
-
this.name = o, this.selectedValue =
|
|
136
|
+
const e = t, { name: o, value: n } = e.detail;
|
|
137
|
+
this.name = o, this.selectedValue = n, this._internals.setFormValue(this.selectedValue), this._updateGroupTabIndex();
|
|
147
138
|
}
|
|
148
139
|
async _handleInvalid(t) {
|
|
149
140
|
if (t.preventDefault(), this._internals.validity.valueMissing) {
|
|
@@ -154,7 +145,7 @@ const a = (h = class extends _ {
|
|
|
154
145
|
if (e) {
|
|
155
146
|
const o = this._internals.form;
|
|
156
147
|
o ? Array.from(o.elements).find(
|
|
157
|
-
(
|
|
148
|
+
(d) => typeof d.checkValidity == "function" && !d.checkValidity()
|
|
158
149
|
) === this && (e.focus(), e.classList.add("active-focus")) : (e.focus(), e.classList.add("active-focus"));
|
|
159
150
|
}
|
|
160
151
|
}
|
|
@@ -162,10 +153,11 @@ const a = (h = class extends _ {
|
|
|
162
153
|
render() {
|
|
163
154
|
return v`<div class="nys-radiogroup">
|
|
164
155
|
<nys-label
|
|
156
|
+
for=${this.id + "--native"}
|
|
165
157
|
label=${this.label}
|
|
166
158
|
description=${this.description}
|
|
167
159
|
flag=${this.required ? "required" : this.optional ? "optional" : ""}
|
|
168
|
-
|
|
160
|
+
tooltip=${this.tooltip}
|
|
169
161
|
?inverted=${this.inverted}
|
|
170
162
|
>
|
|
171
163
|
<slot name="description" slot="description">${this.description}</slot>
|
|
@@ -185,72 +177,65 @@ const a = (h = class extends _ {
|
|
|
185
177
|
></nys-errormessage>
|
|
186
178
|
</div>`;
|
|
187
179
|
}
|
|
188
|
-
}
|
|
189
|
-
|
|
180
|
+
};
|
|
181
|
+
b.styles = g(k), b.formAssociated = !0;
|
|
182
|
+
let s = b;
|
|
183
|
+
a([
|
|
190
184
|
r({ type: String, reflect: !0 })
|
|
191
|
-
],
|
|
192
|
-
|
|
185
|
+
], s.prototype, "id");
|
|
186
|
+
a([
|
|
193
187
|
r({ type: String, reflect: !0 })
|
|
194
|
-
],
|
|
195
|
-
|
|
188
|
+
], s.prototype, "name");
|
|
189
|
+
a([
|
|
196
190
|
r({ type: Boolean, reflect: !0 })
|
|
197
|
-
],
|
|
198
|
-
|
|
191
|
+
], s.prototype, "required");
|
|
192
|
+
a([
|
|
199
193
|
r({ type: Boolean, reflect: !0 })
|
|
200
|
-
],
|
|
201
|
-
|
|
194
|
+
], s.prototype, "optional");
|
|
195
|
+
a([
|
|
202
196
|
r({ type: Boolean, reflect: !0 })
|
|
203
|
-
],
|
|
204
|
-
|
|
197
|
+
], s.prototype, "showError");
|
|
198
|
+
a([
|
|
205
199
|
r({ type: String })
|
|
206
|
-
],
|
|
207
|
-
|
|
200
|
+
], s.prototype, "errorMessage");
|
|
201
|
+
a([
|
|
208
202
|
r({ type: String })
|
|
209
|
-
],
|
|
210
|
-
|
|
203
|
+
], s.prototype, "label");
|
|
204
|
+
a([
|
|
211
205
|
r({ type: String })
|
|
212
|
-
],
|
|
213
|
-
|
|
206
|
+
], s.prototype, "description");
|
|
207
|
+
a([
|
|
214
208
|
r({ type: Boolean, reflect: !0 })
|
|
215
|
-
],
|
|
216
|
-
|
|
209
|
+
], s.prototype, "tile");
|
|
210
|
+
a([
|
|
217
211
|
r({ type: String })
|
|
218
|
-
],
|
|
219
|
-
|
|
212
|
+
], s.prototype, "tooltip");
|
|
213
|
+
a([
|
|
220
214
|
r({ type: Boolean, reflect: !0 })
|
|
221
|
-
],
|
|
222
|
-
|
|
215
|
+
], s.prototype, "inverted");
|
|
216
|
+
a([
|
|
217
|
+
r({ type: String, reflect: !0 })
|
|
218
|
+
], s.prototype, "form");
|
|
219
|
+
a([
|
|
223
220
|
r({ type: String, reflect: !0 })
|
|
224
|
-
],
|
|
225
|
-
|
|
221
|
+
], s.prototype, "size");
|
|
222
|
+
a([
|
|
226
223
|
m()
|
|
227
|
-
],
|
|
228
|
-
|
|
224
|
+
], s.prototype, "selectedValue");
|
|
225
|
+
a([
|
|
229
226
|
m()
|
|
230
|
-
],
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
var S = Object.defineProperty, B = Object.getOwnPropertyDescriptor, u = (b, t, e, o) => {
|
|
237
|
-
for (var s = o > 1 ? void 0 : o ? B(t, e) : t, c = b.length - 1, n; c >= 0; c--)
|
|
238
|
-
(n = b[c]) && (s = (o ? n(t, e, s) : n(s)) || s);
|
|
239
|
-
return o && s && S(t, e, s), s;
|
|
227
|
+
], s.prototype, "_slottedDescriptionText");
|
|
228
|
+
customElements.get("nys-radiogroup") || customElements.define("nys-radiogroup", s);
|
|
229
|
+
var E = Object.defineProperty, u = (h, t, e, o) => {
|
|
230
|
+
for (var n = void 0, c = h.length - 1, d; c >= 0; c--)
|
|
231
|
+
(d = h[c]) && (n = d(t, e, n) || n);
|
|
232
|
+
return n && E(t, e, n), n;
|
|
240
233
|
};
|
|
241
|
-
let
|
|
234
|
+
let A = 0;
|
|
242
235
|
var i;
|
|
243
236
|
const l = (i = class extends _ {
|
|
244
237
|
constructor() {
|
|
245
|
-
super(...arguments), this.checked = !1, this.disabled = !1, this.required = !1, this.label = "", this.description = "", this.id = "", this.name = "", this.value = "", this.inverted = !1, this.form = null, this.
|
|
246
|
-
}
|
|
247
|
-
get size() {
|
|
248
|
-
return this._size;
|
|
249
|
-
}
|
|
250
|
-
set size(t) {
|
|
251
|
-
this._size = i.VALID_SIZES.includes(
|
|
252
|
-
t
|
|
253
|
-
) ? t : "md";
|
|
238
|
+
super(...arguments), this.checked = !1, this.disabled = !1, this.required = !1, this.label = "", this.description = "", this.id = "", this.name = "", this.value = "", this.inverted = !1, this.form = null, this.size = "md", this.tile = !1;
|
|
254
239
|
}
|
|
255
240
|
async getInputElement() {
|
|
256
241
|
return await this.updateComplete, this.shadowRoot?.querySelector("input") || null;
|
|
@@ -259,10 +244,10 @@ const l = (i = class extends _ {
|
|
|
259
244
|
formResetUpdate() {
|
|
260
245
|
this.checked = !1;
|
|
261
246
|
}
|
|
262
|
-
|
|
247
|
+
// Lifecycle updates
|
|
263
248
|
// Generate a unique ID if one is not provided
|
|
264
249
|
connectedCallback() {
|
|
265
|
-
super.connectedCallback(), this.id || (this.id = `nys-radiobutton-${Date.now()}-${
|
|
250
|
+
super.connectedCallback(), this.id || (this.id = `nys-radiobutton-${Date.now()}-${A++}`), this.checked && (i.buttonGroup[this.name] && (i.buttonGroup[this.name].checked = !1, i.buttonGroup[this.name].requestUpdate()), i.buttonGroup[this.name] = this), this.addEventListener("focus", this._handleFocus), this.addEventListener("blur", this._handleBlur), this.addEventListener("click", this._handleChange);
|
|
266
251
|
}
|
|
267
252
|
disconnectedCallback() {
|
|
268
253
|
super.disconnectedCallback(), this.removeEventListener("focus", this._handleFocus), this.removeEventListener("blur", this._handleBlur);
|
|
@@ -270,7 +255,7 @@ const l = (i = class extends _ {
|
|
|
270
255
|
updated(t) {
|
|
271
256
|
t.has("checked") && this.checked && i.buttonGroup[this.name] !== this && (i.buttonGroup[this.name] && (i.buttonGroup[this.name].checked = !1, i.buttonGroup[this.name].requestUpdate()), i.buttonGroup[this.name] = this);
|
|
272
257
|
}
|
|
273
|
-
|
|
258
|
+
// Functions
|
|
274
259
|
// This helper function is called to perform the element's native validation.
|
|
275
260
|
checkValidity() {
|
|
276
261
|
if (this.required && !this.checked)
|
|
@@ -278,7 +263,7 @@ const l = (i = class extends _ {
|
|
|
278
263
|
const t = this.shadowRoot?.querySelector("input");
|
|
279
264
|
return t ? t.checkValidity() : !0;
|
|
280
265
|
}
|
|
281
|
-
|
|
266
|
+
// Event Handlers
|
|
282
267
|
_emitChangeEvent() {
|
|
283
268
|
this.dispatchEvent(
|
|
284
269
|
new CustomEvent("nys-change", {
|
|
@@ -342,47 +327,47 @@ const l = (i = class extends _ {
|
|
|
342
327
|
</div>
|
|
343
328
|
`;
|
|
344
329
|
}
|
|
345
|
-
}, i.styles = g(k), i.
|
|
330
|
+
}, i.styles = g(k), i.buttonGroup = {}, i);
|
|
346
331
|
u([
|
|
347
332
|
r({ type: Boolean, reflect: !0 })
|
|
348
|
-
], l.prototype, "checked"
|
|
333
|
+
], l.prototype, "checked");
|
|
349
334
|
u([
|
|
350
335
|
r({ type: Boolean, reflect: !0 })
|
|
351
|
-
], l.prototype, "disabled"
|
|
336
|
+
], l.prototype, "disabled");
|
|
352
337
|
u([
|
|
353
338
|
r({ type: Boolean, reflect: !0 })
|
|
354
|
-
], l.prototype, "required"
|
|
339
|
+
], l.prototype, "required");
|
|
355
340
|
u([
|
|
356
341
|
r({ type: String })
|
|
357
|
-
], l.prototype, "label"
|
|
342
|
+
], l.prototype, "label");
|
|
358
343
|
u([
|
|
359
344
|
r({ type: String })
|
|
360
|
-
], l.prototype, "description"
|
|
345
|
+
], l.prototype, "description");
|
|
361
346
|
u([
|
|
362
347
|
r({ type: String, reflect: !0 })
|
|
363
|
-
], l.prototype, "id"
|
|
348
|
+
], l.prototype, "id");
|
|
364
349
|
u([
|
|
365
350
|
r({ type: String, reflect: !0 })
|
|
366
|
-
], l.prototype, "name"
|
|
351
|
+
], l.prototype, "name");
|
|
367
352
|
u([
|
|
368
353
|
r({ type: String })
|
|
369
|
-
], l.prototype, "value"
|
|
354
|
+
], l.prototype, "value");
|
|
370
355
|
u([
|
|
371
356
|
r({ type: Boolean, reflect: !0 })
|
|
372
|
-
], l.prototype, "inverted"
|
|
357
|
+
], l.prototype, "inverted");
|
|
373
358
|
u([
|
|
374
359
|
r({ type: String, reflect: !0 })
|
|
375
|
-
], l.prototype, "form"
|
|
360
|
+
], l.prototype, "form");
|
|
376
361
|
u([
|
|
377
|
-
r({ reflect: !0 })
|
|
378
|
-
], l.prototype, "size"
|
|
362
|
+
r({ type: String, reflect: !0 })
|
|
363
|
+
], l.prototype, "size");
|
|
379
364
|
u([
|
|
380
365
|
r({ type: Boolean, reflect: !0 })
|
|
381
|
-
], l.prototype, "tile"
|
|
382
|
-
let
|
|
383
|
-
customElements.get("nys-radiobutton") || customElements.define("nys-radiobutton",
|
|
366
|
+
], l.prototype, "tile");
|
|
367
|
+
let B = l;
|
|
368
|
+
customElements.get("nys-radiobutton") || customElements.define("nys-radiobutton", B);
|
|
384
369
|
export {
|
|
385
|
-
|
|
386
|
-
|
|
370
|
+
B as NysRadiobutton,
|
|
371
|
+
s as NysRadiogroup
|
|
387
372
|
};
|
|
388
373
|
//# sourceMappingURL=nys-radiobutton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nys-radiobutton.js","sources":["../src/nys-radiogroup.ts","../src/nys-radiobutton.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport type { NysRadiobutton } from \"./nys-radiobutton\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-radiobutton.scss?inline\";\n\nlet radiogroupIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysRadiogroup extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\"; // while not use by users, this prop is needed for internalElement form logic\n @property({ type: Boolean, reflect: true }) required = false;\n @property({ type: Boolean, reflect: true }) optional = false;\n @property({ type: Boolean, reflect: true }) showError = false;\n @property({ type: String }) errorMessage = \"\";\n @property({ type: String }) label = \"\";\n @property({ type: String }) description = \"\";\n @property({ type: Boolean, reflect: true }) tile = 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\n @state() private selectedValue: string | null = null;\n @state() private _slottedDescriptionText = \"\";\n private static readonly VALID_SIZES = [\"sm\", \"md\"] as const;\n private _size: (typeof NysRadiogroup.VALID_SIZES)[number] = \"md\";\n\n // Getter and setter for the `size` property.\n @property({ reflect: true })\n get size(): (typeof NysRadiogroup.VALID_SIZES)[number] {\n return this._size;\n }\n\n set size(value: string) {\n // Check if the provided value is in VALID_WIDTHS. If not, default to \"full\".\n this._size = NysRadiogroup.VALID_SIZES.includes(\n value as (typeof NysRadiogroup.VALID_SIZES)[number],\n )\n ? (value as (typeof NysRadiogroup.VALID_SIZES)[number])\n : \"md\";\n }\n\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-radiogroup-${Date.now()}-${radiogroupIdCounter++}`;\n }\n this.addEventListener(\"nys-change\", this._handleRadioButtonChange);\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"nys-change\", this._handleRadioButtonChange);\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n async firstUpdated() {\n await this.updateComplete;\n this._initializeCheckedRadioValue();\n this._setValue(); // This ensures our element always participates in the form\n this._setRadioButtonRequire();\n this._updateRadioButtonsSize();\n this._updateRadioButtonsTile();\n this._updateRadioButtonsShowError();\n this._getSlotDescriptionForAria();\n\n this._initializeChildAttributes();\n this._updateGroupTabIndex();\n }\n\n updated(changedProperties: Map<string | symbol, unknown>) {\n if (\n changedProperties.has(\"required\") ||\n changedProperties.has(\"selectedValue\")\n ) {\n this._manageRequire();\n }\n if (changedProperties.has(\"size\")) {\n this._updateRadioButtonsSize();\n }\n if (changedProperties.has(\"tile\")) {\n this._updateRadioButtonsTile();\n }\n if (changedProperties.has(\"inverted\")) {\n this._updateRadioButtonsInvert();\n }\n if (changedProperties.has(\"showError\")) {\n this._updateRadioButtonsShowError();\n }\n if (changedProperties.has(\"form\")) {\n this._updateRadioButtonsForm();\n }\n }\n\n // This callback is automatically called when the parent form is reset.\n formResetCallback() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n (radioButton as NysRadiobutton).formResetUpdate();\n });\n }\n\n /********************** Form Integration **********************/\n private _setValue() {\n this._internals.setFormValue(this.selectedValue);\n }\n\n // Updates the \"require\" attribute of the first radiobutton underneath a radiogroup.\n // This will make sure there's a requirement for all radiobutton under the same name/group\n private _setRadioButtonRequire() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton, index) => {\n if (this.required && index === 0) {\n radioButton.setAttribute(\"required\", \"required\");\n }\n });\n }\n\n private async _manageRequire() {\n const message = this.errorMessage || \"Please select an option.\";\n\n const radioButtons = Array.from(this.querySelectorAll(\"nys-radiobutton\"));\n const firstRadio = radioButtons[0] as HTMLElement;\n\n if (firstRadio) {\n if (this.required && !this.selectedValue) {\n this._internals.setValidity(\n { valueMissing: true },\n message,\n firstRadio, // pass the custom element, not shadow input\n );\n } else {\n this.showError = false;\n this._internals.setValidity({}, \"\", firstRadio);\n }\n }\n }\n\n checkValidity() {\n const radioButtons = Array.from(this.querySelectorAll(\"nys-radiobutton\"));\n const valid =\n !this.required ||\n radioButtons.some((radio) => (radio as NysRadiobutton).checked);\n return valid;\n }\n\n // Need to account for if radiogroup already have a radiobutton checked at initialization\n private _initializeCheckedRadioValue() {\n const checkedRadio = this.querySelector(\"nys-radiobutton[checked]\");\n if (checkedRadio) {\n this.selectedValue = checkedRadio.getAttribute(\"value\");\n this._internals.setFormValue(this.selectedValue);\n }\n }\n\n /********************** Core Keyboard & Click Logic **********************/\n private _getAllRadios() {\n return Array.from(\n this.querySelectorAll(\"nys-radiobutton\"),\n ) as NysRadiobutton[];\n }\n\n // Arrow / Space / Enter navigation at group level\n private async _handleKeyDown(event: KeyboardEvent) {\n const keys = [\n \"ArrowUp\",\n \"ArrowDown\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \" \",\n \"Enter\",\n ];\n\n if (!keys.includes(event.key)) return;\n event.preventDefault();\n\n const radioBtns = this._getAllRadios().filter((radio) => !radio.disabled);\n const checkedRadio =\n radioBtns.find((radio) => radio.checked) || radioBtns[0];\n\n // Computing the new index based on the keydown event\n const increment =\n event.key === \" \" || event.key === \"Enter\"\n ? 0\n : [\"ArrowUp\", \"ArrowLeft\"].includes(event.key)\n ? -1\n : 1;\n\n let index = radioBtns.indexOf(checkedRadio) + increment;\n // Handles the wrap around ends if user is at first or last radiobutton\n if (index < 0) {\n index = radioBtns.length - 1;\n }\n if (index >= radioBtns.length) {\n index = 0;\n }\n\n // The target is the new radiobutton the user want to choose given the keydown type.\n // We let the target's <input/> dispatch the clickEvent and call _handleRadioButtonChange() directly to make form integration work\n const target = radioBtns[index];\n const input = await target.getInputElement();\n input?.click();\n\n this._updateGroupTabIndex();\n target.focus();\n }\n\n private _updateGroupTabIndex() {\n const radios = this._getAllRadios();\n const active = radios.find((radio) => radio.checked) || radios[0]; // If none checked, make first radiobutton tabbable\n\n radios.forEach((radio) => {\n if (radio.disabled) {\n radio.tabIndex = -1;\n } else {\n radio.tabIndex = radio === active ? 0 : -1;\n }\n\n // Need to update ARIA state due to the new tabindex\n radio.setAttribute(\"aria-checked\", radio.checked ? \"true\" : \"false\");\n radio.setAttribute(\"aria-disabled\", radio.disabled ? \"true\" : \"false\");\n radio.setAttribute(\"aria-required\", this.required ? \"true\" : \"false\");\n });\n }\n\n /********************** Functions **********************/\n // Apply ARIA & initial tabindex to each child radio\n private _initializeChildAttributes() {\n const radios = this._getAllRadios();\n radios.forEach((radio) => {\n radio.setAttribute(\"role\", \"radio\");\n radio.setAttribute(\"aria-checked\", String(radio.checked));\n radio.setAttribute(\"aria-required\", String(radio.required));\n radio.setAttribute(\"aria-disabled\", String(radio.disabled));\n radio.setAttribute(\"tabindex\", \"-1\");\n });\n }\n\n // Updates the size of each radiobutton underneath a radiogroup to ensure size standardization\n private _updateRadioButtonsSize() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n radioButton.setAttribute(\"size\", this.size);\n });\n }\n\n private _updateRadioButtonsTile() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.tile) {\n radioButton.toggleAttribute(\"tile\", true);\n } else {\n radioButton.removeAttribute(\"tile\");\n }\n });\n }\n\n private _updateRadioButtonsInvert() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.inverted) {\n radioButton.toggleAttribute(\"inverted\", true);\n } else {\n radioButton.removeAttribute(\"inverted\");\n }\n });\n }\n\n private _updateRadioButtonsShowError() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.showError) {\n radioButton.setAttribute(\"showError\", \"\");\n } else {\n radioButton.removeAttribute(\"showError\");\n }\n });\n }\n\n private _updateRadioButtonsForm() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.showError) {\n if (this.form !== null) {\n radioButton.setAttribute(\"form\", this.form);\n } else {\n radioButton.removeAttribute(\"form\");\n }\n } else {\n radioButton.removeAttribute(\"form\");\n }\n });\n }\n\n // Get the slotted text contents so native VO can attempt to announce it within the legend in the fieldset\n private _getSlotDescriptionForAria() {\n const slot = this.shadowRoot?.querySelector(\n 'slot[name=\"description\"]',\n ) as HTMLSlotElement;\n const nodes = slot?.assignedNodes({ flatten: true }) || [];\n\n this._slottedDescriptionText = nodes\n .map((node) => node.textContent?.trim())\n .filter(Boolean)\n .join(\", \");\n }\n\n /******************** Event Handlers ********************/\n // Keeps radiogroup informed of the name and value of its current selected radiobutton at each change\n private _handleRadioButtonChange(event: Event) {\n const customEvent = event as CustomEvent;\n const { name, value } = customEvent.detail;\n\n this.name = name;\n this.selectedValue = value;\n this._internals.setFormValue(this.selectedValue);\n\n // Accounts for tabindex & ARIA on every click/space select\n this._updateGroupTabIndex();\n }\n\n private async _handleInvalid(event: Event) {\n event.preventDefault();\n\n // Check if the radio group is invalid and set `showError` accordingly\n if (this._internals.validity.valueMissing) {\n this.showError = true;\n this._manageRequire(); // Refresh validation message\n\n const firstRadio = this.querySelector(\n \"nys-radiobutton\",\n ) as NysRadiobutton;\n\n if (firstRadio) {\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\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 firstRadio.focus();\n firstRadio.classList.add(\"active-focus\"); // Needed to show focus outline; will be removed if user clicks to select\n }\n } else {\n // If not part of a form, simply focus.\n firstRadio.focus();\n firstRadio.classList.add(\"active-focus\");\n }\n }\n }\n }\n\n render() {\n return html`<div class=\"nys-radiogroup\">\n <nys-label\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 <div class=\"nys-radiogroup__content\">\n <fieldset role=\"radiogroup\" @keydown=${this._handleKeyDown}>\n <legend class=\"sr-only\">\n ${this.label}${this._slottedDescriptionText\n ? ` ${this._slottedDescriptionText}`\n : this.description\n ? ` ${this.description}`\n : \"\"}\n </legend>\n <slot></slot>\n </fieldset>\n </div>\n <nys-errormessage\n ?showError=${this.showError}\n errorMessage=${this._internals.validationMessage || this.errorMessage}\n .showDivider=${!this.tile}\n ></nys-errormessage>\n </div>`;\n }\n}\n\nif (!customElements.get(\"nys-radiogroup\")) {\n customElements.define(\"nys-radiogroup\", NysRadiogroup);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport \"./nys-radiogroup\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-radiobutton.scss?inline\";\n\nlet radiobuttonIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysRadiobutton extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: Boolean, reflect: true }) checked = false;\n @property({ type: Boolean, reflect: true }) disabled = false;\n @property({ type: Boolean, reflect: true }) required = false;\n @property({ type: String }) label = \"\";\n @property({ type: String }) description = \"\";\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: String }) value = \"\";\n @property({ type: Boolean, reflect: true }) inverted = false;\n @property({ type: String, reflect: true }) form: string | null = null;\n private static readonly VALID_SIZES = [\"sm\", \"md\"] as const;\n private _size: (typeof NysRadiobutton.VALID_SIZES)[number] = \"md\";\n\n // Getter and setter for the `size` property.\n @property({ reflect: true })\n get size(): (typeof NysRadiobutton.VALID_SIZES)[number] {\n return this._size;\n }\n\n set size(value: string) {\n // Check if the provided value is in VALID_SIZES. If not, default to \"md\".\n this._size = NysRadiobutton.VALID_SIZES.includes(\n value as (typeof NysRadiobutton.VALID_SIZES)[number],\n )\n ? (value as (typeof NysRadiobutton.VALID_SIZES)[number])\n : \"md\";\n }\n @property({ type: Boolean, reflect: true }) tile = false;\n\n public async getInputElement(): Promise<HTMLInputElement | null> {\n await this.updateComplete; // Wait for the component to finish rendering\n return this.shadowRoot?.querySelector(\"input\") || null;\n }\n\n // This callback is automatically called when the parent form is reset.\n public formResetUpdate() {\n this.checked = false;\n }\n\n static buttonGroup: Record<string, NysRadiobutton> = {};\n\n /********************** Lifecycle updates **********************/\n // Generate a unique ID if one is not provided\n connectedCallback() {\n super.connectedCallback();\n if (!this.id) {\n this.id = `nys-radiobutton-${Date.now()}-${radiobuttonIdCounter++}`;\n }\n\n // If this button is initially checked, set it as the current button in its group\n if (this.checked) {\n if (NysRadiobutton.buttonGroup[this.name]) {\n NysRadiobutton.buttonGroup[this.name].checked = false;\n NysRadiobutton.buttonGroup[this.name].requestUpdate();\n }\n NysRadiobutton.buttonGroup[this.name] = this;\n }\n\n this.addEventListener(\"focus\", this._handleFocus);\n this.addEventListener(\"blur\", this._handleBlur);\n this.addEventListener(\"click\", this._handleChange);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n this.removeEventListener(\"focus\", this._handleFocus);\n this.removeEventListener(\"blur\", this._handleBlur);\n }\n\n updated(changedProperties: Map<string | number | symbol, unknown>) {\n // When \"checked\" changes, update the internals.\n if (changedProperties.has(\"checked\")) {\n // Ensure only one radiobutton per group is checked.\n if (this.checked && NysRadiobutton.buttonGroup[this.name] !== this) {\n if (NysRadiobutton.buttonGroup[this.name]) {\n NysRadiobutton.buttonGroup[this.name].checked = false;\n NysRadiobutton.buttonGroup[this.name].requestUpdate();\n }\n NysRadiobutton.buttonGroup[this.name] = this;\n }\n }\n }\n\n /********************** Functions **********************/\n // This helper function is called to perform the element's native validation.\n checkValidity(): boolean {\n // If the radiogroup is required but no radio is selected, return false.\n if (this.required && !this.checked) {\n return false;\n }\n\n // Otherwise, optionally check the native input's validity if available.\n const input = this.shadowRoot?.querySelector(\"input\");\n return input ? input.checkValidity() : true;\n }\n\n /******************** Event Handlers ********************/\n private _emitChangeEvent() {\n this.dispatchEvent(\n new CustomEvent(\"nys-change\", {\n detail: {\n id: this.id,\n checked: this.checked,\n name: this.name,\n value: this.value,\n },\n bubbles: true,\n composed: true,\n }),\n );\n }\n\n // Handle radiobutton change event & unselection of other options in group\n private _handleChange() {\n // Remove active-focus so the focus outline doesn't linger\n // when the user selects a choice, since form focus is no longer needed\n this.classList.remove(\"active-focus\");\n\n if (!this.checked && !this.disabled) {\n if (NysRadiobutton.buttonGroup[this.name]) {\n NysRadiobutton.buttonGroup[this.name].checked = false;\n NysRadiobutton.buttonGroup[this.name].requestUpdate();\n }\n\n NysRadiobutton.buttonGroup[this.name] = this;\n this.checked = true;\n\n // Dispatch a change event with the name and value\n this._emitChangeEvent();\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 this.classList.remove(\"active-focus\"); // removing this classList so the focus ring for handleInvalid() at radiogroup level will disappear\n this.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n private _callInputHandling() {\n if (this.disabled) return;\n\n // Find the hidden input and trigger a click to toggle selection\n const input = this.shadowRoot?.querySelector(\n 'input[type=\"radio\"]',\n ) as HTMLInputElement;\n\n if (input) {\n input.focus();\n input.click();\n }\n }\n\n render() {\n return html`\n <input\n type=\"radio\"\n name=\"${ifDefined(this.name ? this.name : undefined)}\"\n .checked=${this.checked}\n ?disabled=${this.disabled}\n .value=${this.value}\n ?required=\"${this.required}\"\n form=${ifDefined(this.form || undefined)}\n @change=\"${this._handleChange}\"\n hidden\n aria-hidden=\"true\"\n />\n <div\n class=\"nys-radiobutton\"\n @click=\"${this._callInputHandling}\"\n aria-label=${this.label}\n >\n <span class=\"nys-radiobutton__radio\"></span>\n ${this.label &&\n html`<nys-label\n label=${this.label}\n description=${ifDefined(this.description || undefined)}\n ?inverted=${this.inverted}\n >\n <slot name=\"description\" slot=\"description\">${this.description}</slot>\n </nys-label> `}\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-radiobutton\")) {\n customElements.define(\"nys-radiobutton\", NysRadiobutton);\n}\n"],"names":["radiogroupIdCounter","_NysRadiogroup","_a","LitElement","value","changedProperties","radioButton","index","message","firstRadio","radioButtons","radio","checkedRadio","event","radioBtns","increment","target","radios","active","nodes","node","customEvent","name","form","element","html","unsafeCSS","styles","__decorateClass","property","state","NysRadiogroup","radiobuttonIdCounter","_NysRadiobutton","input","ifDefined","NysRadiobutton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"nys-radiobutton.js","sources":["../src/nys-radiogroup.ts","../src/nys-radiobutton.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport type { NysRadiobutton } from \"./nys-radiobutton\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-radiobutton.scss?inline\";\n\nlet radiogroupIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysRadiogroup extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\"; // while not use by users, this prop is needed for internalElement form logic\n @property({ type: Boolean, reflect: true }) required = false;\n @property({ type: Boolean, reflect: true }) optional = false;\n @property({ type: Boolean, reflect: true }) showError = false;\n @property({ type: String }) errorMessage = \"\";\n @property({ type: String }) label = \"\";\n @property({ type: String }) description = \"\";\n @property({ type: Boolean, reflect: true }) tile = 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: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n\n @state() private selectedValue: string | null = null;\n @state() private _slottedDescriptionText = \"\";\n\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-radiogroup-${Date.now()}-${radiogroupIdCounter++}`;\n }\n this.addEventListener(\"nys-change\", this._handleRadioButtonChange);\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"nys-change\", this._handleRadioButtonChange);\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n async firstUpdated() {\n await this.updateComplete;\n this._initializeCheckedRadioValue();\n this._setValue(); // This ensures our element always participates in the form\n this._setRadioButtonRequire();\n this._updateRadioButtonsSize();\n this._updateRadioButtonsTile();\n this._updateRadioButtonsShowError();\n this._getSlotDescriptionForAria();\n\n this._initializeChildAttributes();\n this._updateGroupTabIndex();\n }\n\n updated(changedProperties: Map<string | symbol, unknown>) {\n if (\n changedProperties.has(\"required\") ||\n changedProperties.has(\"selectedValue\")\n ) {\n this._manageRequire();\n }\n if (changedProperties.has(\"size\")) {\n this._updateRadioButtonsSize();\n }\n if (changedProperties.has(\"tile\")) {\n this._updateRadioButtonsTile();\n }\n if (changedProperties.has(\"inverted\")) {\n this._updateRadioButtonsInvert();\n }\n if (changedProperties.has(\"showError\")) {\n this._updateRadioButtonsShowError();\n }\n if (changedProperties.has(\"form\")) {\n this._updateRadioButtonsForm();\n }\n }\n\n // This callback is automatically called when the parent form is reset.\n formResetCallback() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n (radioButton as NysRadiobutton).formResetUpdate();\n });\n }\n\n // Form Integration\n private _setValue() {\n this._internals.setFormValue(this.selectedValue);\n }\n\n // Updates the \"require\" attribute of the first radiobutton underneath a radiogroup.\n // This will make sure there's a requirement for all radiobutton under the same name/group\n private _setRadioButtonRequire() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton, index) => {\n if (this.required && index === 0) {\n radioButton.setAttribute(\"required\", \"required\");\n }\n });\n }\n\n private async _manageRequire() {\n const message = this.errorMessage || \"Please select an option.\";\n\n const radioButtons = Array.from(this.querySelectorAll(\"nys-radiobutton\"));\n const firstRadio = radioButtons[0] as HTMLElement;\n\n if (firstRadio) {\n if (this.required && !this.selectedValue) {\n this._internals.setValidity(\n { valueMissing: true },\n message,\n firstRadio, // pass the custom element, not shadow input\n );\n } else {\n this.showError = false;\n this._internals.setValidity({}, \"\", firstRadio);\n }\n }\n }\n\n checkValidity() {\n const radioButtons = Array.from(this.querySelectorAll(\"nys-radiobutton\"));\n const valid =\n !this.required ||\n radioButtons.some((radio) => (radio as NysRadiobutton).checked);\n return valid;\n }\n\n // Need to account for if radiogroup already have a radiobutton checked at initialization\n private _initializeCheckedRadioValue() {\n const checkedRadio = this.querySelector(\"nys-radiobutton[checked]\");\n if (checkedRadio) {\n this.selectedValue = checkedRadio.getAttribute(\"value\");\n this._internals.setFormValue(this.selectedValue);\n }\n }\n\n // Core Keyboard & Click Logic\n private _getAllRadios() {\n return Array.from(\n this.querySelectorAll(\"nys-radiobutton\"),\n ) as NysRadiobutton[];\n }\n\n // Arrow / Space / Enter navigation at group level\n private async _handleKeyDown(event: KeyboardEvent) {\n const keys = [\n \"ArrowUp\",\n \"ArrowDown\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \" \",\n \"Enter\",\n ];\n\n if (!keys.includes(event.key)) return;\n event.preventDefault();\n\n const radioBtns = this._getAllRadios().filter((radio) => !radio.disabled);\n const checkedRadio =\n radioBtns.find((radio) => radio.checked) || radioBtns[0];\n\n // Computing the new index based on the keydown event\n const increment =\n event.key === \" \" || event.key === \"Enter\"\n ? 0\n : [\"ArrowUp\", \"ArrowLeft\"].includes(event.key)\n ? -1\n : 1;\n\n let index = radioBtns.indexOf(checkedRadio) + increment;\n // Handles the wrap around ends if user is at first or last radiobutton\n if (index < 0) {\n index = radioBtns.length - 1;\n }\n if (index >= radioBtns.length) {\n index = 0;\n }\n\n // The target is the new radiobutton the user want to choose given the keydown type.\n // We let the target's <input/> dispatch the clickEvent and call _handleRadioButtonChange() directly to make form integration work\n const target = radioBtns[index];\n const input = await target.getInputElement();\n input?.click();\n\n this._updateGroupTabIndex();\n target.focus();\n }\n\n private _updateGroupTabIndex() {\n const radios = this._getAllRadios();\n const active = radios.find((radio) => radio.checked) || radios[0]; // If none checked, make first radiobutton tabbable\n\n radios.forEach((radio) => {\n if (radio.disabled) {\n radio.tabIndex = -1;\n } else {\n radio.tabIndex = radio === active ? 0 : -1;\n }\n\n // Need to update ARIA state due to the new tabindex\n radio.setAttribute(\"aria-checked\", radio.checked ? \"true\" : \"false\");\n radio.setAttribute(\"aria-disabled\", radio.disabled ? \"true\" : \"false\");\n radio.setAttribute(\"aria-required\", this.required ? \"true\" : \"false\");\n });\n }\n\n // Functions\n // Apply ARIA & initial tabindex to each child radio\n private _initializeChildAttributes() {\n const radios = this._getAllRadios();\n radios.forEach((radio) => {\n radio.setAttribute(\"role\", \"radio\");\n radio.setAttribute(\"aria-checked\", String(radio.checked));\n radio.setAttribute(\"aria-required\", String(radio.required));\n radio.setAttribute(\"aria-disabled\", String(radio.disabled));\n radio.setAttribute(\"tabindex\", \"-1\");\n });\n }\n\n // Updates the size of each radiobutton underneath a radiogroup to ensure size standardization\n private _updateRadioButtonsSize() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n radioButton.setAttribute(\"size\", this.size);\n });\n }\n\n private _updateRadioButtonsTile() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.tile) {\n radioButton.toggleAttribute(\"tile\", true);\n } else {\n radioButton.removeAttribute(\"tile\");\n }\n });\n }\n\n private _updateRadioButtonsInvert() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.inverted) {\n radioButton.toggleAttribute(\"inverted\", true);\n } else {\n radioButton.removeAttribute(\"inverted\");\n }\n });\n }\n\n private _updateRadioButtonsShowError() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.showError) {\n radioButton.setAttribute(\"showError\", \"\");\n } else {\n radioButton.removeAttribute(\"showError\");\n }\n });\n }\n\n private _updateRadioButtonsForm() {\n const radioButtons = this.querySelectorAll(\"nys-radiobutton\");\n radioButtons.forEach((radioButton) => {\n if (this.showError) {\n if (this.form !== null) {\n radioButton.setAttribute(\"form\", this.form);\n } else {\n radioButton.removeAttribute(\"form\");\n }\n } else {\n radioButton.removeAttribute(\"form\");\n }\n });\n }\n\n // Get the slotted text contents so native VO can attempt to announce it within the legend in the fieldset\n private _getSlotDescriptionForAria() {\n const slot = this.shadowRoot?.querySelector(\n 'slot[name=\"description\"]',\n ) as HTMLSlotElement;\n const nodes = slot?.assignedNodes({ flatten: true }) || [];\n\n this._slottedDescriptionText = nodes\n .map((node) => node.textContent?.trim())\n .filter(Boolean)\n .join(\", \");\n }\n\n // Event Handlers\n // Keeps radiogroup informed of the name and value of its current selected radiobutton at each change\n private _handleRadioButtonChange(event: Event) {\n const customEvent = event as CustomEvent;\n const { name, value } = customEvent.detail;\n\n this.name = name;\n this.selectedValue = value;\n this._internals.setFormValue(this.selectedValue);\n\n // Accounts for tabindex & ARIA on every click/space select\n this._updateGroupTabIndex();\n }\n\n private async _handleInvalid(event: Event) {\n event.preventDefault();\n\n // Check if the radio group is invalid and set `showError` accordingly\n if (this._internals.validity.valueMissing) {\n this.showError = true;\n this._manageRequire(); // Refresh validation message\n\n const firstRadio = this.querySelector(\n \"nys-radiobutton\",\n ) as NysRadiobutton;\n\n if (firstRadio) {\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\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 firstRadio.focus();\n firstRadio.classList.add(\"active-focus\"); // Needed to show focus outline; will be removed if user clicks to select\n }\n } else {\n // If not part of a form, simply focus.\n firstRadio.focus();\n firstRadio.classList.add(\"active-focus\");\n }\n }\n }\n }\n\n render() {\n return html`<div class=\"nys-radiogroup\">\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 <div class=\"nys-radiogroup__content\">\n <fieldset role=\"radiogroup\" @keydown=${this._handleKeyDown}>\n <legend class=\"sr-only\">\n ${this.label}${this._slottedDescriptionText\n ? ` ${this._slottedDescriptionText}`\n : this.description\n ? ` ${this.description}`\n : \"\"}\n </legend>\n <slot></slot>\n </fieldset>\n </div>\n <nys-errormessage\n ?showError=${this.showError}\n errorMessage=${this._internals.validationMessage || this.errorMessage}\n .showDivider=${!this.tile}\n ></nys-errormessage>\n </div>`;\n }\n}\n\nif (!customElements.get(\"nys-radiogroup\")) {\n customElements.define(\"nys-radiogroup\", NysRadiogroup);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport \"./nys-radiogroup\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-radiobutton.scss?inline\";\n\nlet radiobuttonIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysRadiobutton extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: Boolean, reflect: true }) checked = false;\n @property({ type: Boolean, reflect: true }) disabled = false;\n @property({ type: Boolean, reflect: true }) required = false;\n @property({ type: String }) label = \"\";\n @property({ type: String }) description = \"\";\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: String }) value = \"\";\n @property({ type: Boolean, reflect: true }) inverted = false;\n @property({ type: String, reflect: true }) form: string | null = null;\n @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n @property({ type: Boolean, reflect: true }) tile = false;\n\n public async getInputElement(): Promise<HTMLInputElement | null> {\n await this.updateComplete; // Wait for the component to finish rendering\n return this.shadowRoot?.querySelector(\"input\") || null;\n }\n\n // This callback is automatically called when the parent form is reset.\n public formResetUpdate() {\n this.checked = false;\n }\n\n static buttonGroup: Record<string, NysRadiobutton> = {};\n\n // Lifecycle updates\n // Generate a unique ID if one is not provided\n connectedCallback() {\n super.connectedCallback();\n if (!this.id) {\n this.id = `nys-radiobutton-${Date.now()}-${radiobuttonIdCounter++}`;\n }\n\n // If this button is initially checked, set it as the current button in its group\n if (this.checked) {\n if (NysRadiobutton.buttonGroup[this.name]) {\n NysRadiobutton.buttonGroup[this.name].checked = false;\n NysRadiobutton.buttonGroup[this.name].requestUpdate();\n }\n NysRadiobutton.buttonGroup[this.name] = this;\n }\n\n this.addEventListener(\"focus\", this._handleFocus);\n this.addEventListener(\"blur\", this._handleBlur);\n this.addEventListener(\"click\", this._handleChange);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n this.removeEventListener(\"focus\", this._handleFocus);\n this.removeEventListener(\"blur\", this._handleBlur);\n }\n\n updated(changedProperties: Map<string | number | symbol, unknown>) {\n // When \"checked\" changes, update the internals.\n if (changedProperties.has(\"checked\")) {\n // Ensure only one radiobutton per group is checked.\n if (this.checked && NysRadiobutton.buttonGroup[this.name] !== this) {\n if (NysRadiobutton.buttonGroup[this.name]) {\n NysRadiobutton.buttonGroup[this.name].checked = false;\n NysRadiobutton.buttonGroup[this.name].requestUpdate();\n }\n NysRadiobutton.buttonGroup[this.name] = this;\n }\n }\n }\n\n // Functions\n // This helper function is called to perform the element's native validation.\n checkValidity(): boolean {\n // If the radiogroup is required but no radio is selected, return false.\n if (this.required && !this.checked) {\n return false;\n }\n\n // Otherwise, optionally check the native input's validity if available.\n const input = this.shadowRoot?.querySelector(\"input\");\n return input ? input.checkValidity() : true;\n }\n\n // Event Handlers\n private _emitChangeEvent() {\n this.dispatchEvent(\n new CustomEvent(\"nys-change\", {\n detail: {\n id: this.id,\n checked: this.checked,\n name: this.name,\n value: this.value,\n },\n bubbles: true,\n composed: true,\n }),\n );\n }\n\n // Handle radiobutton change event & unselection of other options in group\n private _handleChange() {\n // Remove active-focus so the focus outline doesn't linger\n // when the user selects a choice, since form focus is no longer needed\n this.classList.remove(\"active-focus\");\n\n if (!this.checked && !this.disabled) {\n if (NysRadiobutton.buttonGroup[this.name]) {\n NysRadiobutton.buttonGroup[this.name].checked = false;\n NysRadiobutton.buttonGroup[this.name].requestUpdate();\n }\n\n NysRadiobutton.buttonGroup[this.name] = this;\n this.checked = true;\n\n // Dispatch a change event with the name and value\n this._emitChangeEvent();\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 this.classList.remove(\"active-focus\"); // removing this classList so the focus ring for handleInvalid() at radiogroup level will disappear\n this.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n private _callInputHandling() {\n if (this.disabled) return;\n\n // Find the hidden input and trigger a click to toggle selection\n const input = this.shadowRoot?.querySelector(\n 'input[type=\"radio\"]',\n ) as HTMLInputElement;\n\n if (input) {\n input.focus();\n input.click();\n }\n }\n\n render() {\n return html`\n <input\n type=\"radio\"\n name=\"${ifDefined(this.name ? this.name : undefined)}\"\n .checked=${this.checked}\n ?disabled=${this.disabled}\n .value=${this.value}\n ?required=\"${this.required}\"\n form=${ifDefined(this.form || undefined)}\n @change=\"${this._handleChange}\"\n hidden\n aria-hidden=\"true\"\n />\n <div\n class=\"nys-radiobutton\"\n @click=\"${this._callInputHandling}\"\n aria-label=${this.label}\n >\n <span class=\"nys-radiobutton__radio\"></span>\n ${this.label &&\n html`<nys-label\n label=${this.label}\n description=${ifDefined(this.description || undefined)}\n ?inverted=${this.inverted}\n >\n <slot name=\"description\" slot=\"description\">${this.description}</slot>\n </nys-label> `}\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-radiobutton\")) {\n customElements.define(\"nys-radiobutton\", NysRadiobutton);\n}\n"],"names":["radiogroupIdCounter","_NysRadiogroup","LitElement","changedProperties","radioButton","index","message","firstRadio","radioButtons","radio","checkedRadio","event","radioBtns","increment","target","radios","active","nodes","node","customEvent","name","value","form","element","html","unsafeCSS","styles","NysRadiogroup","__decorateClass","property","state","radiobuttonIdCounter","_NysRadiobutton","_a","input","ifDefined","NysRadiobutton"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nysds/nys-radiobutton",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.12.0",
|
|
4
4
|
"description": "The Radiobutton component from the NYS Design System.",
|
|
5
5
|
"module": "dist/nys-radiobutton.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
"lit-analyze": "lit-analyzer '**/*.ts'"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@nysds/nys-label": "^1.
|
|
27
|
-
"@nysds/nys-errormessage": "^1.
|
|
26
|
+
"@nysds/nys-label": "^1.12.0",
|
|
27
|
+
"@nysds/nys-errormessage": "^1.12.0"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
30
30
|
"lit": "^3.3.1",
|