'use strict';

var index = require('./index-TwNDE7ev.js');
var tslib_es6 = require('./tslib.es6-DrfCPgT9.js');
var aria = require('./aria-BzkqcV7W.js');
var attributes = require('./attributes-Cp0kpySW.js');
var bem = require('./bem-p0PWVN8n.js');
var elementStates_decorator = require('./element-states.decorator-0udYH_TL.js');
var focusVisible = require('./focus-visible-DFZa8IIA.js');
var form = require('./form-BSlIiqcR.js');
var formInput = require('./form-input-DBZuEpuy.js');
var keyboard_helpers = require('./keyboard.helpers-BkZpVT-9.js');
var array = require('./array-Db63Hhl1.js');
var focus_decorator = require('./focus.decorator-Bu4qsoNG.js');
var mutation_decorator = require('./mutation.decorator-C3JICFwA.js');
require('./listener-h1eTpBYL.js');
require('./index-BZ67Dcnb.js');
require('./_commonjsHelpers-BJu3ubxk.js');
require('./index-BobQkZjn.js');

const balCheckboxCss = "@media (hover: hover)and (pointer: fine){.bal-checkbox.bal-focused{-webkit-box-shadow:var(--bal-focus-shadow) !important;box-shadow:var(--bal-focus-shadow) !important}}:root{--bal-checkbox-symbol-size:1.5rem;--bal-checkbox-symbol-border-width:2px;--bal-checkbox-symbol-background:transparent;--bal-checkbox-label-min-height:1.5rem;--bal-checkbox-button-background-hover:var(--bal-color-grey-2);--bal-checkbox-button-background-active:var(--bal-color-grey-2);--bal-checkbox-button-background-checked:var(--bal-color-primary);--bal-checkbox-button-background-checked-hover:var(--bal-color-light-blue-5);--bal-checkbox-button-background-checked-active:var(--bal-color-primary-6);--bal-checkbox-button-background-invalid:var(--bal-color-danger-1);--bal-checkbox-button-background-invalid-hover:var(--bal-color-danger-1);--bal-checkbox-button-background-invalid-active:var(--bal-color-danger-1);--bal-checkbox-button-background-invalid-checked:var(--bal-color-border-danger);--bal-checkbox-button-background-invalid-checked-hover:var(--bal-color-danger-5);--bal-checkbox-button-background-invalid-checked-active:var(--bal-color-danger-6);--bal-checkbox-button-background-disabled-hover-active:var(--bal-color-grey-2);--bal-checkbox-button-background-disabled-checked-hover-active:var(--bal-color-border-grey-dark);--bal-checkbox-button-background:transparent;--bal-checkbox-button-background-checked-green:var(--bal-color-green-1);--bal-checkbox-button-background-checked-purple:var(--bal-color-purple-1);--bal-checkbox-button-background-checked-red:var(--bal-color-red-1);--bal-checkbox-button-background-checked-yellow:var(--bal-color-yellow-1);--bal-checkbox-button-background-disabled:var(--bal-color-grey-1);--bal-checkbox-button-background-hover:var(--bal-color-grey-1);--bal-checkbox-button-border-color:var(--bal-color-primary);--bal-checkbox-button-border-color-hover:var(--bal-color-light-blue-5);--bal-checkbox-button-border-color-active:var(--bal-color-primary-6);--bal-checkbox-button-border-color-invalid:var(--bal-color-border-danger);--bal-checkbox-button-border-color-invalid-hover:var(--bal-color-danger-5);--bal-checkbox-button-border-color-invalid-active:var(--bal-color-danger-6);--bal-checkbox-button-border-color-invalid-checked:var(--bal-color-border-danger);--bal-checkbox-button-border-color-invalid-checked-hover:var(--bal-color-danger-5);--bal-checkbox-button-border-color-invalid-checked-active:var(--bal-color-danger-6);--bal-checkbox-button-border-color-disabled-hover-active:var(--bal-color-border-grey-dark);--bal-checkbox-button-border-color-disabled-checked-hover-active:var(--bal-color-border-grey-dark);--bal-checkbox-tile-background:transparent;--bal-checkbox-tile-background-hover:var(--bal-color-grey-1);--bal-checkbox-tile-background-disabled:var(--bal-color-grey-1);--bal-checkbox-tile-background-invalid-hover:var(--bal-color-danger-1);--bal-checkbox-tile-background-invalid-active:var(--bal-color-danger-1);--bal-checkbox-tile-background-checked-green:var(--bal-color-green-1);--bal-checkbox-tile-background-checked-purple:var(--bal-color-purple-1);--bal-checkbox-tile-background-checked-red:var(--bal-color-red-1);--bal-checkbox-tile-background-checked-yellow:var(--bal-color-yellow-1);--bal-checkbox-tile-border-style:var(--bal-form-field-control-border-style);--bal-checkbox-tile-border-radius:var(--bal-form-field-control-radius);--bal-checkbox-tile-border-width:var(--bal-form-field-control-border-width);--bal-checkbox-tile-padding:var(--bal-text-size-medium);--bal-checkbox-tile-border-color:var(--bal-color-border);--bal-checkbox-tile-border-color-hover:var(--bal-color-border-primary-hovered);--bal-checkbox-tile-border-color-active:var(--bal-color-border-primary-pressed);--bal-checkbox-tile-border-color-invalid-hover:var(--bal-color-border-danger-hovered);--bal-checkbox-tile-border-color-invalid-active:var(--bal-color-border-danger-pressed);--bal-checkbox-tile-border-color-checked:var(--bal-color-border-primary);--bal-checkbox-tile-border-color-invalid:var(--bal-color-border-danger);--bal-checkbox-tile-border-color-disabled:var(--bal-color-border-grey-dark)}.bal-checkbox{position:relative;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;outline:none;min-width:var(--bal-checkbox-symbol-size);border-radius:var(--bal-radius-normal);cursor:pointer}.bal-checkbox .bal-checkbox__label{cursor:pointer}.bal-checkbox--invisible{position:absolute !important;left:0;top:0;margin:0;padding:0;opacity:0;outline:0;border:none;width:1px;height:1px;clip:rect(1px, 1px, 1px, 1px);overflow:hidden}.bal-checkbox.bal-checkbox--flat{min-height:var(--bal-checkbox-symbol-size)}.bal-checkbox:not(.bal-checkbox--flat){min-height:3rem}.bal-checkbox--invalid{color:var(--bal-form-field-label-danger-color)}.bal-checkbox--disabled,.bal-checkbox--disabled .bal-checkbox__label{color:var(--bal-form-field-label-disabled-color);cursor:default}.bal-checkbox__input{position:absolute !important;left:0;top:0;margin:0;padding:0;opacity:0;outline:0;border:none;width:1px;height:1px;clip:rect(1px, 1px, 1px, 1px);overflow:hidden;width:100%;height:100%}.bal-checkbox__label{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;gap:.5rem;-ms-flex-direction:row;flex-direction:row}.bal-checkbox__label__text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:left;contain:layout style;font-family:var(--bal-font-family-text);padding-top:.25rem;padding-bottom:.25rem;width:100%}.bal-checkbox__label__text--hidden{display:none}.bal-checkbox__label__icon{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}@media (hover: hover)and (pointer: fine){.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--hovered .bal-checkbox__label__text,.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):hover .bal-checkbox__label__text{color:var(--bal-color-text-primary-hovered)}.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--hovered .bal-checkbox__label__icon,.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):hover .bal-checkbox__label__icon{color:var(--bal-color-text-primary-hovered)}}.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--pressed .bal-checkbox__label__text,.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):active .bal-checkbox__label__text{color:var(--bal-color-text-primary-pressed)}.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--pressed .bal-checkbox__label__icon,.bal-checkbox:not(.bal-checkbox--button):not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):active .bal-checkbox__label__icon{color:var(--bal-color-text-primary-pressed)}@media (hover: hover)and (pointer: fine){.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled).bal-checkbox--hovered .bal-checkbox__label__text,.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled):hover .bal-checkbox__label__text{color:var(--bal-color-text-danger-hovered)}.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled).bal-checkbox--hovered .bal-checkbox__label__icon,.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled):hover .bal-checkbox__label__icon{color:var(--bal-color-text-danger-hovered)}}.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled).bal-checkbox--pressed .bal-checkbox__label__text,.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled):active .bal-checkbox__label__text{color:var(--bal-color-text-danger-pressed)}.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled).bal-checkbox--pressed .bal-checkbox__label__icon,.bal-checkbox--invalid:not(.bal-checkbox--button):not(.bal-checkbox--disabled):active .bal-checkbox__label__icon{color:var(--bal-color-text-danger-pressed)}.bal-checkbox--button{-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--bal-space-x-small);-ms-flex-pack:center;justify-content:center;-ms-flex-align:start;align-items:flex-start;padding-left:.75rem;padding-right:.75rem;min-width:3rem;border-width:2px;border-style:var(--bal-form-field-control-border-style);border-radius:var(--bal-form-field-control-radius);border-color:var(--bal-checkbox-button-border-color)}.bal-checkbox--button.bal-checkbox--checked{background:var(--bal-checkbox-button-background-checked);color:var(--bal-color-white)}.bal-checkbox--button.bal-checkbox--checked .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--checked .bal-checkbox__label__text .link{color:var(--bal-color-white)}.bal-checkbox--button.bal-checkbox--invalid{border-color:var(--bal-color-border-danger);color:var(--bal-color-text-danger-hovered);background:var(--bal-color-danger-1)}.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked{color:var(--bal-color-white);background:var(--bal-color-border-danger)}.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked .bal-checkbox__label__text .link{color:var(--bal-color-white)}.bal-checkbox--button.bal-checkbox--disabled{border-color:var(--bal-color-grey-4);background:var(--bal-color-grey-2)}.bal-checkbox--button.bal-checkbox--disabled .bal-checkbox__label__text{color:var(--bal-color-text-grey)}.bal-checkbox--button.bal-checkbox--disabled.bal-checkbox--checked{background:var(--bal-color-grey-4);color:var(--bal-color-white)}.bal-checkbox--button.bal-checkbox--disabled.bal-checkbox--checked .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--disabled.bal-checkbox--checked .bal-checkbox__label__text .link{color:var(--bal-color-white)}@media (hover: hover)and (pointer: fine){.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--hovered,.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):hover{background:var(--bal-color-grey-2);border-color:var(--bal-color-border-primary-hovered)}.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--hovered .bal-checkbox__label__text,.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):hover .bal-checkbox__label__text{color:var(--bal-color-text-primary-hovered)}}.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--pressed,.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):active{background:var(--bal-color-grey-2);border-color:var(--bal-color-border-primary-pressed)}.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--pressed .bal-checkbox__label__text,.bal-checkbox--button:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):active .bal-checkbox__label__text{color:var(--bal-color-text-primary-pressed)}@media (hover: hover)and (pointer: fine){.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--hovered,.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):hover{background:var(--bal-color-border-primary-hovered);border-color:var(--bal-color-border-primary-hovered)}.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--hovered .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):hover .bal-checkbox__label__text{color:var(--bal-color-white)}}.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--pressed,.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):active{background:var(--bal-color-border-primary-pressed);border-color:var(--bal-color-border-primary-pressed)}.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--pressed .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--checked:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):active .bal-checkbox__label__text{color:var(--bal-color-white)}@media (hover: hover)and (pointer: fine){.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled).bal-checkbox--hovered,.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled):hover{background:var(--bal-color-danger-1);border-color:var(--bal-color-border-danger-hovered)}.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled).bal-checkbox--hovered .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled):hover .bal-checkbox__label__text{color:var(--bal-color-text-danger-hovered)}}.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled).bal-checkbox--pressed,.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled):active{background:var(--bal-color-danger-1);border-color:var(--bal-color-border-danger-pressed)}.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled).bal-checkbox--pressed .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--invalid:not(.bal-checkbox--disabled):active .bal-checkbox__label__text{color:var(--bal-color-text-danger-pressed)}@media (hover: hover)and (pointer: fine){.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled).bal-checkbox--hovered,.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled):hover{background:var(--bal-color-border-danger-hovered);border-color:var(--bal-color-border-danger-hovered)}.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled).bal-checkbox--hovered .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled):hover .bal-checkbox__label__text{color:var(--bal-color-white)}}.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled).bal-checkbox--pressed,.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled):active{background:var(--bal-color-border-danger-pressed);border-color:var(--bal-color-border-danger-pressed)}.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled).bal-checkbox--pressed .bal-checkbox__label__text,.bal-checkbox--button.bal-checkbox--invalid.bal-checkbox--checked:not(.bal-checkbox--disabled):active .bal-checkbox__label__text{color:var(--bal-color-white)}.bal-checkbox--tile{display:block;-ms-flex:0 0 100%;flex:0 0 100%;background:var(--bal-checkbox-tile-background);border-style:var(--bal-checkbox-tile-border-style);border-radius:var(--bal-checkbox-tile-border-radius);border-width:var(--bal-checkbox-tile-border-width);border-color:var(--bal-checkbox-tile-border-color);padding:var(--bal-checkbox-tile-padding)}.bal-checkbox--tile .bal-checkbox__label{height:100%;-ms-flex-align:stretch;align-items:stretch}.bal-checkbox--tile.bal-checkbox--checked{border-color:var(--bal-checkbox-tile-border-color-checked)}.bal-checkbox--tile.bal-checkbox--invalid{border-color:var(--bal-checkbox-tile-border-color-invalid)}.bal-checkbox--tile.bal-checkbox--disabled{background:var(--bal-checkbox-tile-background-disabled);border-color:var(--bal-checkbox-tile-border-color-disabled);cursor:default}@media (hover: hover)and (pointer: fine){.bal-checkbox--tile:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--hovered,.bal-checkbox--tile:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):hover{background:var(--bal-checkbox-tile-background-hover);border-color:var(--bal-checkbox-tile-border-color-hover)}}.bal-checkbox--tile:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid).bal-checkbox--pressed,.bal-checkbox--tile:not(.bal-checkbox--disabled):not(.bal-checkbox--invalid):active{background:var(--bal-checkbox-tile-background-hover);border-color:var(--bal-checkbox-tile-border-color-active)}@media (hover: hover)and (pointer: fine){.bal-checkbox--tile.bal-checkbox--invalid:not(.bal-checkbox--disabled).bal-checkbox--hovered,.bal-checkbox--tile.bal-checkbox--invalid:not(.bal-checkbox--disabled):hover{background:var(--bal-checkbox-tile-background-invalid-hover);border-color:var(--bal-checkbox-tile-border-color-invalid-hover)}}.bal-checkbox--tile.bal-checkbox--invalid:not(.bal-checkbox--disabled).bal-checkbox--pressed,.bal-checkbox--tile.bal-checkbox--invalid:not(.bal-checkbox--disabled):active{background:var(--bal-checkbox-tile-background-invalid-active);border-color:var(--bal-checkbox-tile-border-color-invalid-active)}.bal-checkbox--tile-color-green:not(.bal-checkbox--disabled).bal-checkbox--checked,.bal-checkbox--tile-color-green:not(.bal-checkbox--disabled).bal-checkbox--checked.bal-checkbox--hovered,.bal-checkbox--tile-color-green:not(.bal-checkbox--disabled).bal-checkbox--checked:hover{background:var(--bal-checkbox-tile-background-checked-green)}.bal-checkbox--tile-color-red:not(.bal-checkbox--disabled).bal-checkbox--checked,.bal-checkbox--tile-color-red:not(.bal-checkbox--disabled).bal-checkbox--checked.bal-checkbox--hovered,.bal-checkbox--tile-color-red:not(.bal-checkbox--disabled).bal-checkbox--checked:hover{background:var(--bal-checkbox-tile-background-checked-red)}.bal-checkbox--tile-color-purple:not(.bal-checkbox--disabled).bal-checkbox--checked,.bal-checkbox--tile-color-purple:not(.bal-checkbox--disabled).bal-checkbox--checked.bal-checkbox--hovered,.bal-checkbox--tile-color-purple:not(.bal-checkbox--disabled).bal-checkbox--checked:hover{background:var(--bal-checkbox-tile-background-checked-purple)}.bal-checkbox--tile-color-yellow:not(.bal-checkbox--disabled).bal-checkbox--checked,.bal-checkbox--tile-color-yellow:not(.bal-checkbox--disabled).bal-checkbox--checked.bal-checkbox--hovered,.bal-checkbox--tile-color-yellow:not(.bal-checkbox--disabled).bal-checkbox--checked:hover{background:var(--bal-checkbox-tile-background-checked-yellow)}@media screen and (min-width: 769px),print{.bal-checkbox--column-2{-ms-flex:0 0 calc(50% - var(--bal-space-normal)*1/2);flex:0 0 calc(50% - var(--bal-space-normal)*1/2)}.bal-checkbox--column-3{-ms-flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3);flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3)}.bal-checkbox--column-4{-ms-flex:0 0 calc(25% - var(--bal-space-normal)*3/4);flex:0 0 calc(25% - var(--bal-space-normal)*3/4)}}@media screen and (max-width: 768px){.bal-checkbox--column-mobile-2{-ms-flex:0 0 calc(50% - var(--bal-space-normal)*1/2);flex:0 0 calc(50% - var(--bal-space-normal)*1/2)}.bal-checkbox--column-mobile-3{-ms-flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3);flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3)}.bal-checkbox--column-mobile-4{-ms-flex:0 0 calc(25% - var(--bal-space-normal)*3/4);flex:0 0 calc(25% - var(--bal-space-normal)*3/4)}}@media screen and (min-width: 769px),print{.bal-checkbox--column-tablet-2{-ms-flex:0 0 calc(50% - var(--bal-space-normal)*1/2);flex:0 0 calc(50% - var(--bal-space-normal)*1/2)}.bal-checkbox--column-tablet-3{-ms-flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3);flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3)}.bal-checkbox--column-tablet-4{-ms-flex:0 0 calc(25% - var(--bal-space-normal)*3/4);flex:0 0 calc(25% - var(--bal-space-normal)*3/4)}}@media screen and (min-width: 1024px){.bal-checkbox--column-2{-ms-flex:0 0 calc(50% - var(--bal-space-normal)*1/2);flex:0 0 calc(50% - var(--bal-space-normal)*1/2)}.bal-checkbox--column-3{-ms-flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3);flex:0 0 calc(33.3333333333% - var(--bal-space-normal)*2/3)}.bal-checkbox--column-4{-ms-flex:0 0 calc(25% - var(--bal-space-normal)*3/4);flex:0 0 calc(25% - var(--bal-space-normal)*3/4)}}";

