import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import * as i0 from "@angular/core";
import * as i1 from "../../../data/providers/data.service";
import * as i2 from "@clr/angular";
import * as i3 from "@angular/common";
import * as i4 from "@angular/forms";
import * as i5 from "@ng-select/ng-select";
import * as i6 from "../chip/chip.component";
export class TagSelectorComponent {
    constructor(dataService) {
        this.dataService = dataService;
    }
    ngOnInit() {
        this.allTags$ = this.dataService.product
            .getTagList()
            .mapStream(data => data.tags.items.map(i => i.value));
    }
    addTagFn(val) {
        return val;
    }
    registerOnChange(fn) {
        this.onChange = fn;
    }
    registerOnTouched(fn) {
        this.onTouch = fn;
    }
    setDisabledState(isDisabled) {
        this.disabled = isDisabled;
    }
    writeValue(obj) {
        if (Array.isArray(obj)) {
            this._value = obj;
        }
    }
    valueChanged(event) {
        this.onChange(event);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: TagSelectorComponent, deps: [{ token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: TagSelectorComponent, selector: "vdr-tag-selector", inputs: { placeholder: "placeholder" }, providers: [
            {
                provide: NG_VALUE_ACCESSOR,
                useExisting: TagSelectorComponent,
                multi: true,
            },
        ], ngImport: i0, template: "<ng-select\n    [addTag]=\"addTagFn\"\n    [multiple]=\"true\"\n    [ngModel]=\"_value\"\n    [clearable]=\"true\"\n    [searchable]=\"true\"\n    [disabled]=\"disabled\"\n    [placeholder]=\"placeholder\"\n    (change)=\"valueChanged($event)\"\n>\n    <ng-template ng-label-tmp let-tag=\"item\" let-clear=\"clear\">\n        <vdr-chip [colorFrom]=\"tag\" icon=\"close\" (iconClick)=\"clear(tag)\"><clr-icon shape=\"tag\" class=\"mr2\"></clr-icon> {{ tag }}</vdr-chip>\n    </ng-template>\n    <ng-option *ngFor=\"let tag of allTags$ | async\" [value]=\"tag\">\n        <vdr-chip [colorFrom]=\"tag\"><clr-icon shape=\"tag\" class=\"mr2\"></clr-icon> {{ tag }}</vdr-chip>\n    </ng-option>\n</ng-select>\n", styles: [":host{display:block;margin-top:12px;position:relative}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i5.NgOptionComponent, selector: "ng-option", inputs: ["value", "disabled"] }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "component", type: i6.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: TagSelectorComponent, decorators: [{
            type: Component,
            args: [{ selector: 'vdr-tag-selector', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: TagSelectorComponent,
                            multi: true,
                        },
                    ], template: "<ng-select\n    [addTag]=\"addTagFn\"\n    [multiple]=\"true\"\n    [ngModel]=\"_value\"\n    [clearable]=\"true\"\n    [searchable]=\"true\"\n    [disabled]=\"disabled\"\n    [placeholder]=\"placeholder\"\n    (change)=\"valueChanged($event)\"\n>\n    <ng-template ng-label-tmp let-tag=\"item\" let-clear=\"clear\">\n        <vdr-chip [colorFrom]=\"tag\" icon=\"close\" (iconClick)=\"clear(tag)\"><clr-icon shape=\"tag\" class=\"mr2\"></clr-icon> {{ tag }}</vdr-chip>\n    </ng-template>\n    <ng-option *ngFor=\"let tag of allTags$ | async\" [value]=\"tag\">\n        <vdr-chip [colorFrom]=\"tag\"><clr-icon shape=\"tag\" class=\"mr2\"></clr-icon> {{ tag }}</vdr-chip>\n    </ng-option>\n</ng-select>\n", styles: [":host{display:block;margin-top:12px;position:relative}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.DataService }]; }, propDecorators: { placeholder: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 