/**
 * @fileoverview added by tsickle
 * Generated from: form/form-checkbox/form-checkbox.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/*!
 * Copyright 2020 VMware, Inc.
 * SPDX-License-Identifier: BSD-2-Clause
 */
import { Component, Input, Optional, Self } from '@angular/core';
import { NgControl } from '@angular/forms';
import { BaseFormControl } from '../base-form-control';
/** @enum {string} */
const CheckBoxStyling = {
    CHECKBOX: "checkbox",
    TOGGLESWITCH: "toggle-switch",
};
export { CheckBoxStyling };
/**
 * {\@link FormControl} wrapper around a input HTML element of checkbox type. The label input from
 * {\@link BaseFormControl} is used for displaying a label on the left of a form field and the text input is used for
 * displaying label on the right of checkbox. Use the 'styling' property with a value of 'checkbox' or 'toggle-switch'
 * to display a checkbox or toggle switch on the UI.
 *
 * Example:
 *      <vcd-form-checkbox [formControlName]="Fields.port" [label]="'enabled'|translate"
 *                         [text]="'feature.enabled'|translate">
 *      </vcd-form-checkbox>
 */
export class FormCheckboxComponent extends BaseFormControl {
    /**
     * @param {?} controlDirective
     */
    constructor(controlDirective) {
        super(controlDirective);
        /**
         * Styling for the checkbox.
         */
        this.styling = CheckBoxStyling.CHECKBOX;
        /**
         * Put the label text on the right.
         */
        this.rightLabel = false;
    }
    /**
     * @return {?}
     */
    get isCheckbox() {
        return this.styling === CheckBoxStyling.CHECKBOX;
    }
}
FormCheckboxComponent.decorators = [
    { type: Component, args: [{
                selector: 'vcd-form-checkbox',
                template: "<div class=\"form-group\">\n    <div class=\"clr-form-control\" [ngClass]=\"{ 'clr-form-control-disabled': disabled }\">\n        <label class=\"clr-control-label\" [for]=\"id\" *ngIf=\"label\">{{ label }}</label>\n        <div class=\"clr-control-container\" [ngClass]=\"{ 'clr-error': showErrors }\">\n            <div [ngClass]=\"{ 'clr-checkbox-wrapper': isCheckbox, 'clr-toggle-wrapper': !isCheckbox }\">\n                <input\n                    type=\"checkbox\"\n                    [id]=\"id\"\n                    [ngClass]=\"{ 'clr-checkbox': isCheckbox, 'clr-toggle': !isCheckbox }\"\n                    [formControl]=\"formControl\"\n                />\n                <label class=\"clr-control-label right-label\" [for]=\"id\">\n                    <clr-icon *ngIf=\"iconShape\" [attr.shape]=\"iconShape\"></clr-icon>\n                    {{ text }}\n                </label>\n            </div>\n            <span class=\"clr-subtext\" *ngIf=\"showErrors\">\n                <div *ngFor=\"let key of errorKeys\">\n                    <div>{{ key | translate: formControl.value }}</div>\n                </div>\n            </span>\n            <span class=\"clr-subtext\" *ngIf=\"!showErrors && description\">\n                {{ description }}\n            </span>\n        </div>\n    </div>\n    <span class=\"clr-subtext\">\n        <ng-content select=\"footer\"></ng-content>\n    </span>\n</div>\n"
            }] }
];
/** @nocollapse */
FormCheckboxComponent.ctorParameters = () => [
    { type: NgControl, decorators: [{ type: Self }, { type: Optional }] }
];
FormCheckboxComponent.propDecorators = {
    text: [{ type: Input }],
    styling: [{ type: Input }],
    rightLabel: [{ type: Input }],
    iconShape: [{ type: Input }]
};
if (false) {
    /**
     * The label that appears next to the control
     * @type {?}
     */
    FormCheckboxComponent.prototype.text;
    /**
     * Styling for the checkbox.
     * @type {?}
     */
    FormCheckboxComponent.prototype.styling;
    /**
     * Put the label text on the right.
     * @type {?}
     */
    FormCheckboxComponent.prototype.rightLabel;
    /**
     * A shape for the icon that appears next to the checkbox.
     * @type {?}
     */
    FormCheckboxComponent.prototype.iconShape;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1jaGVja2JveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AdmNkL3VpLWNvbXBvbmVudHMvIiwic291cmNlcyI6WyJmb3JtL2Zvcm0tY2hlY2tib3gvZm9ybS1jaGVja2JveC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7O0FBS0EsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQVUsUUFBUSxFQUFFLElBQUksRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6RSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDM0MsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHNCQUFzQixDQUFDOztBQUV2RCxNQUFZLGVBQWU7SUFDdkIsUUFBUSxZQUFhO0lBQ3JCLFlBQVksaUJBQWtCO0VBQ2pDOzs7Ozs7Ozs7Ozs7O0FBaUJELE1BQU0sT0FBTyxxQkFBc0IsU0FBUSxlQUFlOzs7O0lBeUJ0RCxZQUFnQyxnQkFBMkI7UUFDdkQsS0FBSyxDQUFDLGdCQUFnQixDQUFDLENBQUM7Ozs7UUFqQm5CLFlBQU8sR0FBb0IsZUFBZSxDQUFDLFFBQVEsQ0FBQzs7OztRQUtwRCxlQUFVLEdBQUcsS0FBSyxDQUFDO0lBYTVCLENBQUM7Ozs7SUFORCxJQUFJLFVBQVU7UUFDVixPQUFPLElBQUksQ0FBQyxPQUFPLEtBQUssZUFBZSxDQUFDLFFBQVEsQ0FBQztJQUNyRCxDQUFDOzs7WUEzQkosU0FBUyxTQUFDO2dCQUNQLFFBQVEsRUFBRSxtQkFBbUI7Z0JBQzdCLDQ1Q0FBNkM7YUFDaEQ7Ozs7WUF0QlEsU0FBUyx1QkFnREQsSUFBSSxZQUFJLFFBQVE7OzttQkFyQjVCLEtBQUs7c0JBS0wsS0FBSzt5QkFLTCxLQUFLO3dCQUtMLEtBQUs7Ozs7Ozs7SUFmTixxQ0FBc0I7Ozs7O0lBS3RCLHdDQUE2RDs7Ozs7SUFLN0QsMkNBQTRCOzs7OztJQUs1QiwwQ0FBMkIiLCJzb3VyY2VzQ29udGVudCI6WyIvKiFcbiAqIENvcHlyaWdodCAyMDIwIFZNd2FyZSwgSW5jLlxuICogU1BEWC1MaWNlbnNlLUlkZW50aWZpZXI6IEJTRC0yLUNsYXVzZVxuICovXG5cbmltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uSW5pdCwgT3B0aW9uYWwsIFNlbGYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5nQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IEJhc2VGb3JtQ29udHJvbCB9IGZyb20gJy4uL2Jhc2UtZm9ybS1jb250cm9sJztcblxuZXhwb3J0IGVudW0gQ2hlY2tCb3hTdHlsaW5nIHtcbiAgICBDSEVDS0JPWCA9ICdjaGVja2JveCcsXG4gICAgVE9HR0xFU1dJVENIID0gJ3RvZ2dsZS1zd2l0Y2gnLFxufVxuXG4vKipcbiAqIHtAbGluayBGb3JtQ29udHJvbH0gd3JhcHBlciBhcm91bmQgYSBpbnB1dCBIVE1MIGVsZW1lbnQgb2YgY2hlY2tib3ggdHlwZS4gVGhlIGxhYmVsIGlucHV0IGZyb21cbiAqIHtAbGluayBCYXNlRm9ybUNvbnRyb2x9IGlzIHVzZWQgZm9yIGRpc3BsYXlpbmcgYSBsYWJlbCBvbiB0aGUgbGVmdCBvZiBhIGZvcm0gZmllbGQgYW5kIHRoZSB0ZXh0IGlucHV0IGlzIHVzZWQgZm9yXG4gKiBkaXNwbGF5aW5nIGxhYmVsIG9uIHRoZSByaWdodCBvZiBjaGVja2JveC4gVXNlIHRoZSAnc3R5bGluZycgcHJvcGVydHkgd2l0aCBhIHZhbHVlIG9mICdjaGVja2JveCcgb3IgJ3RvZ2dsZS1zd2l0Y2gnXG4gKiB0byBkaXNwbGF5IGEgY2hlY2tib3ggb3IgdG9nZ2xlIHN3aXRjaCBvbiB0aGUgVUkuXG4gKlxuICogRXhhbXBsZTpcbiAqICAgICAgPHZjZC1mb3JtLWNoZWNrYm94IFtmb3JtQ29udHJvbE5hbWVdPVwiRmllbGRzLnBvcnRcIiBbbGFiZWxdPVwiJ2VuYWJsZWQnfHRyYW5zbGF0ZVwiXG4gKiAgICAgICAgICAgICAgICAgICAgICAgICBbdGV4dF09XCInZmVhdHVyZS5lbmFibGVkJ3x0cmFuc2xhdGVcIj5cbiAqICAgICAgPC92Y2QtZm9ybS1jaGVja2JveD5cbiAqL1xuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICd2Y2QtZm9ybS1jaGVja2JveCcsXG4gICAgdGVtcGxhdGVVcmw6ICcuL2Zvcm0tY2hlY2tib3guY29tcG9uZW50Lmh0bWwnLFxufSlcbmV4cG9ydCBjbGFzcyBGb3JtQ2hlY2tib3hDb21wb25lbnQgZXh0ZW5kcyBCYXNlRm9ybUNvbnRyb2wge1xuICAgIC8qKlxuICAgICAqIFRoZSBsYWJlbCB0aGF0IGFwcGVhcnMgbmV4dCB0byB0aGUgY29udHJvbFxuICAgICAqL1xuICAgIEBJbnB1dCgpIHRleHQ6IHN0cmluZztcblxuICAgIC8qKlxuICAgICAqIFN0eWxpbmcgZm9yIHRoZSBjaGVja2JveC5cbiAgICAgKi9cbiAgICBASW5wdXQoKSBzdHlsaW5nOiBDaGVja0JveFN0eWxpbmcgPSBDaGVja0JveFN0eWxpbmcuQ0hFQ0tCT1g7XG5cbiAgICAvKipcbiAgICAgKiBQdXQgdGhlIGxhYmVsIHRleHQgb24gdGhlIHJpZ2h0LlxuICAgICAqL1xuICAgIEBJbnB1dCgpIHJpZ2h0TGFiZWwgPSBmYWxzZTtcblxuICAgIC8qKlxuICAgICAqIEEgc2hhcGUgZm9yIHRoZSBpY29uIHRoYXQgYXBwZWFycyBuZXh0IHRvIHRoZSBjaGVja2JveC5cbiAgICAgKi9cbiAgICBASW5wdXQoKSBpY29uU2hhcGU6IHN0cmluZztcblxuICAgIGdldCBpc0NoZWNrYm94KCk6IGJvb2xlYW4ge1xuICAgICAgICByZXR1cm4gdGhpcy5zdHlsaW5nID09PSBDaGVja0JveFN0eWxpbmcuQ0hFQ0tCT1g7XG4gICAgfVxuXG4gICAgY29uc3RydWN0b3IoQFNlbGYoKSBAT3B0aW9uYWwoKSBjb250cm9sRGlyZWN0aXZlOiBOZ0NvbnRyb2wpIHtcbiAgICAgICAgc3VwZXIoY29udHJvbERpcmVjdGl2ZSk7XG4gICAgfVxufVxuIl19