@nysds/nys-checkbox 1.11.3 → 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-checkbox.js +155 -167
- package/dist/nys-checkbox.js.map +1 -1
- package/package.json +4 -4
package/dist/nys-checkbox.js
CHANGED
|
@@ -1,30 +1,21 @@
|
|
|
1
|
-
import { LitElement as p, unsafeCSS as v, html as
|
|
2
|
-
import { property as
|
|
3
|
-
import { ifDefined as
|
|
1
|
+
import { LitElement as p, unsafeCSS as v, html as b } from "lit";
|
|
2
|
+
import { property as r, state as g } from "lit/decorators.js";
|
|
3
|
+
import { ifDefined as k } from "lit/directives/if-defined.js";
|
|
4
4
|
const _ = ':host{--_nys-checkbox-size: var(--nys-size-400, 32px);--_nys-checkbox-border-radius: var(--nys-radius-md, 4px);--_nys-checkbox-border-width: var(--nys-border-width-md, 2px);--_nys-checkbox-outline-color: var(--nys-color-focus, #004dd1);--_nys-checkbox-outline-width: var(--nys-border-width-md, 2px);--_nys-checkbox-outline-offset: var(--nys-space-2px, 2px);--_nys-checkbox-gap: var(--nys-space-150, 12px);--_nys-checkboxgroup-gap: var(--nys-space-200, 16px);--_nys-checkbox-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-checkbox-font-size: var(--nys-font-size-ui-md, 16px);--_nys-checkbox-font-weight: var(--nys-font-weight-regular, 400);--_nys-checkbox-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-checkbox-color: var( --nys-color-ink, var(--nys-color-neutral-900, #1b1b1b) );--_nys-checkbox-background-color: var(--nys-color-ink-reverse, #ffffff);--_nys-checkbox-border-color: var(--nys-color-neutral-600, #62666a);--_nys-checkbox-background-color--hover: var( --nys-color-neutral-50, #ededed );--_nys-checkbox-border-color--hover: var(--nys-color-ink, #1b1b1b);--_nys-checkbox-background-color--active: var( --nys-color-neutral-100, #d0d0ce );--_nys-checkbox-border-color--active: var(--nys-color-ink, #1b1b1b);--_nys-checkbox-background-color--checked: var(--nys-color-theme, #154973);--_nys-checkbox-border-color--checked: var(--nys-color-theme, #154973);--_nys-checkbox-background-color--checked--hover: var( --nys-color-theme-strong, #0e324f );--_nys-checkbox-border-color--checked--hover: var( --nys-color-theme-strong, #0e324f );--_nys-checkbox-background-color--checked--active: var( --nys-color-theme-stronger, #081b2b );--_nys-checkbox-border-color--checked--active: var( --nys-color-theme-stronger, #081b2b );--_nys-checkbox-background-color--disabled: var( --nys-color-ink-reverse, #f0f0f0 );--_nys-checkbox-border-color--disabled: var( --nys-color-neutral-400, #757575 );--_nys-checkbox-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-checkbox-background-color--checked--disabled: var( --nys-color-neutral-100, #d0d0ce );--_nys-checkbox-border-color--checked--disabled: var( --nys-color-neutral-100, #d0d0ce )}:host([size=sm]){--_nys-checkbox-size: var(--nys-size-300, 24px);--_nys-checkbox-border-radius: var(--nys-radius-sm, 2px);--_nys-checkboxgroup-gap: var(--nys-space-100, 8px);--_nys-checkbox-gap: var(--nys-space-100, 8px)}:host([size=md]){--_nys-checkbox-size: var(--nys-size-400, 32px);--_nys-checkbox-border-radius: var(--nys-radius-md, 4px)}:host([tile]){--_nys-checkbox-border-width--tile: var(--nys-border-width-sm, 1px);--_nys-checkbox-border-radius--tile: var(--nys-radius-md, 4px);--_nys-checkbox-border-color--tile: var(--nys-color-neutral-100, #d0d0ce);--_nys-checkbox-background-color--tile: var( --nys-color-ink-reverse, #ffffff );--_nys-checkbox-padding--x--tile: var(--nys-space-250, 20px);--_nys-checkbox-padding--y--tile: var(--nys-space-200, 16px);--_nys-checkbox-border-color--tile--hover: var( --nys-color-neutral-700, #4a4d4f );--_nys-checkbox-background-color--tile--hover: var( --nys-color-ink-reverse, #ffffff );--_nys-checkbox-border-color--tile--active: var( --nys-color-neutral-900, #1b1b1b );--_nys-checkbox-background-color--tile--active: var( --nys-color-ink-reverse, #ffffff );--_nys-checkbox-border-color--tile--checked: var( --nys-color-theme-mid, #457aa5 );--_nys-checkbox-background-color--tile--checked: var( --nys-color-theme-faint, #f7fafd );--_nys-checkbox-background-color--tile--disabled: var( --nys-color-ink-reverse, #f0f0f0 );--_nys-checkbox-border-color--tile--disabled: var( --nys-color-neutral-100, #d0d0ce )}:host([tile][size=sm]){--_nys-checkbox-padding--x--tile: var(--nys-space-200, 16px);--_nys-checkbox-padding--y--tile: var(--nys-space-150, 12px)}:host([tile][showError]){--_nys-checkbox-border-color--tile: var(--nys-color-danger, #b52c2c);--_nys-checkbox-border-color--tile--hover: var(--nys-color-danger, #b52c2c);--_nys-checkbox-border-color--tile--active: var( --nys-color-danger, #b52c2c );--_nys-checkbox-border-color--tile--checked: var( --nys-color-danger, #b52c2c )}#single-error-message{--_nys-errormessage-margin-top: var(--nys-space-50, 4px)}.nys-checkboxgroup{display:flex;flex-direction:column;gap:var(--nys-space-200, 16px);font-family:var(--_nys-checkbox-font-family);font-size:var(--_nys-checkbox-font-size);line-height:var(--_nys-checkbox-line-height)}.nys-checkboxgroup__content{display:flex;flex-direction:column;gap:var(--_nys-checkboxgroup-gap)}.nys-checkbox{display:flex;font-family:var(--_nys-checkbox-font-family);font-size:var(--_nys-checkbox-font-size);line-height:var(--_nys-checkbox-line-height);border-radius:var(--_nys-checkbox-border-radius--tile);border:var(--_nys-checkbox-border-width--tile) solid var(--_nys-checkbox-border-color--tile);background:var(--_nys-checkbox-background-color--tile);padding:var(--_nys-checkbox-padding--y--tile) var(--_nys-checkbox-padding--x--tile);gap:var(--_nys-checkbox-gap)}.nys-checkbox__checkboxwrapper{position:relative;display:flex;justify-content:center;align-items:center;max-height:var(--_nys-checkbox-size)}.nys-checkbox__icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;color:#fff}.nys-checkbox__checkbox{appearance:none;background-repeat:no-repeat;background-position:center;width:var(--_nys-checkbox-size);min-width:var(--_nys-checkbox-size);min-height:var(--_nys-checkbox-size);height:var(--_nys-checkbox-size);max-width:var(--_nys-checkbox-size);max-height:var(--_nys-checkbox-size);border:solid var(--_nys-checkbox-border-width) var(--_nys-checkbox-border-color);background-color:var(--_nys-checkbox-background-color);border-radius:var(--_nys-checkbox-border-radius);outline-offset:var(--_nys-checkbox-outline-offset);outline:none}.nys-checkbox:hover,.nys-checkbox:hover *{cursor:pointer}.nys-checkbox__checkbox:not(:disabled):checked{background-color:var(--_nys-checkbox-background-color--checked);border-color:var(--_nys-checkbox-border-color--checked)}:host([tile]) .nys-checkbox:has(.nys-checkbox__checkbox:not(:disabled):checked){border-color:var(--_nys-checkbox-border-color--tile--checked);background-color:var(--_nys-checkbox-background-color--tile--checked)}.nys-checkbox__checkbox:disabled:checked{background-color:var(--_nys-checkbox-background-color--checked--disabled);border-color:var(--_nys-checkbox-border-color--checked--disabled)}:host([tile]) .nys-checkbox:has(.nys-checkbox__checkbox:disabled:checked){border-color:var(--_nys-checkbox-border-color--tile--disabled);background-color:var(--_nys-checkbox-background-color--tile--disabled)}.nys-checkbox__checkbox:disabled{background-color:var(--_nys-checkbox-background-color--disabled);border-color:var(--_nys-checkbox-border-color--disabled);cursor:not-allowed}.nys-checkbox:has(.nys-checkbox__checkbox:disabled) *{color:var(--_nys-checkbox-color--disabled);cursor:not-allowed;--_nys-label-cursor: not-allowed;--_nys-label-color: var(--_nys-checkbox-color--disabled)}:host([tile]) .nys-checkbox:has(.nys-checkbox__checkbox:disabled){background-color:var(--_nys-checkbox-background-color--disabled);border-color:var(--_nys-checkbox-border-color--disabled);cursor:not-allowed}.nys-checkbox__checkbox:hover:not(:disabled):not(:checked){background-color:var(--_nys-checkbox-background-color--hover);border-color:var(--_nys-checkbox-border-color--hover)}:host([tile]) .nys-checkbox:hover:has(.nys-checkbox__checkbox:not(:disabled):not(:checked)){border-color:var(--_nys-checkbox-border-color--tile--hover);background-color:var(--_nys-checkbox-background-color--tile--hover);outline:solid var(--_nys-checkbox-border-width--tile) var(--_nys-checkbox-border-color--tile--hover)}.nys-checkbox__checkbox:hover:not(:disabled):checked{border-color:var(--_nys-checkbox-border-color--checked--hover);background-color:var(--_nys-checkbox-background-color--checked--hover)}:host([tile]) .nys-checkbox:hover:has(.nys-checkbox__checkbox:not(:disabled):checked){outline:solid var(--_nys-checkbox-border-width--tile) var(--_nys-checkbox-border-color--tile--checked)}.nys-checkbox__checkbox:active:not(:disabled):not(:checked){background-color:var(--_nys-checkbox-background-color--active);border-color:var(--_nys-checkbox-border-color--active)}:host([tile]) .nys-checkbox:has(.nys-checkbox__checkbox:active:not(:disabled):not(:checked)){border-color:var(--_nys-checkbox-border-color--tile--active);background-color:var(--_nys-checkbox-background-color--tile--active);outline:solid var(--_nys-checkbox-border-width--tile) var(--_nys-checkbox-border-color--tile--active)}.nys-checkbox__checkbox:active:not(:disabled):checked{border-color:var(--_nys-checkbox-border-color--checked--active);background-color:var(--_nys-checkbox-background-color--checked--active)}:host(:not([tile])) .nys-checkbox__checkbox:focus{outline:solid var(--_nys-checkbox-outline-width) var(--_nys-checkbox-outline-color)}:host([tile]) .nys-checkbox:has(*:focus){outline:solid var(--_nys-checkbox-border-width--tile) var(--_nys-checkbox-outline-color)!important;border-color:var(--_nys-checkbox-outline-color)!important}:host(:not([tile])) .nys-checkbox>nys-label{--_nys-label-font-weight: var(--_nys-checkbox-font-weight)}:host([tile]) .nys-checkbox>nys-label{--_nys-description-font-style: normal}.nys-checkbox__required{color:var(--nys-color-danger, #b52c2c)}.nys-checkbox__requiredwrapper{display:flex;gap:3px}fieldset{all:unset;display:contents}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0}';
|
|
5
|
-
var m = Object.defineProperty,
|
|
6
|
-
for (var s =
|
|
7
|
-
(
|
|
8
|
-
return
|
|
5
|
+
var m = Object.defineProperty, l = (d, e, o, t) => {
|
|
6
|
+
for (var s = void 0, h = d.length - 1, a; h >= 0; h--)
|
|
7
|
+
(a = d[h]) && (s = a(e, o, s) || s);
|
|
8
|
+
return s && m(e, o, s), s;
|
|
9
9
|
};
|
|
10
|
-
let
|
|
11
|
-
|
|
12
|
-
const n = (d = class extends p {
|
|
10
|
+
let w = 0;
|
|
11
|
+
const u = class u extends p {
|
|
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(e) {
|
|
21
|
-
this._size = d.VALID_SIZES.includes(
|
|
22
|
-
e
|
|
23
|
-
) ? e : "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._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-checkbox-${Date.now()}-${
|
|
18
|
+
super.connectedCallback(), this.id || (this.id = `nys-checkbox-${Date.now()}-${w++}`), this.addEventListener("nys-change", this._handleCheckboxChange), this.addEventListener("invalid", this._handleInvalid);
|
|
28
19
|
}
|
|
29
20
|
disconnectedCallback() {
|
|
30
21
|
super.disconnectedCallback(), this.removeEventListener("nys-change", this._handleCheckboxChange), this.removeEventListener("invalid", this._handleInvalid);
|
|
@@ -35,7 +26,7 @@ const n = (d = class extends p {
|
|
|
35
26
|
updated(e) {
|
|
36
27
|
e.has("required") && this.required && this._setupCheckboxRequired(), e.has("size") && this._updateCheckboxSize(), e.has("tile") && this._updateCheckboxTile(), e.has("inverted") && this._updateCheckboxInvert(), e.has("showError") && this._updateCheckboxShowError(), e.has("form") && this._updateCheckboxForm();
|
|
37
28
|
}
|
|
38
|
-
|
|
29
|
+
// Functions
|
|
39
30
|
_setGroupExist() {
|
|
40
31
|
this.querySelectorAll("nys-checkbox").forEach((o) => {
|
|
41
32
|
o.groupExist = !0;
|
|
@@ -43,23 +34,23 @@ const n = (d = class extends p {
|
|
|
43
34
|
}
|
|
44
35
|
// Initial update on checkbox required attribute
|
|
45
36
|
async _setupCheckboxRequired() {
|
|
46
|
-
const e = this.querySelector("nys-checkbox"), o = this.errorMessage || "This field is required",
|
|
37
|
+
const e = this.querySelector("nys-checkbox"), o = this.errorMessage || "This field is required", t = e ? await e.getInputElement() : null;
|
|
47
38
|
this._internals.setValidity(
|
|
48
39
|
{ valueMissing: !0 },
|
|
49
40
|
o,
|
|
50
|
-
|
|
41
|
+
t || this
|
|
51
42
|
);
|
|
52
43
|
}
|
|
53
44
|
// Updates the required attribute of each checkbox in the group
|
|
54
45
|
async _manageRequire() {
|
|
55
46
|
if (this.required) {
|
|
56
|
-
const e = this.errorMessage || "Please select at least one option.", o = this.querySelector("nys-checkbox"),
|
|
47
|
+
const e = this.errorMessage || "Please select at least one option.", o = this.querySelector("nys-checkbox"), t = o ? await o.getInputElement().catch(() => null) : null, s = this.querySelectorAll("nys-checkbox");
|
|
57
48
|
Array.from(s).some(
|
|
58
|
-
(
|
|
49
|
+
(a) => a.checked
|
|
59
50
|
) ? (this._internals.setValidity({}), this.showError = !1) : (this._internals.setValidity(
|
|
60
51
|
{ valueMissing: !0 },
|
|
61
52
|
e,
|
|
62
|
-
|
|
53
|
+
t || this
|
|
63
54
|
), this.showError = !0);
|
|
64
55
|
}
|
|
65
56
|
}
|
|
@@ -94,41 +85,41 @@ const n = (d = class extends p {
|
|
|
94
85
|
const o = this.shadowRoot?.querySelector(
|
|
95
86
|
'slot[name="description"]'
|
|
96
87
|
)?.assignedNodes({ flatten: !0 }) || [];
|
|
97
|
-
this._slottedDescriptionText = o.map((
|
|
88
|
+
this._slottedDescriptionText = o.map((t) => t.textContent?.trim()).filter(Boolean).join(", ");
|
|
98
89
|
}
|
|
99
90
|
async _handleInvalid(e) {
|
|
100
91
|
e.preventDefault(), this.showError = !0, this._manageRequire();
|
|
101
|
-
const o = this.querySelector("nys-checkbox"),
|
|
102
|
-
if (
|
|
92
|
+
const o = this.querySelector("nys-checkbox"), t = o ? await o.getInputElement() : null;
|
|
93
|
+
if (t) {
|
|
103
94
|
const s = this._internals.form;
|
|
104
|
-
s ? Array.from(s.elements).find((
|
|
105
|
-
if (
|
|
95
|
+
s ? Array.from(s.elements).find((y) => {
|
|
96
|
+
if (y.tagName.toLowerCase() === "nys-checkboxgroup") {
|
|
106
97
|
if (Array.from(
|
|
107
98
|
this.querySelectorAll("nys-checkbox")
|
|
108
99
|
).filter(
|
|
109
100
|
(f) => f.checked
|
|
110
101
|
).length === 0)
|
|
111
|
-
return
|
|
102
|
+
return y;
|
|
112
103
|
} else
|
|
113
|
-
return typeof
|
|
114
|
-
}) === this &&
|
|
104
|
+
return typeof y.checkValidity == "function" && !y.checkValidity();
|
|
105
|
+
}) === this && t.focus() : t.focus();
|
|
115
106
|
}
|
|
116
107
|
}
|
|
117
|
-
|
|
108
|
+
// Event Handlers
|
|
118
109
|
// Similar to how native forms handle multiple same-name fields, we group the selected values into a list for FormData.
|
|
119
110
|
_handleCheckboxChange(e) {
|
|
120
|
-
const o = e, { name:
|
|
121
|
-
this.name =
|
|
111
|
+
const o = e, { name: t } = o.detail, h = Array.from(this.querySelectorAll("nys-checkbox")).filter((a) => a.checked).map((a) => a.value);
|
|
112
|
+
this.name = t, this._internals.setFormValue(h.join(", ")), this._manageRequire();
|
|
122
113
|
}
|
|
123
114
|
render() {
|
|
124
|
-
return
|
|
115
|
+
return b`
|
|
125
116
|
<div class="nys-checkboxgroup">
|
|
126
117
|
<nys-label
|
|
127
118
|
for=${this.id + "--native"}
|
|
128
119
|
label=${this.label}
|
|
129
120
|
description=${this.description}
|
|
130
121
|
flag=${this.required ? "required" : this.optional ? "optional" : ""}
|
|
131
|
-
tooltip=${this.
|
|
122
|
+
tooltip=${this.tooltip}
|
|
132
123
|
?inverted=${this.inverted}
|
|
133
124
|
>
|
|
134
125
|
<slot name="description" slot="description">${this.description}</slot>
|
|
@@ -149,80 +140,72 @@ const n = (d = class extends p {
|
|
|
149
140
|
</div>
|
|
150
141
|
`;
|
|
151
142
|
}
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
143
|
+
};
|
|
144
|
+
u.styles = v(_), u.formAssociated = !0;
|
|
145
|
+
let i = u;
|
|
146
|
+
l([
|
|
147
|
+
r({ type: String, reflect: !0 })
|
|
148
|
+
], i.prototype, "id");
|
|
149
|
+
l([
|
|
150
|
+
r({ type: String, reflect: !0 })
|
|
151
|
+
], i.prototype, "name");
|
|
152
|
+
l([
|
|
153
|
+
r({ type: Boolean, reflect: !0 })
|
|
154
|
+
], i.prototype, "required");
|
|
155
|
+
l([
|
|
156
|
+
r({ type: Boolean, reflect: !0 })
|
|
157
|
+
], i.prototype, "optional");
|
|
158
|
+
l([
|
|
159
|
+
r({ type: Boolean, reflect: !0 })
|
|
160
|
+
], i.prototype, "showError");
|
|
161
|
+
l([
|
|
162
|
+
r({ type: String })
|
|
163
|
+
], i.prototype, "errorMessage");
|
|
164
|
+
l([
|
|
165
|
+
r({ type: String })
|
|
166
|
+
], i.prototype, "label");
|
|
167
|
+
l([
|
|
168
|
+
r({ type: String })
|
|
169
|
+
], i.prototype, "description");
|
|
170
|
+
l([
|
|
171
|
+
r({ type: Boolean, reflect: !0 })
|
|
172
|
+
], i.prototype, "tile");
|
|
173
|
+
l([
|
|
174
|
+
r({ type: String })
|
|
175
|
+
], i.prototype, "tooltip");
|
|
176
|
+
l([
|
|
177
|
+
r({ type: Boolean, reflect: !0 })
|
|
178
|
+
], i.prototype, "inverted");
|
|
179
|
+
l([
|
|
180
|
+
r({ type: String, reflect: !0 })
|
|
181
|
+
], i.prototype, "form");
|
|
182
|
+
l([
|
|
183
|
+
r({ type: String, reflect: !0 })
|
|
184
|
+
], i.prototype, "size");
|
|
185
|
+
l([
|
|
190
186
|
g()
|
|
191
|
-
],
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
var S = Object.defineProperty, q = Object.getOwnPropertyDescriptor, l = (y, e, o, r) => {
|
|
198
|
-
for (var s = r > 1 ? void 0 : r ? q(e, o) : e, h = y.length - 1, c; h >= 0; h--)
|
|
199
|
-
(c = y[h]) && (s = (r ? c(e, o, s) : c(s)) || s);
|
|
200
|
-
return r && s && S(e, o, s), s;
|
|
187
|
+
], i.prototype, "_slottedDescriptionText");
|
|
188
|
+
customElements.get("nys-checkboxgroup") || customElements.define("nys-checkboxgroup", i);
|
|
189
|
+
var E = Object.defineProperty, n = (d, e, o, t) => {
|
|
190
|
+
for (var s = void 0, h = d.length - 1, a; h >= 0; h--)
|
|
191
|
+
(a = d[h]) && (s = a(e, o, s) || s);
|
|
192
|
+
return s && E(e, o, s), s;
|
|
201
193
|
};
|
|
202
|
-
let
|
|
203
|
-
|
|
204
|
-
const i = (b = class extends p {
|
|
194
|
+
let C = 0;
|
|
195
|
+
const x = class x extends p {
|
|
205
196
|
// allows use of elementInternals' API
|
|
206
197
|
constructor() {
|
|
207
|
-
super(), this.checked = !1, this.disabled = !1, this.required = !1, this.label = "", this.description = "", this.id = "", this.name = "", this.value = "", this.form = null, this.showError = !1, this.errorMessage = "", this.groupExist = !1, this.tile = !1, this.inverted = !1, this.
|
|
198
|
+
super(), this.checked = !1, this.disabled = !1, this.required = !1, this.label = "", this.description = "", this.id = "", this.name = "", this.value = "", this.form = null, this.showError = !1, this.errorMessage = "", this.groupExist = !1, this.tile = !1, this.inverted = !1, this.tooltip = "", this.size = "md", this._manageLabelClick = () => {
|
|
208
199
|
const e = this.shadowRoot?.querySelector("nys-label"), o = this.shadowRoot?.querySelector("input");
|
|
209
200
|
e && o && e.addEventListener("click", () => o.click());
|
|
210
201
|
}, this._internals = this.attachInternals();
|
|
211
202
|
}
|
|
212
|
-
get size() {
|
|
213
|
-
return this._size;
|
|
214
|
-
}
|
|
215
|
-
set size(e) {
|
|
216
|
-
this._size = b.VALID_SIZES.includes(
|
|
217
|
-
e
|
|
218
|
-
) ? e : "md";
|
|
219
|
-
}
|
|
220
203
|
async getInputElement() {
|
|
221
204
|
return await this.updateComplete, this.shadowRoot?.querySelector("input") || null;
|
|
222
205
|
}
|
|
223
206
|
// Generate a unique ID if one is not provided
|
|
224
207
|
connectedCallback() {
|
|
225
|
-
super.connectedCallback(), this.id || (this.id = `nys-checkbox-${Date.now()}-${
|
|
208
|
+
super.connectedCallback(), this.id || (this.id = `nys-checkbox-${Date.now()}-${C++}`), this.addEventListener("invalid", this._handleInvalid);
|
|
226
209
|
}
|
|
227
210
|
disconnectedCallback() {
|
|
228
211
|
super.disconnectedCallback(), this.removeEventListener("invalid", this._handleInvalid);
|
|
@@ -234,7 +217,7 @@ const i = (b = class extends p {
|
|
|
234
217
|
formResetCallback() {
|
|
235
218
|
this.checked = !1;
|
|
236
219
|
}
|
|
237
|
-
|
|
220
|
+
// Form Integration
|
|
238
221
|
_setValue() {
|
|
239
222
|
this.groupExist || this._internals.setFormValue(this.checked ? this.value : null);
|
|
240
223
|
}
|
|
@@ -254,10 +237,10 @@ const i = (b = class extends p {
|
|
|
254
237
|
const e = this.shadowRoot?.querySelector("input");
|
|
255
238
|
if (!e) return;
|
|
256
239
|
const o = e.validity;
|
|
257
|
-
let
|
|
258
|
-
o.valueMissing && (
|
|
240
|
+
let t = "";
|
|
241
|
+
o.valueMissing && (t = "This field is required"), this._setValidityMessage(t);
|
|
259
242
|
}
|
|
260
|
-
|
|
243
|
+
// Functions
|
|
261
244
|
// This helper function is called to perform the element's native validation.
|
|
262
245
|
checkValidity() {
|
|
263
246
|
if (this.required && !this.checked)
|
|
@@ -269,13 +252,13 @@ const i = (b = class extends p {
|
|
|
269
252
|
e.preventDefault(), this.showError = !0, this._validate();
|
|
270
253
|
const o = this.shadowRoot?.querySelector("input");
|
|
271
254
|
if (o) {
|
|
272
|
-
const
|
|
273
|
-
|
|
274
|
-
(
|
|
255
|
+
const t = this._internals.form;
|
|
256
|
+
t ? Array.from(t.elements).find(
|
|
257
|
+
(a) => typeof a.checkValidity == "function" && !a.checkValidity()
|
|
275
258
|
) === this && o.focus() : o.focus();
|
|
276
259
|
}
|
|
277
260
|
}
|
|
278
|
-
|
|
261
|
+
// Event Handlers
|
|
279
262
|
_emitChangeEvent() {
|
|
280
263
|
this.dispatchEvent(
|
|
281
264
|
new CustomEvent("nys-change", {
|
|
@@ -308,19 +291,19 @@ const i = (b = class extends p {
|
|
|
308
291
|
e.code === "Space" && (e.preventDefault(), this.disabled || (this.checked = !this.checked, this._internals.setFormValue(this.checked ? this.value : null), await this.updateComplete, this._validate(), this._emitChangeEvent()));
|
|
309
292
|
}
|
|
310
293
|
render() {
|
|
311
|
-
return
|
|
294
|
+
return b`
|
|
312
295
|
<label class="nys-checkbox">
|
|
313
296
|
<div class="nys-checkbox__checkboxwrapper">
|
|
314
297
|
<input
|
|
315
298
|
id=${this.id + "--native"}
|
|
316
299
|
class="nys-checkbox__checkbox"
|
|
317
300
|
type="checkbox"
|
|
318
|
-
name="${
|
|
301
|
+
name="${k(this.name ? this.name : void 0)}"
|
|
319
302
|
.checked=${this.checked}
|
|
320
303
|
?disabled=${this.disabled}
|
|
321
304
|
.value=${this.value}
|
|
322
305
|
?required="${this.required}"
|
|
323
|
-
form=${
|
|
306
|
+
form=${k(this.form || void 0)}
|
|
324
307
|
aria-checked="${this.checked}"
|
|
325
308
|
aria-disabled="${this.disabled ? "true" : "false"}"
|
|
326
309
|
aria-required="${this.required}"
|
|
@@ -331,18 +314,19 @@ const i = (b = class extends p {
|
|
|
331
314
|
@keydown="${this._handleKeydown}"
|
|
332
315
|
aria-label="${this.label}"
|
|
333
316
|
/>
|
|
334
|
-
${this.checked ?
|
|
317
|
+
${this.checked ? b`<nys-icon
|
|
335
318
|
name="check"
|
|
336
|
-
size="${this.size === "md" ? "4xl" : this.size === "sm" ? "2xl" : "
|
|
319
|
+
size="${this.size === "md" ? "4xl" : this.size === "sm" ? "2xl" : "4xl"}"
|
|
337
320
|
class="nys-checkbox__icon"
|
|
338
321
|
></nys-icon>` : ""}
|
|
339
322
|
</div>
|
|
340
|
-
${this.label &&
|
|
323
|
+
${this.label && b`
|
|
341
324
|
<nys-label
|
|
325
|
+
tooltip=${this.tooltip}
|
|
342
326
|
for=${this.id + "--native"}
|
|
343
327
|
label=${this.label}
|
|
344
|
-
description=${
|
|
345
|
-
flag=${
|
|
328
|
+
description=${k(this.description ?? void 0)}
|
|
329
|
+
flag=${k(this.required ? "required" : void 0)}
|
|
346
330
|
?inverted=${this.inverted}
|
|
347
331
|
>
|
|
348
332
|
<slot name="description" slot="description"
|
|
@@ -351,7 +335,7 @@ const i = (b = class extends p {
|
|
|
351
335
|
</nys-label>
|
|
352
336
|
`}
|
|
353
337
|
</label>
|
|
354
|
-
${this.parentElement?.tagName.toLowerCase() !== "nys-checkboxgroup" ?
|
|
338
|
+
${this.parentElement?.tagName.toLowerCase() !== "nys-checkboxgroup" ? b`<nys-errormessage
|
|
355
339
|
id="single-error-message"
|
|
356
340
|
?showError=${this.showError}
|
|
357
341
|
errorMessage=${this._internals.validationMessage || this.errorMessage}
|
|
@@ -359,56 +343,60 @@ const i = (b = class extends p {
|
|
|
359
343
|
></nys-errormessage>` : ""}
|
|
360
344
|
`;
|
|
361
345
|
}
|
|
362
|
-
}
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
346
|
+
};
|
|
347
|
+
x.styles = v(_), x.formAssociated = !0;
|
|
348
|
+
let c = x;
|
|
349
|
+
n([
|
|
350
|
+
r({ type: Boolean, reflect: !0 })
|
|
351
|
+
], c.prototype, "checked");
|
|
352
|
+
n([
|
|
353
|
+
r({ type: Boolean, reflect: !0 })
|
|
354
|
+
], c.prototype, "disabled");
|
|
355
|
+
n([
|
|
356
|
+
r({ type: Boolean, reflect: !0 })
|
|
357
|
+
], c.prototype, "required");
|
|
358
|
+
n([
|
|
359
|
+
r({ type: String })
|
|
360
|
+
], c.prototype, "label");
|
|
361
|
+
n([
|
|
362
|
+
r({ type: String })
|
|
363
|
+
], c.prototype, "description");
|
|
364
|
+
n([
|
|
365
|
+
r({ type: String, reflect: !0 })
|
|
366
|
+
], c.prototype, "id");
|
|
367
|
+
n([
|
|
368
|
+
r({ type: String, reflect: !0 })
|
|
369
|
+
], c.prototype, "name");
|
|
370
|
+
n([
|
|
371
|
+
r({ type: String })
|
|
372
|
+
], c.prototype, "value");
|
|
373
|
+
n([
|
|
374
|
+
r({ type: String, reflect: !0 })
|
|
375
|
+
], c.prototype, "form");
|
|
376
|
+
n([
|
|
377
|
+
r({ type: Boolean, reflect: !0 })
|
|
378
|
+
], c.prototype, "showError");
|
|
379
|
+
n([
|
|
380
|
+
r({ type: String })
|
|
381
|
+
], c.prototype, "errorMessage");
|
|
382
|
+
n([
|
|
383
|
+
r({ type: Boolean })
|
|
384
|
+
], c.prototype, "groupExist");
|
|
385
|
+
n([
|
|
386
|
+
r({ type: Boolean, reflect: !0 })
|
|
387
|
+
], c.prototype, "tile");
|
|
388
|
+
n([
|
|
389
|
+
r({ type: Boolean, reflect: !0 })
|
|
390
|
+
], c.prototype, "inverted");
|
|
391
|
+
n([
|
|
392
|
+
r({ type: String })
|
|
393
|
+
], c.prototype, "tooltip");
|
|
394
|
+
n([
|
|
395
|
+
r({ type: String, reflect: !0 })
|
|
396
|
+
], c.prototype, "size");
|
|
397
|
+
customElements.get("nys-checkbox") || customElements.define("nys-checkbox", c);
|
|
410
398
|
export {
|
|
411
|
-
|
|
412
|
-
|
|
399
|
+
c as NysCheckbox,
|
|
400
|
+
i as NysCheckboxgroup
|
|
413
401
|
};
|
|
414
402
|
//# sourceMappingURL=nys-checkbox.js.map
|
package/dist/nys-checkbox.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nys-checkbox.js","sources":["../src/nys-checkboxgroup.ts","../src/nys-checkbox.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-checkbox.scss?inline\";\n\nlet checkboxgroupIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysCheckboxgroup extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: 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 _slottedDescriptionText = \"\";\n private static readonly VALID_SIZES = [\"sm\", \"md\"] as const;\n private _size: (typeof NysCheckboxgroup.VALID_SIZES)[number] = \"md\";\n\n // Getter and setter for the `size` property.\n @property({ reflect: true })\n get size(): (typeof NysCheckboxgroup.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 \"md\".\n this._size = NysCheckboxgroup.VALID_SIZES.includes(\n value as (typeof NysCheckboxgroup.VALID_SIZES)[number],\n )\n ? (value as (typeof NysCheckboxgroup.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-checkbox-${Date.now()}-${checkboxgroupIdCounter++}`;\n }\n this.addEventListener(\"nys-change\", this._handleCheckboxChange);\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"nys-change\", this._handleCheckboxChange);\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n firstUpdated() {\n // This ensures our checkboxes sets the value only once for formData (not within the individual checkboxes)\n this._setGroupExist();\n this._updateCheckboxSize();\n this._updateCheckboxTile();\n this._updateCheckboxShowError();\n this._getSlotDescriptionForAria();\n }\n\n updated(changedProperties: Map<string | symbol, unknown>) {\n if (changedProperties.has(\"required\")) {\n if (this.required) {\n this._setupCheckboxRequired();\n }\n }\n if (changedProperties.has(\"size\")) {\n this._updateCheckboxSize();\n }\n if (changedProperties.has(\"tile\")) {\n this._updateCheckboxTile();\n }\n if (changedProperties.has(\"inverted\")) {\n this._updateCheckboxInvert();\n }\n if (changedProperties.has(\"showError\")) {\n this._updateCheckboxShowError();\n }\n if (changedProperties.has(\"form\")) {\n this._updateCheckboxForm();\n }\n }\n\n /********************** Functions **********************/\n private _setGroupExist() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox: any) => {\n checkbox.groupExist = true;\n });\n }\n\n // Initial update on checkbox required attribute\n private async _setupCheckboxRequired() {\n const firstCheckbox = this.querySelector(\"nys-checkbox\");\n const message = this.errorMessage || \"This field is required\";\n\n const firstCheckboxInput = firstCheckbox\n ? await (firstCheckbox as any).getInputElement()\n : null;\n\n this._internals.setValidity(\n { valueMissing: true },\n message,\n firstCheckboxInput ? firstCheckboxInput : this,\n );\n }\n\n // Updates the required attribute of each checkbox in the group\n private async _manageRequire() {\n if (this.required) {\n const message = this.errorMessage || \"Please select at least one option.\";\n const firstCheckbox = this.querySelector(\"nys-checkbox\");\n const firstCheckboxInput = firstCheckbox\n ? await (firstCheckbox as any).getInputElement().catch(() => null)\n : null;\n\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n // Loop through each child checkbox to see if one is checked.\n const atLeastOneChecked = Array.from(checkboxes).some(\n (checkbox: any) => checkbox.checked,\n );\n\n if (atLeastOneChecked) {\n this._internals.setValidity({});\n this.showError = false;\n } else {\n this._internals.setValidity(\n { valueMissing: true },\n message,\n firstCheckboxInput ? firstCheckboxInput : this,\n );\n this.showError = true;\n }\n }\n }\n\n // Updates the size of each checkbox in the group\n private _updateCheckboxSize() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n checkbox.setAttribute(\"size\", this.size);\n });\n }\n\n private _updateCheckboxTile() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.tile) {\n checkbox.toggleAttribute(\"tile\", true);\n } else {\n checkbox.removeAttribute(\"tile\");\n }\n });\n }\n\n private _updateCheckboxInvert() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.inverted) {\n checkbox.toggleAttribute(\"inverted\", true);\n } else {\n checkbox.removeAttribute(\"inverted\");\n }\n });\n }\n\n private _updateCheckboxShowError() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.showError) {\n checkbox.setAttribute(\"showError\", \"\");\n } else {\n checkbox.removeAttribute(\"showError\");\n }\n });\n }\n\n private _updateCheckboxForm() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.showError) {\n if (this.form !== null) {\n checkbox.setAttribute(\"form\", this.form);\n } else {\n checkbox.removeAttribute(\"form\");\n }\n } else {\n checkbox.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 private async _handleInvalid(event: Event) {\n event.preventDefault();\n\n this.showError = true;\n this._manageRequire(); // Refresh validation message\n\n const firstCheckbox = this.querySelector(\"nys-checkbox\");\n const firstCheckboxInput = firstCheckbox\n ? await (firstCheckbox as any).getInputElement()\n : null;\n\n if (firstCheckboxInput) {\n // Focus only if this is the first invalid element (top-down approach)\n const form = this._internals.form;\n if (form) {\n const elements = Array.from(form.elements) as Array<\n HTMLElement & { checkValidity?: () => boolean }\n >;\n // Find the first element in the form that is invalid\n const firstInvalidElement = elements.find((element) => {\n // If element is checkboxgroup, we see if anyone checkboxes within the group is checked to fulfill required constraint\n if (element.tagName.toLowerCase() === \"nys-checkboxgroup\") {\n const allCheckboxes = Array.from(\n this.querySelectorAll(\"nys-checkbox\"),\n ) as any[];\n const hasCheckedCheckbox = allCheckboxes.filter(\n (checkbox) => checkbox.checked,\n );\n // Required constraint not met, continue logic to have this component be focused\n if (hasCheckedCheckbox.length === 0) {\n return element;\n }\n } else {\n return (\n typeof element.checkValidity === \"function\" &&\n !element.checkValidity()\n );\n }\n });\n\n if (firstInvalidElement === this) {\n firstCheckboxInput.focus();\n }\n } else {\n // If not part of a form, simply focus.\n firstCheckboxInput.focus();\n }\n }\n }\n\n /******************** Event Handlers ********************/\n // Similar to how native forms handle multiple same-name fields, we group the selected values into a list for FormData.\n private _handleCheckboxChange(event: Event) {\n const customEvent = event as CustomEvent;\n const { name } = customEvent.detail;\n const checkboxes = Array.from(this.querySelectorAll(\"nys-checkbox\"));\n\n // Filter to only the checked ones and extract their values.\n const selectedValues = checkboxes\n .filter((checkbox: any) => checkbox.checked)\n .map((checkbox: any) => checkbox.value);\n\n this.name = name;\n\n this._internals.setFormValue(selectedValues.join(\", \"));\n\n this._manageRequire();\n }\n\n render() {\n return html`\n <div class=\"nys-checkboxgroup\">\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-checkboxgroup__content\">\n <fieldset>\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}\n\nif (!customElements.get(\"nys-checkboxgroup\")) {\n customElements.define(\"nys-checkboxgroup\", NysCheckboxgroup);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport \"./nys-checkboxgroup\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-checkbox.scss?inline\";\n\nlet checkboxIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysCheckbox 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: String, reflect: true }) form: string | null = null;\n @property({ type: Boolean, reflect: true }) showError = false;\n @property({ type: String }) errorMessage = \"\";\n @property({ type: Boolean }) groupExist = false;\n @property({ type: Boolean, reflect: true }) tile = false;\n @property({ type: Boolean, reflect: true }) inverted = false;\n private static readonly VALID_SIZES = [\"sm\", \"md\"] as const;\n private _size: (typeof NysCheckbox.VALID_SIZES)[number] = \"md\";\n\n // Getter and setter for the `size` property.\n @property({ reflect: true })\n get size(): (typeof NysCheckbox.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 = NysCheckbox.VALID_SIZES.includes(\n value as (typeof NysCheckbox.VALID_SIZES)[number],\n )\n ? (value as (typeof NysCheckbox.VALID_SIZES)[number])\n : \"md\";\n }\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 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-checkbox-${Date.now()}-${checkboxIdCounter++}`;\n }\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n firstUpdated() {\n // This ensures our element always participates in the form\n this._setValue();\n this._manageRequire();\n this._manageLabelClick();\n }\n\n // This callback is automatically called when the parent form is reset.\n formResetCallback() {\n this.checked = false;\n }\n\n /********************** Form Integration **********************/\n private _setValue() {\n if (!this.groupExist) {\n this._internals.setFormValue(this.checked ? this.value : null);\n }\n }\n\n private _manageRequire() {\n const input = this.shadowRoot?.querySelector(\"input\");\n const message = this.errorMessage || \"This field is required\";\n if (!input) return;\n\n if (this.required && !this.checked) {\n this._internals.ariaRequired = \"true\";\n this._internals.setValidity({ valueMissing: true }, message, input);\n } else {\n this._internals.setValidity({});\n }\n }\n\n private _setValidityMessage(message: string = \"\") {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Toggle the HTML <div> tag error message\n this.showError = !!message;\n // If user sets errorMessage, this will always override the native validation message\n if (this.errorMessage?.trim() && message !== \"\") {\n message = this.errorMessage;\n }\n\n this._internals.setValidity(\n message ? { customError: true } : {},\n message,\n input,\n );\n }\n\n private _validate() {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Get the native validation state\n const validity = input.validity;\n let message = \"\";\n\n if (validity.valueMissing) {\n message = \"This field is required\";\n }\n\n this._setValidityMessage(message);\n }\n\n /********************** Functions **********************/\n // This helper function is called to perform the element's native validation.\n checkValidity(): boolean {\n // 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 private _handleInvalid(event: Event) {\n event.preventDefault();\n\n this.showError = true;\n this._validate(); // Make sure validation message appears\n\n const input = this.shadowRoot?.querySelector(\"input\");\n if (input) {\n // Focus only if this is the first invalid element (top-down approach)\n const form = this._internals.form;\n if (form) {\n const elements = Array.from(form.elements) as Array<\n HTMLElement & { checkValidity?: () => boolean }\n >;\n // Find the first element in the form that is invalid\n const firstInvalidElement = elements.find(\n (element) =>\n typeof element.checkValidity === \"function\" &&\n !element.checkValidity(),\n );\n if (firstInvalidElement === this) {\n input.focus();\n }\n } else {\n // If not part of a form, simply focus.\n input.focus();\n }\n }\n }\n\n private _manageLabelClick = () => {\n const labelEl = this.shadowRoot?.querySelector(\"nys-label\");\n const inputEl = this.shadowRoot?.querySelector(\"input\");\n\n if (labelEl && inputEl) {\n labelEl.addEventListener(\"click\", () => inputEl.click());\n }\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 checkbox change event\n private _handleChange(e: Event) {\n const { checked } = e.target as HTMLInputElement;\n this.checked = checked;\n if (!this.groupExist) {\n this._internals.setFormValue(this.checked ? this.value : null);\n }\n this._validate();\n this._emitChangeEvent();\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.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n // Handle keydown for keyboard accessibility\n private async _handleKeydown(e: KeyboardEvent) {\n if (e.code === \"Space\") {\n e.preventDefault();\n if (!this.disabled) {\n this.checked = !this.checked;\n this._internals.setFormValue(this.checked ? this.value : null);\n\n // Wait for DOM updates before validating. This is necessary to ensure the native input validation state is updated before this.validate().\n await this.updateComplete;\n this._validate();\n\n this._emitChangeEvent();\n }\n }\n }\n\n render() {\n return html`\n <label class=\"nys-checkbox\">\n <div class=\"nys-checkbox__checkboxwrapper\">\n <input\n id=${this.id + \"--native\"}\n class=\"nys-checkbox__checkbox\"\n type=\"checkbox\"\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 aria-checked=\"${this.checked}\"\n aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n aria-required=\"${this.required}\"\n aria-describedby=\"group-info\"\n @change=\"${this._handleChange}\"\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n @keydown=\"${this._handleKeydown}\"\n aria-label=\"${this.label}\"\n />\n ${this.checked\n ? html`<nys-icon\n name=\"check\"\n size=\"${this.size === \"md\"\n ? \"4xl\"\n : this.size === \"sm\"\n ? \"2xl\"\n : \"xl\"}\"\n class=\"nys-checkbox__icon\"\n ></nys-icon>`\n : \"\"}\n </div>\n ${this.label &&\n html`\n <nys-label\n for=${this.id + \"--native\"}\n label=${this.label}\n description=${ifDefined(this.description ?? undefined)}\n flag=${ifDefined(this.required ? \"required\" : undefined)}\n ?inverted=${this.inverted}\n >\n <slot name=\"description\" slot=\"description\"\n >${this.description}</slot\n >\n </nys-label>\n `}\n </label>\n ${this.parentElement?.tagName.toLowerCase() !== \"nys-checkboxgroup\"\n ? html`<nys-errormessage\n id=\"single-error-message\"\n ?showError=${this.showError}\n errorMessage=${this._internals.validationMessage ||\n this.errorMessage}\n .showDivider=${!this.tile}\n ></nys-errormessage>`\n : \"\"}\n `;\n }\n}\n\nif (!customElements.get(\"nys-checkbox\")) {\n customElements.define(\"nys-checkbox\", NysCheckbox);\n}\n"],"names":["checkboxgroupIdCounter","_NysCheckboxgroup","_a","LitElement","value","changedProperties","checkbox","firstCheckbox","message","firstCheckboxInput","checkboxes","nodes","node","event","form","element","customEvent","name","selectedValues","html","unsafeCSS","styles","__decorateClass","property","state","NysCheckboxgroup","checkboxIdCounter","_NysCheckbox","labelEl","inputEl","input","validity","checked","ifDefined","NysCheckbox"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"nys-checkbox.js","sources":["../src/nys-checkboxgroup.ts","../src/nys-checkbox.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-checkbox.scss?inline\";\n\nlet checkboxgroupIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysCheckboxgroup extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: 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 _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-checkbox-${Date.now()}-${checkboxgroupIdCounter++}`;\n }\n this.addEventListener(\"nys-change\", this._handleCheckboxChange);\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"nys-change\", this._handleCheckboxChange);\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n firstUpdated() {\n // This ensures our checkboxes sets the value only once for formData (not within the individual checkboxes)\n this._setGroupExist();\n this._updateCheckboxSize();\n this._updateCheckboxTile();\n this._updateCheckboxShowError();\n this._getSlotDescriptionForAria();\n }\n\n updated(changedProperties: Map<string | symbol, unknown>) {\n if (changedProperties.has(\"required\")) {\n if (this.required) {\n this._setupCheckboxRequired();\n }\n }\n if (changedProperties.has(\"size\")) {\n this._updateCheckboxSize();\n }\n if (changedProperties.has(\"tile\")) {\n this._updateCheckboxTile();\n }\n if (changedProperties.has(\"inverted\")) {\n this._updateCheckboxInvert();\n }\n if (changedProperties.has(\"showError\")) {\n this._updateCheckboxShowError();\n }\n if (changedProperties.has(\"form\")) {\n this._updateCheckboxForm();\n }\n }\n\n // Functions\n private _setGroupExist() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox: any) => {\n checkbox.groupExist = true;\n });\n }\n\n // Initial update on checkbox required attribute\n private async _setupCheckboxRequired() {\n const firstCheckbox = this.querySelector(\"nys-checkbox\");\n const message = this.errorMessage || \"This field is required\";\n\n const firstCheckboxInput = firstCheckbox\n ? await (firstCheckbox as any).getInputElement()\n : null;\n\n this._internals.setValidity(\n { valueMissing: true },\n message,\n firstCheckboxInput ? firstCheckboxInput : this,\n );\n }\n\n // Updates the required attribute of each checkbox in the group\n private async _manageRequire() {\n if (this.required) {\n const message = this.errorMessage || \"Please select at least one option.\";\n const firstCheckbox = this.querySelector(\"nys-checkbox\");\n const firstCheckboxInput = firstCheckbox\n ? await (firstCheckbox as any).getInputElement().catch(() => null)\n : null;\n\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n // Loop through each child checkbox to see if one is checked.\n const atLeastOneChecked = Array.from(checkboxes).some(\n (checkbox: any) => checkbox.checked,\n );\n\n if (atLeastOneChecked) {\n this._internals.setValidity({});\n this.showError = false;\n } else {\n this._internals.setValidity(\n { valueMissing: true },\n message,\n firstCheckboxInput ? firstCheckboxInput : this,\n );\n this.showError = true;\n }\n }\n }\n\n // Updates the size of each checkbox in the group\n private _updateCheckboxSize() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n checkbox.setAttribute(\"size\", this.size);\n });\n }\n\n private _updateCheckboxTile() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.tile) {\n checkbox.toggleAttribute(\"tile\", true);\n } else {\n checkbox.removeAttribute(\"tile\");\n }\n });\n }\n\n private _updateCheckboxInvert() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.inverted) {\n checkbox.toggleAttribute(\"inverted\", true);\n } else {\n checkbox.removeAttribute(\"inverted\");\n }\n });\n }\n\n private _updateCheckboxShowError() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.showError) {\n checkbox.setAttribute(\"showError\", \"\");\n } else {\n checkbox.removeAttribute(\"showError\");\n }\n });\n }\n\n private _updateCheckboxForm() {\n const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n checkboxes.forEach((checkbox) => {\n if (this.showError) {\n if (this.form !== null) {\n checkbox.setAttribute(\"form\", this.form);\n } else {\n checkbox.removeAttribute(\"form\");\n }\n } else {\n checkbox.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 private async _handleInvalid(event: Event) {\n event.preventDefault();\n\n this.showError = true;\n this._manageRequire(); // Refresh validation message\n\n const firstCheckbox = this.querySelector(\"nys-checkbox\");\n const firstCheckboxInput = firstCheckbox\n ? await (firstCheckbox as any).getInputElement()\n : null;\n\n if (firstCheckboxInput) {\n // Focus only if this is the first invalid element (top-down approach)\n const form = this._internals.form;\n if (form) {\n const elements = Array.from(form.elements) as Array<\n HTMLElement & { checkValidity?: () => boolean }\n >;\n // Find the first element in the form that is invalid\n const firstInvalidElement = elements.find((element) => {\n // If element is checkboxgroup, we see if anyone checkboxes within the group is checked to fulfill required constraint\n if (element.tagName.toLowerCase() === \"nys-checkboxgroup\") {\n const allCheckboxes = Array.from(\n this.querySelectorAll(\"nys-checkbox\"),\n ) as any[];\n const hasCheckedCheckbox = allCheckboxes.filter(\n (checkbox) => checkbox.checked,\n );\n // Required constraint not met, continue logic to have this component be focused\n if (hasCheckedCheckbox.length === 0) {\n return element;\n }\n } else {\n return (\n typeof element.checkValidity === \"function\" &&\n !element.checkValidity()\n );\n }\n });\n\n if (firstInvalidElement === this) {\n firstCheckboxInput.focus();\n }\n } else {\n // If not part of a form, simply focus.\n firstCheckboxInput.focus();\n }\n }\n }\n\n // Event Handlers\n // Similar to how native forms handle multiple same-name fields, we group the selected values into a list for FormData.\n private _handleCheckboxChange(event: Event) {\n const customEvent = event as CustomEvent;\n const { name } = customEvent.detail;\n const checkboxes = Array.from(this.querySelectorAll(\"nys-checkbox\"));\n\n // Filter to only the checked ones and extract their values.\n const selectedValues = checkboxes\n .filter((checkbox: any) => checkbox.checked)\n .map((checkbox: any) => checkbox.value);\n\n this.name = name;\n\n this._internals.setFormValue(selectedValues.join(\", \"));\n\n this._manageRequire();\n }\n\n render() {\n return html`\n <div class=\"nys-checkboxgroup\">\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-checkboxgroup__content\">\n <fieldset>\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}\n\nif (!customElements.get(\"nys-checkboxgroup\")) {\n customElements.define(\"nys-checkboxgroup\", NysCheckboxgroup);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport \"./nys-checkboxgroup\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-checkbox.scss?inline\";\n\nlet checkboxIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysCheckbox 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: String, reflect: true }) form: string | null = null;\n @property({ type: Boolean, reflect: true }) showError = false;\n @property({ type: String }) errorMessage = \"\";\n @property({ type: Boolean }) groupExist = false;\n @property({ type: Boolean, reflect: true }) tile = false;\n @property({ type: Boolean, reflect: true }) inverted = false;\n @property({ type: String }) tooltip = \"\";\n @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\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 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-checkbox-${Date.now()}-${checkboxIdCounter++}`;\n }\n this.addEventListener(\"invalid\", this._handleInvalid);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener(\"invalid\", this._handleInvalid);\n }\n\n firstUpdated() {\n // This ensures our element always participates in the form\n this._setValue();\n this._manageRequire();\n this._manageLabelClick();\n }\n\n // This callback is automatically called when the parent form is reset.\n formResetCallback() {\n this.checked = false;\n }\n\n // Form Integration\n private _setValue() {\n if (!this.groupExist) {\n this._internals.setFormValue(this.checked ? this.value : null);\n }\n }\n\n private _manageRequire() {\n const input = this.shadowRoot?.querySelector(\"input\");\n const message = this.errorMessage || \"This field is required\";\n if (!input) return;\n\n if (this.required && !this.checked) {\n this._internals.ariaRequired = \"true\";\n this._internals.setValidity({ valueMissing: true }, message, input);\n } else {\n this._internals.setValidity({});\n }\n }\n\n private _setValidityMessage(message: string = \"\") {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Toggle the HTML <div> tag error message\n this.showError = !!message;\n // If user sets errorMessage, this will always override the native validation message\n if (this.errorMessage?.trim() && message !== \"\") {\n message = this.errorMessage;\n }\n\n this._internals.setValidity(\n message ? { customError: true } : {},\n message,\n input,\n );\n }\n\n private _validate() {\n const input = this.shadowRoot?.querySelector(\"input\");\n if (!input) return;\n\n // Get the native validation state\n const validity = input.validity;\n let message = \"\";\n\n if (validity.valueMissing) {\n message = \"This field is required\";\n }\n\n this._setValidityMessage(message);\n }\n\n // Functions\n // This helper function is called to perform the element's native validation.\n checkValidity(): boolean {\n // 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 private _handleInvalid(event: Event) {\n event.preventDefault();\n\n this.showError = true;\n this._validate(); // Make sure validation message appears\n\n const input = this.shadowRoot?.querySelector(\"input\");\n if (input) {\n // Focus only if this is the first invalid element (top-down approach)\n const form = this._internals.form;\n if (form) {\n const elements = Array.from(form.elements) as Array<\n HTMLElement & { checkValidity?: () => boolean }\n >;\n // Find the first element in the form that is invalid\n const firstInvalidElement = elements.find(\n (element) =>\n typeof element.checkValidity === \"function\" &&\n !element.checkValidity(),\n );\n if (firstInvalidElement === this) {\n input.focus();\n }\n } else {\n // If not part of a form, simply focus.\n input.focus();\n }\n }\n }\n\n private _manageLabelClick = () => {\n const labelEl = this.shadowRoot?.querySelector(\"nys-label\");\n const inputEl = this.shadowRoot?.querySelector(\"input\");\n\n if (labelEl && inputEl) {\n labelEl.addEventListener(\"click\", () => inputEl.click());\n }\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 checkbox change event\n private _handleChange(e: Event) {\n const { checked } = e.target as HTMLInputElement;\n this.checked = checked;\n if (!this.groupExist) {\n this._internals.setFormValue(this.checked ? this.value : null);\n }\n this._validate();\n this._emitChangeEvent();\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.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n // Handle keydown for keyboard accessibility\n private async _handleKeydown(e: KeyboardEvent) {\n if (e.code === \"Space\") {\n e.preventDefault();\n if (!this.disabled) {\n this.checked = !this.checked;\n this._internals.setFormValue(this.checked ? this.value : null);\n\n // Wait for DOM updates before validating. This is necessary to ensure the native input validation state is updated before this.validate().\n await this.updateComplete;\n this._validate();\n\n this._emitChangeEvent();\n }\n }\n }\n\n render() {\n return html`\n <label class=\"nys-checkbox\">\n <div class=\"nys-checkbox__checkboxwrapper\">\n <input\n id=${this.id + \"--native\"}\n class=\"nys-checkbox__checkbox\"\n type=\"checkbox\"\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 aria-checked=\"${this.checked}\"\n aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n aria-required=\"${this.required}\"\n aria-describedby=\"group-info\"\n @change=\"${this._handleChange}\"\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n @keydown=\"${this._handleKeydown}\"\n aria-label=\"${this.label}\"\n />\n ${this.checked\n ? html`<nys-icon\n name=\"check\"\n size=\"${this.size === \"md\"\n ? \"4xl\"\n : this.size === \"sm\"\n ? \"2xl\"\n : \"4xl\"}\"\n class=\"nys-checkbox__icon\"\n ></nys-icon>`\n : \"\"}\n </div>\n ${this.label &&\n html`\n <nys-label\n tooltip=${this.tooltip}\n for=${this.id + \"--native\"}\n label=${this.label}\n description=${ifDefined(this.description ?? undefined)}\n flag=${ifDefined(this.required ? \"required\" : undefined)}\n ?inverted=${this.inverted}\n >\n <slot name=\"description\" slot=\"description\"\n >${this.description}</slot\n >\n </nys-label>\n `}\n </label>\n ${this.parentElement?.tagName.toLowerCase() !== \"nys-checkboxgroup\"\n ? html`<nys-errormessage\n id=\"single-error-message\"\n ?showError=${this.showError}\n errorMessage=${this._internals.validationMessage ||\n this.errorMessage}\n .showDivider=${!this.tile}\n ></nys-errormessage>`\n : \"\"}\n `;\n }\n}\n\nif (!customElements.get(\"nys-checkbox\")) {\n customElements.define(\"nys-checkbox\", NysCheckbox);\n}\n"],"names":["checkboxgroupIdCounter","_NysCheckboxgroup","LitElement","changedProperties","checkbox","firstCheckbox","message","firstCheckboxInput","checkboxes","nodes","node","event","form","element","customEvent","name","selectedValues","html","unsafeCSS","styles","NysCheckboxgroup","__decorateClass","property","state","checkboxIdCounter","_NysCheckbox","labelEl","inputEl","input","validity","checked","ifDefined","NysCheckbox"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nysds/nys-checkbox",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.12.0",
|
|
4
4
|
"description": "The Checkbox component from the NYS Design System.",
|
|
5
5
|
"module": "dist/nys-checkbox.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -23,9 +23,9 @@
|
|
|
23
23
|
"lit-analyze": "lit-analyzer '**/*.ts'"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@nysds/nys-icon": "^1.
|
|
27
|
-
"@nysds/nys-label": "^1.
|
|
28
|
-
"@nysds/nys-errormessage": "^1.
|
|
26
|
+
"@nysds/nys-icon": "^1.12.0",
|
|
27
|
+
"@nysds/nys-label": "^1.12.0",
|
|
28
|
+
"@nysds/nys-errormessage": "^1.12.0"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"lit": "^3.3.1",
|