// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
//  of this software and associated documentation files (the "Software"), to
//  deal in the Software without restriction, including without limitation the
//  rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
//  sell copies of the Software, and to permit persons to whom the Software is
//  furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
//  all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
//  THE SOFTWARE.
import { Component, ElementRef, EventEmitter, forwardRef, HostBinding, Input, Output, Renderer2, ViewChild, ViewEncapsulation, } from "@angular/core";
import { NG_VALUE_ACCESSOR } from "@angular/forms";
import _debounce from "lodash/debounce";
import _isEmpty from "lodash/isEmpty";
import _isNil from "lodash/isNil";
import _toString from "lodash/toString";
import { BaseSelect } from "./base-select";
import { LoggerService } from "../../services/log-service";
import { UtilService } from "../../services/util.service";
import { NuiFormFieldControl } from "../form-field/public-api";
import { MenuComponent } from "../menu";
import * as i0 from "@angular/core";
import * as i1 from "../../services/util.service";
import * as i2 from "../../services/log-service";
import * as i3 from "@angular/common";
import * as i4 from "../menu/menu-item/menu-action/menu-action.component";
import * as i5 from "../menu/menu/menu.component";
import * as i6 from "../menu/menu-item/menu-group/menu-group.component";
// <example-url>./../examples/index.html#/select</example-url>
/**
 * @deprecated in v11 - Use SelectV2Component instead - Removal: NUI-5796
 */
