/**
 * @fileoverview added by tsickle
 * Generated from: form/form-select/form-select.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';
/**
 * {\@link FormControl} wrapper around a select HTML element
 */
export class FormSelectComponent extends BaseFormControl {
    /**
     * @param {?} ngControl
     */
    constructor(ngControl) {
        super(ngControl);
        /**
         * The displayed options for the select element
         */
        this.options = [];
    }
    /**
     * @return {?}
     */
    get selectedOption() {
        if (!this.options || this.formControl.value === null || this.formControl.value === undefined) {
            return undefined;
        }
        // option.value and formControl.value can be of type number or string
        return this.options.find((/**
         * @param {?} option
         * @return {?}
         */
        (option) => option.value.toString() === this.formControl.value.toString()));
    }
}
FormSelectComponent.decorators = [
    { type: Component, args: [{
                selector: 'vcd-form-select',
                template: "<div class=\"form-group\">\n    <div class=\"clr-form-control\">\n        <label *ngIf=\"label\" [attr.for]=\"id\" class=\"clr-control-label\" [ngClass]=\"{ 'required-field': showAsterisk }\">{{\n            label\n        }}</label>\n        <span *ngIf=\"isReadOnly && selectedOption\" class=\"readOnly\">\n            {{ selectedOption.isTranslatable ? (selectedOption.display | translate) : selectedOption.display }}\n        </span>\n        <div class=\"clr-control-container\" [ngClass]=\"{ 'clr-error': showErrors }\">\n            <div class=\"clr-select-wrapper\" *ngIf=\"!isReadOnly\">\n                <select [id]=\"id\" [formControl]=\"formControl\">\n                    <option *ngFor=\"let option of options\" [value]=\"option.value\">\n                        {{ option.isTranslatable ? (option.display | translate) : option.display }}\n                    </option>\n                </select>\n                <clr-icon *ngIf=\"showErrors\" class=\"clr-validate-icon\" shape=\"exclamation-circle\"></clr-icon>\n            </div>\n\n            <ng-content select=\"aside\"></ng-content>\n\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        </div>\n    </div>\n    <span class=\"clr-subtext\">\n        <ng-content select=\"footer\"></ng-content>\n    </span>\n</div>\n",
                styles: [".required-field:after{content:\"*\";color:red;padding-left:5px}", ".form-group.hide-label{padding-left:0}.form-group.hide-label label:first-child{visibility:hidden}.error-content{white-space:normal}:host(.site-selector-single-site){display:none}"]
            }] }
];
/** @nocollapse */
FormSelectComponent.ctorParameters = () => [
    { type: NgControl, decorators: [{ type: Self }, { type: Optional }] }
];
FormSelectComponent.propDecorators = {
    options: [{ type: Input }]
};
if (false) {
    /**
     * The displayed options for the select element
     * @type {?}
     */
    FormSelectComponent.prototype.options;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1zZWxlY3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQHZjZC91aS1jb21wb25lbnRzLyIsInNvdXJjZXMiOlsiZm9ybS9mb3JtLXNlbGVjdC9mb3JtLXNlbGVjdC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7O0FBS0EsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFFM0MsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHNCQUFzQixDQUFDOzs7O0FBVXZELE1BQU0sT0FBTyxtQkFBb0IsU0FBUSxlQUFlOzs7O0lBTXBELFlBQWdDLFNBQW9CO1FBQ2hELEtBQUssQ0FBQyxTQUFTLENBQUMsQ0FBQzs7OztRQUhaLFlBQU8sR0FBbUIsRUFBRSxDQUFDO0lBSXRDLENBQUM7Ozs7SUFFRCxJQUFJLGNBQWM7UUFDZCxJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sSUFBSSxJQUFJLENBQUMsV0FBVyxDQUFDLEtBQUssS0FBSyxJQUFJLElBQUksSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLEtBQUssU0FBUyxFQUFFO1lBQzFGLE9BQU8sU0FBUyxDQUFDO1NBQ3BCO1FBQ0QscUVBQXFFO1FBQ3JFLE9BQU8sSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJOzs7O1FBQUMsQ0FBQyxNQUFNLEVBQUUsRUFBRSxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsUUFBUSxFQUFFLEtBQUssSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLENBQUMsUUFBUSxFQUFFLEVBQUMsQ0FBQztJQUN4RyxDQUFDOzs7WUFyQkosU0FBUyxTQUFDO2dCQUNQLFFBQVEsRUFBRSxpQkFBaUI7Z0JBQzNCLHc5Q0FBeUM7O2FBRTVDOzs7O1lBWFEsU0FBUyx1QkFrQkQsSUFBSSxZQUFJLFFBQVE7OztzQkFGNUIsS0FBSzs7Ozs7OztJQUFOLHNDQUFzQyIsInNvdXJjZXNDb250ZW50IjpbIi8qIVxuICogQ29weXJpZ2h0IDIwMjAgVk13YXJlLCBJbmMuXG4gKiBTUERYLUxpY2Vuc2UtSWRlbnRpZmllcjogQlNELTItQ2xhdXNlXG4gKi9cblxuaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT3B0aW9uYWwsIFNlbGYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5nQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IFNlbGVjdE9wdGlvbiB9IGZyb20gJy4uLy4uL2NvbW1vbi9pbnRlcmZhY2VzL3NlbGVjdC1vcHRpb24nO1xuaW1wb3J0IHsgQmFzZUZvcm1Db250cm9sIH0gZnJvbSAnLi4vYmFzZS1mb3JtLWNvbnRyb2wnO1xuXG4vKipcbiAqIHtAbGluayBGb3JtQ29udHJvbH0gd3JhcHBlciBhcm91bmQgYSBzZWxlY3QgSFRNTCBlbGVtZW50XG4gKi9cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAndmNkLWZvcm0tc2VsZWN0JyxcbiAgICB0ZW1wbGF0ZVVybDogJ2Zvcm0tc2VsZWN0LmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi4vZm9ybS5zY3NzJywgJy4vZm9ybS1zZWxlY3QuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgRm9ybVNlbGVjdENvbXBvbmVudCBleHRlbmRzIEJhc2VGb3JtQ29udHJvbCB7XG4gICAgLyoqXG4gICAgICogVGhlIGRpc3BsYXllZCBvcHRpb25zIGZvciB0aGUgc2VsZWN0IGVsZW1lbnRcbiAgICAgKi9cbiAgICBASW5wdXQoKSBvcHRpb25zOiBTZWxlY3RPcHRpb25bXSA9IFtdO1xuXG4gICAgY29uc3RydWN0b3IoQFNlbGYoKSBAT3B0aW9uYWwoKSBuZ0NvbnRyb2w6IE5nQ29udHJvbCkge1xuICAgICAgICBzdXBlcihuZ0NvbnRyb2wpO1xuICAgIH1cblxuICAgIGdldCBzZWxlY3RlZE9wdGlvbigpOiBTZWxlY3RPcHRpb24ge1xuICAgICAgICBpZiAoIXRoaXMub3B0aW9ucyB8fCB0aGlzLmZvcm1Db250cm9sLnZhbHVlID09PSBudWxsIHx8IHRoaXMuZm9ybUNvbnRyb2wudmFsdWUgPT09IHVuZGVmaW5lZCkge1xuICAgICAgICAgICAgcmV0dXJuIHVuZGVmaW5lZDtcbiAgICAgICAgfVxuICAgICAgICAvLyBvcHRpb24udmFsdWUgYW5kIGZvcm1Db250cm9sLnZhbHVlIGNhbiBiZSBvZiB0eXBlIG51bWJlciBvciBzdHJpbmdcbiAgICAgICAgcmV0dXJuIHRoaXMub3B0aW9ucy5maW5kKChvcHRpb24pID0+IG9wdGlvbi52YWx1ZS50b1N0cmluZygpID09PSB0aGlzLmZvcm1Db250cm9sLnZhbHVlLnRvU3RyaW5nKCkpO1xuICAgIH1cbn1cbiJdfQ==