import * as i0 from '@angular/core';
import { EventEmitter, TemplateRef, Component, Input, Output, ContentChild, ViewChild, inject, ChangeDetectorRef, ContentChildren, NgModule } from '@angular/core';
import { Tooltip, TooltipModule } from 'primeng/tooltip';
import { ButtonComponent, ButtonModule } from '@seniorsistemas/angular-components/button';
import { EmptyStateComponent, EmptyStateModule } from '@seniorsistemas/angular-components/empty-state';
import { LoadingStateDirective, LoadingStateModule } from '@seniorsistemas/angular-components/loading-state';
import { ThumbnailComponent, ThumbnailModule } from '@seniorsistemas/angular-components/thumbnail';
import { NgClass, NgTemplateOutlet } from '@angular/common';
import { trigger, state, style, transition, animate } from '@angular/animations';
import { isNullOrUndefined } from '@seniorsistemas/angular-components/utils';
import * as i1 from '@angular/forms';
import { FormsModule } from '@angular/forms';

class GlobalSearchDropdownItemComponent {
    static nextId = 0;
    id = `s-global-search-dropdown-item-${GlobalSearchDropdownItemComponent.nextId++}`;
    primaryLabel;
    secondaryEmptyLabel;
    tertiaryEmptyLabel;
    imageSource;
    imageAlt;
    iconClass;
    secondaryLabel;
    tertiaryLabel;
    size = 'standart';
    template = null;
    buttonClick = new EventEmitter();
    thumbnailComponent = null;
    content = null;
    isMediumSize() {
        return this.size === 'medium';
    }
    isSmallSize() {
        return this.size === 'small';
    }
    getImageSize() {
        return this._isStandardSize() ? 'medium' : 'small';
    }
    _isStandardSize() {
        return this.size === 'standart';
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchDropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: GlobalSearchDropdownItemComponent, isStandalone: true, selector: "s-global-search-dropdown-item", inputs: { id: "id", primaryLabel: "primaryLabel", secondaryEmptyLabel: "secondaryEmptyLabel", tertiaryEmptyLabel: "tertiaryEmptyLabel", imageSource: "imageSource", imageAlt: "imageAlt", iconClass: "iconClass", secondaryLabel: "secondaryLabel", tertiaryLabel: "tertiaryLabel", size: "size", template: "template" }, outputs: { buttonClick: "buttonClick" }, queries: [{ propertyName: "thumbnailComponent", first: true, predicate: ThumbnailComponent, descendants: true, static: true }], viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: "<ng-template>\r\n    <div\r\n        class=\"global-search-dropdown-item\"\r\n        [ngClass]=\"{ 'grid grid-cols-2 gap-2': isSmallSize() }\"\r\n    >\r\n        <ng-content select=\"s-thumbnail\"></ng-content>\r\n\r\n        @if (!thumbnailComponent && (imageSource || iconClass) && !isSmallSize()) {\r\n            <s-thumbnail\r\n                [id]=\"id + '-thumbnail'\"\r\n                [imageSource]=\"imageSource\"\r\n                [imageAlt]=\"imageAlt || primaryLabel\"\r\n                [iconClass]=\"iconClass ?? ''\"\r\n                [size]=\"getImageSize()\"\r\n            ></s-thumbnail>\r\n        }\r\n\r\n        <div\r\n            class=\"global-search-item__container ml-[10px] only:ml-0 w-full whitespace-nowrap max-md:whitespace-normal overflow-hidden text-ellipsis {{ !isSmallSize() ? 'w-[60%]' : '' }}\"\r\n        >\r\n            <div #titleTemplate>\r\n                <ng-content select=\"[titleTemplate]\"></ng-content>\r\n            </div>\r\n            @if (!titleTemplate.children.length) {\r\n                <s-button\r\n                    styleClass=\"no-padding\"\r\n                    [id]=\"id + '-title'\"\r\n                    priority=\"link\"\r\n                    [pTooltip]=\"primaryLabel\"\r\n                    [label]=\"primaryLabel\"\r\n                    size=\"small\"\r\n                    (clicked)=\"buttonClick.emit()\"\r\n                >\r\n                </s-button>\r\n            }\r\n\r\n            <div #labelTemplate>\r\n                <ng-content select=\"[labelTemplate]\"></ng-content>\r\n            </div>\r\n\r\n            @if (!labelTemplate.children.length) {\r\n                <span\r\n                    [id]=\"id + '-label'\"\r\n                    [ngClass]=\"{\r\n                        'text-right pt-[2px] pl-[15px]': isSmallSize(),\r\n                        'italic': !secondaryLabel,\r\n                    }\"\r\n                    class=\"text-grayscale-90 block whitespace-nowrap max-md:whitespace-normal overflow-hidden text-ellipsis\"\r\n                    [pTooltip]=\"secondaryLabel\"\r\n                    tooltipPosition=\"top\"\r\n                    showDelay=\"500\"\r\n                    >{{ secondaryLabel ? secondaryLabel : secondaryEmptyLabel }}</span\r\n                >\r\n            }\r\n\r\n            <div #descriptionTemplate>\r\n                <ng-content select=\"[descriptionTemplate]\"></ng-content>\r\n            </div>\r\n\r\n            @if (!descriptionTemplate.children.length && !isMediumSize() && !isSmallSize()) {\r\n                <span\r\n                    [id]=\"id + '-description'\"\r\n                    class=\"text-grayscale-50 block whitespace-nowrap max-md:whitespace-normal overflow-hidden text-ellipsis\"\r\n                    [ngClass]=\"{ 'italic': !secondaryLabel }\"\r\n                    [pTooltip]=\"tertiaryLabel\"\r\n                    tooltipPosition=\"top\"\r\n                    showDelay=\"500\"\r\n                >\r\n                    {{ tertiaryLabel ? tertiaryLabel : tertiaryEmptyLabel }}\r\n                </span>\r\n            }\r\n        </div>\r\n        @if (!isSmallSize()) {\r\n            <div class=\"w-[40%] flex flex-col text-right\">\r\n                <ng-container *ngTemplateOutlet=\"template\"></ng-container>\r\n            </div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: ["::ng-deep .no-padding{padding:0!important;min-width:0px!important}::ng-deep .s-button-with-text{min-width:0px!important}\n"], dependencies: [{ kind: "component", type: ThumbnailComponent, selector: "s-thumbnail", inputs: ["id", "size", "imageSource", "imageFallback", "imageAlt", "iconClass", "hasAction", "actionIconClass", "isTile", "isBrand"] }, { kind: "component", type: ButtonComponent, selector: "s-button", inputs: ["id", "label", "tooltip", "tooltipPosition", "iconClass", "rightIconClass", "caret", "styleClass", "baseZIndex", "disabled", "auxiliary", "type", "priority", "menuOptions", "size", "slide", "animation", "badge", "iconColor", "menuAriaLabel", "ariaLabel"], outputs: ["clicked"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchDropdownItemComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-global-search-dropdown-item', standalone: true, imports: [ThumbnailComponent, ButtonComponent, Tooltip, NgClass, NgTemplateOutlet], template: "<ng-template>\r\n    <div\r\n        class=\"global-search-dropdown-item\"\r\n        [ngClass]=\"{ 'grid grid-cols-2 gap-2': isSmallSize() }\"\r\n    >\r\n        <ng-content select=\"s-thumbnail\"></ng-content>\r\n\r\n        @if (!thumbnailComponent && (imageSource || iconClass) && !isSmallSize()) {\r\n            <s-thumbnail\r\n                [id]=\"id + '-thumbnail'\"\r\n                [imageSource]=\"imageSource\"\r\n                [imageAlt]=\"imageAlt || primaryLabel\"\r\n                [iconClass]=\"iconClass ?? ''\"\r\n                [size]=\"getImageSize()\"\r\n            ></s-thumbnail>\r\n        }\r\n\r\n        <div\r\n            class=\"global-search-item__container ml-[10px] only:ml-0 w-full whitespace-nowrap max-md:whitespace-normal overflow-hidden text-ellipsis {{ !isSmallSize() ? 'w-[60%]' : '' }}\"\r\n        >\r\n            <div #titleTemplate>\r\n                <ng-content select=\"[titleTemplate]\"></ng-content>\r\n            </div>\r\n            @if (!titleTemplate.children.length) {\r\n                <s-button\r\n                    styleClass=\"no-padding\"\r\n                    [id]=\"id + '-title'\"\r\n                    priority=\"link\"\r\n                    [pTooltip]=\"primaryLabel\"\r\n                    [label]=\"primaryLabel\"\r\n                    size=\"small\"\r\n                    (clicked)=\"buttonClick.emit()\"\r\n                >\r\n                </s-button>\r\n            }\r\n\r\n            <div #labelTemplate>\r\n                <ng-content select=\"[labelTemplate]\"></ng-content>\r\n            </div>\r\n\r\n            @if (!labelTemplate.children.length) {\r\n                <span\r\n                    [id]=\"id + '-label'\"\r\n                    [ngClass]=\"{\r\n                        'text-right pt-[2px] pl-[15px]': isSmallSize(),\r\n                        'italic': !secondaryLabel,\r\n                    }\"\r\n                    class=\"text-grayscale-90 block whitespace-nowrap max-md:whitespace-normal overflow-hidden text-ellipsis\"\r\n                    [pTooltip]=\"secondaryLabel\"\r\n                    tooltipPosition=\"top\"\r\n                    showDelay=\"500\"\r\n                    >{{ secondaryLabel ? secondaryLabel : secondaryEmptyLabel }}</span\r\n                >\r\n            }\r\n\r\n            <div #descriptionTemplate>\r\n                <ng-content select=\"[descriptionTemplate]\"></ng-content>\r\n            </div>\r\n\r\n            @if (!descriptionTemplate.children.length && !isMediumSize() && !isSmallSize()) {\r\n                <span\r\n                    [id]=\"id + '-description'\"\r\n                    class=\"text-grayscale-50 block whitespace-nowrap max-md:whitespace-normal overflow-hidden text-ellipsis\"\r\n                    [ngClass]=\"{ 'italic': !secondaryLabel }\"\r\n                    [pTooltip]=\"tertiaryLabel\"\r\n                    tooltipPosition=\"top\"\r\n                    showDelay=\"500\"\r\n                >\r\n                    {{ tertiaryLabel ? tertiaryLabel : tertiaryEmptyLabel }}\r\n                </span>\r\n            }\r\n        </div>\r\n        @if (!isSmallSize()) {\r\n            <div class=\"w-[40%] flex flex-col text-right\">\r\n                <ng-container *ngTemplateOutlet=\"template\"></ng-container>\r\n            </div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: ["::ng-deep .no-padding{padding:0!important;min-width:0px!important}::ng-deep .s-button-with-text{min-width:0px!important}\n"] }]
        }], propDecorators: { id: [{
                type: Input
            }], primaryLabel: [{
                type: Input
            }], secondaryEmptyLabel: [{
                type: Input
            }], tertiaryEmptyLabel: [{
                type: Input
            }], imageSource: [{
                type: Input
            }], imageAlt: [{
                type: Input
            }], iconClass: [{
                type: Input
            }], secondaryLabel: [{
                type: Input
            }], tertiaryLabel: [{
                type: Input
            }], size: [{
                type: Input
            }], template: [{
                type: Input
            }], buttonClick: [{
                type: Output
            }], thumbnailComponent: [{
                type: ContentChild,
                args: [ThumbnailComponent, { static: true }]
            }], content: [{
                type: ViewChild,
                args: [TemplateRef, { static: true }]
            }] } });

