@nysds/nys-checkbox 1.15.0 → 1.16.0-alpha4

package/dist/nys-checkbox.js

@@ -1,34 +1,34 @@
-import { LitElement as x, unsafeCSS as v, html as d } from "lit";
-import { property as s, state as _ } from "lit/decorators.js";
-import { ifDefined as y } from "lit/directives/if-defined.js";
+import { LitElement as _, unsafeCSS as v, html as d } from "lit";
+import { property as o, state as x } from "lit/decorators.js";
+import { ifDefined as u } from "lit/directives/if-defined.js";
 /*!
    * █▄  █  █   █  █▀▀▀█  █▀▀▄  █▀▀▀█
    * █ █ █  █▄▄▄█  ▀▀▀▄▄  █   █ ▀▀▀▄▄
    * █  ▀█    █    █▄▄▄█  █▄▄▀  █▄▄▄█
    *
-   * Checkbox Component
+   * Checkbox Component v1.16.0-alpha4
    * Part of the New York State Design System
    * Repository: https://github.com/its-hcd/nysds
    * License: MIT
 */
-const f = ':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;flex-direction:column;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)}.nys-checkbox .nys-checkbox__main-container{display:flex;font-family:var(--_nys-checkbox-font-family);font-size:var(--_nys-checkbox-font-size);line-height:var(--_nys-checkbox-line-height);align-items:center;gap:var(--_nys-checkbox-gap)}.nys-checkbox .nys-checkbox__main-container.has-description{align-items:flex-start}.nys-checkbox__checkbox-wrapper{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:var(--nys-color-ink-reverse, #ffffff)}.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;margin:0}.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:hover .nys-checkbox__checkbox:not(:disabled):not(:checked),.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:hover .nys-checkbox__checkbox:not(:disabled):checked,.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:active .nys-checkbox__checkbox:not(:disabled):not(: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:active .nys-checkbox__checkbox:not(:disabled):checked,.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-visible{outline:solid var(--_nys-checkbox-outline-width) var(--_nys-checkbox-outline-color)}:host([tile]) .nys-checkbox:has(*:focus-visible){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__main-container>nys-label{--_nys-label-font-weight: var(--_nys-checkbox-font-weight)}:host([tile]) .nys-checkbox__main-container>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}.nys-checkbox__other-container{display:flex;padding-inline-start:calc(var(--_nys-checkbox-size) + var(--_nys-checkbox-gap))}';
-var g = Object.defineProperty, h = (b, e, t, r) => {
-  for (var o = void 0, l = b.length - 1, a; l >= 0; l--)
-    (a = b[l]) && (o = a(e, t, o) || o);
-  return o && g(e, t, o), o;
+const f = ':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)}:host([inverted]){--_nys-checkbox-outline-color: var(--nys-color-focus-reverse, #7aa5e7)}#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;flex-direction:column;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)}.nys-checkbox .nys-checkbox__main-container{display:flex;font-family:var(--_nys-checkbox-font-family);font-size:var(--_nys-checkbox-font-size);line-height:var(--_nys-checkbox-line-height);align-items:center;gap:var(--_nys-checkbox-gap)}.nys-checkbox .nys-checkbox__main-container.has-description{align-items:flex-start}.nys-checkbox__checkbox-wrapper{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:var(--nys-color-ink-reverse, #ffffff)}.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;margin:0}.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:hover .nys-checkbox__checkbox:not(:disabled):not(:checked),.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:hover .nys-checkbox__checkbox:not(:disabled):checked,.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:active .nys-checkbox__checkbox:not(:disabled):not(: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:active .nys-checkbox__checkbox:not(:disabled):checked,.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-visible),:host([tile][showError]) .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__main-container>nys-label{--_nys-label-font-weight: var(--_nys-checkbox-font-weight)}:host([tile]) .nys-checkbox__main-container>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}.nys-checkbox__other-container{display:flex;padding-inline-start:calc(var(--_nys-checkbox-size) + var(--_nys-checkbox-gap))}';
+var g = Object.defineProperty, a = (b, e, t, r) => {
+  for (var s = void 0, l = b.length - 1, c; l >= 0; l--)
+    (c = b[l]) && (s = c(e, t, s) || s);
+  return s && g(e, t, s), s;
 };
 let E = 0;
-const u = class u extends x {
+const y = class y extends _ {
   // allows use of elementInternals' API
   constructor() {
     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._hasOtherError = !1, this._otherErrorCheckbox = null, this._internals = this.attachInternals();
   }
   // Generate a unique ID if one is not provided
   connectedCallback() {
-    super.connectedCallback(), this.id || (this.id = `nys-checkboxgroup-${Date.now()}-${E++}`), this.addEventListener("nys-change", this._handleCheckboxChange), this.addEventListener("invalid", this._handleInvalid), this.addEventListener("nys-error", this._handleChildError), this.addEventListener("nys-error-clear", this._handleChildErrorClear);
+    super.connectedCallback(), this.id || (this.id = `nys-checkboxgroup-${Date.now()}-${E++}`), this.addEventListener("nys-change", this._handleCheckboxChange), this.addEventListener("nys-other-input", this._handleOtherInput), this.addEventListener("invalid", this._handleInvalid), this.addEventListener("nys-error", this._handleChildError), this.addEventListener("nys-error-clear", this._handleChildErrorClear);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener("nys-change", this._handleCheckboxChange), this.removeEventListener("invalid", this._handleInvalid), this.removeEventListener("nys-error", this._handleChildError), this.removeEventListener("nys-error-clear", this._handleChildErrorClear);
+    super.disconnectedCallback(), this.removeEventListener("nys-change", this._handleCheckboxChange), this.removeEventListener("nys-other-input", this._handleOtherInput), this.removeEventListener("invalid", this._handleInvalid), this.removeEventListener("nys-error", this._handleChildError), this.removeEventListener("nys-error-clear", this._handleChildErrorClear);
   }
   firstUpdated() {
     this._setGroupExist(), this._updateCheckboxSize(), this._updateCheckboxTile(), this._updateCheckboxShowError(), this._getSlotDescriptionForAria();
@@ -64,11 +64,11 @@ const u = class u extends x {
     if (!this.required) return;
     const e = this.errorMessage || "You must make a selection to proceed.", t = Array.from(
       this.querySelectorAll("nys-checkbox")
-    ), r = this._hasAtLeastOneChecked(), o = t ? await t[0].getInputElement().catch(() => null) : null;
+    ), r = this._hasAtLeastOneChecked(), s = t ? await t[0].getInputElement().catch(() => null) : null;
     this._internals.setValidity({}), this.showError = !1, r ? this._hasOtherError && this._otherErrorCheckbox && (this._setCustomOtherError(), this.showError = !0) : this._hasOtherError ? (this._setCustomOtherError(), this.showError = !0) : (this._internals.setValidity(
       { valueMissing: !0 },
       e,
-      o ?? this
+      s ?? this
     ), this.showError = !0);
   }
   _setCustomOtherError() {
@@ -120,36 +120,34 @@ const u = class u extends x {
   }
   async _handleInvalid(e) {
     if (e.preventDefault(), this._internals.validity.customError) {
-      const r = Array.from(
+      const l = Array.from(
         this.querySelectorAll("nys-checkbox")
       ).find(
-        (o) => o.other && o.checked
+        (c) => c.other && c.checked
       );
-      if (r) {
-        const o = r.shadowRoot?.querySelector("nys-textinput");
-        if (o) {
-          await o.updateComplete, o.focus();
+      if (l) {
+        const c = l.shadowRoot?.querySelector("nys-textinput");
+        if (c) {
+          await c.updateComplete, c.focus();
           return;
         }
       }
     }
-    if (this._internals.validity.valueMissing) {
-      this.showError = !0, this._manageRequire();
-      const t = this.querySelector("nys-checkbox"), r = t ? await t.getInputElement() : null;
-      if (r) {
-        const o = this._internals.form;
-        o ? Array.from(o.elements).find((p) => {
-          if (p.tagName.toLowerCase() === "nys-checkboxgroup") {
-            if (Array.from(
-              this.querySelectorAll("nys-checkbox")
-            ).filter(
-              (m) => m.checked
-            ).length === 0)
-              return p;
-          } else
-            return typeof p.checkValidity == "function" && !p.checkValidity();
-        }) === this && r.focus() : r.focus();
-      }
+    this.showError = !0, await this._manageRequire();
+    const t = this.querySelector("nys-checkbox"), r = t ? await t.getInputElement() : null;
+    if (r) {
+      const s = this._internals.form;
+      s ? Array.from(s.elements).find((p) => {
+        if (p.tagName.toLowerCase() === "nys-checkboxgroup") {
+          if (Array.from(
+            this.querySelectorAll("nys-checkbox")
+          ).filter(
+            (m) => m.checked
+          ).length === 0)
+            return p;
+        } else
+          return typeof p.checkValidity == "function" && !p.checkValidity();
+      }) === this && r.focus() : r.focus();
     }
   }
   /**
@@ -158,10 +156,10 @@ const u = class u extends x {
    */
   // Similar to how native forms handle multiple same-name fields, we group the selected values into a list for FormData.
   _handleCheckboxChange(e) {
-    const t = e, { name: r } = t.detail, o = Array.from(
+    const t = e, { name: r } = t.detail, s = Array.from(
       this.querySelectorAll("nys-checkbox")
-    ), l = o.filter((a) => a.checked).map((a) => a.value);
-    this.name = r, this._internals.setFormValue(l.join(", ")), this._checkOtherInputs(o), this._hasOtherError || this._manageRequire();
+    ), l = s.filter((c) => c.checked).map((c) => c.value);
+    this.name = r, this._internals.setFormValue(l.join(", ")), this._checkOtherInputs(s), this._hasOtherError || this._manageRequire();
   }
   async _handleChildError(e) {
     e.stopPropagation();
@@ -170,7 +168,13 @@ const u = class u extends x {
   }
   _handleChildErrorClear(e) {
     const r = e.detail?.sourceCheckbox;
-    this._otherErrorCheckbox && r !== this._otherErrorCheckbox || (this._internals.setValidity({}), this.showError = !1, this.required && !this._hasAtLeastOneChecked() && this._manageRequire());
+    this._otherErrorCheckbox && r !== this._otherErrorCheckbox || (this._hasOtherError = !1, this._otherErrorCheckbox = null, this._internals.setValidity({}), this.showError = !1, this.required && !this._hasAtLeastOneChecked() && this._manageRequire());
+  }
+  _handleOtherInput() {
+    const t = Array.from(
+      this.querySelectorAll("nys-checkbox")
+    ).filter((r) => r.checked).map((r) => r.value);
+    this._internals.setFormValue(t.join(", "));
   }
   async _checkOtherInputs(e) {
     for (const t of e)
@@ -214,67 +218,67 @@ const u = class u extends x {
     `;
   }
 };
-u.styles = v(f), u.shadowRootOptions = {
-  ...x.shadowRootOptions,
+y.styles = v(f), y.shadowRootOptions = {
+  ..._.shadowRootOptions,
   delegatesFocus: !0
-}, u.formAssociated = !0;
-let c = u;
-h([
-  s({ type: String, reflect: !0 })
-], c.prototype, "id");
-h([
-  s({ type: String, reflect: !0 })
-], c.prototype, "name");
-h([
-  s({ type: Boolean, reflect: !0 })
-], c.prototype, "required");
-h([
-  s({ type: Boolean, reflect: !0 })
-], c.prototype, "optional");
-h([
-  s({ type: Boolean, reflect: !0 })
-], c.prototype, "showError");
-h([
-  s({ type: String })
-], c.prototype, "errorMessage");
-h([
-  s({ type: String })
-], c.prototype, "label");
-h([
-  s({ type: String })
-], c.prototype, "description");
-h([
-  s({ type: Boolean, reflect: !0 })
-], c.prototype, "tile");
-h([
-  s({ type: String })
-], c.prototype, "tooltip");
-h([
-  s({ type: Boolean, reflect: !0 })
-], c.prototype, "inverted");
-h([
-  s({ type: String, reflect: !0 })
-], c.prototype, "form");
-h([
-  s({ type: String, reflect: !0 })
-], c.prototype, "size");
-h([
-  _()
-], c.prototype, "_slottedDescriptionText");
-h([
-  _()
-], c.prototype, "_hasOtherError");
-h([
-  _()
-], c.prototype, "_otherErrorCheckbox");
-customElements.get("nys-checkboxgroup") || customElements.define("nys-checkboxgroup", c);
-var w = Object.defineProperty, n = (b, e, t, r) => {
-  for (var o = void 0, l = b.length - 1, a; l >= 0; l--)
-    (a = b[l]) && (o = a(e, t, o) || o);
-  return o && w(e, t, o), o;
+}, y.formAssociated = !0;
+let n = y;
+a([
+  o({ type: String, reflect: !0 })
+], n.prototype, "id");
+a([
+  o({ type: String, reflect: !0 })
+], n.prototype, "name");
+a([
+  o({ type: Boolean, reflect: !0 })
+], n.prototype, "required");
+a([
+  o({ type: Boolean, reflect: !0 })
+], n.prototype, "optional");
+a([
+  o({ type: Boolean, reflect: !0 })
+], n.prototype, "showError");
+a([
+  o({ type: String })
+], n.prototype, "errorMessage");
+a([
+  o({ type: String })
+], n.prototype, "label");
+a([
+  o({ type: String })
+], n.prototype, "description");
+a([
+  o({ type: Boolean, reflect: !0 })
+], n.prototype, "tile");
+a([
+  o({ type: String })
+], n.prototype, "tooltip");
+a([
+  o({ type: Boolean, reflect: !0 })
+], n.prototype, "inverted");
+a([
+  o({ type: String, reflect: !0 })
+], n.prototype, "form");
+a([
+  o({ type: String, reflect: !0 })
+], n.prototype, "size");
+a([
+  x()
+], n.prototype, "_slottedDescriptionText");
+a([
+  x()
+], n.prototype, "_hasOtherError");
+a([
+  x()
+], n.prototype, "_otherErrorCheckbox");
+customElements.get("nys-checkboxgroup") || customElements.define("nys-checkboxgroup", n);
+var w = Object.defineProperty, h = (b, e, t, r) => {
+  for (var s = void 0, l = b.length - 1, c; l >= 0; l--)
+    (c = b[l]) && (s = c(e, t, s) || s);
+  return s && w(e, t, s), s;
 };
 let C = 0;
-const k = class k extends x {
+const k = class k extends _ {
   // allows use of elementInternals' API
   constructor() {
     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.other = !1, this.showOtherError = !1, this.isMobile = window.innerWidth < 480, this._hasUserInteracted = !1, this._manageLabelClick = () => {
@@ -311,7 +315,7 @@ const k = class k extends x {
   }
   _manageRequire() {
     const e = this.shadowRoot?.querySelector("input"), t = this.errorMessage || "This field is required";
-    e && (this.required && !this.checked ? (this._internals.ariaRequired = "true", this._internals.setValidity({ valueMissing: !0 }, t, e)) : this._internals.setValidity({}));
+    e && (this.required && !this.checked ? (this._internals.ariaInvalid = "true", this._internals.setValidity({ valueMissing: !0 }, t, e)) : (this._internals.ariaInvalid = "false", this._internals.setValidity({})));
   }
   _setValidityMessage(e = "") {
     const t = this.shadowRoot?.querySelector("input");
@@ -351,7 +355,7 @@ const k = class k extends x {
     if (t) {
       const r = this._internals.form;
       r ? Array.from(r.elements).find(
-        (a) => typeof a.checkValidity == "function" && !a.checkValidity()
+        (c) => typeof c.checkValidity == "function" && !c.checkValidity()
       ) === this && t.focus() : t.focus();
     }
   }
@@ -418,7 +422,7 @@ const k = class k extends x {
       return;
     }
     const e = this.value.trim() === "";
-    this.showOtherError = e, e && this.dispatchEvent(
+    this.showOtherError = e, e ? this.dispatchEvent(
       new CustomEvent("nys-error", {
         detail: {
           id: this.id,
@@ -430,11 +434,12 @@ const k = class k extends x {
         bubbles: !0,
         composed: !0
       })
-    );
+    ) : this._dispatchClearError();
   }
   _dispatchClearError() {
     this.dispatchEvent(
       new CustomEvent("nys-error-clear", {
+        detail: { sourceCheckbox: this },
         bubbles: !0,
         composed: !0
       })
@@ -451,12 +456,12 @@ const k = class k extends x {
               id=${this.id + "--native"}
               class="nys-checkbox__checkbox"
               type="checkbox"
-              name="${y(this.name ? this.name : void 0)}"
+              name="${u(this.name ? this.name : void 0)}"
               .checked=${this.checked}
               ?disabled=${this.disabled}
               .value=${this.value}
               ?required="${this.required}"
-              form=${y(this.form || void 0)}
+              form=${u(this.form || void 0)}
               aria-checked="${this.checked}"
               aria-disabled="${this.disabled ? "true" : "false"}"
               aria-required="${this.required}"
@@ -464,7 +469,7 @@ const k = class k extends x {
               @change="${this._handleChange}"
               @focus="${this._handleFocus}"
               @keydown="${this._handleKeydown}"
-              aria-label=${this.label || y(this.other ? "Other" : void 0)}
+              aria-label=${this.label || u(this.other ? "Other" : void 0)}
             />
             ${this.checked ? d`<nys-icon
                   name="check"
@@ -477,8 +482,8 @@ const k = class k extends x {
               tooltip=${this.tooltip}
               for=${this.id + "--native"}
               label="${this.label || (this.other ? "Other" : "")}"
-              description=${y(this.description || void 0)}
-              flag=${y(this.required ? "required" : void 0)}
+              description=${u(this.description || void 0)}
+              flag=${u(this.required ? "required" : void 0)}
               ?inverted=${this.inverted}
             >
               <slot name="description" slot="description"
@@ -511,70 +516,70 @@ const k = class k extends x {
   }
 };
 k.styles = v(f), k.shadowRootOptions = {
-  ...x.shadowRootOptions,
+  ..._.shadowRootOptions,
   delegatesFocus: !0
 }, k.formAssociated = !0;
 let i = k;
-n([
-  s({ type: Boolean, reflect: !0 })
+h([
+  o({ type: Boolean, reflect: !0 })
 ], i.prototype, "checked");
-n([
-  s({ type: Boolean, reflect: !0 })
+h([
+  o({ type: Boolean, reflect: !0 })
 ], i.prototype, "disabled");
-n([
-  s({ type: Boolean, reflect: !0 })
+h([
+  o({ type: Boolean, reflect: !0 })
 ], i.prototype, "required");
-n([
-  s({ type: String })
+h([
+  o({ type: String })
 ], i.prototype, "label");
-n([
-  s({ type: String })
+h([
+  o({ type: String })
 ], i.prototype, "description");
-n([
-  s({ type: String, reflect: !0 })
+h([
+  o({ type: String, reflect: !0 })
 ], i.prototype, "id");
-n([
-  s({ type: String, reflect: !0 })
+h([
+  o({ type: String, reflect: !0 })
 ], i.prototype, "name");
-n([
-  s({ type: String })
+h([
+  o({ type: String })
 ], i.prototype, "value");
-n([
-  s({ type: String, reflect: !0 })
+h([
+  o({ type: String, reflect: !0 })
 ], i.prototype, "form");
-n([
-  s({ type: Boolean, reflect: !0 })
+h([
+  o({ type: Boolean, reflect: !0 })
 ], i.prototype, "showError");
-n([
-  s({ type: String })
+h([
+  o({ type: String })
 ], i.prototype, "errorMessage");
-n([
-  s({ type: Boolean })
+h([
+  o({ type: Boolean })
 ], i.prototype, "groupExist");
-n([
-  s({ type: Boolean, reflect: !0 })
+h([
+  o({ type: Boolean, reflect: !0 })
 ], i.prototype, "tile");
-n([
-  s({ type: Boolean, reflect: !0 })
+h([
+  o({ type: Boolean, reflect: !0 })
 ], i.prototype, "inverted");
-n([
-  s({ type: String })
+h([
+  o({ type: String })
 ], i.prototype, "tooltip");
-n([
-  s({ type: String, reflect: !0 })
+h([
+  o({ type: String, reflect: !0 })
 ], i.prototype, "size");
-n([
-  s({ type: Boolean, reflect: !0 })
+h([
+  o({ type: Boolean, reflect: !0 })
 ], i.prototype, "other");
-n([
-  s({ type: Boolean })
+h([
+  o({ type: Boolean })
 ], i.prototype, "showOtherError");
-n([
-  _()
+h([
+  x()
 ], i.prototype, "isMobile");
 customElements.get("nys-checkbox") || customElements.define("nys-checkbox", i);
 export {
   i as NysCheckbox,
-  c as NysCheckboxgroup
+  n as NysCheckboxgroup
 };
 //# sourceMappingURL=nys-checkbox.js.map

package/dist/nys-checkbox.js.map

@@ -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\";\nimport type { NysCheckbox } from \"./nys-checkbox\";\n\nlet checkboxgroupIdCounter = 0;\n\n/**\n * A container for grouping multiple `nys-checkbox` components as a single form control.\n * Handles validation, required constraints, and submits comma-separated values.\n *\n * Use to allow users to select multiple options from a list. Apply `tile`, `size`, and `inverted` to the group\n * and all children inherit these styles automatically.\n *\n * @summary Container for grouping checkboxes as a single form control.\n * @element nys-checkboxgroup\n *\n * @slot - Default slot for `nys-checkbox` elements.\n * @slot description - Custom HTML description content.\n *\n * @example Basic checkbox group\n * ```html\n * <nys-checkboxgroup label=\"Select landmarks\" required>\n *   <nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n *   <nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n * </nys-checkboxgroup>\n * ```\n */\n\nexport class NysCheckboxgroup extends LitElement {\n  static styles = unsafeCSS(styles);\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /** Unique identifier. Auto-generated if not provided. */\n  @property({ type: String, reflect: true }) id = \"\";\n\n  /** Name for form submission. Set on group, not individual checkboxes. */\n  @property({ type: String, reflect: true }) name = \"\";\n\n  /** Requires at least one checkbox to be checked. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  /** Shows \"Optional\" flag. */\n  @property({ type: Boolean, reflect: true }) optional = false;\n\n  /** Shows error message when true. */\n  @property({ type: Boolean, reflect: true }) showError = false;\n\n  /** Error message text. Shown only when `showError` is true. */\n  @property({ type: String }) errorMessage = \"\";\n\n  /** Visible label text for the group. */\n  @property({ type: String }) label = \"\";\n\n  /** Helper text below label. Use slot for custom HTML. */\n  @property({ type: String }) description = \"\";\n\n  /** Renders all checkboxes as tiles with larger clickable area. */\n  @property({ type: Boolean, reflect: true }) tile = false;\n\n  /** Tooltip text shown on hover/focus of info icon. */\n  @property({ type: String }) tooltip = \"\";\n\n  /** Adjusts colors for dark backgrounds. Applied to all children. */\n  @property({ type: Boolean, reflect: true }) inverted = false;\n\n  /** Form `id` to associate with. Applied to all children. */\n  @property({ type: String, reflect: true }) form: string | null = null;\n\n  /**\n   * Checkbox size for all children: `sm` (24px) or `md` (32px, default).\n   * @default \"md\"\n   */\n  @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n\n  @state() private _slottedDescriptionText = \"\";\n  @state() private _hasOtherError = false;\n  @state() private _otherErrorCheckbox: NysCheckbox | null = null;\n\n  private _internals: ElementInternals;\n\n  /**\n   * Lifecycle methods\n   * --------------------------------------------------------------------------\n   */\n\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-checkboxgroup-${Date.now()}-${checkboxgroupIdCounter++}`;\n    }\n    this.addEventListener(\"nys-change\", this._handleCheckboxChange);\n    this.addEventListener(\"invalid\", this._handleInvalid);\n    this.addEventListener(\"nys-error\", this._handleChildError);\n    this.addEventListener(\"nys-error-clear\", this._handleChildErrorClear);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(\"nys-change\", this._handleCheckboxChange);\n    this.removeEventListener(\"invalid\", this._handleInvalid);\n    this.removeEventListener(\"nys-error\", this._handleChildError);\n    this.removeEventListener(\"nys-error-clear\", this._handleChildErrorClear);\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  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\n  private _hasAtLeastOneChecked() {\n    return Array.from(this.querySelectorAll(\"nys-checkbox\")).some(\n      (checkbox: any) => checkbox.checked,\n    );\n  }\n\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) return;\n\n    const message =\n      this.errorMessage || \"You must make a selection to proceed.\";\n    const checkboxes = Array.from(\n      this.querySelectorAll(\"nys-checkbox\"),\n    ) as any[];\n\n    // Loop through each child checkbox to see if one is checked.\n    const atLeastOneChecked = this._hasAtLeastOneChecked();\n\n    const firstCheckboxInput = checkboxes\n      ? await checkboxes[0].getInputElement().catch(() => null)\n      : null;\n\n    // Always clear validation first to prevent message lingering\n    this._internals.setValidity({});\n    this.showError = false;\n\n    if (!atLeastOneChecked) {\n      // Only set valueMissing if there's no active \"other\" error\n      // If there IS an \"other\" error, keep that as the primary error\n      if (!this._hasOtherError) {\n        this._internals.setValidity(\n          { valueMissing: true },\n          message,\n          firstCheckboxInput ?? this,\n        );\n        this.showError = true;\n      } else {\n        // Re-set the other error since we just cleared everything\n        this._setCustomOtherError();\n        this.showError = true;\n      }\n    } else {\n      // At least one checkbox is checked\n      // If there's an \"other\" error, reset it since we cleared everything above\n      if (this._hasOtherError && this._otherErrorCheckbox) {\n        this._setCustomOtherError();\n        this.showError = true;\n      }\n    }\n  }\n\n  private _setCustomOtherError() {\n    const textInput =\n      this._otherErrorCheckbox?.shadowRoot?.querySelector(\"nys-textinput\");\n    const targetElement = textInput || this._otherErrorCheckbox;\n    this._internals.setValidity(\n      { customError: true },\n      \"Please complete this field.\",\n      targetElement as HTMLElement,\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  // This callback is automatically called when the parent form is reset.\n  public formResetCallback() {\n    // Reset all child checkboxes\n    const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n    checkboxes.forEach((checkbox: any) => {\n      checkbox.formResetCallback();\n    });\n\n    this._internals.setFormValue(\"\");\n\n    // Reset validation UI\n    this.showError = false;\n    this._internals.setValidity({});\n\n    // Re-render UI\n    this.requestUpdate();\n  }\n\n  private async _handleInvalid(event: Event) {\n    event.preventDefault();\n\n    // Priority 1: Focus \"other\" text input when customError is set\n    if (this._internals.validity.customError) {\n      const checkboxes = Array.from(\n        this.querySelectorAll(\"nys-checkbox\"),\n      ) as NysCheckbox[];\n\n      const otherCheckbox = checkboxes.find(\n        (checkbox) => checkbox.other && checkbox.checked,\n      );\n\n      if (otherCheckbox) {\n        const textInput =\n          otherCheckbox.shadowRoot?.querySelector(\"nys-textinput\");\n\n        if (textInput) {\n          await (textInput as any).updateComplete;\n          (textInput as HTMLElement).focus();\n          return;\n        }\n      }\n    }\n\n    // Priority 2: Handle valueMissing (required validation)\n    if (this._internals.validity.valueMissing) {\n      this.showError = true;\n      this._manageRequire(); // Refresh validation message\n\n      // Fallback behavior\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 <nys-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\n  /**\n   * Event Handlers\n   * --------------------------------------------------------------------------\n   */\n\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(\n      this.querySelectorAll(\"nys-checkbox\"),\n    ) as NysCheckbox[];\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    this._internals.setFormValue(selectedValues.join(\", \"));\n\n    // Check \"other\" inputs first (they take priority)\n    this._checkOtherInputs(checkboxes);\n\n    // Only run required validation if no \"other\" error is active\n    if (!this._hasOtherError) {\n      this._manageRequire();\n    }\n  }\n\n  private async _handleChildError(event: Event) {\n    event.stopPropagation();\n\n    const { sourceCheckbox } = (event as CustomEvent).detail;\n    if (!sourceCheckbox) return;\n\n    // Track which checkbox has the error\n    this._hasOtherError = true;\n    this._otherErrorCheckbox = sourceCheckbox;\n    this.showError = true;\n\n    this._setCustomOtherError();\n  }\n\n  private _handleChildErrorClear(event: Event) {\n    const customEvent = event as CustomEvent;\n    const sourceCheckbox = customEvent.detail?.sourceCheckbox;\n\n    if (\n      this._otherErrorCheckbox &&\n      sourceCheckbox !== this._otherErrorCheckbox\n    ) {\n      return;\n    }\n\n    // Clear the old validation state first so to prevent the old customError message from persisting\n    this._internals.setValidity({});\n    this.showError = false;\n\n    // Then check if we need to set a new required error\n    if (this.required && !this._hasAtLeastOneChecked()) {\n      this._manageRequire();\n    }\n  }\n\n  private async _checkOtherInputs(checkboxes: NysCheckbox[]) {\n    for (const checkbox of checkboxes) {\n      if (checkbox.checked && checkbox.other) {\n        const value = checkbox.value.trim();\n\n        const hasUserInteracted = (checkbox as any)._hasUserInteracted;\n\n        if (!hasUserInteracted) {\n          // User hasn't interacted yet, skip validation\n          continue;\n        }\n\n        if (!value || value === \"\") {\n          this._hasOtherError = true;\n          this._otherErrorCheckbox = checkbox;\n          this._setCustomOtherError();\n          this.showError = true;\n          return;\n        }\n      }\n    }\n\n    // If we reached here, no other invalid \"other\" was found.\n    // Clear any previous \"other\" error\n    if (this._hasOtherError) {\n      this._hasOtherError = false;\n      this._otherErrorCheckbox = null;\n\n      // Re-check required constraint\n      if (this.required) {\n        this._manageRequire();\n      } else {\n        this._internals.setValidity({});\n        this.showError = false;\n      }\n    }\n  }\n\n  render() {\n    return html`\n      <fieldset\n        aria-label=\"${this.label}${this._slottedDescriptionText\n          ? ` ${this._slottedDescriptionText}`\n          : this.description\n            ? ` ${this.description}`\n            : \"\"}\"\n        class=\"nys-checkboxgroup\"\n        role=\"radiogroup\"\n      >\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          <slot></slot>\n        </div>\n        <nys-errormessage\n          ?showError=${this.showError}\n          errorMessage=${this._internals.validationMessage || this.errorMessage}\n          .showDivider=${!this.tile}\n        ></nys-errormessage>\n      </fieldset>\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, state } 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;\n\n/**\n * A checkbox input for binary choices or multi-select lists. Can be used standalone or in a `nys-checkboxgroup`.\n * Form-associated with validation via ElementInternals.\n *\n * Use for binary decisions (agree/disagree) or selecting multiple options from a list.\n * For single selection from 2-6 options, use `nys-radiobutton`. For immediate state changes, use `nys-toggle`.\n *\n * @summary Checkbox for binary choices or multi-select options.\n * @element nys-checkbox\n *\n * @slot description - Custom HTML description content.\n *\n * @fires nys-change - Fired when checked state changes. Detail: `{id, checked, name, value}`.\n * @fires nys-focus - Fired when checkbox gains focus.\n * @fires nys-blur - Fired when checkbox loses focus.\n * @fires nys-other-input - Fired when \"other\" text input value changes. Detail: `{id, name, value}`.\n *\n * @example Single checkbox\n * ```html\n * <nys-checkbox label=\"I agree to the terms\" name=\"terms\" required></nys-checkbox>\n * ```\n *\n * @example Checkbox group\n * ```html\n * <nys-checkboxgroup label=\"Select landmarks\">\n *   <nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n *   <nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n * </nys-checkboxgroup>\n * ```\n */\n\nexport class NysCheckbox extends LitElement {\n  static styles = unsafeCSS(styles);\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /** Whether checkbox is checked. */\n  @property({ type: Boolean, reflect: true }) checked = false;\n\n  /** Prevents interaction. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Marks as required. Validates that checkbox is checked. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  /** Visible label text. Required for accessibility. */\n  @property({ type: String }) label = \"\";\n\n  /** Helper text below label. Use slot for custom HTML. */\n  @property({ type: String }) description = \"\";\n\n  /** Unique identifier. Auto-generated if not provided. */\n  @property({ type: String, reflect: true }) id = \"\";\n\n  /** Name for form submission. Use same name for grouped checkboxes. */\n  @property({ type: String, reflect: true }) name = \"\";\n\n  /** Value submitted when checked. */\n  @property({ type: String }) value = \"\";\n\n  /** Form `id` to associate with when checkbox is outside form element. */\n  @property({ type: String, reflect: true }) form: string | null = null;\n\n  /** Shows error message when true. */\n  @property({ type: Boolean, reflect: true }) showError = false;\n\n  /** Error message text. Shown only when `showError` is true. */\n  @property({ type: String }) errorMessage = \"\";\n\n  /** Internal: Set by parent checkboxgroup. Do not set manually. */\n  @property({ type: Boolean }) groupExist = false;\n\n  /** Renders as tile with larger clickable area. Apply to group for consistency. */\n  @property({ type: Boolean, reflect: true }) tile = false;\n\n  /** Adjusts colors for dark backgrounds. */\n  @property({ type: Boolean, reflect: true }) inverted = false;\n\n  /** Tooltip text shown on hover/focus of info icon. */\n  @property({ type: String }) tooltip = \"\";\n\n  /**\n   * Checkbox size: `sm` (24px) or `md` (32px, default).\n   * @default \"md\"\n   */\n  @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n  @property({ type: Boolean, reflect: true }) other = false;\n  @property({ type: Boolean }) showOtherError = false;\n  @state() private isMobile = window.innerWidth < 480;\n\n  private _hasUserInteracted = false; // need this flag for \"eager mode\"\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  /**\n   * Lifecycle methods\n   * --------------------------------------------------------------------------\n   */\n\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    this.addEventListener(\"blur\", this._handleBlur);\n    window.addEventListener(\"resize\", this._handleResize);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(\"invalid\", this._handleInvalid);\n    this.removeEventListener(\"blur\", this._handleBlur);\n    window.removeEventListener(\"resize\", this._handleResize);\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  /**\n   * Form Integration\n   * --------------------------------------------------------------------------\n   */\n\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  // Called automatically when the parent form is reset\n  public formResetCallback() {\n    this.checked = false;\n\n    this._internals.setFormValue(null);\n\n    const input = this.shadowRoot?.querySelector(\"input\");\n    if (input) {\n      input.checked = false;\n    }\n\n    // Reset validation UI\n    this.showError = false;\n    this.errorMessage = \"\";\n    this._internals.setValidity({});\n\n    // Re-render UI\n    this.requestUpdate();\n  }\n\n  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\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 main = this.shadowRoot?.querySelector(\n      \".nys-checkbox__main-container\",\n    );\n    const inputEl = this.shadowRoot?.querySelector(\"input\");\n\n    if (!main || !inputEl) return;\n\n    main.addEventListener(\"click\", (e) => {\n      const target = e.target as HTMLElement;\n\n      // Let native input behavior work. Avoid double toggling the checkbox.\n      if (target.tagName.toLowerCase() === \"input\") return;\n\n      if (!this.disabled) {\n        inputEl.click();\n        inputEl.focus();\n      }\n    });\n  };\n\n  get _hasDescription() {\n    // This accounts for both description prop or slotted content. Used for styling text alignment.\n    const slot = this.querySelector('[slot=\"description\"]');\n    return !!this.description || !!slot;\n  }\n\n  private _handleResize = () => {\n    this.isMobile = window.innerWidth < 480;\n  };\n\n  /**\n   * Event Handlers\n   * --------------------------------------------------------------------------\n   */\n\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  private _emitOtherInputEvent() {\n    this.dispatchEvent(\n      new CustomEvent(\"nys-other-input\", {\n        detail: {\n          id: this.id,\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 async _handleChange(e: Event) {\n    const { checked } = e.target as HTMLInputElement;\n    const wasChecked = this.checked;\n\n    this.checked = checked;\n\n    if (!this.groupExist) {\n      this._internals.setFormValue(this.checked ? this.value : null);\n    }\n\n    // If unchecking \"other\", clear error state\n    if (this.other && wasChecked && !checked) {\n      this.showOtherError = false;\n      this._hasUserInteracted = false;\n      this._dispatchClearError();\n    }\n\n    this._validate();\n    this._emitChangeEvent();\n  }\n\n  private _handleFocus() {\n    this.dispatchEvent(new Event(\"nys-focus\"));\n  }\n\n  private _handleBlur() {\n    this.dispatchEvent(new Event(\"nys-blur\"));\n\n    if (this.other && this.checked) {\n      this._hasUserInteracted = true;\n      this._validateOtherAndEmitError();\n    }\n  }\n\n  private _handleTextInputBlur() {\n    this._hasUserInteracted = true;\n    this._validateOtherAndEmitError();\n  }\n\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  private _handleTextInput(event: Event) {\n    const input = event.target as HTMLInputElement;\n    let newValue = input.value;\n    this.value = newValue;\n\n    if (this._hasUserInteracted) {\n      this._validateOtherAndEmitError();\n    }\n\n    this._emitOtherInputEvent();\n  }\n\n  private _validateOtherAndEmitError() {\n    if (!this.other) return;\n\n    // Prevent early validation of the \"other\" input before the user interacts with it.\n    // Additionally clear validation when \"other\" checkbox is unchecked\n    if (!this.checked || !this._hasUserInteracted) {\n      this.showOtherError = false;\n\n      this._dispatchClearError();\n      return;\n    }\n\n    const isInvalid = this.value.trim() === \"\";\n    this.showOtherError = isInvalid;\n\n    if (isInvalid) {\n      this.dispatchEvent(\n        new CustomEvent(\"nys-error\", {\n          detail: {\n            id: this.id,\n            name: this.name,\n            type: \"other\",\n            message: \"Please enter a value for this option.\",\n            sourceCheckbox: this,\n          },\n          bubbles: true,\n          composed: true,\n        }),\n      );\n    }\n  }\n\n  private _dispatchClearError() {\n    this.dispatchEvent(\n      new CustomEvent(\"nys-error-clear\", {\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  render() {\n    return html`\n      <div class=\"nys-checkbox\">\n        <div\n          class=\"nys-checkbox__main-container ${this._hasDescription\n            ? \"has-description\"\n            : \"\"}\"\n        >\n          <div class=\"nys-checkbox__checkbox-wrapper\">\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              @keydown=\"${this._handleKeydown}\"\n              aria-label=${this.label ||\n              ifDefined(this.other ? \"Other\" : undefined)}\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 || this.other) &&\n          html`\n            <nys-label\n              tooltip=${this.tooltip}\n              for=${this.id + \"--native\"}\n              label=\"${this.label || (this.other ? \"Other\" : \"\")}\"\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        </div>\n        <div class=\"nys-checkbox__other-container\">\n          ${this.other && this.checked\n            ? html`\n                <nys-textinput\n                  .value=${this.value}\n                  id=${\"radiobutton-other-\" + this.id}\n                  @nys-input=${this._handleTextInput}\n                  @nys-blur=${this._handleTextInputBlur}\n                  ariaLabel=\"Other\"\n                  aria-invalid=${this.showOtherError ? \"true\" : \"false\"}\n                  width=${this.isMobile ? \"full\" : \"md\"}\n                ></nys-textinput>\n              `\n            : \"\"}\n        </div>\n      </div>\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","atLeastOneChecked","targetElement","nodes","node","event","otherCheckbox","textInput","form","element","customEvent","name","selectedValues","sourceCheckbox","value","html","unsafeCSS","styles","NysCheckboxgroup","__decorateClass","property","state","checkboxIdCounter","_NysCheckbox","main","inputEl","e","input","validity","slot","checked","wasChecked","newValue","isInvalid","ifDefined","NysCheckbox"],"mappings":";;;;;;;;;;;;;;;;;;;AAMA,IAAIA,IAAyB;AAwBtB,MAAMC,IAAN,MAAMA,UAAyBC,EAAW;AAAA;AAAA,EA8D/C,cAAc;AACZ,UAAA,GAvDyC,KAAA,KAAK,IAGL,KAAA,OAAO,IAGN,KAAA,WAAW,IAGX,KAAA,WAAW,IAGX,KAAA,YAAY,IAG5B,KAAA,eAAe,IAGf,KAAA,QAAQ,IAGR,KAAA,cAAc,IAGE,KAAA,OAAO,IAGvB,KAAA,UAAU,IAGM,KAAA,WAAW,IAGZ,KAAA,OAAsB,MAMtB,KAAA,OAAoB,MAEtD,KAAQ,0BAA0B,IAClC,KAAQ,iBAAiB,IACzB,KAAQ,sBAA0C,MAazD,KAAK,aAAa,KAAK,gBAAA;AAAA,EACzB;AAAA;AAAA,EAGA,oBAAoB;AAClB,UAAM,kBAAA,GACD,KAAK,OACR,KAAK,KAAK,qBAAqB,KAAK,KAAK,IAAIF,GAAwB,KAEvE,KAAK,iBAAiB,cAAc,KAAK,qBAAqB,GAC9D,KAAK,iBAAiB,WAAW,KAAK,cAAc,GACpD,KAAK,iBAAiB,aAAa,KAAK,iBAAiB,GACzD,KAAK,iBAAiB,mBAAmB,KAAK,sBAAsB;AAAA,EACtE;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA,GACN,KAAK,oBAAoB,cAAc,KAAK,qBAAqB,GACjE,KAAK,oBAAoB,WAAW,KAAK,cAAc,GACvD,KAAK,oBAAoB,aAAa,KAAK,iBAAiB,GAC5D,KAAK,oBAAoB,mBAAmB,KAAK,sBAAsB;AAAA,EACzE;AAAA,EAEA,eAAe;AAEb,SAAK,eAAA,GACL,KAAK,oBAAA,GACL,KAAK,oBAAA,GACL,KAAK,yBAAA,GACL,KAAK,2BAAA;AAAA,EACP;AAAA,EAEA,QAAQG,GAAkD;AACxD,IAAIA,EAAkB,IAAI,UAAU,KAC9B,KAAK,YACP,KAAK,uBAAA,GAGLA,EAAkB,IAAI,MAAM,KAC9B,KAAK,oBAAA,GAEHA,EAAkB,IAAI,MAAM,KAC9B,KAAK,oBAAA,GAEHA,EAAkB,IAAI,UAAU,KAClC,KAAK,sBAAA,GAEHA,EAAkB,IAAI,WAAW,KACnC,KAAK,yBAAA,GAEHA,EAAkB,IAAI,MAAM,KAC9B,KAAK,oBAAA;AAAA,EAET;AAAA;AAAA;AAAA;AAAA;AAAA,EAOQ,wBAAwB;AAC9B,WAAO,MAAM,KAAK,KAAK,iBAAiB,cAAc,CAAC,EAAE;AAAA,MACvD,CAACC,MAAkBA,EAAS;AAAA,IAAA;AAAA,EAEhC;AAAA,EAEQ,iBAAiB;AAEvB,IADmB,KAAK,iBAAiB,cAAc,EAC5C,QAAQ,CAACA,MAAkB;AACpC,MAAAA,EAAS,aAAa;AAAA,IACxB,CAAC;AAAA,EACH;AAAA;AAAA,EAGA,MAAc,yBAAyB;AACrC,UAAMC,IAAgB,KAAK,cAAc,cAAc,GACjDC,IAAU,KAAK,gBAAgB,0BAE/BC,IAAqBF,IACvB,MAAOA,EAAsB,oBAC7B;AAEJ,SAAK,WAAW;AAAA,MACd,EAAE,cAAc,GAAA;AAAA,MAChBC;AAAA,MACAC,KAA0C;AAAA,IAAA;AAAA,EAE9C;AAAA;AAAA,EAGA,MAAc,iBAAiB;AAC7B,QAAI,CAAC,KAAK,SAAU;AAEpB,UAAMD,IACJ,KAAK,gBAAgB,yCACjBE,IAAa,MAAM;AAAA,MACvB,KAAK,iBAAiB,cAAc;AAAA,IAAA,GAIhCC,IAAoB,KAAK,sBAAA,GAEzBF,IAAqBC,IACvB,MAAMA,EAAW,CAAC,EAAE,gBAAA,EAAkB,MAAM,MAAM,IAAI,IACtD;AAGJ,SAAK,WAAW,YAAY,EAAE,GAC9B,KAAK,YAAY,IAEZC,IAkBC,KAAK,kBAAkB,KAAK,wBAC9B,KAAK,qBAAA,GACL,KAAK,YAAY,MAjBd,KAAK,kBASR,KAAK,qBAAA,GACL,KAAK,YAAY,OATjB,KAAK,WAAW;AAAA,MACd,EAAE,cAAc,GAAA;AAAA,MAChBH;AAAA,MACAC,KAAsB;AAAA,IAAA,GAExB,KAAK,YAAY;AAAA,EAcvB;AAAA,EAEQ,uBAAuB;AAG7B,UAAMG,IADJ,KAAK,qBAAqB,YAAY,cAAc,eAAe,KAClC,KAAK;AACxC,SAAK,WAAW;AAAA,MACd,EAAE,aAAa,GAAA;AAAA,MACf;AAAA,MACAA;AAAA,IAAA;AAAA,EAEJ;AAAA;AAAA,EAGQ,sBAAsB;AAE5B,IADmB,KAAK,iBAAiB,cAAc,EAC5C,QAAQ,CAACN,MAAa;AAC/B,MAAAA,EAAS,aAAa,QAAQ,KAAK,IAAI;AAAA,IACzC,CAAC;AAAA,EACH;AAAA,EAEQ,sBAAsB;AAE5B,IADmB,KAAK,iBAAiB,cAAc,EAC5C,QAAQ,CAACA,MAAa;AAC/B,MAAI,KAAK,OACPA,EAAS,gBAAgB,QAAQ,EAAI,IAErCA,EAAS,gBAAgB,MAAM;AAAA,IAEnC,CAAC;AAAA,EACH;AAAA,EAEQ,wBAAwB;AAE9B,IADmB,KAAK,iBAAiB,cAAc,EAC5C,QAAQ,CAACA,MAAa;AAC/B,MAAI,KAAK,WACPA,EAAS,gBAAgB,YAAY,EAAI,IAEzCA,EAAS,gBAAgB,UAAU;AAAA,IAEvC,CAAC;AAAA,EACH;AAAA,EAEQ,2BAA2B;AAEjC,IADmB,KAAK,iBAAiB,cAAc,EAC5C,QAAQ,CAACA,MAAa;AAC/B,MAAI,KAAK,YACPA,EAAS,aAAa,aAAa,EAAE,IAErCA,EAAS,gBAAgB,WAAW;AAAA,IAExC,CAAC;AAAA,EACH;AAAA,EAEQ,sBAAsB;AAE5B,IADmB,KAAK,iBAAiB,cAAc,EAC5C,QAAQ,CAACA,MAAa;AAC/B,MAAI,KAAK,aACH,KAAK,SAAS,OAChBA,EAAS,aAAa,QAAQ,KAAK,IAAI,IAKzCA,EAAS,gBAAgB,MAAM;AAAA,IAEnC,CAAC;AAAA,EACH;AAAA;AAAA,EAGQ,6BAA6B;AAInC,UAAMO,IAHO,KAAK,YAAY;AAAA,MAC5B;AAAA,IAAA,GAEkB,cAAc,EAAE,SAAS,GAAA,CAAM,KAAK,CAAA;AAExD,SAAK,0BAA0BA,EAC5B,IAAI,CAACC,MAASA,EAAK,aAAa,KAAA,CAAM,EACtC,OAAO,OAAO,EACd,KAAK,IAAI;AAAA,EACd;AAAA;AAAA,EAGO,oBAAoB;AAGzB,IADmB,KAAK,iBAAiB,cAAc,EAC5C,QAAQ,CAACR,MAAkB;AACpC,MAAAA,EAAS,kBAAA;AAAA,IACX,CAAC,GAED,KAAK,WAAW,aAAa,EAAE,GAG/B,KAAK,YAAY,IACjB,KAAK,WAAW,YAAY,EAAE,GAG9B,KAAK,cAAA;AAAA,EACP;AAAA,EAEA,MAAc,eAAeS,GAAc;AAIzC,QAHAA,EAAM,eAAA,GAGF,KAAK,WAAW,SAAS,aAAa;AAKxC,YAAMC,IAJa,MAAM;AAAA,QACvB,KAAK,iBAAiB,cAAc;AAAA,MAAA,EAGL;AAAA,QAC/B,CAACV,MAAaA,EAAS,SAASA,EAAS;AAAA,MAAA;AAG3C,UAAIU,GAAe;AACjB,cAAMC,IACJD,EAAc,YAAY,cAAc,eAAe;AAEzD,YAAIC,GAAW;AACb,gBAAOA,EAAkB,gBACxBA,EAA0B,MAAA;AAC3B;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAGA,QAAI,KAAK,WAAW,SAAS,cAAc;AACzC,WAAK,YAAY,IACjB,KAAK,eAAA;AAGL,YAAMV,IAAgB,KAAK,cAAc,cAAc,GACjDE,IAAqBF,IACvB,MAAOA,EAAsB,oBAC7B;AAEJ,UAAIE,GAAoB;AAEtB,cAAMS,IAAO,KAAK,WAAW;AAC7B,QAAIA,IACe,MAAM,KAAKA,EAAK,QAAQ,EAIJ,KAAK,CAACC,MAAY;AAErD,cAAIA,EAAQ,QAAQ,YAAA,MAAkB;AAQpC,gBAPsB,MAAM;AAAA,cAC1B,KAAK,iBAAiB,cAAc;AAAA,YAAA,EAEG;AAAA,cACvC,CAACb,MAAaA,EAAS;AAAA,YAAA,EAGF,WAAW;AAChC,qBAAOa;AAAA;AAGT,mBACE,OAAOA,EAAQ,iBAAkB,cACjC,CAACA,EAAQ,cAAA;AAAA,QAGf,CAAC,MAE2B,QAC1BV,EAAmB,MAAA,IAIrBA,EAAmB,MAAA;AAAA,MAEvB;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQQ,sBAAsBM,GAAc;AAC1C,UAAMK,IAAcL,GACd,EAAE,MAAAM,MAASD,EAAY,QACvBV,IAAa,MAAM;AAAA,MACvB,KAAK,iBAAiB,cAAc;AAAA,IAAA,GAIhCY,IAAiBZ,EACpB,OAAO,CAACJ,MAAkBA,EAAS,OAAO,EAC1C,IAAI,CAACA,MAAkBA,EAAS,KAAK;AAExC,SAAK,OAAOe,GACZ,KAAK,WAAW,aAAaC,EAAe,KAAK,IAAI,CAAC,GAGtD,KAAK,kBAAkBZ,CAAU,GAG5B,KAAK,kBACR,KAAK,eAAA;AAAA,EAET;AAAA,EAEA,MAAc,kBAAkBK,GAAc;AAC5C,IAAAA,EAAM,gBAAA;AAEN,UAAM,EAAE,gBAAAQ,MAAoBR,EAAsB;AAClD,IAAKQ,MAGL,KAAK,iBAAiB,IACtB,KAAK,sBAAsBA,GAC3B,KAAK,YAAY,IAEjB,KAAK,qBAAA;AAAA,EACP;AAAA,EAEQ,uBAAuBR,GAAc;AAE3C,UAAMQ,IADcR,EACe,QAAQ;AAE3C,IACE,KAAK,uBACLQ,MAAmB,KAAK,wBAM1B,KAAK,WAAW,YAAY,EAAE,GAC9B,KAAK,YAAY,IAGb,KAAK,YAAY,CAAC,KAAK,2BACzB,KAAK,eAAA;AAAA,EAET;AAAA,EAEA,MAAc,kBAAkBb,GAA2B;AACzD,eAAWJ,KAAYI;AACrB,UAAIJ,EAAS,WAAWA,EAAS,OAAO;AACtC,cAAMkB,IAAQlB,EAAS,MAAM,KAAA;AAI7B,YAAI,CAFuBA,EAAiB;AAI1C;AAGF,YAAI,CAACkB,KAASA,MAAU,IAAI;AAC1B,eAAK,iBAAiB,IACtB,KAAK,sBAAsBlB,GAC3B,KAAK,qBAAA,GACL,KAAK,YAAY;AACjB;AAAA,QACF;AAAA,MACF;AAKF,IAAI,KAAK,mBACP,KAAK,iBAAiB,IACtB,KAAK,sBAAsB,MAGvB,KAAK,WACP,KAAK,eAAA,KAEL,KAAK,WAAW,YAAY,EAAE,GAC9B,KAAK,YAAY;AAAA,EAGvB;AAAA,EAEA,SAAS;AACP,WAAOmB;AAAA;AAAA,sBAEW,KAAK,KAAK,GAAG,KAAK,0BAC5B,IAAI,KAAK,uBAAuB,KAChC,KAAK,cACH,IAAI,KAAK,WAAW,KACpB,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKA,KAAK,KAAK,UAAU;AAAA,kBAClB,KAAK,KAAK;AAAA,wBACJ,KAAK,WAAW;AAAA,iBACvB,KAAK,WAAW,aAAa,KAAK,WAAW,aAAa,EAAE;AAAA,oBACzD,KAAK,OAAO;AAAA,sBACV,KAAK,QAAQ;AAAA;AAAA,wDAEqB,KAAK,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAMjD,KAAK,SAAS;AAAA,yBACZ,KAAK,WAAW,qBAAqB,KAAK,YAAY;AAAA,yBACtD,CAAC,KAAK,IAAI;AAAA;AAAA;AAAA;AAAA,EAIjC;AACF;AA3fEtB,EAAO,SAASuB,EAAUC,CAAM,GAChCxB,EAAO,oBAAoB;AAAA,EACzB,GAAGC,EAAW;AAAA,EACd,gBAAgB;AAAA,GAwDlBD,EAAO,iBAAiB;AA5DnB,IAAMyB,IAANzB;AAQsC0B,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAR9BF,EAQgC,WAAA,IAAA;AAGAC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAX9BF,EAWgC,WAAA,MAAA;AAGCC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAd/BF,EAciC,WAAA,UAAA;AAGAC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAjB/BF,EAiBiC,WAAA,UAAA;AAGAC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GApB/BF,EAoBiC,WAAA,WAAA;AAGhBC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAvBfF,EAuBiB,WAAA,cAAA;AAGAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfF,EA0BiB,WAAA,OAAA;AAGAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA7BfF,EA6BiB,WAAA,aAAA;AAGgBC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAhC/BF,EAgCiC,WAAA,MAAA;AAGhBC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAnCfF,EAmCiB,WAAA,SAAA;AAGgBC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAtC/BF,EAsCiC,WAAA,UAAA;AAGDC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAzC9BF,EAyCgC,WAAA,MAAA;AAMAC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GA/C9BF,EA+CgC,WAAA,MAAA;AAE1BC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAjDIH,EAiDM,WAAA,yBAAA;AACAC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAlDIH,EAkDM,WAAA,gBAAA;AACAC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAnDIH,EAmDM,WAAA,qBAAA;AA2cd,eAAe,IAAI,mBAAmB,KACzC,eAAe,OAAO,qBAAqBA,CAAgB;;;;;;ACthB7D,IAAII,IAAoB;AAiCjB,MAAMC,IAAN,MAAMA,UAAoB7B,EAAW;AAAA;AAAA,EA6E1C,cAAc;AACZ,UAAA,GAtE0C,KAAA,UAAU,IAGV,KAAA,WAAW,IAGX,KAAA,WAAW,IAG3B,KAAA,QAAQ,IAGR,KAAA,cAAc,IAGC,KAAA,KAAK,IAGL,KAAA,OAAO,IAGtB,KAAA,QAAQ,IAGO,KAAA,OAAsB,MAGrB,KAAA,YAAY,IAG5B,KAAA,eAAe,IAGd,KAAA,aAAa,IAGE,KAAA,OAAO,IAGP,KAAA,WAAW,IAG3B,KAAA,UAAU,IAMK,KAAA,OAAoB,MACnB,KAAA,QAAQ,IACvB,KAAA,iBAAiB,IACrC,KAAQ,WAAW,OAAO,aAAa,KAEhD,KAAQ,qBAAqB,IA0K7B,KAAQ,oBAAoB,MAAM;AAChC,YAAM8B,IAAO,KAAK,YAAY;AAAA,QAC5B;AAAA,MAAA,GAEIC,IAAU,KAAK,YAAY,cAAc,OAAO;AAEtD,MAAI,CAACD,KAAQ,CAACC,KAEdD,EAAK,iBAAiB,SAAS,CAACE,MAAM;AAIpC,QAHeA,EAAE,OAGN,QAAQ,YAAA,MAAkB,YAEhC,KAAK,aACRD,EAAQ,MAAA,GACRA,EAAQ,MAAA;AAAA,MAEZ,CAAC;AAAA,IACH,GAQA,KAAQ,gBAAgB,MAAM;AAC5B,WAAK,WAAW,OAAO,aAAa;AAAA,IACtC,GArLE,KAAK,aAAa,KAAK,gBAAA;AAAA,EACzB;AAAA;AAAA,EAjBA,MAAa,kBAAoD;AAC/D,iBAAM,KAAK,gBACJ,KAAK,YAAY,cAAc,OAAO,KAAK;AAAA,EACpD;AAAA;AAAA,EAiBA,oBAAoB;AAClB,UAAM,kBAAA,GACD,KAAK,OACR,KAAK,KAAK,gBAAgB,KAAK,KAAK,IAAIH,GAAmB,KAE7D,KAAK,iBAAiB,WAAW,KAAK,cAAc,GACpD,KAAK,iBAAiB,QAAQ,KAAK,WAAW,GAC9C,OAAO,iBAAiB,UAAU,KAAK,aAAa;AAAA,EACtD;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA,GACN,KAAK,oBAAoB,WAAW,KAAK,cAAc,GACvD,KAAK,oBAAoB,QAAQ,KAAK,WAAW,GACjD,OAAO,oBAAoB,UAAU,KAAK,aAAa;AAAA,EACzD;AAAA,EAEA,eAAe;AAEb,SAAK,UAAA,GACL,KAAK,eAAA,GACL,KAAK,kBAAA;AAAA,EACP;AAAA;AAAA;AAAA;AAAA;AAAA,EAOQ,YAAY;AAClB,IAAK,KAAK,cACR,KAAK,WAAW,aAAa,KAAK,UAAU,KAAK,QAAQ,IAAI;AAAA,EAEjE;AAAA,EAEQ,iBAAiB;AACvB,UAAMK,IAAQ,KAAK,YAAY,cAAc,OAAO,GAC9C7B,IAAU,KAAK,gBAAgB;AACrC,IAAK6B,MAED,KAAK,YAAY,CAAC,KAAK,WACzB,KAAK,WAAW,eAAe,QAC/B,KAAK,WAAW,YAAY,EAAE,cAAc,GAAA,GAAQ7B,GAAS6B,CAAK,KAElE,KAAK,WAAW,YAAY,EAAE;AAAA,EAElC;AAAA,EAEQ,oBAAoB7B,IAAkB,IAAI;AAChD,UAAM6B,IAAQ,KAAK,YAAY,cAAc,OAAO;AACpD,IAAKA,MAGL,KAAK,YAAY,CAAC,CAAC7B,GAEf,KAAK,cAAc,KAAA,KAAUA,MAAY,OAC3CA,IAAU,KAAK,eAGjB,KAAK,WAAW;AAAA,MACdA,IAAU,EAAE,aAAa,GAAA,IAAS,CAAA;AAAA,MAClCA;AAAA,MACA6B;AAAA,IAAA;AAAA,EAEJ;AAAA,EAEQ,YAAY;AAClB,UAAMA,IAAQ,KAAK,YAAY,cAAc,OAAO;AACpD,QAAI,CAACA,EAAO;AAGZ,UAAMC,IAAWD,EAAM;AACvB,QAAI7B,IAAU;AAEd,IAAI8B,EAAS,iBACX9B,IAAU,2BAGZ,KAAK,oBAAoBA,CAAO;AAAA,EAClC;AAAA;AAAA,EAGO,oBAAoB;AACzB,SAAK,UAAU,IAEf,KAAK,WAAW,aAAa,IAAI;AAEjC,UAAM6B,IAAQ,KAAK,YAAY,cAAc,OAAO;AACpD,IAAIA,MACFA,EAAM,UAAU,KAIlB,KAAK,YAAY,IACjB,KAAK,eAAe,IACpB,KAAK,WAAW,YAAY,EAAE,GAG9B,KAAK,cAAA;AAAA,EACP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQA,gBAAyB;AAEvB,QAAI,KAAK,YAAY,CAAC,KAAK;AACzB,aAAO;AAIT,UAAMA,IAAQ,KAAK,YAAY,cAAc,OAAO;AACpD,WAAOA,IAAQA,EAAM,cAAA,IAAkB;AAAA,EACzC;AAAA,EAEQ,eAAetB,GAAc;AACnC,IAAAA,EAAM,eAAA,GAEN,KAAK,YAAY,IACjB,KAAK,UAAA;AAEL,UAAMsB,IAAQ,KAAK,YAAY,cAAc,OAAO;AACpD,QAAIA,GAAO;AAET,YAAMnB,IAAO,KAAK,WAAW;AAC7B,MAAIA,IACe,MAAM,KAAKA,EAAK,QAAQ,EAIJ;AAAA,QACnC,CAACC,MACC,OAAOA,EAAQ,iBAAkB,cACjC,CAACA,EAAQ,cAAA;AAAA,MAAc,MAEC,QAC1BkB,EAAM,MAAA,IAIRA,EAAM,MAAA;AAAA,IAEV;AAAA,EACF;AAAA,EAuBA,IAAI,kBAAkB;AAEpB,UAAME,IAAO,KAAK,cAAc,sBAAsB;AACtD,WAAO,CAAC,CAAC,KAAK,eAAe,CAAC,CAACA;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA,EAWQ,mBAAmB;AACzB,SAAK;AAAA,MACH,IAAI,YAAY,cAAc;AAAA,QAC5B,QAAQ;AAAA,UACN,IAAI,KAAK;AAAA,UACT,SAAS,KAAK;AAAA,UACd,MAAM,KAAK;AAAA,UACX,OAAO,KAAK;AAAA,QAAA;AAAA,QAEd,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA,EAEQ,uBAAuB;AAC7B,SAAK;AAAA,MACH,IAAI,YAAY,mBAAmB;AAAA,QACjC,QAAQ;AAAA,UACN,IAAI,KAAK;AAAA,UACT,MAAM,KAAK;AAAA,UACX,OAAO,KAAK;AAAA,QAAA;AAAA,QAEd,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA;AAAA,EAGA,MAAc,cAAc,GAAU;AACpC,UAAM,EAAE,SAAAC,MAAY,EAAE,QAChBC,IAAa,KAAK;AAExB,SAAK,UAAUD,GAEV,KAAK,cACR,KAAK,WAAW,aAAa,KAAK,UAAU,KAAK,QAAQ,IAAI,GAI3D,KAAK,SAASC,KAAc,CAACD,MAC/B,KAAK,iBAAiB,IACtB,KAAK,qBAAqB,IAC1B,KAAK,oBAAA,IAGP,KAAK,UAAA,GACL,KAAK,iBAAA;AAAA,EACP;AAAA,EAEQ,eAAe;AACrB,SAAK,cAAc,IAAI,MAAM,WAAW,CAAC;AAAA,EAC3C;AAAA,EAEQ,cAAc;AACpB,SAAK,cAAc,IAAI,MAAM,UAAU,CAAC,GAEpC,KAAK,SAAS,KAAK,YACrB,KAAK,qBAAqB,IAC1B,KAAK,2BAAA;AAAA,EAET;AAAA,EAEQ,uBAAuB;AAC7B,SAAK,qBAAqB,IAC1B,KAAK,2BAAA;AAAA,EACP;AAAA,EAEA,MAAc,eAAe,GAAkB;AAC7C,IAAI,EAAE,SAAS,YACb,EAAE,eAAA,GACG,KAAK,aACR,KAAK,UAAU,CAAC,KAAK,SACrB,KAAK,WAAW,aAAa,KAAK,UAAU,KAAK,QAAQ,IAAI,GAG7D,MAAM,KAAK,gBACX,KAAK,UAAA,GAEL,KAAK,iBAAA;AAAA,EAGX;AAAA,EAEQ,iBAAiBzB,GAAc;AAErC,QAAI2B,IADU3B,EAAM,OACC;AACrB,SAAK,QAAQ2B,GAET,KAAK,sBACP,KAAK,2BAAA,GAGP,KAAK,qBAAA;AAAA,EACP;AAAA,EAEQ,6BAA6B;AACnC,QAAI,CAAC,KAAK,MAAO;AAIjB,QAAI,CAAC,KAAK,WAAW,CAAC,KAAK,oBAAoB;AAC7C,WAAK,iBAAiB,IAEtB,KAAK,oBAAA;AACL;AAAA,IACF;AAEA,UAAMC,IAAY,KAAK,MAAM,KAAA,MAAW;AACxC,SAAK,iBAAiBA,GAElBA,KACF,KAAK;AAAA,MACH,IAAI,YAAY,aAAa;AAAA,QAC3B,QAAQ;AAAA,UACN,IAAI,KAAK;AAAA,UACT,MAAM,KAAK;AAAA,UACX,MAAM;AAAA,UACN,SAAS;AAAA,UACT,gBAAgB;AAAA,QAAA;AAAA,QAElB,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAGP;AAAA,EAEQ,sBAAsB;AAC5B,SAAK;AAAA,MACH,IAAI,YAAY,mBAAmB;AAAA,QACjC,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA,EAEA,SAAS;AACP,WAAOlB;AAAA;AAAA;AAAA,gDAGqC,KAAK,kBACvC,oBACA,EAAE;AAAA;AAAA;AAAA;AAAA,mBAIG,KAAK,KAAK,UAAU;AAAA;AAAA;AAAA,sBAGjBmB,EAAU,KAAK,OAAO,KAAK,OAAO,MAAS,CAAC;AAAA,yBACzC,KAAK,OAAO;AAAA,0BACX,KAAK,QAAQ;AAAA,uBAChB,KAAK,KAAK;AAAA,2BACN,KAAK,QAAQ;AAAA,qBACnBA,EAAU,KAAK,QAAQ,MAAS,CAAC;AAAA,8BACxB,KAAK,OAAO;AAAA,+BACX,KAAK,WAAW,SAAS,OAAO;AAAA,+BAChC,KAAK,QAAQ;AAAA;AAAA,yBAEnB,KAAK,aAAa;AAAA,wBACnB,KAAK,YAAY;AAAA,0BACf,KAAK,cAAc;AAAA,2BAClB,KAAK,SAClBA,EAAU,KAAK,QAAQ,UAAU,MAAS,CAAC;AAAA;AAAA,cAE3C,KAAK,UACHnB;AAAA;AAAA,0BAEU,KAAK,SAAS,OAClB,QACA,KAAK,SAAS,OACZ,QACA,KAAK;AAAA;AAAA,gCAGb,EAAE;AAAA;AAAA,aAEL,KAAK,SAAS,KAAK,UACtBA;AAAA;AAAA,wBAEc,KAAK,OAAO;AAAA,oBAChB,KAAK,KAAK,UAAU;AAAA,uBACjB,KAAK,UAAU,KAAK,QAAQ,UAAU,GAAG;AAAA,4BACpCmB,EAAU,KAAK,eAAe,MAAS,CAAC;AAAA,qBAC/CA,EAAU,KAAK,WAAW,aAAa,MAAS,CAAC;AAAA,0BAC5C,KAAK,QAAQ;AAAA;AAAA;AAAA,mBAGpB,KAAK,WAAW;AAAA;AAAA;AAAA,WAGxB;AAAA;AAAA;AAAA,YAGC,KAAK,SAAS,KAAK,UACjBnB;AAAA;AAAA,2BAEa,KAAK,KAAK;AAAA,uBACd,uBAAuB,KAAK,EAAE;AAAA,+BACtB,KAAK,gBAAgB;AAAA,8BACtB,KAAK,oBAAoB;AAAA;AAAA,iCAEtB,KAAK,iBAAiB,SAAS,OAAO;AAAA,0BAC7C,KAAK,WAAW,SAAS,IAAI;AAAA;AAAA,kBAGzC,EAAE;AAAA;AAAA;AAAA,QAGR,KAAK,eAAe,QAAQ,YAAA,MAAkB,sBAC5CA;AAAA;AAAA,yBAEe,KAAK,SAAS;AAAA,2BACZ,KAAK,WAAW,qBAC/B,KAAK,YAAY;AAAA,2BACF,CAAC,KAAK,IAAI;AAAA,kCAE3B,EAAE;AAAA;AAAA,EAEV;AACF;AAxeEQ,EAAO,SAASP,EAAUC,CAAM,GAChCM,EAAO,oBAAoB;AAAA,EACzB,GAAG7B,EAAW;AAAA,EACd,gBAAgB;AAAA,GAuElB6B,EAAO,iBAAiB;AA3EnB,IAAMY,IAANZ;AAQuCJ,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAR/Be,EAQiC,WAAA,SAAA;AAGAhB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAX/Be,EAWiC,WAAA,UAAA;AAGAhB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAd/Be,EAciC,WAAA,UAAA;AAGhBhB,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAjBfe,EAiBiB,WAAA,OAAA;AAGAhB,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GApBfe,EAoBiB,WAAA,aAAA;AAGehB,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAvB9Be,EAuBgC,WAAA,IAAA;AAGAhB,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GA1B9Be,EA0BgC,WAAA,MAAA;AAGfhB,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA7Bfe,EA6BiB,WAAA,OAAA;AAGehB,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAhC9Be,EAgCgC,WAAA,MAAA;AAGChB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAnC/Be,EAmCiC,WAAA,WAAA;AAGhBhB,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAtCfe,EAsCiB,WAAA,cAAA;AAGChB,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GAzChBe,EAyCkB,WAAA,YAAA;AAGehB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA5C/Be,EA4CiC,WAAA,MAAA;AAGAhB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA/C/Be,EA+CiC,WAAA,UAAA;AAGhBhB,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAlDfe,EAkDiB,WAAA,SAAA;AAMehB,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAxD9Be,EAwDgC,WAAA,MAAA;AACChB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAzD/Be,EAyDiC,WAAA,OAAA;AACfhB,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GA1DhBe,EA0DkB,WAAA,gBAAA;AACZhB,EAAA;AAAA,EAAhBE,EAAA;AAAM,GA3DIc,EA2DM,WAAA,UAAA;AAgbd,eAAe,IAAI,cAAc,KACpC,eAAe,OAAO,gBAAgBA,CAAW;"}
+{"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\";\nimport type { NysCheckbox } from \"./nys-checkbox\";\n\nlet checkboxgroupIdCounter = 0;\n\n/**\n * A container for grouping multiple `nys-checkbox` components as a single form control.\n * Handles validation, required constraints, and submits comma-separated values.\n *\n * Use to allow users to select multiple options from a list. Apply `tile`, `size`, and `inverted` to the group\n * and all children inherit these styles automatically.\n *\n * @summary Container for grouping checkboxes as a single form control.\n * @element nys-checkboxgroup\n *\n * @slot - Default slot for `nys-checkbox` elements.\n * @slot description - Custom HTML description content.\n *\n * @example Basic checkbox group\n * ```html\n * <nys-checkboxgroup label=\"Select landmarks\" required>\n *   <nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n *   <nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n * </nys-checkboxgroup>\n * ```\n */\n\nexport class NysCheckboxgroup extends LitElement {\n  static styles = unsafeCSS(styles);\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /** Unique identifier. Auto-generated if not provided. */\n  @property({ type: String, reflect: true }) id = \"\";\n\n  /** Name for form submission. Set on group, not individual checkboxes. */\n  @property({ type: String, reflect: true }) name = \"\";\n\n  /** Requires at least one checkbox to be checked. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  /** Shows \"Optional\" flag. */\n  @property({ type: Boolean, reflect: true }) optional = false;\n\n  /** Shows error message when true. */\n  @property({ type: Boolean, reflect: true }) showError = false;\n\n  /** Error message text. Shown only when `showError` is true. */\n  @property({ type: String }) errorMessage = \"\";\n\n  /** Visible label text for the group. */\n  @property({ type: String }) label = \"\";\n\n  /** Helper text below label. Use slot for custom HTML. */\n  @property({ type: String }) description = \"\";\n\n  /** Renders all checkboxes as tiles with larger clickable area. */\n  @property({ type: Boolean, reflect: true }) tile = false;\n\n  /** Tooltip text shown on hover/focus of info icon. */\n  @property({ type: String }) tooltip = \"\";\n\n  /** Adjusts colors for dark backgrounds. Applied to all children. */\n  @property({ type: Boolean, reflect: true }) inverted = false;\n\n  /** Form `id` to associate with. Applied to all children. */\n  @property({ type: String, reflect: true }) form: string | null = null;\n\n  /**\n   * Checkbox size for all children: `sm` (24px) or `md` (32px, default).\n   * @default \"md\"\n   */\n  @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n\n  @state() private _slottedDescriptionText = \"\";\n  @state() private _hasOtherError = false;\n  @state() private _otherErrorCheckbox: NysCheckbox | null = null;\n\n  private _internals: ElementInternals;\n\n  /**\n   * Lifecycle methods\n   * --------------------------------------------------------------------------\n   */\n\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-checkboxgroup-${Date.now()}-${checkboxgroupIdCounter++}`;\n    }\n    this.addEventListener(\"nys-change\", this._handleCheckboxChange);\n    this.addEventListener(\"nys-other-input\", this._handleOtherInput);\n    this.addEventListener(\"invalid\", this._handleInvalid);\n    this.addEventListener(\"nys-error\", this._handleChildError);\n    this.addEventListener(\"nys-error-clear\", this._handleChildErrorClear);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(\"nys-change\", this._handleCheckboxChange);\n    this.removeEventListener(\"nys-other-input\", this._handleOtherInput);\n    this.removeEventListener(\"invalid\", this._handleInvalid);\n    this.removeEventListener(\"nys-error\", this._handleChildError);\n    this.removeEventListener(\"nys-error-clear\", this._handleChildErrorClear);\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  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\n  private _hasAtLeastOneChecked() {\n    return Array.from(this.querySelectorAll(\"nys-checkbox\")).some(\n      (checkbox: any) => checkbox.checked,\n    );\n  }\n\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) return;\n\n    const message =\n      this.errorMessage || \"You must make a selection to proceed.\";\n    const checkboxes = Array.from(\n      this.querySelectorAll(\"nys-checkbox\"),\n    ) as any[];\n\n    // Loop through each child checkbox to see if one is checked.\n    const atLeastOneChecked = this._hasAtLeastOneChecked();\n\n    const firstCheckboxInput = checkboxes\n      ? await checkboxes[0].getInputElement().catch(() => null)\n      : null;\n\n    // Always clear validation first to prevent message lingering\n    this._internals.setValidity({});\n    this.showError = false;\n\n    if (!atLeastOneChecked) {\n      // Only set valueMissing if there's no active \"other\" error\n      // If there IS an \"other\" error, keep that as the primary error\n      if (!this._hasOtherError) {\n        this._internals.setValidity(\n          { valueMissing: true },\n          message,\n          firstCheckboxInput ?? this,\n        );\n        this.showError = true;\n      } else {\n        // Re-set the other error since we just cleared everything\n        this._setCustomOtherError();\n        this.showError = true;\n      }\n    } else {\n      // At least one checkbox is checked\n      // If there's an \"other\" error, reset it since we cleared everything above\n      if (this._hasOtherError && this._otherErrorCheckbox) {\n        this._setCustomOtherError();\n        this.showError = true;\n      }\n    }\n  }\n\n  private _setCustomOtherError() {\n    const textInput =\n      this._otherErrorCheckbox?.shadowRoot?.querySelector(\"nys-textinput\");\n    const targetElement = textInput || this._otherErrorCheckbox;\n    this._internals.setValidity(\n      { customError: true },\n      \"Please complete this field.\",\n      targetElement as HTMLElement,\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  // This callback is automatically called when the parent form is reset.\n  public formResetCallback() {\n    // Reset all child checkboxes\n    const checkboxes = this.querySelectorAll(\"nys-checkbox\");\n    checkboxes.forEach((checkbox: any) => {\n      checkbox.formResetCallback();\n    });\n\n    this._internals.setFormValue(\"\");\n\n    // Reset validation UI\n    this.showError = false;\n    this._internals.setValidity({});\n\n    // Re-render UI\n    this.requestUpdate();\n  }\n\n  private async _handleInvalid(event: Event) {\n    event.preventDefault();\n\n    // Priority 1: Focus \"other\" text input when customError is set\n    if (this._internals.validity.customError) {\n      const checkboxes = Array.from(\n        this.querySelectorAll(\"nys-checkbox\"),\n      ) as NysCheckbox[];\n\n      const otherCheckbox = checkboxes.find(\n        (checkbox) => checkbox.other && checkbox.checked,\n      );\n\n      if (otherCheckbox) {\n        const textInput =\n          otherCheckbox.shadowRoot?.querySelector(\"nys-textinput\");\n\n        if (textInput) {\n          await (textInput as any).updateComplete;\n          (textInput as HTMLElement).focus();\n          return;\n        }\n      }\n    }\n\n    // Priority 2: Handle valueMissing (required validation)\n    this.showError = true;\n    await this._manageRequire(); // Refresh validation message\n\n    // Fallback behavior\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 <nys-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  /**\n   * Event Handlers\n   * --------------------------------------------------------------------------\n   */\n\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(\n      this.querySelectorAll(\"nys-checkbox\"),\n    ) as NysCheckbox[];\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    this._internals.setFormValue(selectedValues.join(\", \"));\n\n    // Check \"other\" inputs first (they take priority)\n    this._checkOtherInputs(checkboxes);\n\n    // Only run required validation if no \"other\" error is active\n    if (!this._hasOtherError) {\n      this._manageRequire();\n    }\n  }\n\n  private async _handleChildError(event: Event) {\n    event.stopPropagation();\n\n    const { sourceCheckbox } = (event as CustomEvent).detail;\n    if (!sourceCheckbox) return;\n\n    // Track which checkbox has the error\n    this._hasOtherError = true;\n    this._otherErrorCheckbox = sourceCheckbox;\n    this.showError = true;\n\n    this._setCustomOtherError();\n  }\n\n  private _handleChildErrorClear(event: Event) {\n    const customEvent = event as CustomEvent;\n    const sourceCheckbox = customEvent.detail?.sourceCheckbox;\n\n    if (\n      this._otherErrorCheckbox &&\n      sourceCheckbox !== this._otherErrorCheckbox\n    ) {\n      return;\n    }\n\n    // Clear the old validation state first so to prevent the old customError message from persisting\n    this._hasOtherError = false;\n    this._otherErrorCheckbox = null;\n    this._internals.setValidity({});\n    this.showError = false;\n\n    // Then check if we need to set a new required error\n    if (this.required && !this._hasAtLeastOneChecked()) {\n      this._manageRequire();\n    }\n  }\n\n  private _handleOtherInput() {\n    const checkboxes = Array.from(\n      this.querySelectorAll(\"nys-checkbox\"),\n    ) as NysCheckbox[];\n    const selectedValues = checkboxes\n      .filter((checkbox: any) => checkbox.checked)\n      .map((checkbox: any) => checkbox.value);\n    this._internals.setFormValue(selectedValues.join(\", \"));\n  }\n\n  private async _checkOtherInputs(checkboxes: NysCheckbox[]) {\n    for (const checkbox of checkboxes) {\n      if (checkbox.checked && checkbox.other) {\n        const value = checkbox.value.trim();\n\n        const hasUserInteracted = (checkbox as any)._hasUserInteracted;\n\n        if (!hasUserInteracted) {\n          // User hasn't interacted yet, skip validation\n          continue;\n        }\n\n        if (!value || value === \"\") {\n          this._hasOtherError = true;\n          this._otherErrorCheckbox = checkbox;\n          this._setCustomOtherError();\n          this.showError = true;\n          return;\n        }\n      }\n    }\n\n    // If we reached here, no other invalid \"other\" was found.\n    // Clear any previous \"other\" error\n    if (this._hasOtherError) {\n      this._hasOtherError = false;\n      this._otherErrorCheckbox = null;\n\n      // Re-check required constraint\n      if (this.required) {\n        this._manageRequire();\n      } else {\n        this._internals.setValidity({});\n        this.showError = false;\n      }\n    }\n  }\n\n  render() {\n    return html`\n      <fieldset\n        aria-label=\"${this.label}${this._slottedDescriptionText\n          ? ` ${this._slottedDescriptionText}`\n          : this.description\n            ? ` ${this.description}`\n            : \"\"}\"\n        class=\"nys-checkboxgroup\"\n        role=\"radiogroup\"\n      >\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          <slot></slot>\n        </div>\n        <nys-errormessage\n          ?showError=${this.showError}\n          errorMessage=${this._internals.validationMessage || this.errorMessage}\n          .showDivider=${!this.tile}\n        ></nys-errormessage>\n      </fieldset>\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, state } 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;\n\n/**\n * A checkbox input for binary choices or multi-select lists. Can be used standalone or in a `nys-checkboxgroup`.\n * Form-associated with validation via ElementInternals.\n *\n * Use for binary decisions (agree/disagree) or selecting multiple options from a list.\n * For single selection from 2-6 options, use `nys-radiobutton`. For immediate state changes, use `nys-toggle`.\n *\n * @summary Checkbox for binary choices or multi-select options.\n * @element nys-checkbox\n *\n * @slot description - Custom HTML description content.\n *\n * @fires nys-change - Fired when checked state changes. Detail: `{id, checked, name, value}`.\n * @fires nys-focus - Fired when checkbox gains focus.\n * @fires nys-blur - Fired when checkbox loses focus.\n * @fires nys-other-input - Fired when \"other\" text input value changes. Detail: `{id, name, value}`.\n *\n * @example Single checkbox\n * ```html\n * <nys-checkbox label=\"I agree to the terms\" name=\"terms\" required></nys-checkbox>\n * ```\n *\n * @example Checkbox group\n * ```html\n * <nys-checkboxgroup label=\"Select landmarks\">\n *   <nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n *   <nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n * </nys-checkboxgroup>\n * ```\n */\n\nexport class NysCheckbox extends LitElement {\n  static styles = unsafeCSS(styles);\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /** Whether checkbox is checked. */\n  @property({ type: Boolean, reflect: true }) checked = false;\n\n  /** Prevents interaction. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Marks as required. Validates that checkbox is checked. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  /** Visible label text. Required for accessibility. */\n  @property({ type: String }) label = \"\";\n\n  /** Helper text below label. Use slot for custom HTML. */\n  @property({ type: String }) description = \"\";\n\n  /** Unique identifier. Auto-generated if not provided. */\n  @property({ type: String, reflect: true }) id = \"\";\n\n  /** Name for form submission. Use same name for grouped checkboxes. */\n  @property({ type: String, reflect: true }) name = \"\";\n\n  /** Value submitted when checked. */\n  @property({ type: String }) value = \"\";\n\n  /** Form `id` to associate with when checkbox is outside form element. */\n  @property({ type: String, reflect: true }) form: string | null = null;\n\n  /** Shows error message when true. */\n  @property({ type: Boolean, reflect: true }) showError = false;\n\n  /** Error message text. Shown only when `showError` is true. */\n  @property({ type: String }) errorMessage = \"\";\n\n  /** Internal: Set by parent checkboxgroup. Do not set manually. */\n  @property({ type: Boolean }) groupExist = false;\n\n  /** Renders as tile with larger clickable area. Apply to group for consistency. */\n  @property({ type: Boolean, reflect: true }) tile = false;\n\n  /** Adjusts colors for dark backgrounds. */\n  @property({ type: Boolean, reflect: true }) inverted = false;\n\n  /** Tooltip text shown on hover/focus of info icon. */\n  @property({ type: String }) tooltip = \"\";\n\n  /**\n   * Checkbox size: `sm` (24px) or `md` (32px, default).\n   * @default \"md\"\n   */\n  @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n  @property({ type: Boolean, reflect: true }) other = false;\n  @property({ type: Boolean }) showOtherError = false;\n  @state() private isMobile = window.innerWidth < 480;\n\n  private _hasUserInteracted = false; // need this flag for \"eager mode\"\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  /**\n   * Lifecycle methods\n   * --------------------------------------------------------------------------\n   */\n\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    this.addEventListener(\"blur\", this._handleBlur);\n    window.addEventListener(\"resize\", this._handleResize);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(\"invalid\", this._handleInvalid);\n    this.removeEventListener(\"blur\", this._handleBlur);\n    window.removeEventListener(\"resize\", this._handleResize);\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  /**\n   * Form Integration\n   * --------------------------------------------------------------------------\n   */\n\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.ariaInvalid = \"true\";\n      this._internals.setValidity({ valueMissing: true }, message, input);\n    } else {\n      this._internals.ariaInvalid = \"false\";\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  // Called automatically when the parent form is reset\n  public formResetCallback() {\n    this.checked = false;\n\n    this._internals.setFormValue(null);\n\n    const input = this.shadowRoot?.querySelector(\"input\");\n    if (input) {\n      input.checked = false;\n    }\n\n    // Reset validation UI\n    this.showError = false;\n    this.errorMessage = \"\";\n    this._internals.setValidity({});\n\n    // Re-render UI\n    this.requestUpdate();\n  }\n\n  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\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 main = this.shadowRoot?.querySelector(\n      \".nys-checkbox__main-container\",\n    );\n    const inputEl = this.shadowRoot?.querySelector(\"input\");\n\n    if (!main || !inputEl) return;\n\n    main.addEventListener(\"click\", (e) => {\n      const target = e.target as HTMLElement;\n\n      // Let native input behavior work. Avoid double toggling the checkbox.\n      if (target.tagName.toLowerCase() === \"input\") return;\n\n      if (!this.disabled) {\n        inputEl.click();\n        inputEl.focus();\n      }\n    });\n  };\n\n  get _hasDescription() {\n    // This accounts for both description prop or slotted content. Used for styling text alignment.\n    const slot = this.querySelector('[slot=\"description\"]');\n    return !!this.description || !!slot;\n  }\n\n  private _handleResize = () => {\n    this.isMobile = window.innerWidth < 480;\n  };\n\n  /**\n   * Event Handlers\n   * --------------------------------------------------------------------------\n   */\n\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  private _emitOtherInputEvent() {\n    this.dispatchEvent(\n      new CustomEvent(\"nys-other-input\", {\n        detail: {\n          id: this.id,\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 async _handleChange(e: Event) {\n    const { checked } = e.target as HTMLInputElement;\n    const wasChecked = this.checked;\n\n    this.checked = checked;\n\n    if (!this.groupExist) {\n      this._internals.setFormValue(this.checked ? this.value : null);\n    }\n\n    // If unchecking \"other\", clear error state\n    if (this.other && wasChecked && !checked) {\n      this.showOtherError = false;\n      this._hasUserInteracted = false;\n      this._dispatchClearError();\n    }\n\n    this._validate();\n    this._emitChangeEvent();\n  }\n\n  private _handleFocus() {\n    this.dispatchEvent(new Event(\"nys-focus\"));\n  }\n\n  private _handleBlur() {\n    this.dispatchEvent(new Event(\"nys-blur\"));\n\n    if (this.other && this.checked) {\n      this._hasUserInteracted = true;\n      this._validateOtherAndEmitError();\n    }\n  }\n\n  private _handleTextInputBlur() {\n    this._hasUserInteracted = true;\n    this._validateOtherAndEmitError();\n  }\n\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  private _handleTextInput(event: Event) {\n    const input = event.target as HTMLInputElement;\n    let newValue = input.value;\n    this.value = newValue;\n\n    if (this._hasUserInteracted) {\n      this._validateOtherAndEmitError();\n    }\n\n    this._emitOtherInputEvent();\n  }\n\n  private _validateOtherAndEmitError() {\n    if (!this.other) return;\n\n    // Prevent early validation of the \"other\" input before the user interacts with it.\n    // Additionally clear validation when \"other\" checkbox is unchecked\n    if (!this.checked || !this._hasUserInteracted) {\n      this.showOtherError = false;\n\n      this._dispatchClearError();\n      return;\n    }\n\n    const isInvalid = this.value.trim() === \"\";\n    this.showOtherError = isInvalid;\n\n    if (isInvalid) {\n      this.dispatchEvent(\n        new CustomEvent(\"nys-error\", {\n          detail: {\n            id: this.id,\n            name: this.name,\n            type: \"other\",\n            message: \"Please enter a value for this option.\",\n            sourceCheckbox: this,\n          },\n          bubbles: true,\n          composed: true,\n        }),\n      );\n    } else {\n      this._dispatchClearError();\n    }\n  }\n\n  private _dispatchClearError() {\n    this.dispatchEvent(\n      new CustomEvent(\"nys-error-clear\", {\n        detail: { sourceCheckbox: this },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  render() {\n    return html`\n      <div class=\"nys-checkbox\">\n        <div\n          class=\"nys-checkbox__main-container ${this._hasDescription\n            ? \"has-description\"\n            : \"\"}\"\n        >\n          <div class=\"nys-checkbox__checkbox-wrapper\">\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              @keydown=\"${this._handleKeydown}\"\n              aria-label=${this.label ||\n              ifDefined(this.other ? \"Other\" : undefined)}\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 || this.other) &&\n          html`\n            <nys-label\n              tooltip=${this.tooltip}\n              for=${this.id + \"--native\"}\n              label=\"${this.label || (this.other ? \"Other\" : \"\")}\"\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        </div>\n        <div class=\"nys-checkbox__other-container\">\n          ${this.other && this.checked\n            ? html`\n                <nys-textinput\n                  .value=${this.value}\n                  id=${\"radiobutton-other-\" + this.id}\n                  @nys-input=${this._handleTextInput}\n                  @nys-blur=${this._handleTextInputBlur}\n                  ariaLabel=\"Other\"\n                  aria-invalid=${this.showOtherError ? \"true\" : \"false\"}\n                  width=${this.isMobile ? \"full\" : \"md\"}\n                ></nys-textinput>\n              `\n            : \"\"}\n        </div>\n      </div>\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","atLeastOneChecked","targetElement","nodes","node","event","otherCheckbox","textInput","form","element","customEvent","name","selectedValues","sourceCheckbox","value","html","unsafeCSS","styles","NysCheckboxgroup","__decorateClass","property","state","checkboxIdCounter","_NysCheckbox","main","inputEl","e","input","validity","slot","checked","wasChecked","newValue","isInvalid","ifDefined","NysCheckbox"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nysds/nys-checkbox",
-  "version": "1.15.0",
+  "version": "1.16.0-alpha4",
   "description": "The Checkbox component from the NYS Design System.",
   "module": "dist/nys-checkbox.js",
   "types": "dist/index.d.ts",
@@ -16,16 +16,16 @@
   ],
   "scripts": {
     "dev": "tsc --emitDeclarationOnly && vite",
-    "build": "tsc --emitDeclarationOnly && vite build",
+    "build": "vite build",
     "test": "vite build && wtr",
     "build:watch": "tsc --emitDeclarationOnly && vite build --watch",
     "test:watch": "vite build && wtr --watch",
     "lit-analyze": "lit-analyzer '**/*.ts'"
   },
   "dependencies": {
-    "@nysds/nys-icon": "^1.15.0",
-    "@nysds/nys-label": "^1.15.0",
-    "@nysds/nys-errormessage": "^1.15.0"
+    "@nysds/nys-icon": "^1.16.0-alpha4",
+    "@nysds/nys-label": "^1.16.0-alpha4",
+    "@nysds/nys-errormessage": "^1.16.0-alpha4"
   },
   "devDependencies": {
     "lit": "^3.3.1",

package/dist/index.d.ts

@@ -1,2 +0,0 @@
-export * from "./nys-checkbox";
-export * from "./nys-checkboxgroup";

package/dist/nys-checkbox.d.ts

@@ -1,126 +0,0 @@
-import { LitElement } from "lit";
-import "./nys-checkboxgroup";
-/**
- * A checkbox input for binary choices or multi-select lists. Can be used standalone or in a `nys-checkboxgroup`.
- * Form-associated with validation via ElementInternals.
- *
- * Use for binary decisions (agree/disagree) or selecting multiple options from a list.
- * For single selection from 2-6 options, use `nys-radiobutton`. For immediate state changes, use `nys-toggle`.
- *
- * @summary Checkbox for binary choices or multi-select options.
- * @element nys-checkbox
- *
- * @slot description - Custom HTML description content.
- *
- * @fires nys-change - Fired when checked state changes. Detail: `{id, checked, name, value}`.
- * @fires nys-focus - Fired when checkbox gains focus.
- * @fires nys-blur - Fired when checkbox loses focus.
- * @fires nys-other-input - Fired when "other" text input value changes. Detail: `{id, name, value}`.
- *
- * @example Single checkbox
- * ```html
- * <nys-checkbox label="I agree to the terms" name="terms" required></nys-checkbox>
- * ```
- *
- * @example Checkbox group
- * ```html
- * <nys-checkboxgroup label="Select landmarks">
- *   <nys-checkbox name="landmarks" value="adirondacks" label="Adirondacks"></nys-checkbox>
- *   <nys-checkbox name="landmarks" value="niagara" label="Niagara Falls"></nys-checkbox>
- * </nys-checkboxgroup>
- * ```
- */
-export declare class NysCheckbox extends LitElement {
-    static styles: import("lit").CSSResult;
-    static shadowRootOptions: {
-        delegatesFocus: boolean;
-        clonable?: boolean;
-        customElementRegistry?: CustomElementRegistry;
-        mode: ShadowRootMode;
-        serializable?: boolean;
-        slotAssignment?: SlotAssignmentMode;
-    };
-    /** Whether checkbox is checked. */
-    checked: boolean;
-    /** Prevents interaction. */
-    disabled: boolean;
-    /** Marks as required. Validates that checkbox is checked. */
-    required: boolean;
-    /** Visible label text. Required for accessibility. */
-    label: string;
-    /** Helper text below label. Use slot for custom HTML. */
-    description: string;
-    /** Unique identifier. Auto-generated if not provided. */
-    id: string;
-    /** Name for form submission. Use same name for grouped checkboxes. */
-    name: string;
-    /** Value submitted when checked. */
-    value: string;
-    /** Form `id` to associate with when checkbox is outside form element. */
-    form: string | null;
-    /** Shows error message when true. */
-    showError: boolean;
-    /** Error message text. Shown only when `showError` is true. */
-    errorMessage: string;
-    /** Internal: Set by parent checkboxgroup. Do not set manually. */
-    groupExist: boolean;
-    /** Renders as tile with larger clickable area. Apply to group for consistency. */
-    tile: boolean;
-    /** Adjusts colors for dark backgrounds. */
-    inverted: boolean;
-    /** Tooltip text shown on hover/focus of info icon. */
-    tooltip: string;
-    /**
-     * Checkbox size: `sm` (24px) or `md` (32px, default).
-     * @default "md"
-     */
-    size: "sm" | "md";
-    other: boolean;
-    showOtherError: boolean;
-    private isMobile;
-    private _hasUserInteracted;
-    getInputElement(): Promise<HTMLInputElement | null>;
-    private _internals;
-    /**
-     * Lifecycle methods
-     * --------------------------------------------------------------------------
-     */
-    static formAssociated: boolean;
-    constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    firstUpdated(): void;
-    /**
-     * Form Integration
-     * --------------------------------------------------------------------------
-     */
-    private _setValue;
-    private _manageRequire;
-    private _setValidityMessage;
-    private _validate;
-    formResetCallback(): void;
-    /**
-     * Functions
-     * --------------------------------------------------------------------------
-     */
-    checkValidity(): boolean;
-    private _handleInvalid;
-    private _manageLabelClick;
-    get _hasDescription(): boolean;
-    private _handleResize;
-    /**
-     * Event Handlers
-     * --------------------------------------------------------------------------
-     */
-    private _emitChangeEvent;
-    private _emitOtherInputEvent;
-    private _handleChange;
-    private _handleFocus;
-    private _handleBlur;
-    private _handleTextInputBlur;
-    private _handleKeydown;
-    private _handleTextInput;
-    private _validateOtherAndEmitError;
-    private _dispatchClearError;
-    render(): import("lit-html").TemplateResult<1>;
-}

package/dist/nys-checkbox.figma.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/nys-checkboxgroup.d.ts

@@ -1,102 +0,0 @@
-import { LitElement } from "lit";
-/**
- * A container for grouping multiple `nys-checkbox` components as a single form control.
- * Handles validation, required constraints, and submits comma-separated values.
- *
- * Use to allow users to select multiple options from a list. Apply `tile`, `size`, and `inverted` to the group
- * and all children inherit these styles automatically.
- *
- * @summary Container for grouping checkboxes as a single form control.
- * @element nys-checkboxgroup
- *
- * @slot - Default slot for `nys-checkbox` elements.
- * @slot description - Custom HTML description content.
- *
- * @example Basic checkbox group
- * ```html
- * <nys-checkboxgroup label="Select landmarks" required>
- *   <nys-checkbox name="landmarks" value="adirondacks" label="Adirondacks"></nys-checkbox>
- *   <nys-checkbox name="landmarks" value="niagara" label="Niagara Falls"></nys-checkbox>
- * </nys-checkboxgroup>
- * ```
- */
-export declare class NysCheckboxgroup extends LitElement {
-    static styles: import("lit").CSSResult;
-    static shadowRootOptions: {
-        delegatesFocus: boolean;
-        clonable?: boolean;
-        customElementRegistry?: CustomElementRegistry;
-        mode: ShadowRootMode;
-        serializable?: boolean;
-        slotAssignment?: SlotAssignmentMode;
-    };
-    /** Unique identifier. Auto-generated if not provided. */
-    id: string;
-    /** Name for form submission. Set on group, not individual checkboxes. */
-    name: string;
-    /** Requires at least one checkbox to be checked. */
-    required: boolean;
-    /** Shows "Optional" flag. */
-    optional: boolean;
-    /** Shows error message when true. */
-    showError: boolean;
-    /** Error message text. Shown only when `showError` is true. */
-    errorMessage: string;
-    /** Visible label text for the group. */
-    label: string;
-    /** Helper text below label. Use slot for custom HTML. */
-    description: string;
-    /** Renders all checkboxes as tiles with larger clickable area. */
-    tile: boolean;
-    /** Tooltip text shown on hover/focus of info icon. */
-    tooltip: string;
-    /** Adjusts colors for dark backgrounds. Applied to all children. */
-    inverted: boolean;
-    /** Form `id` to associate with. Applied to all children. */
-    form: string | null;
-    /**
-     * Checkbox size for all children: `sm` (24px) or `md` (32px, default).
-     * @default "md"
-     */
-    size: "sm" | "md";
-    private _slottedDescriptionText;
-    private _hasOtherError;
-    private _otherErrorCheckbox;
-    private _internals;
-    /**
-     * Lifecycle methods
-     * --------------------------------------------------------------------------
-     */
-    static formAssociated: boolean;
-    constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    firstUpdated(): void;
-    updated(changedProperties: Map<string | symbol, unknown>): void;
-    /**
-     * Functions
-     * --------------------------------------------------------------------------
-     */
-    private _hasAtLeastOneChecked;
-    private _setGroupExist;
-    private _setupCheckboxRequired;
-    private _manageRequire;
-    private _setCustomOtherError;
-    private _updateCheckboxSize;
-    private _updateCheckboxTile;
-    private _updateCheckboxInvert;
-    private _updateCheckboxShowError;
-    private _updateCheckboxForm;
-    private _getSlotDescriptionForAria;
-    formResetCallback(): void;
-    private _handleInvalid;
-    /**
-     * Event Handlers
-     * --------------------------------------------------------------------------
-     */
-    private _handleCheckboxChange;
-    private _handleChildError;
-    private _handleChildErrorClear;
-    private _checkOtherInputs;
-    render(): import("lit-html").TemplateResult<1>;
-}