const Checkbox = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.balFocus = index.createEvent(this, "balFocus");
        this.balBlur = index.createEvent(this, "balBlur");
        this.balChange = index.createEvent(this, "balChange");
        this.inputId = `bal-cb-${checkboxIds++}`;
        this.inheritedAttributes = {};
        this.keyboardMode = true;
        this.hasLabel = true;
        this.focused = false;
        this.ariaForm = form.defaultBalAriaForm;
        /**
         * Track focus state
         * If `true` checkbox needs to remain focused
         */
        this.wasFocused = false;
        this.outerElementState = {
            hovered: false,
            pressed: false,
        };
        this.innerElementState = {
            hovered: false,
            pressed: false,
        };
        this.mergedElementState = {
            hovered: false,
            pressed: false,
        };
        /**
         * PUBLIC PROPERTY API
         * ------------------------------------------------------
         */
        /**
         * The name of the control, which is submitted with the form data.
         */
        this.name = this.inputId;
        /**
         * Label of the radio item.
         */
        this.label = '';
        /**
         * If `true` the checkbox has no label
         */
        this.labelHidden = false;
        /**
         * If `true` the control is no padding
         */
        this.flat = false;
        /**
         * Defines the layout of the checkbox button
         */
        this.interface = 'checkbox';
        /**
         * A DOMString representing the value of the checkbox. This is not displayed on the
         * client-side, but on the server this is the value given to the data
         * submitted with the checkbox's name.
         */
        this.value = 'on';
        /**
         * If `true`, the checkbox is selected.
         */
        this.checked = false;
        this.initialValue = false;
        /**
         * If `true`, the element is not mutable, focusable, or even submitted with the form. The user can neither edit nor focus on the control, nor its form control descendants.
         */
        this.disabled = false;
        /**
         * If `true` the element can not mutated, meaning the user can not edit the control.
         */
        this.readonly = false;
        /**
         * If `true`, the user must fill in a value before submitting a form.
         */
        this.required = false;
        /**
         * If `true`, in Angular reactive forms the control will not be set invalid
         */
        this.autoInvalidOff = false;
        /**
         * If `true`, the value will not be send with a form submit
         */
        this.nonSubmit = false;
        /**
         * If `true` the component gets a invalid style.
         */
        this.invalid = false;
        /**
         * @internal
         */
        this.hovered = false;
        /**
         * @internal
         */
        this.pressed = false;
        /**
         * @internal
         */
        this.colSize = 1;
        /**
         * @internal
         */
        this.colSizeTablet = 1;
        /**
         * @internal
         */
        this.colSizeMobile = 1;
        this.setChecked = (state) => {
            this.checked = state;
            this.balChange.emit(this.checked);
        };
        this.toggleChecked = (ev) => {
            ev.preventDefault();
            this.setFocus();
            this.setChecked(!this.checked);
        };
        this.onClick = (ev) => {
            if (this.disabled) {
                return;
            }
            const element = ev.target;
            if (element && element.href) {
                return;
            }
            if (this.wasFocused) {
                this.focused = true;
            }
            this.toggleChecked(ev);
        };
        this.onFocus = (ev) => {
            if (this.disabled || this.readonly) {
                this.focused = false;
                return formInput.stopEventBubbling(ev);
            }
            this.balFocus.emit(ev);
            if (this.keyboardMode) {
                this.focused = true;
                this.wasFocused = true;
            }
        };
        this.onBlur = (ev) => {
            if (this.disabled || this.readonly) {
                return formInput.stopEventBubbling(ev);
            }
            this.balBlur.emit(ev);
            this.focused = false;
        };
        this.onPointerDown = () => (this.keyboardMode = false);
        this.onKeydown = (ev) => {
            if (!keyboard_helpers.isSpaceKey(ev)) {
                this.wasFocused = false;
            }
            this.keyboardMode = focusVisible.FOCUS_KEYS.includes(ev.key);
        };
    }
    createLogger(log) {
        this.log = log;
    }
    hoveredChanged() {
        this.innerElementState = {
            hovered: this.hovered,
            pressed: this.pressed,
        };
        this.mergeElementState();
    }
    pressedChanged() {
        this.innerElementState = {
            hovered: this.hovered,
            pressed: this.pressed,
        };
        this.mergeElementState();
    }
    /**
     * LIFECYCLE
     * ------------------------------------------------------
     */
    connectedCallback() {
        this.hoveredChanged();
        if (this.group) {
            this.updateState();
            this.group.addEventListener('balChange', () => this.updateState());
        }
        this.initialValue = this.checked;
        this.el.addEventListener('keydown', this.onKeydown);
        this.el.addEventListener('touchstart', this.onPointerDown);
        this.el.addEventListener('mousedown', this.onPointerDown);
    }
    componentWillLoad() {
        this.inheritedAttributes = attributes.inheritAttributes(this.el, ['aria-label', 'tabindex', 'title']);
    }
    componentWillRender() {
        this.interactionChildElements.forEach(el => {
            el.disabled = this.disabled || this.readonly;
            el.invalid = this.invalid;
            el.checked = this.checked;
        });
    }
    disconnectedCallback() {
        if (this.group) {
            this.group.removeEventListener('balChange', () => this.updateState());
        }
        this.el.removeEventListener('keydown', this.onKeydown);
        this.el.removeEventListener('touchstart', this.onPointerDown);
        this.el.removeEventListener('mousedown', this.onPointerDown);
    }
    /**
     * LISTENERS
     * ------------------------------------------------------
     */
    listenOnClick(ev) {
        if ((this.disabled || this.readonly) &&
            ev.target &&
            (ev.target === this.el || index.isDescendant(this.el, ev.target))) {
            formInput.stopEventBubbling(ev);
        }
    }
    resetHandler(ev) {
        const formElement = ev.target;
        if (formElement === null || formElement === void 0 ? void 0 : formElement.contains(this.el)) {
            this.checked = this.initialValue;
        }
    }
    elementStateListener(info) {
        this.outerElementState = info;
        this.mergeElementState();
    }
    /**
     * PUBLIC METHODS
     * ------------------------------------------------------
     */
    /**
     * Sets the focus on the checkbox input element.
     */
    async setFocus() {
        formInput.inputSetFocus(this);
    }
    /**
     * Sets blur on the native `input`. Use this method instead of the global
     * `input.blur()`.
     * @internal
     */
    async setBlur() {
        formInput.inputSetBlur(this);
    }
    /**
     * Returns the native `<input>` element used under the hood.
     */
    getInputElement() {
        return Promise.resolve(this.nativeInput);
    }
    /**
     * Options of the tab like label, value etc.
     */
    async getOption() {
        return this.option;
    }
    /**
     * @internal
     */
    async updateState() {
        if (this.group && this.group.control && Array.isArray(this.group.value)) {
            const newChecked = this.group.value.includes(this.value);
            if (newChecked !== this.checked) {
                this.checked = newChecked;
            }
        }
    }
    /**
     * @internal
     */
    async setAriaForm(ariaForm) {
        this.ariaForm = Object.assign({}, ariaForm);
    }
    /**
     * GETTERS
     * ------------------------------------------------------
     */
    get group() {
        return this.el.closest('bal-checkbox-group');
    }
    get interactionChildElements() {
        return Array.from(this.el.querySelectorAll('bal-check, bal-switch, bal-icon'));
    }
    get option() {
        return {
            name: this.name,
            value: this.value,
            checked: this.checked,
            label: this.label,
            labelHidden: this.labelHidden,
            flat: this.flat,
            interface: this.interface,
            disabled: this.disabled,
            readonly: this.readonly,
            required: this.required,
            nonSubmit: this.nonSubmit,
            invalid: this.invalid,
        };
    }
    /**
     * EVENT HANDLERS
     * ------------------------------------------------------
     */
    mergeElementState() {
        this.mergedElementState = {
            hovered: this.outerElementState.hovered || this.innerElementState.hovered,
            pressed: this.outerElementState.pressed || this.innerElementState.pressed,
        };
        this.interactionChildElements.forEach(el => {
            el.hovered = this.mergedElementState.hovered;
            el.pressed = this.mergedElementState.pressed;
        });
    }
    /**
     * RENDER
     * ------------------------------------------------------
     */
    render() {
        const block = bem.BEM.block('checkbox');
        const inputEl = block.element('input');
        const labelEl = block.element('label');
        const labelTextEl = labelEl.element('text');
        const labelIconEl = labelEl.element('icon');
        const focused = this.focused && this.buttonTabindex !== -1;
        const inputAttributes = this.inheritedAttributes;
        if (this.buttonTabindex !== undefined) {
            inputAttributes.tabIndex = this.buttonTabindex;
        }
        const hasFormControl = !this.nonSubmit;
        const id = this.ariaForm.controlId || this.inputId;
        const labelId = this.ariaForm.labelId || null;
        const LabelTag = hasFormControl ? 'label' : 'span';
        const Icon = this.interface === 'switch' ? 'bal-switch' : 'bal-check';
        return (index.h(index.Host, { key: 'eaa9cf2ba9de2a203b98515939ff117c89dc16cf', "aria-checked": `${this.checked}`, "aria-disabled": aria.ariaBooleanToString(this.disabled), "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-hidden": aria.ariaBooleanToString(this.disabled || this.nonSubmit), "aria-focused": focused ? 'true' : null, "aria-labelledby": labelId, "aria-describedby": this.ariaForm.messageId, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ 'bal-focused': focused }, block.class()), block.modifier('checkbox').class()), block.modifier('button').class(this.interface === 'button')), block.modifier('switch').class(this.interface === 'switch')), block.modifier('tile').class(this.interface === 'tile')), block.modifier(`tile-color-${this.color}`).class(this.interface === 'tile' && !!this.color)), block.modifier('focused').class(this.focused)), block.modifier('invalid').class(this.invalid)), block.modifier('checked').class(this.checked)), block.modifier('flat').class(this.flat)), block.modifier('disabled').class(this.disabled || this.readonly)), block.modifier('hovered').class(this.mergedElementState.hovered)), block.modifier('pressed').class(this.mergedElementState.pressed)), block.modifier(`column-${this.colSize}`).class(this.interface === 'tile' && this.colSize > 1)), block
                .modifier(`column-tablet-${this.colSizeTablet}`)
                .class(this.interface === 'tile' && this.colSizeTablet > 1)), block
                .modifier(`column-mobile-${this.colSizeMobile}`)
                .class(this.interface === 'tile' && this.colSizeMobile > 1)), onClick: this.onClick }, index.h(LabelTag, { key: '6fd849f4768bc7155eb5db297713bc82aeab6dfe', class: Object.assign({}, labelEl.class()), "data-testid": "bal-checkbox-label" }, hasFormControl ? (index.h("input", Object.assign({ id: id, type: "checkbox", "data-testid": "bal-checkbox-input", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled || this.nonSubmit, readonly: this.readonly, class: Object.assign({}, inputEl.class()), "aria-hidden": aria.ariaBooleanToString(this.nonSubmit), "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-describedby": this.ariaForm.messageId, onChange: ev => this.toggleChecked(ev), onFocus: ev => this.onFocus(ev), onBlur: ev => this.onBlur(ev), ref: inputEl => (this.nativeInput = inputEl) }, inputAttributes))) : (''), this.interface !== 'tile' ? (index.h("div", { class: Object.assign({}, labelIconEl.class()) }, index.h(Icon, { checked: this.checked, disabled: this.disabled || this.readonly, invalid: this.invalid, inverted: this.interface === 'button' && this.checked, hovered: this.mergedElementState.hovered, pressed: this.mergedElementState.pressed }))) : (''), index.h("div", { key: 'ca1ec209d9211082db1d0905e599eea5e6803244', class: Object.assign(Object.assign({}, labelTextEl.class()), labelTextEl.modifier('hidden').class(this.labelHidden)) }, index.h("slot", { key: 'a2a3c8124d7d47bf300b229fe01e62fa198961c0' })))));
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "hovered": ["hoveredChanged"],
        "pressed": ["pressedChanged"]
    }; }
};
tslib_es6.__decorate([
    index.Logger('bal-checkbox'),
    tslib_es6.__metadata("design:type", Function),
    tslib_es6.__metadata("design:paramtypes", [Function]),
    tslib_es6.__metadata("design:returntype", void 0)
], Checkbox.prototype, "createLogger", null);
tslib_es6.__decorate([
    elementStates_decorator.ListenToElementStates(),
    tslib_es6.__metadata("design:type", Function),
    tslib_es6.__metadata("design:paramtypes", [Object]),
    tslib_es6.__metadata("design:returntype", void 0)
], Checkbox.prototype, "elementStateListener", null);
let checkboxIds = 0;
Checkbox.style = balCheckboxCss;