/**
 * @description Componente de busca global com input, dropdown de resultados, estado
 * de carregamento, empty state e suporte a itens customizáveis via `GlobalSearchDropdownItemComponent`.
 *
 * @example
 * ```html
 * <s-global-search
 *   totalItensLabel="resultados"
 *   showMoreLabel="Ver mais"
 *   [totalElements]="total"
 *   (search)="onBusca($event)" />
 * ```
 *
 * @category Structure
 */
class GlobalSearchComponent {
    _cdr = inject(ChangeDetectorRef);
    static nextId = 0;
    globalSearch = null;
    /** @description Identificador único do componente no DOM. Gerado automaticamente se não informado. */
    id = `s-global-search-${GlobalSearchDropdownItemComponent.nextId++}`;
    /** @description Tempo de debounce em ms antes de emitir o evento de busca. @default 500 */
    delay = 500;
    /** @description Label que acompanha o total de resultados. Campo obrigatório. */
    totalItensLabel;
    /** @description Rótulo do link para exibir mais resultados. Campo obrigatório. */
    showMoreLabel;
    /** @description Placeholder do input de busca. */
    placeholder;
    /** @description Exibe indicador de carregamento no dropdown. @default false */
    isLoading = false;
    /** @description Número total de resultados encontrados. */
    totalElements;
    /** @description Título do empty state quando não há resultados. */
    emptyTitle;
    /** @description Descrição do empty state exibida abaixo do título. */
    emptyDescription;
    /** @description Classe do ícone exibido no empty state. */
    emptyIcon;
    /** @description Exibe o rodapé com o link "ver mais" e contagem de resultados. @default true */
    showFooter = true;
    dropdownItens = null;
    /** @description Emitido ao digitar no campo de busca, com o valor atual da pesquisa. */
    searched = new EventEmitter();
    /** @description Emitido quando o campo de busca ganha ou perde foco (`true` = focado). */
    focused = new EventEmitter();
    /** @description Emitido ao clicar no link para exibir mais resultados. */
    moreShown = new EventEmitter();
    search = null;
    wasSearched = false;
    isModalLoading = false;
    expanded = true;
    onChange() {
        const search = this.search;
        setTimeout(() => {
            if (this.search === search) {
                this._canShowGlobalSearchActive();
                this.searched.emit(this.search ?? '');
            }
        }, this.delay);
    }
    focusIn() {
        this.focused.emit(true);
    }
    focusOut() {
        this.focused.emit(false);
    }
    showMore() {
        this.moreShown.emit();
    }
    close() {
        this.search = null;
        this.wasSearched = false;
        this.dropdownItens = null;
        this.isModalLoading = false;
        this._removeActiveClassByGlobalSearch();
    }
    _removeActiveClassByGlobalSearch() {
        if (isNullOrUndefined(this.globalSearch))
            return;
        this.globalSearch.nativeElement.classList.remove('global-search__input-active');
    }
    _canShowGlobalSearchActive() {
        this.wasSearched = !!this.search;
        if (this.search) {
            if (isNullOrUndefined(this.globalSearch))
                return;
            this.globalSearch.nativeElement.classList.add('global-search__input-active');
        }
        else {
            this._removeActiveClassByGlobalSearch();
            this.close();
        }
        this._cdr.detectChanges();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: GlobalSearchComponent, isStandalone: true, selector: "s-global-search", inputs: { id: "id", delay: "delay", totalItensLabel: "totalItensLabel", showMoreLabel: "showMoreLabel", placeholder: "placeholder", isLoading: "isLoading", totalElements: "totalElements", emptyTitle: "emptyTitle", emptyDescription: "emptyDescription", emptyIcon: "emptyIcon", showFooter: "showFooter" }, outputs: { searched: "searched", focused: "focused", moreShown: "moreShown" }, queries: [{ propertyName: "dropdownItens", predicate: GlobalSearchDropdownItemComponent }], viewQueries: [{ propertyName: "globalSearch", first: true, predicate: ["globalSearch"], descendants: true }], ngImport: i0, template: "<div class=\"group flex max-w-full\">\r\n    <input\r\n        #globalSearch\r\n        class=\"global-search__input rounded-tl-[20px] rounded-bl-[20px] rounded-tr-none rounded-br-none border border-solid border-grayscale-30 border-r-0 cursor-pointer h-[25px] min-h-[25px] pl-[15px] text-sm font-open-sans outline-none bg-grayscale-0 transition-all duration-300 w-[136px]\"\r\n        [(ngModel)]=\"search\"\r\n        (ngModelChange)=\"onChange()\"\r\n        [placeholder]=\"placeholder\"\r\n        (focus)=\"focusIn()\"\r\n        (blur)=\"focusOut()\"\r\n    />\r\n    <span class=\"global-search__span items-center bg-transparent border border-solid border-grayscale-30 border-l-0 rounded-tr-[20px] rounded-br-[20px] flex h-[25px] justify-center px-2 transition-all duration-300\">\r\n        <em class=\"fas fa-search\"></em>\r\n    </span>\r\n\r\n    @if (wasSearched) {\r\n        <div class=\"bg-grayscale-0 rounded-[5px] shadow-[0_2px_8px_0_rgba(0,0,0,0.4)] mt-[60px] min-h-[50px] absolute w-[500px] z-[6]\">\r\n            <div\r\n                *sLoadingState=\"isLoading && !isModalLoading\"\r\n                class=\"global-search__loader\"\r\n            >\r\n                @if ((dropdownItens && dropdownItens.length > 0) || isLoading) {\r\n                    <div class=\"min-h-[50px] w-full\">\r\n                        @if (dropdownItens && dropdownItens.length > 0) {\r\n                            <div>\r\n                                <div class=\"border-b border-solid border-grayscale-30 text-grayscale-90 font-semibold h-[50px] p-[15px] flex items-center justify-between\">\r\n                                    <span class=\"m-0 p-0\">{{ totalItensLabel }}</span>\r\n                                    <span\r\n                                        class=\"m-0 p-0 cursor-pointer text-right\"\r\n                                        (click)=\"close()\"\r\n                                    >\r\n                                        <em class=\"fas fa-times\"></em>\r\n                                    </span>\r\n                                </div>\r\n                                <div\r\n                                    class=\"max-h-[510px] overflow-auto\"\r\n                                    [@expandableContent]=\"expanded\"\r\n                                >\r\n                                    @for (item of dropdownItens; track item.id) {\r\n                                        <div\r\n                                            class=\"s-object-card-field hover:bg-[#dbe0e4]\"\r\n                                        >\r\n                                            <ng-container *ngTemplateOutlet=\"item.content\"></ng-container>\r\n                                        </div>\r\n                                    }\r\n                                </div>\r\n\r\n                                @if (showFooter) {\r\n                                    <div class=\"border-t border-solid border-grayscale-30 h-[50px]\">\r\n                                        <s-button\r\n                                            class=\"flex flex-col\"\r\n                                            (click)=\"showMore()\"\r\n                                            priority=\"link\"\r\n                                        >\r\n                                            {{ showMoreLabel }}\r\n                                        </s-button>\r\n                                    </div>\r\n                                }\r\n                            </div>\r\n                        }\r\n                    </div>\r\n                }\r\n\r\n                @if ((!dropdownItens || !dropdownItens.length) && !isLoading) {\r\n                    <s-empty-state\r\n                        [title]=\"emptyTitle ?? ''\"\r\n                        [description]=\"emptyDescription\"\r\n                        ngClass=\"global-search__empty-state--icon\"\r\n                        [iconClass]=\"emptyIcon ? emptyIcon : 'fas fa-search'\"\r\n                    >\r\n                    </s-empty-state>\r\n                }\r\n            </div>\r\n        </div>\r\n    }\r\n\r\n    @if (wasSearched) {\r\n        <div\r\n            class=\"bg-[rgba(0,0,0,0.4)] cursor-pointer h-[calc(100vh-70px)] left-0 mt-[50px] absolute w-full z-[5]\"\r\n            (click)=\"close()\"\r\n        ></div>\r\n    }\r\n</div>\r\n", styles: [".global-search__input:active,.global-search__input:focus,.global-search__input-active{border-bottom:solid 1px #428bca;border-left:solid 1px #428bca;border-top:solid 1px #428bca;cursor:default;width:466px}.global-search__input:focus+.global-search__span,.global-search__input:active+.global-search__span{border-bottom:solid 1px #428bca;border-right:solid 1px #428bca;border-top:solid 1px #428bca}::ng-deep s-global-search{width:100%}::ng-deep s-global-search .global-search__loader{border-radius:5px!important;width:100%}::ng-deep s-global-search .global-search__empty-state--icon .empty-state .icon{font-size:40px}::ng-deep s-global-search .s-button-priority-link{color:#428bca}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: LoadingStateDirective, selector: "[sLoadingState]", inputs: ["sLoadingState"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "s-button", inputs: ["id", "label", "tooltip", "tooltipPosition", "iconClass", "rightIconClass", "caret", "styleClass", "baseZIndex", "disabled", "auxiliary", "type", "priority", "menuOptions", "size", "slide", "animation", "badge", "iconColor", "menuAriaLabel", "ariaLabel"], outputs: ["clicked"] }, { kind: "component", type: EmptyStateComponent, selector: "s-empty-state", inputs: ["id", "title", "iconClass", "description", "showPrimaryAction", "showSecondaryAction", "primaryActionLabel", "secondaryActionLabel", "primaryModel"], outputs: ["primaryAction", "secondaryAction"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
            trigger('expandableContent', [
                state('*', style({ height: '0' })),
                state('false', style({ height: '0' })),
                state('true', style({ height: '*' })),
                transition('* => true', animate('200ms ease-out')),
                transition('false <=> true', animate('200ms ease-out')),
            ]),
        ] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-global-search', animations: [
                        trigger('expandableContent', [
                            state('*', style({ height: '0' })),
                            state('false', style({ height: '0' })),
                            state('true', style({ height: '*' })),
                            transition('* => true', animate('200ms ease-out')),
                            transition('false <=> true', animate('200ms ease-out')),
                        ]),
                    ], standalone: true, imports: [
                        FormsModule,
                        LoadingStateDirective,
                        NgTemplateOutlet,
                        ButtonComponent,
                        EmptyStateComponent,
                        NgClass,
                    ], template: "<div class=\"group flex max-w-full\">\r\n    <input\r\n        #globalSearch\r\n        class=\"global-search__input rounded-tl-[20px] rounded-bl-[20px] rounded-tr-none rounded-br-none border border-solid border-grayscale-30 border-r-0 cursor-pointer h-[25px] min-h-[25px] pl-[15px] text-sm font-open-sans outline-none bg-grayscale-0 transition-all duration-300 w-[136px]\"\r\n        [(ngModel)]=\"search\"\r\n        (ngModelChange)=\"onChange()\"\r\n        [placeholder]=\"placeholder\"\r\n        (focus)=\"focusIn()\"\r\n        (blur)=\"focusOut()\"\r\n    />\r\n    <span class=\"global-search__span items-center bg-transparent border border-solid border-grayscale-30 border-l-0 rounded-tr-[20px] rounded-br-[20px] flex h-[25px] justify-center px-2 transition-all duration-300\">\r\n        <em class=\"fas fa-search\"></em>\r\n    </span>\r\n\r\n    @if (wasSearched) {\r\n        <div class=\"bg-grayscale-0 rounded-[5px] shadow-[0_2px_8px_0_rgba(0,0,0,0.4)] mt-[60px] min-h-[50px] absolute w-[500px] z-[6]\">\r\n            <div\r\n                *sLoadingState=\"isLoading && !isModalLoading\"\r\n                class=\"global-search__loader\"\r\n            >\r\n                @if ((dropdownItens && dropdownItens.length > 0) || isLoading) {\r\n                    <div class=\"min-h-[50px] w-full\">\r\n                        @if (dropdownItens && dropdownItens.length > 0) {\r\n                            <div>\r\n                                <div class=\"border-b border-solid border-grayscale-30 text-grayscale-90 font-semibold h-[50px] p-[15px] flex items-center justify-between\">\r\n                                    <span class=\"m-0 p-0\">{{ totalItensLabel }}</span>\r\n                                    <span\r\n                                        class=\"m-0 p-0 cursor-pointer text-right\"\r\n                                        (click)=\"close()\"\r\n                                    >\r\n                                        <em class=\"fas fa-times\"></em>\r\n                                    </span>\r\n                                </div>\r\n                                <div\r\n                                    class=\"max-h-[510px] overflow-auto\"\r\n                                    [@expandableContent]=\"expanded\"\r\n                                >\r\n                                    @for (item of dropdownItens; track item.id) {\r\n                                        <div\r\n                                            class=\"s-object-card-field hover:bg-[#dbe0e4]\"\r\n                                        >\r\n                                            <ng-container *ngTemplateOutlet=\"item.content\"></ng-container>\r\n                                        </div>\r\n                                    }\r\n                                </div>\r\n\r\n                                @if (showFooter) {\r\n                                    <div class=\"border-t border-solid border-grayscale-30 h-[50px]\">\r\n                                        <s-button\r\n                                            class=\"flex flex-col\"\r\n                                            (click)=\"showMore()\"\r\n                                            priority=\"link\"\r\n                                        >\r\n                                            {{ showMoreLabel }}\r\n                                        </s-button>\r\n                                    </div>\r\n                                }\r\n                            </div>\r\n                        }\r\n                    </div>\r\n                }\r\n\r\n                @if ((!dropdownItens || !dropdownItens.length) && !isLoading) {\r\n                    <s-empty-state\r\n                        [title]=\"emptyTitle ?? ''\"\r\n                        [description]=\"emptyDescription\"\r\n                        ngClass=\"global-search__empty-state--icon\"\r\n                        [iconClass]=\"emptyIcon ? emptyIcon : 'fas fa-search'\"\r\n                    >\r\n                    </s-empty-state>\r\n                }\r\n            </div>\r\n        </div>\r\n    }\r\n\r\n    @if (wasSearched) {\r\n        <div\r\n            class=\"bg-[rgba(0,0,0,0.4)] cursor-pointer h-[calc(100vh-70px)] left-0 mt-[50px] absolute w-full z-[5]\"\r\n            (click)=\"close()\"\r\n        ></div>\r\n    }\r\n</div>\r\n", styles: [".global-search__input:active,.global-search__input:focus,.global-search__input-active{border-bottom:solid 1px #428bca;border-left:solid 1px #428bca;border-top:solid 1px #428bca;cursor:default;width:466px}.global-search__input:focus+.global-search__span,.global-search__input:active+.global-search__span{border-bottom:solid 1px #428bca;border-right:solid 1px #428bca;border-top:solid 1px #428bca}::ng-deep s-global-search{width:100%}::ng-deep s-global-search .global-search__loader{border-radius:5px!important;width:100%}::ng-deep s-global-search .global-search__empty-state--icon .empty-state .icon{font-size:40px}::ng-deep s-global-search .s-button-priority-link{color:#428bca}\n"] }]
        }], propDecorators: { globalSearch: [{
                type: ViewChild,
                args: ['globalSearch', { static: false }]
            }], id: [{
                type: Input
            }], delay: [{
                type: Input
            }], totalItensLabel: [{
                type: Input,
                args: [{ required: true }]
            }], showMoreLabel: [{
                type: Input,
                args: [{ required: true }]
            }], placeholder: [{
                type: Input
            }], isLoading: [{
                type: Input
            }], totalElements: [{
                type: Input
            }], emptyTitle: [{
                type: Input
            }], emptyDescription: [{
                type: Input
            }], emptyIcon: [{
                type: Input
            }], showFooter: [{
                type: Input
            }], dropdownItens: [{
                type: ContentChildren,
                args: [GlobalSearchDropdownItemComponent]
            }], searched: [{
                type: Output
            }], focused: [{
                type: Output
            }], moreShown: [{
                type: Output
            }] } });