export class SelectComponent extends BaseSelect {
    get isJustified() {
        return this.justified;
    }
    get isInline() {
        return this.inline;
    }
    constructor(utilService, renderer, elRef, logger) {
        super(utilService);
        this.renderer = renderer;
        this.elRef = elRef;
        this.logger = logger;
        /**
         * Input that indicates text which is displayed if "isRemoveValueEnabled" set to true
         */
        this.removeValueText = "Unspecified";
        /**
         * Callback event that provides split-button behavior and interaction.
         */
        this.secondaryAction = new EventEmitter();
        this.debouncedBlur = _debounce(() => {
            this.handleBlur();
        }, 300);
        this.logger.warn("<nui-select> is deprecated as of Nova v11. Please use <nui-select-v2> instead.");
    }
    ngOnInit() {
        super.ngOnInit();
        this.unsubscriber = this.renderer.listen(this.elRef.nativeElement, "focusout", () => {
            // Blur is debounced cause when you click on menu item blur is triggered twice: from textbox and when popup is closed.
            this.debouncedBlur();
        });
    }
    ngOnChanges(changes) {
        super.ngOnChanges(changes);
    }
    displayPlaceholder() {
        return !_isNil(this.placeholder) && _isEmpty(this.getSelectedItem());
    }
    displayedValue() {
        return this.displayPlaceholder()
            ? this.placeholder
            : _toString(this.getDisplayValueFormatted(this.getSelectedItem()));
    }
    handleBlur() {
        this.select(this.selectedItem);
    }
    getWidth() {
        // when appendToBody=true popup goes to body, so it's out of nui-select and it's width needs to be set explicitly
        return this.appendToBody || this.isJustified
            ? this.elRef.nativeElement.getBoundingClientRect().width + "px"
            : "";
    }
    ngOnDestroy() {
        if (this.unsubscriber) {
            this.unsubscriber();
        }
    }
}
SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: SelectComponent, deps: [{ token: i1.UtilService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i2.LoggerService }], target: i0.ɵɵFactoryTarget.Component });
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: SelectComponent, selector: "nui-select", inputs: { appendToBody: "appendToBody", removeValueText: "removeValueText" }, outputs: { secondaryAction: "secondaryAction" }, host: { properties: { "class.nui-select--justified": "this.isJustified", "class.nui-select--inline": "this.isInline" }, classAttribute: "nui-select" }, providers: [
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => SelectComponent),
            multi: true,
        },
        {
            provide: NuiFormFieldControl,
            useExisting: forwardRef(() => SelectComponent),
            multi: true,
        },
    ], viewQueries: [{ propertyName: "menu", first: true, predicate: ["menu"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"nui-select__layout-block\"\n    [class.placeholder-displayed]=\"displayPlaceholder()\"\n    [class.custom-template]=\"customTemplate\"\n    [class.disabled]=\"isDisabled\"\n>\n    <ng-container *ngIf=\"itemsSource; else transclusionContent\">\n        <nui-menu\n            #menu\n            [class.has-error]=\"isInErrorState\"\n            [title]=\"displayedValue()\"\n            [isDisabled]=\"isDisabled\"\n            [appendToBody]=\"appendToBody\"\n            [widthOfPopup]=\"getWidth()\"\n            [contextClass]=\"\n                (justified ? 'nui-select--justified ' : '') +\n                'nui-select-popup-host'\n            \"\n            [attr.aria-label]=\"ariaLabel\"\n        >\n            <nui-menu-action\n                *ngIf=\"isRemoveValueEnabled\"\n                (actionDone)=\"select(null)\"\n            >\n                {{ removeValueText }}\n            </nui-menu-action>\n            <ng-container *ngFor=\"let item of itemsSource\">\n                <nui-menu-action\n                    *ngIf=\"!item.items\"\n                    [class.item-selected]=\"isItemSelected(item)\"\n                    (actionDone)=\"select(item)\"\n                >\n                    <ng-container *ngIf=\"!customTemplate\">{{\n                        getItemDisplay(item)\n                    }}</ng-container>\n                    <ng-container\n                        [ngTemplateOutlet]=\"customTemplate\"\n                        [ngTemplateOutletContext]=\"{ context: item }\"\n                    >\n                    </ng-container>\n                </nui-menu-action>\n                <nui-menu-group *ngIf=\"item.items\" [header]=\"item.header\">\n                    <nui-menu-action\n                        *ngFor=\"let groupedItem of item.items\"\n                        [class.item-selected]=\"isItemSelected(groupedItem)\"\n                        (actionDone)=\"select(groupedItem)\"\n                    >\n                        {{ getItemDisplay(groupedItem) }}\n                    </nui-menu-action>\n                </nui-menu-group>\n            </ng-container>\n        </nui-menu>\n    </ng-container>\n    <ng-template #transclusionContent>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n", styles: [".nui .nui-select--inline .nui-select__layout-block{display:inline-flex}.nui .nui-select .nui-button.menu-button{color:var(--nui-color-text-default,#111);min-width:100px;justify-content:space-between;padding-right:6px}.nui .nui-select .nui-button.menu-button.is-empty{justify-content:flex-end}.nui .nui-select .nui-button.menu-button:hover,.nui .nui-select .nui-button.menu-button:focus,.nui .nui-select .nui-button.menu-button:active,.nui .nui-select .nui-button.menu-button:active:hover{color:var(--nui-color-text-default,#111);transform:none;outline:none}.nui .nui-select .placeholder-displayed .nui-button.menu-button{color:var(--nui-color-text-secondary,rgba(17, 17, 17, .6));font-weight:400}.nui .nui-select .placeholder-displayed .nui-button.menu-button:hover,.nui .nui-select .placeholder-displayed .nui-button.menu-button:focus,.nui .nui-select .placeholder-displayed .nui-button.menu-button:active{color:var(--nui-color-text-secondary,rgba(17, 17, 17, .6))}.nui .nui-select .disabled .nui-button.menu-button{color:var(--nui-color-text-disabled,rgba(17, 17, 17, .3));cursor:not-allowed}.nui .nui-select .disabled .nui-button.menu-button .nui-icon path,.nui .nui-select .disabled .nui-button.menu-button .nui-icon polygon{fill:var(--nui-color-icon-disabled,rgba(17, 17, 17, .3))}.nui .nui-select .disabled .nui-button.menu-button:hover,.nui .nui-select .disabled .nui-button.menu-button:focus,.nui .nui-select .disabled .nui-button.menu-button:active{color:var(--nui-color-text-disabled,rgba(17, 17, 17, .3));border-color:var(--nui-color-line-default,#d9d9d9);background-color:var(--nui-color-bg-transparent,transparent);box-shadow:none}.nui .nui-select .nui-menu-item .nui-menu-item__action{color:var(--nui-color-text-default,#111)}.nui .nui-select .nui-menu-item.item-selected .nui-menu-item__action{background-color:var(--nui-color-selected,rgba(0, 196, 210, .1));color:var(--nui-color-text-default,#111);font-weight:600}.nui .nui-select .nui-menu-item.item-selected .nui-menu-item__action:hover{background-color:var(--nui-color-selected-hover,rgba(0, 196, 210, .2))}.nui .nui-select .custom-template .nui-popup .nui-popup__area{width:auto}.nui .nui-select .nui-popup .nui-popup__area [popupAreaContent]{padding:0}.nui .nui-select .nui-popup .nui-popup__area{width:100%;min-width:160px;max-width:400px;height:100%;overflow-y:auto}.nui .nui-select .nui-select__menu{max-height:300px;overflow-y:auto;max-width:400px}.nui .nui-select .has-error .nui-button.menu-button{border-color:var(--nui-color-line-critical,#dd2c00)}.nui .nui-select .has-error .nui-button.menu-button:hover,.nui .nui-select .has-error .nui-button.menu-button:focus,.nui .nui-select .has-error .nui-button.menu-button:active{border-color:var(--nui-color-line-critical,#dd2c00)}.nui .nui-select--justified .custom-template .nui-popup .nui-popup__area{max-width:none;width:100%}.nui .nui-select--justified nui-menu{display:flex}.nui .nui-select--justified nui-menu .nui-popup{flex-grow:1;width:100%}.nui .nui-select--justified nui-menu .nui-popup-container{flex-grow:1;width:100%}.nui .nui-select--justified nui-menu .nui-popup-container .nui-popup__area{max-width:none}.nui .nui-select--justified nui-menu .nui-popup__content{width:100%}.nui .nui-select--justified nui-menu .nui-popup__content .menu-button{display:flex;flex-grow:1;max-width:none}@-moz-document url-prefix(){.nui .nui-select .nui-menu-item{padding-right:0}}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.MenuActionComponent, selector: "nui-menu-action", inputs: ["icon", "type"] }, { kind: "component", type: i5.MenuComponent, selector: "nui-menu", inputs: ["widthOfPopup", "contextClass", "appendToBody", "ariaLabel", "title", "size", "displayStyle", "isDisabled", "icon", "itemsSource"], outputs: ["blurred"] }, { kind: "component", type: i6.MenuGroupComponent, selector: "nui-menu-group", inputs: ["header"] }], encapsulation: i0.ViewEncapsulation.None });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: SelectComponent, decorators: [{
            type: Component,
            args: [{ selector: "nui-select", host: { class: "nui-select" }, providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => SelectComponent),
                            multi: true,
                        },
                        {
                            provide: NuiFormFieldControl,
                            useExisting: forwardRef(() => SelectComponent),
                            multi: true,
                        },
                    ], encapsulation: ViewEncapsulation.None, template: "<div\n    class=\"nui-select__layout-block\"\n    [class.placeholder-displayed]=\"displayPlaceholder()\"\n    [class.custom-template]=\"customTemplate\"\n    [class.disabled]=\"isDisabled\"\n>\n    <ng-container *ngIf=\"itemsSource; else transclusionContent\">\n        <nui-menu\n            #menu\n            [class.has-error]=\"isInErrorState\"\n            [title]=\"displayedValue()\"\n            [isDisabled]=\"isDisabled\"\n            [appendToBody]=\"appendToBody\"\n            [widthOfPopup]=\"getWidth()\"\n            [contextClass]=\"\n                (justified ? 'nui-select--justified ' : '') +\n                'nui-select-popup-host'\n            \"\n            [attr.aria-label]=\"ariaLabel\"\n        >\n            <nui-menu-action\n                *ngIf=\"isRemoveValueEnabled\"\n                (actionDone)=\"select(null)\"\n            >\n                {{ removeValueText }}\n            </nui-menu-action>\n            <ng-container *ngFor=\"let item of itemsSource\">\n                <nui-menu-action\n                    *ngIf=\"!item.items\"\n                    [class.item-selected]=\"isItemSelected(item)\"\n                    (actionDone)=\"select(item)\"\n                >\n                    <ng-container *ngIf=\"!customTemplate\">{{\n                        getItemDisplay(item)\n                    }}</ng-container>\n                    <ng-container\n                        [ngTemplateOutlet]=\"customTemplate\"\n                        [ngTemplateOutletContext]=\"{ context: item }\"\n                    >\n                    </ng-container>\n                </nui-menu-action>\n                <nui-menu-group *ngIf=\"item.items\" [header]=\"item.header\">\n                    <nui-menu-action\n                        *ngFor=\"let groupedItem of item.items\"\n                        [class.item-selected]=\"isItemSelected(groupedItem)\"\n                        (actionDone)=\"select(groupedItem)\"\n                    >\n                        {{ getItemDisplay(groupedItem) }}\n                    </nui-menu-action>\n                </nui-menu-group>\n            </ng-container>\n        </nui-menu>\n    </ng-container>\n    <ng-template #transclusionContent>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n", styles: [".nui .nui-select--inline .nui-select__layout-block{display:inline-flex}.nui .nui-select .nui-button.menu-button{color:var(--nui-color-text-default,#111);min-width:100px;justify-content:space-between;padding-right:6px}.nui .nui-select .nui-button.menu-button.is-empty{justify-content:flex-end}.nui .nui-select .nui-button.menu-button:hover,.nui .nui-select .nui-button.menu-button:focus,.nui .nui-select .nui-button.menu-button:active,.nui .nui-select .nui-button.menu-button:active:hover{color:var(--nui-color-text-default,#111);transform:none;outline:none}.nui .nui-select .placeholder-displayed .nui-button.menu-button{color:var(--nui-color-text-secondary,rgba(17, 17, 17, .6));font-weight:400}.nui .nui-select .placeholder-displayed .nui-button.menu-button:hover,.nui .nui-select .placeholder-displayed .nui-button.menu-button:focus,.nui .nui-select .placeholder-displayed .nui-button.menu-button:active{color:var(--nui-color-text-secondary,rgba(17, 17, 17, .6))}.nui .nui-select .disabled .nui-button.menu-button{color:var(--nui-color-text-disabled,rgba(17, 17, 17, .3));cursor:not-allowed}.nui .nui-select .disabled .nui-button.menu-button .nui-icon path,.nui .nui-select .disabled .nui-button.menu-button .nui-icon polygon{fill:var(--nui-color-icon-disabled,rgba(17, 17, 17, .3))}.nui .nui-select .disabled .nui-button.menu-button:hover,.nui .nui-select .disabled .nui-button.menu-button:focus,.nui .nui-select .disabled .nui-button.menu-button:active{color:var(--nui-color-text-disabled,rgba(17, 17, 17, .3));border-color:var(--nui-color-line-default,#d9d9d9);background-color:var(--nui-color-bg-transparent,transparent);box-shadow:none}.nui .nui-select .nui-menu-item .nui-menu-item__action{color:var(--nui-color-text-default,#111)}.nui .nui-select .nui-menu-item.item-selected .nui-menu-item__action{background-color:var(--nui-color-selected,rgba(0, 196, 210, .1));color:var(--nui-color-text-default,#111);font-weight:600}.nui .nui-select .nui-menu-item.item-selected .nui-menu-item__action:hover{background-color:var(--nui-color-selected-hover,rgba(0, 196, 210, .2))}.nui .nui-select .custom-template .nui-popup .nui-popup__area{width:auto}.nui .nui-select .nui-popup .nui-popup__area [popupAreaContent]{padding:0}.nui .nui-select .nui-popup .nui-popup__area{width:100%;min-width:160px;max-width:400px;height:100%;overflow-y:auto}.nui .nui-select .nui-select__menu{max-height:300px;overflow-y:auto;max-width:400px}.nui .nui-select .has-error .nui-button.menu-button{border-color:var(--nui-color-line-critical,#dd2c00)}.nui .nui-select .has-error .nui-button.menu-button:hover,.nui .nui-select .has-error .nui-button.menu-button:focus,.nui .nui-select .has-error .nui-button.menu-button:active{border-color:var(--nui-color-line-critical,#dd2c00)}.nui .nui-select--justified .custom-template .nui-popup .nui-popup__area{max-width:none;width:100%}.nui .nui-select--justified nui-menu{display:flex}.nui .nui-select--justified nui-menu .nui-popup{flex-grow:1;width:100%}.nui .nui-select--justified nui-menu .nui-popup-container{flex-grow:1;width:100%}.nui .nui-select--justified nui-menu .nui-popup-container .nui-popup__area{max-width:none}.nui .nui-select--justified nui-menu .nui-popup__content{width:100%}.nui .nui-select--justified nui-menu .nui-popup__content .menu-button{display:flex;flex-grow:1;max-width:none}@-moz-document url-prefix(){.nui .nui-select .nui-menu-item{padding-right:0}}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.UtilService }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i2.LoggerService }]; }, propDecorators: { appendToBody: [{
                type: Input
            }], removeValueText: [{
                type: Input
            }], secondaryAction: [{
                type: Output
            }], isJustified: [{
                type: HostBinding,
                args: ["class.nui-select--justified"]
            }], isInline: [{
                type: HostBinding,
                args: ["class.nui-select--inline"]
            }], menu: [{
                type: ViewChild,
                args: ["menu"]
            }] } });
//# sourceMappingURL=data:application/json;base64, 