const balCheckboxGroupCss = ".bal-checkbox-group{display:inline-block;position:relative;width:100%}.bal-checkbox-group__inner{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:stretch;align-items:stretch;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--bal-space-normal)}.bal-checkbox-group__inner--button{-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex:1;flex:1;gap:var(--bal-space-x-small)}@media screen and (min-width: 769px),print{.bal-checkbox-group__inner--button{-ms-flex-direction:row;flex-direction:row}}.bal-checkbox-group__inner--expanded{-ms-flex-align:stretch;align-items:stretch}.bal-checkbox-group__inner--expanded .bal-checkbox{-ms-flex:1;flex:1}@media screen and (max-width: 768px){.bal-checkbox-group__inner--expanded .bal-checkbox{width:100%}}.bal-checkbox-group__inner--button.bal-checkbox-group__inner--vertical{gap:var(--bal-space-x-small)}.bal-checkbox-group__inner--vertical{-ms-flex-direction:column;flex-direction:column;border-radius:var(--bal-radius-normal);gap:0}@media screen and (min-width: 769px),print{.bal-checkbox-group__inner--vertical{-ms-flex-align:start;align-items:flex-start}}@media screen and (max-width: 768px){.bal-checkbox-group__inner--vertical-mobile{-ms-flex-direction:column;flex-direction:column;border-radius:var(--bal-radius-normal);gap:0}}";