class GlobalSearchModule {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchModule, imports: [TooltipModule,
            ThumbnailModule,
            ButtonModule,
            LoadingStateModule,
            EmptyStateModule,
            GlobalSearchComponent,
            GlobalSearchDropdownItemComponent], exports: [GlobalSearchComponent,
            GlobalSearchDropdownItemComponent,
            TooltipModule,
            ThumbnailModule,
            ButtonModule,
            LoadingStateModule,
            EmptyStateModule] });
    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchModule, imports: [TooltipModule,
            ThumbnailModule,
            ButtonModule,
            LoadingStateModule,
            EmptyStateModule,
            GlobalSearchComponent,
            GlobalSearchDropdownItemComponent, TooltipModule,
            ThumbnailModule,
            ButtonModule,
            LoadingStateModule,
            EmptyStateModule] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlobalSearchModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        TooltipModule,
                        ThumbnailModule,
                        ButtonModule,
                        LoadingStateModule,
                        EmptyStateModule,
                        GlobalSearchComponent,
                        GlobalSearchDropdownItemComponent,
                    ],
                    exports: [
                        GlobalSearchComponent,
                        GlobalSearchDropdownItemComponent,
                        TooltipModule,
                        ThumbnailModule,
                        ButtonModule,
                        LoadingStateModule,
                        EmptyStateModule,
                    ],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { GlobalSearchComponent, GlobalSearchDropdownItemComponent, GlobalSearchModule };
//# sourceMappingURL=seniorsistemas-angular-components-global-search.mjs.map
