@nysds/nys-radiobutton 1.6.0 → 1.8.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.d.ts +3 -2
- package/dist/nys-radiobutton.js +423 -350
- package/dist/nys-radiobutton.js.map +1 -1
- package/dist/nys-radiogroup.d.ts +12 -3
- package/package.json +3 -3
package/dist/nys-radiobutton.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { css as
|
|
1
|
+
import { css as pt, LitElement as rt, html as j } from "lit";
|
|
2
2
|
/*!
|
|
3
3
|
* ▒█▄░▒█ ▒█░░▒█ ▒█▀▀▀█ ▒█▀▀▄ ▒█▀▀▀█
|
|
4
4
|
* ▒█▒█▒█ ▒█▄▄▄█ ░▀▀▀▄▄ ▒█░▒█ ░▀▀▀▄▄
|
|
@@ -14,7 +14,7 @@ import { css as ut, LitElement as it, html as j } from "lit";
|
|
|
14
14
|
* Copyright 2019 Google LLC
|
|
15
15
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
16
16
|
*/
|
|
17
|
-
const O = globalThis,
|
|
17
|
+
const O = globalThis, F = O.ShadowRoot && (O.ShadyCSS === void 0 || O.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, nt = Symbol(), K = /* @__PURE__ */ new WeakMap();
|
|
18
18
|
let bt = class {
|
|
19
19
|
constructor(t, e, o) {
|
|
20
20
|
if (this._$cssResult$ = !0, o !== nt) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
|
|
@@ -23,7 +23,7 @@ let bt = class {
|
|
|
23
23
|
get styleSheet() {
|
|
24
24
|
let t = this.o;
|
|
25
25
|
const e = this.t;
|
|
26
|
-
if (
|
|
26
|
+
if (F && t === void 0) {
|
|
27
27
|
const o = e !== void 0 && e.length === 1;
|
|
28
28
|
o && (t = K.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), o && K.set(e, t));
|
|
29
29
|
}
|
|
@@ -33,26 +33,26 @@ let bt = class {
|
|
|
33
33
|
return this.cssText;
|
|
34
34
|
}
|
|
35
35
|
};
|
|
36
|
-
const
|
|
37
|
-
if (
|
|
36
|
+
const yt = (r) => new bt(typeof r == "string" ? r : r + "", void 0, nt), _t = (r, t) => {
|
|
37
|
+
if (F) r.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
|
|
38
38
|
else for (const e of t) {
|
|
39
|
-
const o = document.createElement("style"),
|
|
40
|
-
|
|
39
|
+
const o = document.createElement("style"), i = O.litNonce;
|
|
40
|
+
i !== void 0 && o.setAttribute("nonce", i), o.textContent = e.cssText, r.appendChild(o);
|
|
41
41
|
}
|
|
42
|
-
}, J =
|
|
42
|
+
}, J = F ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((t) => {
|
|
43
43
|
let e = "";
|
|
44
44
|
for (const o of t.cssRules) e += o.cssText;
|
|
45
|
-
return
|
|
45
|
+
return yt(e);
|
|
46
46
|
})(r) : r;
|
|
47
47
|
/**
|
|
48
48
|
* @license
|
|
49
49
|
* Copyright 2017 Google LLC
|
|
50
50
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
51
51
|
*/
|
|
52
|
-
const { is:
|
|
52
|
+
const { is: ft, defineProperty: vt, getOwnPropertyDescriptor: gt, getOwnPropertyNames: mt, getOwnPropertySymbols: $t, getPrototypeOf: At } = Object, w = globalThis, Y = w.trustedTypes, wt = Y ? Y.emptyScript : "", N = w.reactiveElementPolyfillSupport, P = (r, t) => r, H = { toAttribute(r, t) {
|
|
53
53
|
switch (t) {
|
|
54
54
|
case Boolean:
|
|
55
|
-
r = r ?
|
|
55
|
+
r = r ? wt : null;
|
|
56
56
|
break;
|
|
57
57
|
case Object:
|
|
58
58
|
case Array:
|
|
@@ -77,7 +77,7 @@ const { is: _t, defineProperty: ft, getOwnPropertyDescriptor: vt, getOwnProperty
|
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
79
|
return e;
|
|
80
|
-
} },
|
|
80
|
+
} }, W = (r, t) => !ft(r, t), Q = { attribute: !0, type: String, converter: H, reflect: !1, hasChanged: W };
|
|
81
81
|
Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), w.litPropertyMetadata ?? (w.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
|
|
82
82
|
class C extends HTMLElement {
|
|
83
83
|
static addInitializer(t) {
|
|
@@ -86,48 +86,48 @@ class C extends HTMLElement {
|
|
|
86
86
|
static get observedAttributes() {
|
|
87
87
|
return this.finalize(), this._$Eh && [...this._$Eh.keys()];
|
|
88
88
|
}
|
|
89
|
-
static createProperty(t, e =
|
|
89
|
+
static createProperty(t, e = Q) {
|
|
90
90
|
if (e.state && (e.attribute = !1), this._$Ei(), this.elementProperties.set(t, e), !e.noAccessor) {
|
|
91
|
-
const o = Symbol(),
|
|
92
|
-
|
|
91
|
+
const o = Symbol(), i = this.getPropertyDescriptor(t, o, e);
|
|
92
|
+
i !== void 0 && vt(this.prototype, t, i);
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
95
|
static getPropertyDescriptor(t, e, o) {
|
|
96
|
-
const { get:
|
|
96
|
+
const { get: i, set: n } = gt(this.prototype, t) ?? { get() {
|
|
97
97
|
return this[e];
|
|
98
|
-
}, set(
|
|
99
|
-
this[e] =
|
|
98
|
+
}, set(s) {
|
|
99
|
+
this[e] = s;
|
|
100
100
|
} };
|
|
101
101
|
return { get() {
|
|
102
|
-
return
|
|
103
|
-
}, set(
|
|
104
|
-
const d =
|
|
105
|
-
n.call(this,
|
|
102
|
+
return i == null ? void 0 : i.call(this);
|
|
103
|
+
}, set(s) {
|
|
104
|
+
const d = i == null ? void 0 : i.call(this);
|
|
105
|
+
n.call(this, s), this.requestUpdate(t, d, o);
|
|
106
106
|
}, configurable: !0, enumerable: !0 };
|
|
107
107
|
}
|
|
108
108
|
static getPropertyOptions(t) {
|
|
109
|
-
return this.elementProperties.get(t) ??
|
|
109
|
+
return this.elementProperties.get(t) ?? Q;
|
|
110
110
|
}
|
|
111
111
|
static _$Ei() {
|
|
112
|
-
if (this.hasOwnProperty(
|
|
113
|
-
const t =
|
|
112
|
+
if (this.hasOwnProperty(P("elementProperties"))) return;
|
|
113
|
+
const t = At(this);
|
|
114
114
|
t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
|
|
115
115
|
}
|
|
116
116
|
static finalize() {
|
|
117
|
-
if (this.hasOwnProperty(
|
|
118
|
-
if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(
|
|
119
|
-
const e = this.properties, o = [...
|
|
120
|
-
for (const
|
|
117
|
+
if (this.hasOwnProperty(P("finalized"))) return;
|
|
118
|
+
if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(P("properties"))) {
|
|
119
|
+
const e = this.properties, o = [...mt(e), ...$t(e)];
|
|
120
|
+
for (const i of o) this.createProperty(i, e[i]);
|
|
121
121
|
}
|
|
122
122
|
const t = this[Symbol.metadata];
|
|
123
123
|
if (t !== null) {
|
|
124
124
|
const e = litPropertyMetadata.get(t);
|
|
125
|
-
if (e !== void 0) for (const [o,
|
|
125
|
+
if (e !== void 0) for (const [o, i] of e) this.elementProperties.set(o, i);
|
|
126
126
|
}
|
|
127
127
|
this._$Eh = /* @__PURE__ */ new Map();
|
|
128
128
|
for (const [e, o] of this.elementProperties) {
|
|
129
|
-
const
|
|
130
|
-
|
|
129
|
+
const i = this._$Eu(e, o);
|
|
130
|
+
i !== void 0 && this._$Eh.set(i, e);
|
|
131
131
|
}
|
|
132
132
|
this.elementStyles = this.finalizeStyles(this.styles);
|
|
133
133
|
}
|
|
@@ -135,7 +135,7 @@ class C extends HTMLElement {
|
|
|
135
135
|
const e = [];
|
|
136
136
|
if (Array.isArray(t)) {
|
|
137
137
|
const o = new Set(t.flat(1 / 0).reverse());
|
|
138
|
-
for (const
|
|
138
|
+
for (const i of o) e.unshift(J(i));
|
|
139
139
|
} else t !== void 0 && e.push(J(t));
|
|
140
140
|
return e;
|
|
141
141
|
}
|
|
@@ -165,7 +165,7 @@ class C extends HTMLElement {
|
|
|
165
165
|
}
|
|
166
166
|
createRenderRoot() {
|
|
167
167
|
const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
|
|
168
|
-
return
|
|
168
|
+
return _t(t, this.constructor.elementStyles), t;
|
|
169
169
|
}
|
|
170
170
|
connectedCallback() {
|
|
171
171
|
var t;
|
|
@@ -188,23 +188,23 @@ class C extends HTMLElement {
|
|
|
188
188
|
}
|
|
189
189
|
_$EC(t, e) {
|
|
190
190
|
var n;
|
|
191
|
-
const o = this.constructor.elementProperties.get(t),
|
|
192
|
-
if (
|
|
193
|
-
const
|
|
194
|
-
this._$Em = t,
|
|
191
|
+
const o = this.constructor.elementProperties.get(t), i = this.constructor._$Eu(t, o);
|
|
192
|
+
if (i !== void 0 && o.reflect === !0) {
|
|
193
|
+
const s = (((n = o.converter) == null ? void 0 : n.toAttribute) !== void 0 ? o.converter : H).toAttribute(e, o.type);
|
|
194
|
+
this._$Em = t, s == null ? this.removeAttribute(i) : this.setAttribute(i, s), this._$Em = null;
|
|
195
195
|
}
|
|
196
196
|
}
|
|
197
197
|
_$AK(t, e) {
|
|
198
198
|
var n;
|
|
199
|
-
const o = this.constructor,
|
|
200
|
-
if (
|
|
201
|
-
const
|
|
202
|
-
this._$Em =
|
|
199
|
+
const o = this.constructor, i = o._$Eh.get(t);
|
|
200
|
+
if (i !== void 0 && this._$Em !== i) {
|
|
201
|
+
const s = o.getPropertyOptions(i), d = typeof s.converter == "function" ? { fromAttribute: s.converter } : ((n = s.converter) == null ? void 0 : n.fromAttribute) !== void 0 ? s.converter : H;
|
|
202
|
+
this._$Em = i, this[i] = d.fromAttribute(e, s.type), this._$Em = null;
|
|
203
203
|
}
|
|
204
204
|
}
|
|
205
205
|
requestUpdate(t, e, o) {
|
|
206
206
|
if (t !== void 0) {
|
|
207
|
-
if (o ?? (o = this.constructor.getPropertyOptions(t)), !(o.hasChanged ??
|
|
207
|
+
if (o ?? (o = this.constructor.getPropertyOptions(t)), !(o.hasChanged ?? W)(this[t], e)) return;
|
|
208
208
|
this.P(t, e, o);
|
|
209
209
|
}
|
|
210
210
|
this.isUpdatePending === !1 && (this._$ES = this._$ET());
|
|
@@ -230,21 +230,21 @@ class C extends HTMLElement {
|
|
|
230
230
|
if (!this.isUpdatePending) return;
|
|
231
231
|
if (!this.hasUpdated) {
|
|
232
232
|
if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
|
|
233
|
-
for (const [n,
|
|
233
|
+
for (const [n, s] of this._$Ep) this[n] = s;
|
|
234
234
|
this._$Ep = void 0;
|
|
235
235
|
}
|
|
236
|
-
const
|
|
237
|
-
if (
|
|
236
|
+
const i = this.constructor.elementProperties;
|
|
237
|
+
if (i.size > 0) for (const [n, s] of i) s.wrapped !== !0 || this._$AL.has(n) || this[n] === void 0 || this.P(n, this[n], s);
|
|
238
238
|
}
|
|
239
239
|
let t = !1;
|
|
240
240
|
const e = this._$AL;
|
|
241
241
|
try {
|
|
242
|
-
t = this.shouldUpdate(e), t ? (this.willUpdate(e), (o = this._$EO) == null || o.forEach((
|
|
242
|
+
t = this.shouldUpdate(e), t ? (this.willUpdate(e), (o = this._$EO) == null || o.forEach((i) => {
|
|
243
243
|
var n;
|
|
244
|
-
return (n =
|
|
244
|
+
return (n = i.hostUpdate) == null ? void 0 : n.call(i);
|
|
245
245
|
}), this.update(e)) : this._$EU();
|
|
246
|
-
} catch (
|
|
247
|
-
throw t = !1, this._$EU(),
|
|
246
|
+
} catch (i) {
|
|
247
|
+
throw t = !1, this._$EU(), i;
|
|
248
248
|
}
|
|
249
249
|
t && this._$AE(e);
|
|
250
250
|
}
|
|
@@ -253,8 +253,8 @@ class C extends HTMLElement {
|
|
|
253
253
|
_$AE(t) {
|
|
254
254
|
var e;
|
|
255
255
|
(e = this._$EO) == null || e.forEach((o) => {
|
|
256
|
-
var
|
|
257
|
-
return (
|
|
256
|
+
var i;
|
|
257
|
+
return (i = o.hostUpdated) == null ? void 0 : i.call(o);
|
|
258
258
|
}), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
|
|
259
259
|
}
|
|
260
260
|
_$EU() {
|
|
@@ -277,37 +277,37 @@ class C extends HTMLElement {
|
|
|
277
277
|
firstUpdated(t) {
|
|
278
278
|
}
|
|
279
279
|
}
|
|
280
|
-
C.elementStyles = [], C.shadowRootOptions = { mode: "open" }, C[
|
|
280
|
+
C.elementStyles = [], C.shadowRootOptions = { mode: "open" }, C[P("elementProperties")] = /* @__PURE__ */ new Map(), C[P("finalized")] = /* @__PURE__ */ new Map(), N == null || N({ ReactiveElement: C }), (w.reactiveElementVersions ?? (w.reactiveElementVersions = [])).push("2.0.4");
|
|
281
281
|
/**
|
|
282
282
|
* @license
|
|
283
283
|
* Copyright 2017 Google LLC
|
|
284
284
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
285
285
|
*/
|
|
286
|
-
const
|
|
287
|
-
const { kind: o, metadata:
|
|
288
|
-
let n = globalThis.litPropertyMetadata.get(
|
|
289
|
-
if (n === void 0 && globalThis.litPropertyMetadata.set(
|
|
290
|
-
const { name:
|
|
286
|
+
const Et = { attribute: !0, type: String, converter: H, reflect: !1, hasChanged: W }, kt = (r = Et, t, e) => {
|
|
287
|
+
const { kind: o, metadata: i } = e;
|
|
288
|
+
let n = globalThis.litPropertyMetadata.get(i);
|
|
289
|
+
if (n === void 0 && globalThis.litPropertyMetadata.set(i, n = /* @__PURE__ */ new Map()), n.set(e.name, r), o === "accessor") {
|
|
290
|
+
const { name: s } = e;
|
|
291
291
|
return { set(d) {
|
|
292
292
|
const a = t.get.call(this);
|
|
293
|
-
t.set.call(this, d), this.requestUpdate(
|
|
293
|
+
t.set.call(this, d), this.requestUpdate(s, a, r);
|
|
294
294
|
}, init(d) {
|
|
295
|
-
return d !== void 0 && this.P(
|
|
295
|
+
return d !== void 0 && this.P(s, void 0, r), d;
|
|
296
296
|
} };
|
|
297
297
|
}
|
|
298
298
|
if (o === "setter") {
|
|
299
|
-
const { name:
|
|
299
|
+
const { name: s } = e;
|
|
300
300
|
return function(d) {
|
|
301
|
-
const a = this[
|
|
302
|
-
t.call(this, d), this.requestUpdate(
|
|
301
|
+
const a = this[s];
|
|
302
|
+
t.call(this, d), this.requestUpdate(s, a, r);
|
|
303
303
|
};
|
|
304
304
|
}
|
|
305
305
|
throw Error("Unsupported decorator location: " + o);
|
|
306
306
|
};
|
|
307
|
-
function
|
|
308
|
-
return (t, e) => typeof e == "object" ?
|
|
309
|
-
const
|
|
310
|
-
return
|
|
307
|
+
function u(r) {
|
|
308
|
+
return (t, e) => typeof e == "object" ? kt(r, t, e) : ((o, i, n) => {
|
|
309
|
+
const s = i.hasOwnProperty(n);
|
|
310
|
+
return i.constructor.createProperty(n, s ? { ...o, wrapped: !0 } : o), s ? Object.getOwnPropertyDescriptor(i, n) : void 0;
|
|
311
311
|
})(r, t, e);
|
|
312
312
|
}
|
|
313
313
|
/**
|
|
@@ -315,78 +315,78 @@ function c(r) {
|
|
|
315
315
|
* Copyright 2017 Google LLC
|
|
316
316
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
317
317
|
*/
|
|
318
|
-
function
|
|
319
|
-
return
|
|
318
|
+
function at(r) {
|
|
319
|
+
return u({ ...r, state: !0, attribute: !1 });
|
|
320
320
|
}
|
|
321
321
|
/**
|
|
322
322
|
* @license
|
|
323
323
|
* Copyright 2017 Google LLC
|
|
324
324
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
325
325
|
*/
|
|
326
|
-
const z = globalThis,
|
|
327
|
-
\f\r]`,
|
|
328
|
-
\f\r"'\`<>=]|("|')|))|$)`, "g"), ot = /'/g,
|
|
326
|
+
const z = globalThis, D = z.trustedTypes, X = D ? D.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, dt = "$lit$", A = `lit$${Math.random().toFixed(9).slice(2)}$`, lt = "?" + A, St = `<${lt}>`, S = document, M = () => S.createComment(""), U = (r) => r === null || typeof r != "object" && typeof r != "function", Z = Array.isArray, xt = (r) => Z(r) || typeof (r == null ? void 0 : r[Symbol.iterator]) == "function", V = `[
|
|
327
|
+
\f\r]`, R = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, tt = /-->/g, et = />/g, E = RegExp(`>|${V}(?:([^\\s"'>=/]+)(${V}*=${V}*(?:[^
|
|
328
|
+
\f\r"'\`<>=]|("|')|))|$)`, "g"), ot = /'/g, it = /"/g, ct = /^(?:script|style|textarea|title)$/i, T = Symbol.for("lit-noChange"), p = Symbol.for("lit-nothing"), st = /* @__PURE__ */ new WeakMap(), k = S.createTreeWalker(S, 129);
|
|
329
329
|
function ht(r, t) {
|
|
330
330
|
if (!Z(r) || !r.hasOwnProperty("raw")) throw Error("invalid template strings array");
|
|
331
|
-
return
|
|
331
|
+
return X !== void 0 ? X.createHTML(t) : t;
|
|
332
332
|
}
|
|
333
333
|
const Ct = (r, t) => {
|
|
334
334
|
const e = r.length - 1, o = [];
|
|
335
|
-
let
|
|
335
|
+
let i, n = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", s = R;
|
|
336
336
|
for (let d = 0; d < e; d++) {
|
|
337
337
|
const a = r[d];
|
|
338
|
-
let
|
|
339
|
-
for (; g < a.length && (
|
|
340
|
-
const $ =
|
|
341
|
-
n +=
|
|
338
|
+
let c, b, l = -1, g = 0;
|
|
339
|
+
for (; g < a.length && (s.lastIndex = g, b = s.exec(a), b !== null); ) g = s.lastIndex, s === R ? b[1] === "!--" ? s = tt : b[1] !== void 0 ? s = et : b[2] !== void 0 ? (ct.test(b[2]) && (i = RegExp("</" + b[2], "g")), s = E) : b[3] !== void 0 && (s = E) : s === E ? b[0] === ">" ? (s = i ?? R, l = -1) : b[1] === void 0 ? l = -2 : (l = s.lastIndex - b[2].length, c = b[1], s = b[3] === void 0 ? E : b[3] === '"' ? it : ot) : s === it || s === ot ? s = E : s === tt || s === et ? s = R : (s = E, i = void 0);
|
|
340
|
+
const $ = s === E && r[d + 1].startsWith("/>") ? " " : "";
|
|
341
|
+
n += s === R ? a + St : l >= 0 ? (o.push(c), a.slice(0, l) + dt + a.slice(l) + A + $) : a + A + (l === -2 ? d : $);
|
|
342
342
|
}
|
|
343
343
|
return [ht(r, n + (r[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), o];
|
|
344
344
|
};
|
|
345
345
|
class B {
|
|
346
346
|
constructor({ strings: t, _$litType$: e }, o) {
|
|
347
|
-
let
|
|
347
|
+
let i;
|
|
348
348
|
this.parts = [];
|
|
349
|
-
let n = 0,
|
|
350
|
-
const d = t.length - 1, a = this.parts, [
|
|
351
|
-
if (this.el = B.createElement(
|
|
352
|
-
const
|
|
353
|
-
|
|
349
|
+
let n = 0, s = 0;
|
|
350
|
+
const d = t.length - 1, a = this.parts, [c, b] = Ct(t, e);
|
|
351
|
+
if (this.el = B.createElement(c, o), k.currentNode = this.el.content, e === 2 || e === 3) {
|
|
352
|
+
const l = this.el.content.firstChild;
|
|
353
|
+
l.replaceWith(...l.childNodes);
|
|
354
354
|
}
|
|
355
|
-
for (; (
|
|
356
|
-
if (
|
|
357
|
-
if (
|
|
358
|
-
const g =
|
|
359
|
-
a.push({ type: 1, index: n, name:
|
|
360
|
-
} else
|
|
361
|
-
if (
|
|
362
|
-
const
|
|
355
|
+
for (; (i = k.nextNode()) !== null && a.length < d; ) {
|
|
356
|
+
if (i.nodeType === 1) {
|
|
357
|
+
if (i.hasAttributes()) for (const l of i.getAttributeNames()) if (l.endsWith(dt)) {
|
|
358
|
+
const g = b[s++], $ = i.getAttribute(l).split(A), q = /([.?@])?(.*)/.exec(g);
|
|
359
|
+
a.push({ type: 1, index: n, name: q[2], strings: $, ctor: q[1] === "." ? Pt : q[1] === "?" ? zt : q[1] === "@" ? Ut : L }), i.removeAttribute(l);
|
|
360
|
+
} else l.startsWith(A) && (a.push({ type: 6, index: n }), i.removeAttribute(l));
|
|
361
|
+
if (ct.test(i.tagName)) {
|
|
362
|
+
const l = i.textContent.split(A), g = l.length - 1;
|
|
363
363
|
if (g > 0) {
|
|
364
|
-
|
|
365
|
-
for (let $ = 0; $ < g; $++)
|
|
366
|
-
|
|
364
|
+
i.textContent = D ? D.emptyScript : "";
|
|
365
|
+
for (let $ = 0; $ < g; $++) i.append(l[$], M()), k.nextNode(), a.push({ type: 2, index: ++n });
|
|
366
|
+
i.append(l[g], M());
|
|
367
367
|
}
|
|
368
368
|
}
|
|
369
|
-
} else if (
|
|
369
|
+
} else if (i.nodeType === 8) if (i.data === lt) a.push({ type: 2, index: n });
|
|
370
370
|
else {
|
|
371
|
-
let
|
|
372
|
-
for (; (
|
|
371
|
+
let l = -1;
|
|
372
|
+
for (; (l = i.data.indexOf(A, l + 1)) !== -1; ) a.push({ type: 7, index: n }), l += A.length - 1;
|
|
373
373
|
}
|
|
374
374
|
n++;
|
|
375
375
|
}
|
|
376
376
|
}
|
|
377
377
|
static createElement(t, e) {
|
|
378
|
-
const o =
|
|
378
|
+
const o = S.createElement("template");
|
|
379
379
|
return o.innerHTML = t, o;
|
|
380
380
|
}
|
|
381
381
|
}
|
|
382
382
|
function x(r, t, e = r, o) {
|
|
383
|
-
var
|
|
384
|
-
if (t ===
|
|
385
|
-
let
|
|
383
|
+
var s, d;
|
|
384
|
+
if (t === T) return t;
|
|
385
|
+
let i = o !== void 0 ? (s = e._$Co) == null ? void 0 : s[o] : e._$Cl;
|
|
386
386
|
const n = U(t) ? void 0 : t._$litDirective$;
|
|
387
|
-
return (
|
|
387
|
+
return (i == null ? void 0 : i.constructor) !== n && ((d = i == null ? void 0 : i._$AO) == null || d.call(i, !1), n === void 0 ? i = void 0 : (i = new n(r), i._$AT(r, e, o)), o !== void 0 ? (e._$Co ?? (e._$Co = []))[o] = i : e._$Cl = i), i !== void 0 && (t = x(r, i._$AS(r, t.values), i, o)), t;
|
|
388
388
|
}
|
|
389
|
-
class
|
|
389
|
+
class Rt {
|
|
390
390
|
constructor(t, e) {
|
|
391
391
|
this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = e;
|
|
392
392
|
}
|
|
@@ -397,30 +397,30 @@ class Pt {
|
|
|
397
397
|
return this._$AM._$AU;
|
|
398
398
|
}
|
|
399
399
|
u(t) {
|
|
400
|
-
const { el: { content: e }, parts: o } = this._$AD,
|
|
401
|
-
|
|
402
|
-
let n =
|
|
400
|
+
const { el: { content: e }, parts: o } = this._$AD, i = ((t == null ? void 0 : t.creationScope) ?? S).importNode(e, !0);
|
|
401
|
+
k.currentNode = i;
|
|
402
|
+
let n = k.nextNode(), s = 0, d = 0, a = o[0];
|
|
403
403
|
for (; a !== void 0; ) {
|
|
404
|
-
if (
|
|
405
|
-
let
|
|
406
|
-
a.type === 2 ?
|
|
404
|
+
if (s === a.index) {
|
|
405
|
+
let c;
|
|
406
|
+
a.type === 2 ? c = new I(n, n.nextSibling, this, t) : a.type === 1 ? c = new a.ctor(n, a.name, a.strings, this, t) : a.type === 6 && (c = new Tt(n, this, t)), this._$AV.push(c), a = o[++d];
|
|
407
407
|
}
|
|
408
|
-
|
|
408
|
+
s !== (a == null ? void 0 : a.index) && (n = k.nextNode(), s++);
|
|
409
409
|
}
|
|
410
|
-
return
|
|
410
|
+
return k.currentNode = S, i;
|
|
411
411
|
}
|
|
412
412
|
p(t) {
|
|
413
413
|
let e = 0;
|
|
414
414
|
for (const o of this._$AV) o !== void 0 && (o.strings !== void 0 ? (o._$AI(t, o, e), e += o.strings.length - 2) : o._$AI(t[e])), e++;
|
|
415
415
|
}
|
|
416
416
|
}
|
|
417
|
-
class
|
|
417
|
+
class I {
|
|
418
418
|
get _$AU() {
|
|
419
419
|
var t;
|
|
420
420
|
return ((t = this._$AM) == null ? void 0 : t._$AU) ?? this._$Cv;
|
|
421
421
|
}
|
|
422
|
-
constructor(t, e, o,
|
|
423
|
-
this.type = 2, this._$AH =
|
|
422
|
+
constructor(t, e, o, i) {
|
|
423
|
+
this.type = 2, this._$AH = p, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = o, this.options = i, this._$Cv = (i == null ? void 0 : i.isConnected) ?? !0;
|
|
424
424
|
}
|
|
425
425
|
get parentNode() {
|
|
426
426
|
let t = this._$AA.parentNode;
|
|
@@ -434,7 +434,7 @@ class N {
|
|
|
434
434
|
return this._$AB;
|
|
435
435
|
}
|
|
436
436
|
_$AI(t, e = this) {
|
|
437
|
-
t = x(this, t, e), U(t) ? t ===
|
|
437
|
+
t = x(this, t, e), U(t) ? t === p || t == null || t === "" ? (this._$AH !== p && this._$AR(), this._$AH = p) : t !== this._$AH && t !== T && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : xt(t) ? this.k(t) : this._(t);
|
|
438
438
|
}
|
|
439
439
|
O(t) {
|
|
440
440
|
return this._$AA.parentNode.insertBefore(t, this._$AB);
|
|
@@ -443,33 +443,33 @@ class N {
|
|
|
443
443
|
this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
|
|
444
444
|
}
|
|
445
445
|
_(t) {
|
|
446
|
-
this._$AH !==
|
|
446
|
+
this._$AH !== p && U(this._$AH) ? this._$AA.nextSibling.data = t : this.T(S.createTextNode(t)), this._$AH = t;
|
|
447
447
|
}
|
|
448
448
|
$(t) {
|
|
449
449
|
var n;
|
|
450
|
-
const { values: e, _$litType$: o } = t,
|
|
451
|
-
if (((n = this._$AH) == null ? void 0 : n._$AD) ===
|
|
450
|
+
const { values: e, _$litType$: o } = t, i = typeof o == "number" ? this._$AC(t) : (o.el === void 0 && (o.el = B.createElement(ht(o.h, o.h[0]), this.options)), o);
|
|
451
|
+
if (((n = this._$AH) == null ? void 0 : n._$AD) === i) this._$AH.p(e);
|
|
452
452
|
else {
|
|
453
|
-
const
|
|
454
|
-
|
|
453
|
+
const s = new Rt(i, this), d = s.u(this.options);
|
|
454
|
+
s.p(e), this.T(d), this._$AH = s;
|
|
455
455
|
}
|
|
456
456
|
}
|
|
457
457
|
_$AC(t) {
|
|
458
|
-
let e =
|
|
459
|
-
return e === void 0 &&
|
|
458
|
+
let e = st.get(t.strings);
|
|
459
|
+
return e === void 0 && st.set(t.strings, e = new B(t)), e;
|
|
460
460
|
}
|
|
461
461
|
k(t) {
|
|
462
462
|
Z(this._$AH) || (this._$AH = [], this._$AR());
|
|
463
463
|
const e = this._$AH;
|
|
464
|
-
let o,
|
|
465
|
-
for (const n of t)
|
|
466
|
-
|
|
464
|
+
let o, i = 0;
|
|
465
|
+
for (const n of t) i === e.length ? e.push(o = new I(this.O(M()), this.O(M()), this, this.options)) : o = e[i], o._$AI(n), i++;
|
|
466
|
+
i < e.length && (this._$AR(o && o._$AB.nextSibling, i), e.length = i);
|
|
467
467
|
}
|
|
468
468
|
_$AR(t = this._$AA.nextSibling, e) {
|
|
469
469
|
var o;
|
|
470
470
|
for ((o = this._$AP) == null ? void 0 : o.call(this, !1, !0, e); t && t !== this._$AB; ) {
|
|
471
|
-
const
|
|
472
|
-
t.remove(), t =
|
|
471
|
+
const i = t.nextSibling;
|
|
472
|
+
t.remove(), t = i;
|
|
473
473
|
}
|
|
474
474
|
}
|
|
475
475
|
setConnected(t) {
|
|
@@ -477,62 +477,62 @@ class N {
|
|
|
477
477
|
this._$AM === void 0 && (this._$Cv = t, (e = this._$AP) == null || e.call(this, t));
|
|
478
478
|
}
|
|
479
479
|
}
|
|
480
|
-
class
|
|
480
|
+
class L {
|
|
481
481
|
get tagName() {
|
|
482
482
|
return this.element.tagName;
|
|
483
483
|
}
|
|
484
484
|
get _$AU() {
|
|
485
485
|
return this._$AM._$AU;
|
|
486
486
|
}
|
|
487
|
-
constructor(t, e, o,
|
|
488
|
-
this.type = 1, this._$AH =
|
|
487
|
+
constructor(t, e, o, i, n) {
|
|
488
|
+
this.type = 1, this._$AH = p, this._$AN = void 0, this.element = t, this.name = e, this._$AM = i, this.options = n, o.length > 2 || o[0] !== "" || o[1] !== "" ? (this._$AH = Array(o.length - 1).fill(new String()), this.strings = o) : this._$AH = p;
|
|
489
489
|
}
|
|
490
|
-
_$AI(t, e = this, o,
|
|
490
|
+
_$AI(t, e = this, o, i) {
|
|
491
491
|
const n = this.strings;
|
|
492
|
-
let
|
|
493
|
-
if (n === void 0) t = x(this, t, e, 0),
|
|
492
|
+
let s = !1;
|
|
493
|
+
if (n === void 0) t = x(this, t, e, 0), s = !U(t) || t !== this._$AH && t !== T, s && (this._$AH = t);
|
|
494
494
|
else {
|
|
495
495
|
const d = t;
|
|
496
|
-
let a,
|
|
497
|
-
for (t = n[0], a = 0; a < n.length - 1; a++)
|
|
496
|
+
let a, c;
|
|
497
|
+
for (t = n[0], a = 0; a < n.length - 1; a++) c = x(this, d[o + a], e, a), c === T && (c = this._$AH[a]), s || (s = !U(c) || c !== this._$AH[a]), c === p ? t = p : t !== p && (t += (c ?? "") + n[a + 1]), this._$AH[a] = c;
|
|
498
498
|
}
|
|
499
|
-
|
|
499
|
+
s && !i && this.j(t);
|
|
500
500
|
}
|
|
501
501
|
j(t) {
|
|
502
|
-
t ===
|
|
502
|
+
t === p ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
|
|
503
503
|
}
|
|
504
504
|
}
|
|
505
|
-
class
|
|
505
|
+
class Pt extends L {
|
|
506
506
|
constructor() {
|
|
507
507
|
super(...arguments), this.type = 3;
|
|
508
508
|
}
|
|
509
509
|
j(t) {
|
|
510
|
-
this.element[this.name] = t ===
|
|
510
|
+
this.element[this.name] = t === p ? void 0 : t;
|
|
511
511
|
}
|
|
512
512
|
}
|
|
513
|
-
class zt extends
|
|
513
|
+
class zt extends L {
|
|
514
514
|
constructor() {
|
|
515
515
|
super(...arguments), this.type = 4;
|
|
516
516
|
}
|
|
517
517
|
j(t) {
|
|
518
|
-
this.element.toggleAttribute(this.name, !!t && t !==
|
|
518
|
+
this.element.toggleAttribute(this.name, !!t && t !== p);
|
|
519
519
|
}
|
|
520
520
|
}
|
|
521
|
-
class Ut extends
|
|
522
|
-
constructor(t, e, o,
|
|
523
|
-
super(t, e, o,
|
|
521
|
+
class Ut extends L {
|
|
522
|
+
constructor(t, e, o, i, n) {
|
|
523
|
+
super(t, e, o, i, n), this.type = 5;
|
|
524
524
|
}
|
|
525
525
|
_$AI(t, e = this) {
|
|
526
|
-
if ((t = x(this, t, e, 0) ??
|
|
527
|
-
const o = this._$AH,
|
|
528
|
-
|
|
526
|
+
if ((t = x(this, t, e, 0) ?? p) === T) return;
|
|
527
|
+
const o = this._$AH, i = t === p && o !== p || t.capture !== o.capture || t.once !== o.once || t.passive !== o.passive, n = t !== p && (o === p || i);
|
|
528
|
+
i && this.element.removeEventListener(this.name, this, o), n && this.element.addEventListener(this.name, this, t), this._$AH = t;
|
|
529
529
|
}
|
|
530
530
|
handleEvent(t) {
|
|
531
531
|
var e;
|
|
532
532
|
typeof this._$AH == "function" ? this._$AH.call(((e = this.options) == null ? void 0 : e.host) ?? this.element, t) : this._$AH.handleEvent(t);
|
|
533
533
|
}
|
|
534
534
|
}
|
|
535
|
-
class
|
|
535
|
+
class Tt {
|
|
536
536
|
constructor(t, e, o) {
|
|
537
537
|
this.element = t, this.type = 6, this._$AN = void 0, this._$AM = e, this.options = o;
|
|
538
538
|
}
|
|
@@ -544,17 +544,17 @@ class qt {
|
|
|
544
544
|
}
|
|
545
545
|
}
|
|
546
546
|
const G = z.litHtmlPolyfillSupport;
|
|
547
|
-
G == null || G(B,
|
|
547
|
+
G == null || G(B, I), (z.litHtmlVersions ?? (z.litHtmlVersions = [])).push("3.2.1");
|
|
548
548
|
/**
|
|
549
549
|
* @license
|
|
550
550
|
* Copyright 2018 Google LLC
|
|
551
551
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
552
552
|
*/
|
|
553
|
-
const Bt = (r) => r ??
|
|
553
|
+
const Bt = (r) => r ?? p, ut = pt`
|
|
554
554
|
:host {
|
|
555
555
|
/* Global Radiobutton Styles */
|
|
556
556
|
--_nys-radiobutton-size: var(--nys-size-400, 32px);
|
|
557
|
-
--_nys-radiobutton-radius: var(--nys-radius-md, 4px);
|
|
557
|
+
--_nys-radiobutton-border-radius: var(--nys-radius-md, 4px);
|
|
558
558
|
--_nys-radiobutton-width-border: var(--nys-border-width-md, 2px);
|
|
559
559
|
--_nys-radiobutton-color-focus: var(--nys-color-focus, #004dd1);
|
|
560
560
|
--_nys-radiobutton-width-focus: var(--nys-border-width-md, 2px);
|
|
@@ -605,40 +605,22 @@ const Bt = (r) => r ?? u, ct = ut`
|
|
|
605
605
|
--_nys-radiobutton-pressed-color-border: var(--nys-color-ink, #1b1b1b);
|
|
606
606
|
/* Checked */
|
|
607
607
|
--_nys-radiobutton-checked-color-bg: var(--nys-color-theme, #154973);
|
|
608
|
-
/* Checked + Hovered */
|
|
609
|
-
--_nys-radiobutton-checked-hover-color-bg: var(
|
|
610
|
-
--nys-color-theme-strong,
|
|
611
|
-
var(--nys-color-state-blue-800, #0e324f)
|
|
612
|
-
);
|
|
613
|
-
--_nys-radiobutton-checked-hover-color-border: var(
|
|
614
|
-
--nys-color-ink,
|
|
615
|
-
#1b1b1b
|
|
616
|
-
);
|
|
617
|
-
/* Checked + Pressed */
|
|
618
|
-
--_nys-radiobutton-checked-pressed-color-bg: var(
|
|
619
|
-
--nys-color-theme-strong,
|
|
620
|
-
var(--nys-color-state-blue-800, #0e324f)
|
|
621
|
-
);
|
|
622
|
-
--_nys-radiobutton-checked-pressed-color-border: var(
|
|
623
|
-
--nys-color-ink,
|
|
624
|
-
#1b1b1b
|
|
625
|
-
);
|
|
626
608
|
/* Disabled */
|
|
627
|
-
--_nys-radiobutton-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
var(--nys-color-neutral-200, #bec0c1)
|
|
609
|
+
--_nys-radiobutton-background-color--disabled: var(
|
|
610
|
+
--nys-color-ink-reverse,
|
|
611
|
+
#f0f0f0
|
|
631
612
|
);
|
|
632
|
-
--_nys-radiobutton-disabled-color-
|
|
613
|
+
--_nys-radiobutton-color--disabled: var(--nys-color-text-disabled, #bec0c1);
|
|
614
|
+
--_nys-radiobutton-border-color--disabled: var(
|
|
633
615
|
--nys-color-neutral-100,
|
|
634
616
|
#d0d0ce
|
|
635
617
|
);
|
|
636
618
|
/* Disabled Checked */
|
|
637
|
-
--_nys-radiobutton-
|
|
619
|
+
--_nys-radiobutton-background-color--checked--disabled: var(
|
|
638
620
|
--nys-color-neutral-100,
|
|
639
621
|
#d0d0ce
|
|
640
622
|
);
|
|
641
|
-
--_nys-radiobutton-
|
|
623
|
+
--_nys-radiobutton-border-color--checked--disabled: var(
|
|
642
624
|
--nys-color-neutral-100,
|
|
643
625
|
#d0d0ce
|
|
644
626
|
);
|
|
@@ -647,14 +629,14 @@ const Bt = (r) => r ?? u, ct = ut`
|
|
|
647
629
|
/* Small Variant */
|
|
648
630
|
:host([size="sm"]) {
|
|
649
631
|
--_nys-radiobutton-size: var(--nys-size-300, 24px);
|
|
650
|
-
--_nys-radiobutton-radius: var(--nys-radius-sm, 2px);
|
|
632
|
+
--_nys-radiobutton-border-radius: var(--nys-radius-sm, 2px);
|
|
651
633
|
--_nys-radiogroup-gap: var(--nys-space-100, 8px);
|
|
652
634
|
--_nys-radiobutton-gap: var(--nys-space-100, 8px);
|
|
653
635
|
}
|
|
654
636
|
/* Medium Variant */
|
|
655
637
|
:host([size="md"]) {
|
|
656
638
|
--_nys-radiobutton-size: var(--nys-size-400, 32px);
|
|
657
|
-
--_nys-radiobutton-radius: var(--nys-radius-md, 4px);
|
|
639
|
+
--_nys-radiobutton-border-radius: var(--nys-radius-md, 4px);
|
|
658
640
|
--_nys-radiogroup-gap: var(--nys-space-200, 16px);
|
|
659
641
|
--_nys-radiobutton-gap: var(--nys-space-150, 12px);
|
|
660
642
|
}
|
|
@@ -662,66 +644,72 @@ const Bt = (r) => r ?? u, ct = ut`
|
|
|
662
644
|
/* Tile Variant */
|
|
663
645
|
:host([tile]) {
|
|
664
646
|
--_nys-radiobutton-font-weight-label: var(--nys-font-weight-semibold, 600);
|
|
665
|
-
--_nys-radiobutton-
|
|
666
|
-
--_nys-radiobutton-
|
|
667
|
-
--_nys-radiobutton-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
647
|
+
--_nys-radiobutton-border-width--tile: var(--nys-border-width-sm, 1px);
|
|
648
|
+
--_nys-radiobutton-border-radius--tile: var(--nys-radius-md, 4px);
|
|
649
|
+
--_nys-radiobutton-border-color--tile: var(
|
|
650
|
+
--nys-color-neutral-100,
|
|
651
|
+
#d0d0ce
|
|
652
|
+
);
|
|
653
|
+
--_nys-radiobutton-background-color--tile: var(
|
|
654
|
+
--nys-color-ink-reverse,
|
|
655
|
+
#ffffff
|
|
656
|
+
);
|
|
657
|
+
--_nys-radiobutton-padding--x--tile: var(--nys-space-250, 20px);
|
|
658
|
+
--_nys-radiobutton-padding--y--tile: var(--nys-space-200, 16px);
|
|
671
659
|
/* Hover */
|
|
672
|
-
--_nys-radiobutton-
|
|
660
|
+
--_nys-radiobutton-border-color--tile--hover: var(
|
|
673
661
|
--nys-color-neutral-700,
|
|
674
662
|
#4a4d4f
|
|
675
663
|
);
|
|
676
|
-
--_nys-radiobutton-
|
|
664
|
+
--_nys-radiobutton-background-color--tile--hover: var(
|
|
677
665
|
--nys-color-ink-reverse,
|
|
678
666
|
#ffffff
|
|
679
667
|
);
|
|
680
668
|
/* Pressed */
|
|
681
|
-
--_nys-radiobutton-
|
|
669
|
+
--_nys-radiobutton-border-color--tile--active: var(
|
|
682
670
|
--nys-color-neutral-900,
|
|
683
671
|
#1b1b1b
|
|
684
672
|
);
|
|
685
|
-
--_nys-radiobutton-
|
|
673
|
+
--_nys-radiobutton-background-color--tile--active: var(
|
|
686
674
|
--nys-color-ink-reverse,
|
|
687
675
|
#ffffff
|
|
688
676
|
);
|
|
689
677
|
/* Checked */
|
|
690
|
-
--_nys-radiobutton-
|
|
678
|
+
--_nys-radiobutton-border-color--tile--checked: var(
|
|
691
679
|
--nys-color-theme-mid,
|
|
692
680
|
#457aa5
|
|
693
681
|
);
|
|
694
|
-
--_nys-radiobutton-
|
|
682
|
+
--_nys-radiobutton-background-color--tile--checked: var(
|
|
695
683
|
--nys-color-theme-faint,
|
|
696
684
|
#f7fafd
|
|
697
685
|
);
|
|
698
686
|
/* Disabled */
|
|
699
|
-
--_nys-radiobutton-
|
|
687
|
+
--_nys-radiobutton-border-color--tile--disabled: var(
|
|
700
688
|
--nys-color-ink-reverse,
|
|
701
689
|
#f0f0f0
|
|
702
690
|
);
|
|
703
|
-
--_nys-radiobutton-
|
|
691
|
+
--_nys-radiobutton-background-color--tile--disabled: var(
|
|
704
692
|
--nys-color-neutral-100,
|
|
705
693
|
#d0d0ce
|
|
706
694
|
);
|
|
707
695
|
}
|
|
708
696
|
|
|
709
697
|
:host([tile][size="sm"]) {
|
|
710
|
-
--_nys-radiobutton-
|
|
711
|
-
--_nys-radiobutton-
|
|
698
|
+
--_nys-radiobutton-padding--x--tile: var(--nys-space-200, 16px);
|
|
699
|
+
--_nys-radiobutton-padding--y--tile: var(--nys-space-150, 12px);
|
|
712
700
|
}
|
|
713
701
|
|
|
714
702
|
:host([tile][showError]) {
|
|
715
|
-
--_nys-radiobutton-
|
|
716
|
-
--_nys-radiobutton-
|
|
703
|
+
--_nys-radiobutton-border-color--tile: var(--nys-color-danger, #b52c2c);
|
|
704
|
+
--_nys-radiobutton-border-color--tile--hover: var(
|
|
717
705
|
--nys-color-danger,
|
|
718
706
|
#b52c2c
|
|
719
707
|
);
|
|
720
|
-
--_nys-radiobutton-
|
|
708
|
+
--_nys-radiobutton-border-color--tile--active: var(
|
|
721
709
|
--nys-color-danger,
|
|
722
710
|
#b52c2c
|
|
723
711
|
);
|
|
724
|
-
--_nys-radiobutton-
|
|
712
|
+
--_nys-radiobutton-border-color--tile--checked: var(
|
|
725
713
|
--nys-color-danger,
|
|
726
714
|
#b52c2c
|
|
727
715
|
);
|
|
@@ -750,12 +738,12 @@ const Bt = (r) => r ?? u, ct = ut`
|
|
|
750
738
|
line-height: var(--_nys-radiobutton-line-height);
|
|
751
739
|
|
|
752
740
|
/* Tile */
|
|
753
|
-
border-radius: var(--_nys-radiobutton-
|
|
754
|
-
border: var(--_nys-radiobutton-
|
|
755
|
-
var(--_nys-radiobutton-
|
|
756
|
-
background: var(--_nys-radiobutton-
|
|
757
|
-
padding: var(--_nys-radiobutton-
|
|
758
|
-
var(--_nys-radiobutton-
|
|
741
|
+
border-radius: var(--_nys-radiobutton-border-radius--tile);
|
|
742
|
+
border: var(--_nys-radiobutton-border-width--tile) solid
|
|
743
|
+
var(--_nys-radiobutton-border-color--tile);
|
|
744
|
+
background-color: var(--_nys-radiobutton-background-color--tile);
|
|
745
|
+
padding: var(--_nys-radiobutton-padding--y--tile)
|
|
746
|
+
var(--_nys-radiobutton-padding--x--tile);
|
|
759
747
|
}
|
|
760
748
|
|
|
761
749
|
.nys-radiobutton__radio {
|
|
@@ -776,6 +764,7 @@ const Bt = (r) => r ?? u, ct = ut`
|
|
|
776
764
|
outline-offset: var(--_nys-radiobutton-outline-offset);
|
|
777
765
|
outline: none;
|
|
778
766
|
margin: 0 0 auto 0; /* Causes centered radio button if single line of label but top aligned if multiline */
|
|
767
|
+
box-sizing: border-box;
|
|
779
768
|
}
|
|
780
769
|
|
|
781
770
|
/* Pointer cursor for unchecked radio button */
|
|
@@ -785,84 +774,99 @@ const Bt = (r) => r ?? u, ct = ut`
|
|
|
785
774
|
}
|
|
786
775
|
|
|
787
776
|
/* Checked */
|
|
788
|
-
|
|
777
|
+
input:not(:disabled):checked + .nys-radiobutton .nys-radiobutton__radio {
|
|
789
778
|
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>');
|
|
790
779
|
background-color: var(--_nys-radiobutton-checked-color-bg);
|
|
791
780
|
}
|
|
792
781
|
:host([tile])
|
|
793
|
-
.nys-radiobutton:has(
|
|
794
|
-
|
|
795
|
-
|
|
782
|
+
.nys-radiobutton:has(input:not(:disabled):checked)
|
|
783
|
+
+ .nys-radiobutton
|
|
784
|
+
.nys-radiobutton__radio {
|
|
785
|
+
border-color: var(--_nys-radiobutton-border-color--tile--checked);
|
|
786
|
+
background-color: var(--_nys-radiobutton-background-color--tile--checked);
|
|
796
787
|
}
|
|
797
788
|
:host([tile])
|
|
798
|
-
.nys-radiobutton:has(
|
|
789
|
+
.nys-radiobutton:has(input:not(:disabled):checked:hover)
|
|
790
|
+
+ .nys-radiobutton
|
|
791
|
+
.nys-radiobutton__radio {
|
|
799
792
|
cursor: default;
|
|
800
793
|
}
|
|
801
794
|
|
|
802
795
|
/* Checked + Disabled */
|
|
803
|
-
|
|
796
|
+
input:disabled:checked + .nys-radiobutton .nys-radiobutton__radio {
|
|
804
797
|
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>');
|
|
805
|
-
border-color: var(--_nys-radiobutton-
|
|
806
|
-
background-color: var(
|
|
798
|
+
border-color: var(--_nys-radiobutton-border-color--checked--disabled);
|
|
799
|
+
background-color: var(
|
|
800
|
+
--_nys-radiobutton-background-color--checked--disabled
|
|
801
|
+
);
|
|
807
802
|
}
|
|
808
|
-
:host([tile])
|
|
809
|
-
|
|
810
|
-
|
|
803
|
+
:host([tile])
|
|
804
|
+
.nys-radiobutton:has(input:disabled:checked)
|
|
805
|
+
+ .nys-radiobutton
|
|
806
|
+
.nys-radiobutton__radio {
|
|
807
|
+
border-color: var(--_nys-radiobutton-background-color--tile--disabled);
|
|
808
|
+
background-color: var(--_nys-radiobutton-border-color--tile--disabled);
|
|
811
809
|
}
|
|
812
810
|
|
|
813
811
|
/* Disabled */
|
|
814
|
-
.nys-radiobutton__radio
|
|
815
|
-
background-color: var(--_nys-radiobutton-
|
|
816
|
-
border-color: var(--_nys-radiobutton-
|
|
812
|
+
input:disabled + .nys-radiobutton .nys-radiobutton__radio {
|
|
813
|
+
background-color: var(--_nys-radiobutton-background-color--disabled);
|
|
814
|
+
border-color: var(--_nys-radiobutton-border-color--disabled);
|
|
817
815
|
cursor: not-allowed;
|
|
818
816
|
}
|
|
819
|
-
:host([tile])
|
|
820
|
-
|
|
821
|
-
|
|
817
|
+
:host([tile])
|
|
818
|
+
.nys-radiobutton:has(input:disabled)
|
|
819
|
+
+ .nys-radiobutton
|
|
820
|
+
.nys-radiobutton__radio {
|
|
821
|
+
background-color: var(--_nys-radiobutton-background-color--disabled);
|
|
822
|
+
border-color: var(--_nys-radiobutton-border-color--disabled);
|
|
822
823
|
cursor: not-allowed;
|
|
823
824
|
}
|
|
824
825
|
|
|
825
826
|
/* Hover - only allow hover on unchecked */
|
|
826
|
-
|
|
827
|
+
input:hover:not(:disabled):not(:checked)
|
|
828
|
+
+ .nys-radiobutton
|
|
829
|
+
.nys-radiobutton__radio {
|
|
827
830
|
border-color: var(--_nys-radiobutton-hover-color-border);
|
|
828
831
|
background-color: var(--_nys-radiobutton-hover-color-bg);
|
|
829
832
|
}
|
|
830
833
|
:host([tile])
|
|
831
834
|
.nys-radiobutton:has(
|
|
832
|
-
|
|
835
|
+
input:hover:not(:disabled):not(:checked)
|
|
836
|
+
+ .nys-radiobutton
|
|
837
|
+
.nys-radiobutton__radio
|
|
833
838
|
) {
|
|
834
|
-
border-color: var(--_nys-radiobutton-
|
|
835
|
-
background-color: var(--_nys-radiobutton-
|
|
836
|
-
outline: solid var(--_nys-radiobutton-
|
|
837
|
-
var(--_nys-radiobutton-
|
|
839
|
+
border-color: var(--_nys-radiobutton-border-color--tile--hover);
|
|
840
|
+
background-color: var(--_nys-radiobutton-background-color--tile--hover);
|
|
841
|
+
outline: solid var(--_nys-radiobutton-border-width--tile)
|
|
842
|
+
var(--_nys-radiobutton-border-color--tile--hover);
|
|
838
843
|
}
|
|
839
844
|
|
|
840
845
|
/* Pressed - only allow pressed on unchecked */
|
|
841
|
-
|
|
846
|
+
input:active:not(:disabled):not(:checked)
|
|
847
|
+
+ .nys-radiobutton
|
|
848
|
+
.nys-radiobutton__radio {
|
|
842
849
|
border-color: var(--_nys-radiobutton-pressed-color-border);
|
|
843
850
|
background-color: var(--_nys-radiobutton-pressed-color-bg);
|
|
844
851
|
}
|
|
845
852
|
:host([tile])
|
|
846
853
|
.nys-radiobutton:has(
|
|
847
|
-
|
|
854
|
+
input:active:not(:disabled):not(:checked)
|
|
855
|
+
+ .nys-radiobutton
|
|
856
|
+
.nys-radiobutton__radio
|
|
848
857
|
) {
|
|
849
|
-
border-color: var(--_nys-radiobutton-
|
|
850
|
-
background-color: var(--_nys-radiobutton-
|
|
851
|
-
outline: solid var(--_nys-radiobutton-
|
|
852
|
-
var(--_nys-radiobutton-
|
|
858
|
+
border-color: var(--_nys-radiobutton-border-color--tile--active);
|
|
859
|
+
background-color: var(--_nys-radiobutton-background-color--tile--active);
|
|
860
|
+
outline: solid var(--_nys-radiobutton-border-width--tile)
|
|
861
|
+
var(--_nys-radiobutton-border-color--tile--active);
|
|
853
862
|
}
|
|
854
863
|
|
|
855
864
|
/* Focused */
|
|
856
|
-
:host
|
|
865
|
+
:host:focus-visible,
|
|
866
|
+
:host(.active-focus) {
|
|
857
867
|
outline: solid var(--_nys-radiobutton-width-focus)
|
|
858
868
|
var(--_nys-radiobutton-color-focus);
|
|
859
869
|
}
|
|
860
|
-
:host([tile]) .nys-radiobutton:has(*:focus-visible) {
|
|
861
|
-
outline: solid var(--_nys-radiobutton-tile-border-width)
|
|
862
|
-
var(--_nys-radiobutton-color-focus) !important;
|
|
863
|
-
border-color: var(--_nys-radiobutton-color-focus) !important;
|
|
864
|
-
}
|
|
865
|
-
|
|
866
870
|
/* Radiobutton Label Holder */
|
|
867
871
|
.nys-radiobutton__text {
|
|
868
872
|
line-height: var(--_nys-radiobutton-line-height);
|
|
@@ -893,27 +897,39 @@ const Bt = (r) => r ?? u, ct = ut`
|
|
|
893
897
|
}
|
|
894
898
|
|
|
895
899
|
/* Disabled label */
|
|
896
|
-
.nys-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
.nys-radiobutton__radio:disabled
|
|
900
|
-
+ .nys-radiobutton__text
|
|
901
|
-
.nys-radiobutton__description {
|
|
902
|
-
color: var(--_nys-radiobutton-disabled-color-text);
|
|
900
|
+
input:disabled + span + .nys-radiobutton__text .nys-radiobutton__label,
|
|
901
|
+
input:disabled + span + .nys-radiobutton__text .nys-radiobutton__description {
|
|
902
|
+
color: var(--_nys-radiobutton-color--disabled);
|
|
903
903
|
cursor: not-allowed;
|
|
904
904
|
}
|
|
905
|
+
|
|
906
|
+
/* Screen readers ONLY */
|
|
907
|
+
fieldset {
|
|
908
|
+
all: unset;
|
|
909
|
+
display: contents;
|
|
910
|
+
}
|
|
911
|
+
|
|
912
|
+
.sr-only {
|
|
913
|
+
position: absolute;
|
|
914
|
+
width: 1px;
|
|
915
|
+
height: 1px;
|
|
916
|
+
padding: 0;
|
|
917
|
+
margin: -1px;
|
|
918
|
+
overflow: hidden;
|
|
919
|
+
border: 0;
|
|
920
|
+
}
|
|
905
921
|
`;
|
|
906
|
-
var
|
|
907
|
-
for (var
|
|
908
|
-
(
|
|
909
|
-
return o &&
|
|
922
|
+
var qt = Object.defineProperty, Ot = Object.getOwnPropertyDescriptor, _ = (r, t, e, o) => {
|
|
923
|
+
for (var i = o > 1 ? void 0 : o ? Ot(t, e) : t, n = r.length - 1, s; n >= 0; n--)
|
|
924
|
+
(s = r[n]) && (i = (o ? s(t, e, i) : s(i)) || i);
|
|
925
|
+
return o && i && qt(t, e, i), i;
|
|
910
926
|
};
|
|
911
|
-
let
|
|
927
|
+
let Ht = 0;
|
|
912
928
|
var m;
|
|
913
|
-
const y = (m = class extends
|
|
929
|
+
const y = (m = class extends rt {
|
|
914
930
|
// allows use of elementInternals' API
|
|
915
931
|
constructor() {
|
|
916
|
-
super(), this.id = "", this.name = "", this.required = !1, this.optional = !1, this.showError = !1, this.errorMessage = "", this.label = "", this.description = "", this.selectedValue = null, this.
|
|
932
|
+
super(), this.id = "", this.name = "", this.required = !1, this.optional = !1, this.showError = !1, this.errorMessage = "", this.label = "", this.description = "", this.tile = !1, this.selectedValue = null, this._slottedDescriptionText = "", this._size = "md", this._internals = this.attachInternals();
|
|
917
933
|
}
|
|
918
934
|
get size() {
|
|
919
935
|
return this._size;
|
|
@@ -925,13 +941,13 @@ const y = (m = class extends it {
|
|
|
925
941
|
}
|
|
926
942
|
// Generate a unique ID if one is not provided
|
|
927
943
|
connectedCallback() {
|
|
928
|
-
super.connectedCallback(), this.id || (this.id = `nys-radiogroup-${Date.now()}-${
|
|
944
|
+
super.connectedCallback(), this.id || (this.id = `nys-radiogroup-${Date.now()}-${Ht++}`), this.addEventListener("nys-change", this._handleRadioButtonChange), this.addEventListener("invalid", this._handleInvalid);
|
|
929
945
|
}
|
|
930
946
|
disconnectedCallback() {
|
|
931
947
|
super.disconnectedCallback(), this.removeEventListener("nys-change", this._handleRadioButtonChange), this.removeEventListener("invalid", this._handleInvalid);
|
|
932
948
|
}
|
|
933
|
-
firstUpdated() {
|
|
934
|
-
this._initializeCheckedRadioValue(), this._setValue(), this.
|
|
949
|
+
async firstUpdated() {
|
|
950
|
+
this._initializeCheckedRadioValue(), this._setValue(), this._setRadioButtonRequire(), this._updateRadioButtonsSize(), this._updateRadioButtonsTile(), this._updateRadioButtonsShowError(), this._getSlotDescriptionForAria(), await this.updateComplete, this._initializeChildAttributes(), this._updateGroupTabIndex();
|
|
935
951
|
}
|
|
936
952
|
updated(t) {
|
|
937
953
|
(t.has("required") || t.has("selectedValue")) && this._manageRequire(), t.has("size") && this._updateRadioButtonsSize(), t.has("tile") && this._updateRadioButtonsTile(), t.has("showError") && this._updateRadioButtonsShowError();
|
|
@@ -946,8 +962,9 @@ const y = (m = class extends it {
|
|
|
946
962
|
_setValue() {
|
|
947
963
|
this._internals.setFormValue(this.selectedValue);
|
|
948
964
|
}
|
|
949
|
-
// Updates the "require" attribute of the first radiobutton underneath a radiogroup
|
|
950
|
-
|
|
965
|
+
// Updates the "require" attribute of the first radiobutton underneath a radiogroup.
|
|
966
|
+
// This will make sure there's a requirement for all radiobutton under the same name/group
|
|
967
|
+
_setRadioButtonRequire() {
|
|
951
968
|
this.querySelectorAll("nys-radiobutton").forEach((e, o) => {
|
|
952
969
|
this.required && o === 0 && e.setAttribute("required", "required");
|
|
953
970
|
});
|
|
@@ -960,12 +977,49 @@ const y = (m = class extends it {
|
|
|
960
977
|
o
|
|
961
978
|
) : (this.showError = !1, this._internals.setValidity({}, "", o)));
|
|
962
979
|
}
|
|
980
|
+
checkValidity() {
|
|
981
|
+
const t = Array.from(this.querySelectorAll("nys-radiobutton"));
|
|
982
|
+
return !this.required || t.some((o) => o.checked);
|
|
983
|
+
}
|
|
963
984
|
// Need to account for if radiogroup already have a radiobutton checked at initialization
|
|
964
985
|
_initializeCheckedRadioValue() {
|
|
965
986
|
const t = this.querySelector("nys-radiobutton[checked]");
|
|
966
987
|
t && (this.selectedValue = t.getAttribute("value"), this._internals.setFormValue(this.selectedValue));
|
|
967
988
|
}
|
|
989
|
+
/********************** Core Keyboard & Click Logic **********************/
|
|
990
|
+
_getAllRadios() {
|
|
991
|
+
return Array.from(this.querySelectorAll("nys-radiobutton"));
|
|
992
|
+
}
|
|
993
|
+
// Arrow / Space / Enter navigation at group level
|
|
994
|
+
async _handleKeyDown(t) {
|
|
995
|
+
if (![
|
|
996
|
+
"ArrowUp",
|
|
997
|
+
"ArrowDown",
|
|
998
|
+
"ArrowLeft",
|
|
999
|
+
"ArrowRight",
|
|
1000
|
+
" ",
|
|
1001
|
+
"Enter"
|
|
1002
|
+
].includes(t.key)) return;
|
|
1003
|
+
t.preventDefault();
|
|
1004
|
+
const o = this._getAllRadios().filter((c) => !c.disabled), i = o.find((c) => c.checked) || o[0], n = t.key === " " || t.key === "Enter" ? 0 : ["ArrowUp", "ArrowLeft"].includes(t.key) ? -1 : 1;
|
|
1005
|
+
let s = o.indexOf(i) + n;
|
|
1006
|
+
s < 0 && (s = o.length - 1), s >= o.length && (s = 0);
|
|
1007
|
+
const d = o[s], a = await d.getInputElement();
|
|
1008
|
+
a == null || a.click(), this._updateGroupTabIndex(), d.focus();
|
|
1009
|
+
}
|
|
1010
|
+
_updateGroupTabIndex() {
|
|
1011
|
+
const t = this._getAllRadios(), e = t.find((o) => o.checked) || t[0];
|
|
1012
|
+
t.forEach((o) => {
|
|
1013
|
+
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");
|
|
1014
|
+
});
|
|
1015
|
+
}
|
|
968
1016
|
/********************** Functions **********************/
|
|
1017
|
+
// Apply ARIA & initial tabindex to each child radio
|
|
1018
|
+
_initializeChildAttributes() {
|
|
1019
|
+
this._getAllRadios().forEach((e) => {
|
|
1020
|
+
e.setAttribute("role", "radio"), e.setAttribute("aria-checked", String(e.checked)), e.setAttribute("aria-required", String(e.required)), e.setAttribute("aria-disabled", String(e.disabled)), e.setAttribute("tabindex", "-1");
|
|
1021
|
+
});
|
|
1022
|
+
}
|
|
969
1023
|
// Updates the size of each radiobutton underneath a radiogroup to ensure size standardization
|
|
970
1024
|
_updateRadioButtonsSize() {
|
|
971
1025
|
this.querySelectorAll("nys-radiobutton").forEach((e) => {
|
|
@@ -982,36 +1036,39 @@ const y = (m = class extends it {
|
|
|
982
1036
|
this.showError ? e.setAttribute("showError", "") : e.removeAttribute("showError");
|
|
983
1037
|
});
|
|
984
1038
|
}
|
|
1039
|
+
// Get the slotted text contents so native VO can attempt to announce it within the legend in the fieldset
|
|
1040
|
+
_getSlotDescriptionForAria() {
|
|
1041
|
+
var o;
|
|
1042
|
+
const t = (o = this.shadowRoot) == null ? void 0 : o.querySelector(
|
|
1043
|
+
'slot[name="description"]'
|
|
1044
|
+
), e = (t == null ? void 0 : t.assignedNodes({ flatten: !0 })) || [];
|
|
1045
|
+
this._slottedDescriptionText = e.map((i) => {
|
|
1046
|
+
var n;
|
|
1047
|
+
return (n = i.textContent) == null ? void 0 : n.trim();
|
|
1048
|
+
}).filter(Boolean).join(", ");
|
|
1049
|
+
}
|
|
1050
|
+
/******************** Event Handlers ********************/
|
|
985
1051
|
// Keeps radiogroup informed of the name and value of its current selected radiobutton at each change
|
|
986
1052
|
_handleRadioButtonChange(t) {
|
|
987
|
-
const e = t, { name: o, value:
|
|
988
|
-
this.name = o, this.selectedValue =
|
|
1053
|
+
const e = t, { name: o, value: i } = e.detail;
|
|
1054
|
+
this.name = o, this.selectedValue = i, this._internals.setFormValue(this.selectedValue), this._updateGroupTabIndex();
|
|
989
1055
|
}
|
|
990
1056
|
async _handleInvalid(t) {
|
|
991
1057
|
if (t.preventDefault(), this._internals.validity.valueMissing) {
|
|
992
1058
|
this.showError = !0, this._manageRequire();
|
|
993
|
-
const e = this.querySelector("nys-radiobutton")
|
|
994
|
-
if (
|
|
995
|
-
const
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
return d;
|
|
1000
|
-
} else
|
|
1001
|
-
return typeof d.checkValidity == "function" && !d.checkValidity();
|
|
1002
|
-
}) === this && o.focus() : o.focus();
|
|
1059
|
+
const e = this.querySelector("nys-radiobutton");
|
|
1060
|
+
if (e) {
|
|
1061
|
+
const o = this._internals.form;
|
|
1062
|
+
o ? Array.from(o.elements).find(
|
|
1063
|
+
(s) => typeof s.checkValidity == "function" && !s.checkValidity()
|
|
1064
|
+
) === this && (e.focus(), e.classList.add("active-focus")) : (e.focus(), e.classList.add("active-focus"));
|
|
1003
1065
|
}
|
|
1004
1066
|
}
|
|
1005
1067
|
}
|
|
1006
1068
|
render() {
|
|
1007
|
-
return j
|
|
1008
|
-
role="radiogroup"
|
|
1009
|
-
class="nys-radiogroup"
|
|
1010
|
-
aria-required="${this.required ? "true" : "false"}"
|
|
1011
|
-
aria-invalid="${this.showError ? "true" : "false"}"
|
|
1012
|
-
>
|
|
1069
|
+
return j`<div class="nys-radiogroup">
|
|
1013
1070
|
<nys-label
|
|
1014
|
-
|
|
1071
|
+
for=${this.id}
|
|
1015
1072
|
label=${this.label}
|
|
1016
1073
|
description=${this.description}
|
|
1017
1074
|
flag=${this.required ? "required" : this.optional ? "optional" : ""}
|
|
@@ -1019,7 +1076,12 @@ const y = (m = class extends it {
|
|
|
1019
1076
|
<slot name="description" slot="description">${this.description}</slot>
|
|
1020
1077
|
</nys-label>
|
|
1021
1078
|
<div class="nys-radiogroup__content">
|
|
1022
|
-
<
|
|
1079
|
+
<fieldset role="radiogroup" @keydown=${this._handleKeyDown}>
|
|
1080
|
+
<legend class="sr-only">
|
|
1081
|
+
${this.label}${this._slottedDescriptionText ? ` ${this._slottedDescriptionText}` : this.description ? ` ${this.description}` : ""}
|
|
1082
|
+
</legend>
|
|
1083
|
+
<slot></slot>
|
|
1084
|
+
</fieldset>
|
|
1023
1085
|
</div>
|
|
1024
1086
|
<nys-errormessage
|
|
1025
1087
|
?showError=${this.showError}
|
|
@@ -1028,50 +1090,53 @@ const y = (m = class extends it {
|
|
|
1028
1090
|
></nys-errormessage>
|
|
1029
1091
|
</div>`;
|
|
1030
1092
|
}
|
|
1031
|
-
}, m.VALID_SIZES = ["sm", "md"], m.styles =
|
|
1093
|
+
}, m.VALID_SIZES = ["sm", "md"], m.styles = ut, m.formAssociated = !0, m);
|
|
1032
1094
|
_([
|
|
1033
|
-
|
|
1095
|
+
u({ type: String })
|
|
1034
1096
|
], y.prototype, "id", 2);
|
|
1035
1097
|
_([
|
|
1036
|
-
|
|
1098
|
+
u({ type: String, reflect: !0 })
|
|
1037
1099
|
], y.prototype, "name", 2);
|
|
1038
1100
|
_([
|
|
1039
|
-
|
|
1101
|
+
u({ type: Boolean, reflect: !0 })
|
|
1040
1102
|
], y.prototype, "required", 2);
|
|
1041
1103
|
_([
|
|
1042
|
-
|
|
1104
|
+
u({ type: Boolean, reflect: !0 })
|
|
1043
1105
|
], y.prototype, "optional", 2);
|
|
1044
1106
|
_([
|
|
1045
|
-
|
|
1107
|
+
u({ type: Boolean, reflect: !0 })
|
|
1046
1108
|
], y.prototype, "showError", 2);
|
|
1047
1109
|
_([
|
|
1048
|
-
|
|
1110
|
+
u({ type: String })
|
|
1049
1111
|
], y.prototype, "errorMessage", 2);
|
|
1050
1112
|
_([
|
|
1051
|
-
|
|
1113
|
+
u({ type: String })
|
|
1052
1114
|
], y.prototype, "label", 2);
|
|
1053
1115
|
_([
|
|
1054
|
-
|
|
1116
|
+
u({ type: String })
|
|
1055
1117
|
], y.prototype, "description", 2);
|
|
1056
1118
|
_([
|
|
1057
|
-
|
|
1119
|
+
u({ type: Boolean, reflect: !0 })
|
|
1120
|
+
], y.prototype, "tile", 2);
|
|
1121
|
+
_([
|
|
1122
|
+
at()
|
|
1058
1123
|
], y.prototype, "selectedValue", 2);
|
|
1059
1124
|
_([
|
|
1060
|
-
|
|
1061
|
-
], y.prototype, "
|
|
1125
|
+
at()
|
|
1126
|
+
], y.prototype, "_slottedDescriptionText", 2);
|
|
1062
1127
|
_([
|
|
1063
|
-
|
|
1064
|
-
], y.prototype, "
|
|
1065
|
-
let
|
|
1066
|
-
customElements.get("nys-radiogroup") || customElements.define("nys-radiogroup",
|
|
1067
|
-
var
|
|
1068
|
-
for (var
|
|
1069
|
-
(
|
|
1070
|
-
return o &&
|
|
1128
|
+
u({ reflect: !0 })
|
|
1129
|
+
], y.prototype, "size", 1);
|
|
1130
|
+
let Dt = y;
|
|
1131
|
+
customElements.get("nys-radiogroup") || customElements.define("nys-radiogroup", Dt);
|
|
1132
|
+
var Mt = Object.defineProperty, It = Object.getOwnPropertyDescriptor, v = (r, t, e, o) => {
|
|
1133
|
+
for (var i = o > 1 ? void 0 : o ? It(t, e) : t, n = r.length - 1, s; n >= 0; n--)
|
|
1134
|
+
(s = r[n]) && (i = (o ? s(t, e, i) : s(i)) || i);
|
|
1135
|
+
return o && i && Mt(t, e, i), i;
|
|
1071
1136
|
};
|
|
1072
|
-
let
|
|
1073
|
-
var
|
|
1074
|
-
const f = (
|
|
1137
|
+
let Lt = 0;
|
|
1138
|
+
var h;
|
|
1139
|
+
const f = (h = class extends rt {
|
|
1075
1140
|
constructor() {
|
|
1076
1141
|
super(...arguments), this.checked = !1, this.disabled = !1, this.required = !1, this.label = "", this.description = "", this.id = "", this.name = "", this.value = "", this._size = "md", this.tile = !1;
|
|
1077
1142
|
}
|
|
@@ -1079,7 +1144,7 @@ const f = (l = class extends it {
|
|
|
1079
1144
|
return this._size;
|
|
1080
1145
|
}
|
|
1081
1146
|
set size(t) {
|
|
1082
|
-
this._size =
|
|
1147
|
+
this._size = h.VALID_SIZES.includes(
|
|
1083
1148
|
t
|
|
1084
1149
|
) ? t : "md";
|
|
1085
1150
|
}
|
|
@@ -1094,12 +1159,15 @@ const f = (l = class extends it {
|
|
|
1094
1159
|
/********************** Lifecycle updates **********************/
|
|
1095
1160
|
// Generate a unique ID if one is not provided
|
|
1096
1161
|
connectedCallback() {
|
|
1097
|
-
super.connectedCallback(), this.id || (this.id = `nys-radiobutton-${Date.now()}-${
|
|
1162
|
+
super.connectedCallback(), this.id || (this.id = `nys-radiobutton-${Date.now()}-${Lt++}`), this.checked && (h.buttonGroup[this.name] && (h.buttonGroup[this.name].checked = !1, h.buttonGroup[this.name].requestUpdate()), h.buttonGroup[this.name] = this), this.addEventListener("focus", this._handleFocus), this.addEventListener("blur", this._handleBlur), this.addEventListener("click", this._handleChange);
|
|
1163
|
+
}
|
|
1164
|
+
disconnectedCallback() {
|
|
1165
|
+
super.disconnectedCallback(), this.removeEventListener("focus", this._handleFocus), this.removeEventListener("blur", this._handleBlur);
|
|
1098
1166
|
}
|
|
1099
1167
|
updated(t) {
|
|
1100
|
-
t.has("checked") && this.checked &&
|
|
1168
|
+
t.has("checked") && this.checked && h.buttonGroup[this.name] !== this && (h.buttonGroup[this.name] && (h.buttonGroup[this.name].checked = !1, h.buttonGroup[this.name].requestUpdate()), h.buttonGroup[this.name] = this);
|
|
1101
1169
|
}
|
|
1102
|
-
|
|
1170
|
+
/********************** Functions **********************/
|
|
1103
1171
|
// This helper function is called to perform the element's native validation.
|
|
1104
1172
|
checkValidity() {
|
|
1105
1173
|
var e;
|
|
@@ -1113,6 +1181,7 @@ const f = (l = class extends it {
|
|
|
1113
1181
|
this.dispatchEvent(
|
|
1114
1182
|
new CustomEvent("nys-change", {
|
|
1115
1183
|
detail: {
|
|
1184
|
+
id: this.id,
|
|
1116
1185
|
checked: this.checked,
|
|
1117
1186
|
name: this.name,
|
|
1118
1187
|
value: this.value
|
|
@@ -1124,7 +1193,7 @@ const f = (l = class extends it {
|
|
|
1124
1193
|
}
|
|
1125
1194
|
// Handle radiobutton change event & unselection of other options in group
|
|
1126
1195
|
_handleChange() {
|
|
1127
|
-
this.checked || (
|
|
1196
|
+
this.classList.remove("active-focus"), this.checked || (h.buttonGroup[this.name] && (h.buttonGroup[this.name].checked = !1, h.buttonGroup[this.name].requestUpdate()), h.buttonGroup[this.name] = this, this.checked = !0, this._emitChangeEvent());
|
|
1128
1197
|
}
|
|
1129
1198
|
// Handle focus event
|
|
1130
1199
|
_handleFocus() {
|
|
@@ -1132,78 +1201,82 @@ const f = (l = class extends it {
|
|
|
1132
1201
|
}
|
|
1133
1202
|
// Handle blur event
|
|
1134
1203
|
_handleBlur() {
|
|
1135
|
-
this.dispatchEvent(new Event("nys-blur"));
|
|
1204
|
+
this.classList.remove("active-focus"), this.dispatchEvent(new Event("nys-blur"));
|
|
1136
1205
|
}
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1206
|
+
_callInputHandling() {
|
|
1207
|
+
var e;
|
|
1208
|
+
if (this.disabled) return;
|
|
1209
|
+
const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector(
|
|
1210
|
+
'input[type="radio"]'
|
|
1211
|
+
);
|
|
1212
|
+
t && (t.focus(), t.click());
|
|
1140
1213
|
}
|
|
1141
1214
|
render() {
|
|
1142
1215
|
return j`
|
|
1143
|
-
<
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
|
|
1152
|
-
|
|
1153
|
-
|
|
1154
|
-
|
|
1155
|
-
|
|
1156
|
-
|
|
1157
|
-
|
|
1158
|
-
|
|
1159
|
-
|
|
1160
|
-
|
|
1216
|
+
<input
|
|
1217
|
+
id="${this.id}"
|
|
1218
|
+
type="radio"
|
|
1219
|
+
name="${Bt(this.name ? this.name : void 0)}"
|
|
1220
|
+
.checked=${this.checked}
|
|
1221
|
+
?disabled=${this.disabled}
|
|
1222
|
+
.value=${this.value}
|
|
1223
|
+
?required="${this.required}"
|
|
1224
|
+
@change="${this._handleChange}"
|
|
1225
|
+
hidden
|
|
1226
|
+
aria-hidden="true"
|
|
1227
|
+
/>
|
|
1228
|
+
|
|
1229
|
+
<label
|
|
1230
|
+
class="nys-radiobutton"
|
|
1231
|
+
for="${this.id}"
|
|
1232
|
+
@click="${this._callInputHandling}"
|
|
1233
|
+
>
|
|
1234
|
+
<span class="nys-radiobutton__radio"></span>
|
|
1235
|
+
|
|
1161
1236
|
${this.label && j` <div class="nys-radiobutton__text">
|
|
1162
|
-
<
|
|
1163
|
-
|
|
1164
|
-
>
|
|
1165
|
-
<label for=${this.id} class="nys-radiobutton__description">
|
|
1237
|
+
<div class="nys-radiobutton__label">${this.label}</div>
|
|
1238
|
+
<div class="nys-radiobutton__description">
|
|
1166
1239
|
<slot name="description">${this.description}</slot>
|
|
1167
|
-
</
|
|
1240
|
+
</div>
|
|
1168
1241
|
</div>`}
|
|
1169
1242
|
</label>
|
|
1170
1243
|
`;
|
|
1171
1244
|
}
|
|
1172
|
-
},
|
|
1245
|
+
}, h.VALID_SIZES = ["sm", "md"], h.buttonGroup = {}, h.styles = ut, h);
|
|
1173
1246
|
v([
|
|
1174
|
-
|
|
1247
|
+
u({ type: Boolean, reflect: !0 })
|
|
1175
1248
|
], f.prototype, "checked", 2);
|
|
1176
1249
|
v([
|
|
1177
|
-
|
|
1250
|
+
u({ type: Boolean, reflect: !0 })
|
|
1178
1251
|
], f.prototype, "disabled", 2);
|
|
1179
1252
|
v([
|
|
1180
|
-
|
|
1253
|
+
u({ type: Boolean, reflect: !0 })
|
|
1181
1254
|
], f.prototype, "required", 2);
|
|
1182
1255
|
v([
|
|
1183
|
-
|
|
1256
|
+
u({ type: String })
|
|
1184
1257
|
], f.prototype, "label", 2);
|
|
1185
1258
|
v([
|
|
1186
|
-
|
|
1259
|
+
u({ type: String })
|
|
1187
1260
|
], f.prototype, "description", 2);
|
|
1188
1261
|
v([
|
|
1189
|
-
|
|
1262
|
+
u({ type: String })
|
|
1190
1263
|
], f.prototype, "id", 2);
|
|
1191
1264
|
v([
|
|
1192
|
-
|
|
1265
|
+
u({ type: String, reflect: !0 })
|
|
1193
1266
|
], f.prototype, "name", 2);
|
|
1194
1267
|
v([
|
|
1195
|
-
|
|
1268
|
+
u({ type: String })
|
|
1196
1269
|
], f.prototype, "value", 2);
|
|
1197
1270
|
v([
|
|
1198
|
-
|
|
1271
|
+
u({ reflect: !0 })
|
|
1199
1272
|
], f.prototype, "size", 1);
|
|
1200
1273
|
v([
|
|
1201
|
-
|
|
1274
|
+
u({ type: Boolean, reflect: !0 })
|
|
1202
1275
|
], f.prototype, "tile", 2);
|
|
1203
|
-
let
|
|
1204
|
-
customElements.get("nys-radiobutton") || customElements.define("nys-radiobutton",
|
|
1276
|
+
let Nt = f;
|
|
1277
|
+
customElements.get("nys-radiobutton") || customElements.define("nys-radiobutton", Nt);
|
|
1205
1278
|
export {
|
|
1206
|
-
|
|
1207
|
-
|
|
1279
|
+
Nt as NysRadiobutton,
|
|
1280
|
+
Dt as NysRadiogroup
|
|
1208
1281
|
};
|
|
1209
1282
|
//# sourceMappingURL=nys-radiobutton.js.map
|