const CheckboxGroup = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.balChange = index.createEvent(this, "balChange");
        this.balFocus = index.createEvent(this, "balFocus");
        this.balBlur = index.createEvent(this, "balBlur");
        this.inputId = `bal-cg-${checkboxGroupIds++}`;
        this.inheritedAttributes = {};
        this.ariaForm = form.defaultBalAriaForm;
        /**
         * Defines the layout of the checkbox button
         */
        this.interface = undefined;
        /**
         * If `true` it acts as the main form control
         */
        this.control = false;
        /**
         * The name of the control, which is submitted with the form data.
         */
        this.name = this.inputId;
        /**
         * Displays the checkboxes vertically
         */
        this.vertical = false;
        /**
         * If `true`, the controls will be vertically on mobile devices.
         */
        this.verticalOnMobile = false;
        /**
         * Uses the whole width
         */
        this.expanded = false;
        /**
         * If `true`, the element is not mutable, focusable, or even submitted with the form. The user can neither edit nor focus on the control, nor its form control descendants.
         */
        this.invalid = undefined;
        /**
         * If `true`, the user cannot interact with the checkboxes.
         */
        this.disabled = undefined;
        /**
         * If `true`, the user cannot interact with the checkboxes.
         */
        this.readonly = undefined;
        /**
         * The value of the control.
         */
        this.value = [];
        /**
         * Defines the column size like the grid.
         */
        this.columns = 1;
        /**
         * Defines the column size for tablet and bigger like the grid.
         */
        this.columnsTablet = 1;
        /**
         * Defines the column size for mobile and bigger like the grid.
         */
        this.columnsMobile = 1;
        /**
         * If `true`, in Angular reactive forms the control will not be set invalid
         */
        this.autoInvalidOff = false;
        /**
         * LISTENERS
         * ------------------------------------------------------
         */
        this.hasFocus = false;
        this.mutationObserverActive = true;
        /**
         * EVENT BINDING
         * ------------------------------------------------------
         */
        this.onClick = (ev) => {
            if (!this.control) {
                return;
            }
            const element = ev.target;
            if (element.href) {
                return;
            }
            const selectedCheckbox = ev.target && ev.target.closest('bal-checkbox');
            if (selectedCheckbox) {
                if (selectedCheckbox.disabled || selectedCheckbox.readonly) {
                    return ev.stopPropagation();
                }
            }
            this.updateValues();
        };
        this.onOptionChange = async () => {
            this.sync();
        };
    }
    createLogger(log) {
        this.log = log;
    }
    async optionChanged() {
        if (this.control) {
            this.onOptionChange();
            this.mutationObserverActive = this.options === undefined;
        }
    }
    invalidChanged(value) {
        if (this.control) {
            if (value !== undefined) {
                this.getCheckboxes().forEach(child => {
                    child.invalid = value;
                });
            }
        }
    }
    disabledChanged(value) {
        if (this.control) {
            if (value !== undefined) {
                this.getCheckboxes().forEach(child => {
                    child.disabled = value;
                });
            }
        }
    }
    readonlyChanged(value) {
        if (this.control) {
            if (value !== undefined) {
                this.getCheckboxes().forEach(child => {
                    child.readonly = value;
                });
            }
        }
    }
    valueChanged(_value, oldValue) {
        if (this.control) {
            if (!array.areArraysEqual(this.value, oldValue)) {
                this.onOptionChange();
            }
        }
        else {
            this.onOptionChange();
        }
    }
    columnsChanged(value) {
        this.getCheckboxes().forEach(checkbox => (checkbox.colSize = value));
    }
    columnsTabletChanged(value) {
        this.getCheckboxes().forEach(checkbox => (checkbox.colSizeTablet = value));
    }
    columnsMobileChanged(value) {
        this.getCheckboxes().forEach(checkbox => (checkbox.colSizeMobile = value));
    }
    /**
     * LIFECYCLE
     * ------------------------------------------------------
     */
    connectedCallback() {
        if (this.control) {
            this.mutationObserverActive = this.options === undefined;
            this.valueChanged(this.value, []);
        }
    }
    componentWillLoad() {
        if (this.control) {
            this.inheritedAttributes = attributes.inheritAttributes(this.el, ['aria-label', 'tabindex', 'title']);
            this.disabledChanged(this.disabled);
            this.invalidChanged(this.invalid);
            this.readonlyChanged(this.readonly);
        }
        this.columnsChanged(this.columns);
        this.columnsTabletChanged(this.columnsTablet);
        this.columnsMobileChanged(this.columnsMobile);
        this.onOptionChange();
    }
    focusInListener(ev) {
        this.balFocus.emit(ev);
    }
    focusOutListener(ev) {
        this.balBlur.emit(ev);
    }
    mutationListener() {
        if (this.control) {
            this.disabledChanged(this.disabled);
            this.readonlyChanged(this.readonly);
        }
        this.columnsChanged(this.columns);
        this.columnsTabletChanged(this.columnsTablet);
        this.columnsMobileChanged(this.columnsMobile);
        this.onOptionChange();
    }
    listenOnCheckboxChange(ev) {
        if (this.control) {
            if (index.isDescendant(this.el, ev.target)) {
                formInput.stopEventBubbling(ev);
                this.updateValues();
            }
        }
    }
    resetHandler(ev) {
        const formElement = ev.target;
        if (formElement === null || formElement === void 0 ? void 0 : formElement.contains(this.el)) {
            if (this.control) {
                this.value = [];
            }
            this.onOptionChange();
        }
    }
    checkboxFocusListener(ev) {
        const { target } = ev;
        if (target && index.isDescendant(this.el, target) && index.hasTagName(target, 'bal-checkbox')) {
            formInput.stopEventBubbling(ev);
        }
    }
    checkboxBlurListener(ev) {
        const { target } = ev;
        if (target && index.isDescendant(this.el, target) && index.hasTagName(target, 'bal-checkbox')) {
            formInput.stopEventBubbling(ev);
        }
    }
    /**
     * PUBLIC METHODS
     * ------------------------------------------------------
     */
    /** @internal */
    async setValue(value) {
        if (this.control) {
            this.value = value;
        }
    }
    /**
     * Find the options properties by its value
     */
    async getOptionByValue(value) {
        const options = this.options;
        if (options) {
            return options.find(option => option.value === value);
        }
        return undefined;
    }
    /**
     * @internal
     */
    async setAriaForm(ariaForm) {
        this.ariaForm = Object.assign({}, ariaForm);
    }
    /**
     * PRIVATE METHODS
     * ------------------------------------------------------
     */
    sync() {
        if (this.control) {
            const isChecked = (checkbox) => {
                for (let index = 0; index < this.value.length; index++) {
                    const valueItem = this.value[index];
                    if (valueItem !== undefined && valueItem.toString() === checkbox.value.toString()) {
                        return true;
                    }
                }
                return false;
            };
            this.getCheckboxes().forEach((checkbox) => {
                checkbox.checked = isChecked(checkbox);
            });
        }
        this.getCheckboxes().forEach((checkbox) => {
            if (this.interface) {
                checkbox.interface = this.interface;
            }
        });
    }
    /**
     * GETTERS
     * ------------------------------------------------------
     */
    getCheckboxes() {
        return Array.from(this.el.querySelectorAll('bal-checkbox'));
    }
    updateValues() {
        // generate new value array out of the checked checkboxes
        const newValue = [];
        this.getCheckboxes().forEach(cb => {
            if (cb.checked) {
                newValue.push(cb.value);
            }
        });
        if (!array.areArraysEqual(this.value, newValue)) {
            this.value = [...newValue];
            this.balChange.emit(this.value);
        }
    }
    /**
     * RENDER
     * ------------------------------------------------------
     */
    render() {
        const block = bem.BEM.block('checkbox-group');
        const innerEl = block.element('inner');
        const rawOptions = this.options || [];
        const options = rawOptions.map(option => {
            if (typeof option.html === 'function') {
                return Object.assign(Object.assign({}, option), { html: option.html() });
            }
            return option;
        });
        return (index.h(index.Host, Object.assign({ class: Object.assign({}, block.class()), role: "group", "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-disabled": aria.ariaBooleanToString(this.disabled), "aria-invalid": aria.ariaBooleanToString(this.invalid), onClick: this.onClick }, this.inheritedAttributes), index.h("div", { class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, innerEl.class()), innerEl.modifier('vertical-mobile').class(this.verticalOnMobile)), innerEl.modifier('vertical').class(this.vertical)), innerEl.modifier('expanded').class(this.expanded)), innerEl.modifier('button').class(this.interface === 'button')) }, index.h("slot", null), options.map(option => (index.h("bal-checkbox", { key: option.value, name: option.name, value: option.value, labelHidden: option.labelHidden, flat: option.flat, interface: option.interface, disabled: option.disabled, readonly: option.readonly, required: option.required, nonSubmit: !!option.nonSubmit, invalid: option.invalid, innerHTML: option.html }))))));
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "options": ["optionChanged"],
        "invalid": ["invalidChanged"],
        "disabled": ["disabledChanged"],
        "readonly": ["readonlyChanged"],
        "value": ["valueChanged"],
        "columns": ["columnsChanged"],
        "columnsTablet": ["columnsTabletChanged"],
        "columnsMobile": ["columnsMobileChanged"]
    }; }
};
tslib_es6.__decorate([
    index.Logger('bal-checkbox-group'),
    tslib_es6.__metadata("design:type", Function),
    tslib_es6.__metadata("design:paramtypes", [Function]),
    tslib_es6.__metadata("design:returntype", void 0)
], CheckboxGroup.prototype, "createLogger", null);
tslib_es6.__decorate([
    focus_decorator.ListenToFocus(),
    tslib_es6.__metadata("design:type", Function),
    tslib_es6.__metadata("design:paramtypes", [Object]),
    tslib_es6.__metadata("design:returntype", void 0)
], CheckboxGroup.prototype, "focusInListener", null);
tslib_es6.__decorate([
    focus_decorator.ListenToFocus(),
    tslib_es6.__metadata("design:type", Function),
    tslib_es6.__metadata("design:paramtypes", [Object]),
    tslib_es6.__metadata("design:returntype", void 0)
], CheckboxGroup.prototype, "focusOutListener", null);
tslib_es6.__decorate([
    mutation_decorator.ListenToMutation({ tags: ['bal-checkbox-group', 'bal-checkbox'], attributes: false, characterData: false }),
    tslib_es6.__metadata("design:type", Function),
    tslib_es6.__metadata("design:paramtypes", []),
    tslib_es6.__metadata("design:returntype", void 0)
], CheckboxGroup.prototype, "mutationListener", null);
let checkboxGroupIds = 0;
CheckboxGroup.style = balCheckboxGroupCss;

exports.bal_checkbox = Checkbox;
exports.bal_checkbox_group = CheckboxGroup;
