import { ChangeDetectorRef, Component, Inject, Input, Optional } from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
import { CategoryLabelPipe, LANGUAGE_OVERRIDE, METADATA, TranslateService } from '@aztrix/helpers';
import { BehaviorSubject, map, startWith } from 'rxjs';
import * as i0 from "@angular/core";
import * as i1 from "@aztrix/helpers";
import * as i2 from "@angular/common";
import * as i3 from "@angular/material/form-field";
import * as i4 from "@angular/material/select";
import * as i5 from "@angular/material/core";
import * as i6 from "@aztrix/icons";
import * as i7 from "ngx-mat-select-search";
import * as i8 from "@angular/forms";
import * as i9 from "@aztrix/components/clear-button";
import * as i10 from "rxjs";
export class CategorySelectSearchComponent {
    constructor(_translate, _changeDetector, _languageOverride$) {
        this._translate = _translate;
        this._changeDetector = _changeDetector;
        this._languageOverride$ = _languageOverride$;
        this.form = new UntypedFormControl();
        this.forProperty = false;
        this.required = false;
        this.readonly = false;
        this.subscriptSizing = 'dynamic';
        this.formFilterControl = new UntypedFormControl('');
        this._categoryPipe = new CategoryLabelPipe(this._translate, this._changeDetector, this._languageOverride$);
        this._categories = ['ALL'].concat(METADATA.categories);
        this.categoryResults$ = this.formFilterControl.valueChanges.pipe(startWith(this.formFilterControl.value.toLowerCase()), map((query) => this._categories.filter((category) => this._categoryPipe.transform(category).toLowerCase().includes(query.toLowerCase()))));
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CategorySelectSearchComponent, deps: [{ token: i1.TranslateService }, { token: i0.ChangeDetectorRef }, { token: LANGUAGE_OVERRIDE, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CategorySelectSearchComponent, selector: "ax-category-select-search", inputs: { form: "form", forProperty: "forProperty", hint: "hint", label: "label", required: "required", readonly: "readonly", subscriptSizing: "subscriptSizing" }, ngImport: i0, template: "<mat-form-field\n  [appearance]=\"forProperty ? 'outline' : 'fill'\"\n  [ngClass]=\"{'c-input': forProperty, readonly: readonly}\"\n  style=\"width: 100%\"\n  [subscriptSizing]=\"subscriptSizing\"\n>\n  <mat-label *ngIf=\"forProperty\">\n    <span *ngIf=\"label\">{{ label }}<span *ngIf=\"required\">*</span></span>\n  </mat-label>\n  <mat-select\n    disableOptionCentering\n    [placeholder]=\"'label.category' | translate\"\n    [formControl]=\"form\"\n  >\n    <mat-option>\n      <ngx-mat-select-search\n        [formControl]=\"formFilterControl\"\n        [placeholderLabel]=\"'label.search' | translate\"\n        [noEntriesFoundLabel]=\"'search.results.absence' | translate\"\n        class=\"select-search\"\n      >\n        <ax-icon class=\"icon\" name=\"close\" ngxMatSelectSearchClear></ax-icon>\n      </ngx-mat-select-search>\n    </mat-option>\n    <mat-option\n      *ngFor=\"let category of categoryResults$ | async\"\n      [value]=\"category === 'ALL' ? undefined : category\"\n    >\n      <div class=\"option-wrapper\">\n        <ax-icon class=\"icon\" [name]=\"category | categoryIcon\"></ax-icon>\n        <span>{{ category | categoryLabel }}</span>\n      </div>\n    </mat-option>\n  </mat-select>\n  <mat-hint *ngIf=\"hint\" class=\"hint\" align=\"end\">\n    <span>{{ hint }}</span>\n  </mat-hint>\n  <mat-error>\n    <ax-icon name=\"alert-circle\"></ax-icon>\n    {{\n      'property.validation.required'\n        | translate: {propertyType: 'property.CATEGORY.label' | translate}\n    }}\n  </mat-error>\n  <ax-clear-button\n    *ngIf=\"forProperty && form.value && !readonly\"\n    [form]=\"form\"\n    matSuffix\n  ></ax-clear-button>\n</mat-form-field>\n", styles: [":host{width:100%}::ng-deep .mat-mdc-select-panel-wrap .mat-mdc-select-panel{max-width:180px}.icon{width:1rem;height:1rem}.option-wrapper{display:flex;align-items:center;width:100%;gap:.5rem}.option-wrapper .icon{vertical-align:middle}.option-wrapper span{max-width:100%;white-space:normal;line-height:1.2}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i6.IconComponent, selector: "ax-icon", inputs: ["name", "inline"] }, { kind: "component", type: i7.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "directive", type: i7.MatSelectSearchClearDirective, selector: "[ngxMatSelectSearchClear]" }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i9.ClearButtonComponent, selector: "ax-clear-button", inputs: ["form"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.CategoryIconPipe, name: "categoryIcon" }, { kind: "pipe", type: i1.CategoryLabelPipe, name: "categoryLabel" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CategorySelectSearchComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ax-category-select-search', template: "<mat-form-field\n  [appearance]=\"forProperty ? 'outline' : 'fill'\"\n  [ngClass]=\"{'c-input': forProperty, readonly: readonly}\"\n  style=\"width: 100%\"\n  [subscriptSizing]=\"subscriptSizing\"\n>\n  <mat-label *ngIf=\"forProperty\">\n    <span *ngIf=\"label\">{{ label }}<span *ngIf=\"required\">*</span></span>\n  </mat-label>\n  <mat-select\n    disableOptionCentering\n    [placeholder]=\"'label.category' | translate\"\n    [formControl]=\"form\"\n  >\n    <mat-option>\n      <ngx-mat-select-search\n        [formControl]=\"formFilterControl\"\n        [placeholderLabel]=\"'label.search' | translate\"\n        [noEntriesFoundLabel]=\"'search.results.absence' | translate\"\n        class=\"select-search\"\n      >\n        <ax-icon class=\"icon\" name=\"close\" ngxMatSelectSearchClear></ax-icon>\n      </ngx-mat-select-search>\n    </mat-option>\n    <mat-option\n      *ngFor=\"let category of categoryResults$ | async\"\n      [value]=\"category === 'ALL' ? undefined : category\"\n    >\n      <div class=\"option-wrapper\">\n        <ax-icon class=\"icon\" [name]=\"category | categoryIcon\"></ax-icon>\n        <span>{{ category | categoryLabel }}</span>\n      </div>\n    </mat-option>\n  </mat-select>\n  <mat-hint *ngIf=\"hint\" class=\"hint\" align=\"end\">\n    <span>{{ hint }}</span>\n  </mat-hint>\n  <mat-error>\n    <ax-icon name=\"alert-circle\"></ax-icon>\n    {{\n      'property.validation.required'\n        | translate: {propertyType: 'property.CATEGORY.label' | translate}\n    }}\n  </mat-error>\n  <ax-clear-button\n    *ngIf=\"forProperty && form.value && !readonly\"\n    [form]=\"form\"\n    matSuffix\n  ></ax-clear-button>\n</mat-form-field>\n", styles: [":host{width:100%}::ng-deep .mat-mdc-select-panel-wrap .mat-mdc-select-panel{max-width:180px}.icon{width:1rem;height:1rem}.option-wrapper{display:flex;align-items:center;width:100%;gap:.5rem}.option-wrapper .icon{vertical-align:middle}.option-wrapper span{max-width:100%;white-space:normal;line-height:1.2}\n"] }]
        }], ctorParameters: () => [{ type: i1.TranslateService }, { type: i0.ChangeDetectorRef }, { type: i10.BehaviorSubject, decorators: [{
                    type: Optional
                }, {
                    type: Inject,
                    args: [LANGUAGE_OVERRIDE]
                }] }], propDecorators: { form: [{
                type: Input
            }], forProperty: [{
                type: Input
            }], hint: [{
                type: Input
            }], label: [{
                type: Input
            }], required: [{
                type: Input
            }], readonly: [{
                type: Input
            }], subscriptSizing: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 