import { Directive, TemplateRef, EventEmitter, Component, ChangeDetectionStrategy, ChangeDetectorRef, Inject, Optional, Input, Output, ViewChild, ContentChild, Pipe, NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatIconModule } from '@angular/material/icon';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { __awaiter, __classPrivateFieldGet, __classPrivateFieldSet } from 'tslib';
import { ENTER, COMMA } from '@angular/cdk/keycodes';
import { startWith, debounceTime, switchMap, map } from 'rxjs/operators';
import { v4 } from 'uuid';
import hash from 'object-hash';
import { FormControl, Validators, NgForm, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BehaviorSubject, Subscription, combineLatest } from 'rxjs';
import { MatAutocompleteTrigger, MatAutocompleteModule } from '@angular/material/autocomplete';
import { SdFormControl, FORM_CONFIG, SdViewDefDirective, SdLabelDefDirective, SdCommonModule } from '@sd-angular/core/common';
import { MatInputModule } from '@angular/material/input';
import { MatFormFieldModule } from '@angular/material/form-field';
import { SdTranslateModule } from '@sd-angular/core/translate';
import { MatChipsModule } from '@angular/material/chips';

class SdChipDisplayDef {
    constructor(templateRef) {
        this.templateRef = templateRef;
    }
}
SdChipDisplayDef.decorators = [
    { type: Directive, args: [{
                selector: '[sdChipDisplayDef]'
            },] }
];
SdChipDisplayDef.ctorParameters = () => [
    { type: TemplateRef }
];

var _name, _form, _addable, _allItems, _allItem, _cache, _delay, _itemsChanges, _selectedItems, _filteredItems, _subscription, _updateValidator, _loadItems, _loadSelectedItems;
class SdChipErrotStateMatcher {
    constructor(formControl) {
        this.formControl = formControl;
    }
    isErrorState(control, form) {
        var _a, _b, _c;
        const isSubmitted = form && form.submitted;
        return !!(((_a = this.formControl) === null || _a === void 0 ? void 0 : _a.invalid) && (((_b = this.formControl) === null || _b === void 0 ? void 0 : _b.dirty) || ((_c = this.formControl) === null || _c === void 0 ? void 0 : _c.touched) || isSubmitted));
    }
}
class SdChip {
    constructor(ref, formConfig) {
        this.ref = ref;
        this.formConfig = formConfig;
        _name.set(this, v4());
        this.separatorKeysCodes = [ENTER, COMMA];
        this.selectable = true;
        _form.set(this, void 0);
        _addable.set(this, void 0);
        this.removable = true;
        this.disableErrorMessage = false;
        // Server search
        this.loading = false;
        _allItems.set(this, void 0);
        _allItem.set(this, {});
        _cache.set(this, {});
        _delay.set(this, 200); // Sau khoảng thời gian delay nếu không có thay đổi thì thì mới bắt đầu thực hiện gọi hàm
        _itemsChanges.set(this, new BehaviorSubject([]));
        this.limit = 50;
        _selectedItems.set(this, []);
        _filteredItems.set(this, void 0);
        // Validator
        this.required = false;
        this.modelChange = new EventEmitter();
        this.sdChange = new EventEmitter();
        this.sdUpdate = new EventEmitter();
        this.chipSelected = new EventEmitter();
        this.isBluring = false;
        this.isFocused = false;
        this.inputControl = new FormControl();
        this.formControl = new SdFormControl();
        this.matcher = new SdChipErrotStateMatcher(this.formControl);
        _subscription.set(this, new Subscription());
        _updateValidator.set(this, () => {
            this.formControl.clearValidators();
            this.formControl.clearAsyncValidators();
            const validators = [];
            const asyncValidators = [];
            if (this.required) {
                validators.push(Validators.required);
            }
            if (this.min > 0) {
                validators.push(Validators.minLength(this.min));
            }
            if (this.max > 0) {
                validators.push(Validators.maxLength(this.max));
            }
            this.formControl.setValidators(validators);
            this.formControl.setAsyncValidators(asyncValidators);
            this.formControl.updateValueAndValidity();
        });
        _loadItems.set(this, (searchText, items) => __awaiter(this, void 0, void 0, function* () {
            searchText = (searchText === null || searchText === void 0 ? void 0 : searchText.toString()) || '';
            const key = hash({
                checksum: this.cacheChecksum || null,
                searchText
            });
            if (__classPrivateFieldGet(this, _cache)[key] === undefined) {
                this.loading = true;
                const results = yield items(searchText).catch(() => []).finally(() => this.loading = false);
                const objItem = Array.toObject(results, this.valueField);
                __classPrivateFieldSet(this, _allItem, Object.assign(Object.assign({}, __classPrivateFieldGet(this, _allItem)), objItem));
                __classPrivateFieldGet(this, _cache)[key] = results.union(this.valueField);
            }
            // if (!this.multiple) {
            //   return this.#cache[searchText];
            // }
            const selectedItems = yield __classPrivateFieldGet(this, _loadSelectedItems).call(this, this.formControl.value, items);
            // Đưa những selectedItems lên đầu nếu không mat-select-trigger sẽ không work
            return [...selectedItems, ...__classPrivateFieldGet(this, _cache)[key]].union(this.valueField);
        }));
        _loadSelectedItems.set(this, (value, items) => __awaiter(this, void 0, void 0, function* () {
            if (!(value === null || value === void 0 ? void 0 : value.toString())) {
                return [];
            }
            const values = Array.isArray(value) ? value : [value];
            if (!this.valueField && !this.displayField) {
                return values;
            }
            this.loading = true;
            if (values.some(val => __classPrivateFieldGet(this, _allItem)[val] === undefined)) {
                const results = yield items(value, true).catch(() => []).finally(() => this.loading = false);
                const objItem = Array.toObject(results, this.valueField);
                const objValue = Array.toObject(values.map(val => ({ [val === null || val === void 0 ? void 0 : val.toString()]: { [this.valueField]: val, [this.displayField]: val } })), this.valueField);
                __classPrivateFieldSet(this, _allItem, Object.assign(Object.assign(Object.assign({}, objValue), __classPrivateFieldGet(this, _allItem)), objItem));
            }
            return values.map(val => { var _a; return (_a = __classPrivateFieldGet(this, _allItem)[val === null || val === void 0 ? void 0 : val.toString()]) !== null && _a !== void 0 ? _a : { [this.valueField]: val, [this.displayField]: val }; });
        }));
        this.onAdd = (event) => {
            var _a, _b, _c, _d, _e;
            // Add item only when MatAutocomplete is not open
            // To make sure this does not conflict with OptionSelected Event
            // if (!this.matAutocomplete.isOpen) {
            //   const value = (event.value ?? '').toString().trim();
            //   if (value) {
            //     if (this.valueField && this.displayField) {
            //       const item = this.#filteredItems.find(e => e[this.displayField] === value);
            //       if (item) {
            //         const values: (string | number)[] = this.formControl.value ?? [];
            //         values.push(item[this.valueField]);
            //         this.formControl.setValue(values);
            //       } else if (this.#addable) {
            //         const values: (string | number)[] = this.formControl.value ?? [];
            //         values.push(value);
            //         this.formControl.setValue(values);
            //       }
            //     } else {
            //       console.log(value);
            //       console.log(this.#filteredItems);
            //       const item = this.#filteredItems.find(item => item === value);
            //       if (item) {
            //         const values: (string | number)[] = this.formControl.value ?? [];
            //         values.push(item);
            //         this.formControl.setValue(values);
            //       } else if (this.#addable) {
            //         const values: (string | number)[] = this.formControl.value ?? [];
            //         values.push(value);
            //         this.formControl.setValue(values);
            //       }
            //     }
            //   }
            //   this.inputControl.setValue('');
            // }
            const value = ((_a = event.value) !== null && _a !== void 0 ? _a : '').toString().trim();
            if (value) {
                if (this.valueField && this.displayField) {
                    const item = __classPrivateFieldGet(this, _filteredItems).find(e => e[this.displayField] === value);
                    if (item) {
                        const values = (_b = this.formControl.value) !== null && _b !== void 0 ? _b : [];
                        values.push(item[this.valueField]);
                        this.formControl.setValue(values);
                        this.modelChange.emit(this.formControl.value);
                        this.sdChange.emit(this.formControl.value);
                    }
                    else if (__classPrivateFieldGet(this, _addable)) {
                        const values = (_c = this.formControl.value) !== null && _c !== void 0 ? _c : [];
                        values.push(value);
                        this.formControl.setValue(values);
                        this.modelChange.emit(this.formControl.value);
                        this.sdChange.emit(this.formControl.value);
                    }
                }
                else {
                    const item = __classPrivateFieldGet(this, _filteredItems).find(item => item === value);
                    if (item) {
                        const values = (_d = this.formControl.value) !== null && _d !== void 0 ? _d : [];
                        values.push(item);
                        this.formControl.setValue(values);
                        this.modelChange.emit(this.formControl.value);
                        this.sdChange.emit(this.formControl.value);
                    }
                    else if (__classPrivateFieldGet(this, _addable)) {
                        const values = (_e = this.formControl.value) !== null && _e !== void 0 ? _e : [];
                        values.push(value);
                        this.formControl.setValue(values);
                        this.modelChange.emit(this.formControl.value);
                        this.sdChange.emit(this.formControl.value);
                    }
                }
            }
            this.input.nativeElement.value = '';
            this.inputControl.setValue('');
        };
        // andn1 viết để xử lý tạm us B2B1D-18289 ở S69
        this.onAdd2 = (event) => {
            var _a, _b;
            const value = ((_a = event.value) !== null && _a !== void 0 ? _a : '').toString().toLowerCase().trim();
            if (value) {
                const item = __classPrivateFieldGet(this, _filteredItems).find(e => e[this.valueField]
                    && e[this.valueField].toString().toLowerCase().trim() === value);
                if (item) {
                    const values = (_b = this.formControl.value) !== null && _b !== void 0 ? _b : [];
                    if (!values.includes(item[this.valueField])) {
                        values.push(item[this.valueField]);
                    }
                    this.formControl.setValue(values);
                }
            }
            this.inputControl.setValue('');
        };
        this.onClickChip = ($event, item) => {
            $event.stopPropagation();
            $event.stopImmediatePropagation();
            if (!this.formControl.disabled) {
                item.isSelected = !item.isSelected;
                this.focus();
            }
        };
        this.onRemove = (item) => {
            var _a;
            const values = (_a = this.formControl.value) !== null && _a !== void 0 ? _a : [];
            if (typeof (item) === 'string' || typeof (item) === 'number') {
                this.formControl.setValue(values.filter(value => item !== value));
                this.modelChange.emit(this.formControl.value);
                this.sdChange.emit(this.formControl.value);
            }
            else if (this.valueField) {
                this.formControl.setValue(values.filter(value => (item === null || item === void 0 ? void 0 : item[this.valueField]) !== value));
                this.modelChange.emit(this.formControl.value);
                this.sdChange.emit(this.formControl.value);
            }
            this.inputControl.setValue('');
            this.focus();
        };
        this.select = (item) => {
            this.chipSelected.emit(item);
            this.focus();
        };
        // onSelect = (event: MatAutocompleteSelectedEvent) => {
        //   const value = (event.option.value?.[this.valueField] ?? '').toString().trim();
        //   if (value) {
        //     const item = this.#items.find(e => e[this.valueField]
        //       && e[this.valueField].toString().trim() === value);
        //     if (item) {
        //       const values: (string | number)[] = this.formControl.value ?? [];
        //       values.push(item[this.valueField]);
        //       this.formControl.setValue(values);
        //       this.input.nativeElement.value = '';
        //       this.inputControl.setValue('');
        //       setTimeout(() => {
        //         this.autocompleteTrigger?.openPanel();
        //       }, 0);
        //     }
        //   }
        // }
        this.onSelect = (event) => {
            var _a;
            const item = event.option.value;
            const values = (_a = this.formControl.value) !== null && _a !== void 0 ? _a : [];
            if (item) {
                if (typeof (item) === 'string' || typeof (item) === 'number') {
                    if (!values.includes(item)) {
                        values.push(item);
                        this.formControl.setValue(values);
                        this.modelChange.emit(this.formControl.value);
                        this.sdChange.emit(this.formControl.value);
                        setTimeout(() => {
                            var _a;
                            (_a = this.autocompleteTrigger) === null || _a === void 0 ? void 0 : _a.openPanel();
                        }, 0);
                    }
                }
                else if (this.valueField) {
                    const val = (item === null || item === void 0 ? void 0 : item[this.valueField]) || null;
                    if (!values.includes(val)) {
                        values.push(val);
                        this.formControl.setValue(values);
                        this.modelChange.emit(this.formControl.value);
                        this.sdChange.emit(this.formControl.value);
                        setTimeout(() => {
                            var _a;
                            (_a = this.autocompleteTrigger) === null || _a === void 0 ? void 0 : _a.openPanel();
                        }, 0);
                    }
                }
                this.input.nativeElement.value = '';
                this.inputControl.setValue('', {
                    emitEvent: false
                });
            }
        };
        // displayFn = (value: string | { [key: string]: string }): string | undefined => {
        //   if (typeof value === 'string') {
        //     if (!this.#items) {
        //       return undefined;
        //     }
        //     const selectedItem = this.#items.find(item => item[this.valueField] === value);
        //     if (selectedItem) {
        //       return selectedItem[this.displayField];
        //     }
        //     if (this.#items.some(item => item[this.displayField].toLowerCase().indexOf(value.toLowerCase()) !== -1)) {
        //       return value;
        //     } else {
        //       return undefined;
        //     }
        //   } else {
        //     return value ? value[this.displayField] : undefined;
        //   }
        // }
        this.onFocus = () => {
            this.isFocused = true;
            this.isBluring = false;
            this.inputControl.setValue('');
            // this.inputControl.updateValueAndValidity();
        };
        this.onBlur = () => {
            this.isBluring = true;
            setTimeout(() => {
                if (this.isBluring) {
                    this.isFocused = false;
                    this.inputControl.setValue('', {
                        emitEvent: false
                    });
                }
            }, 100);
        };
        this.onClick = () => {
            var _a;
            if ((_a = this.sdView) === null || _a === void 0 ? void 0 : _a.templateRef) {
                if (!this.formControl.disabled && !this.isFocused) {
                    this.focus();
                }
            }
        };
        this.focus = () => {
            this.isFocused = true;
            this.isBluring = false;
            setTimeout(() => {
                var _a, _b, _c;
                (_a = this.autocompleteTrigger) === null || _a === void 0 ? void 0 : _a.openPanel();
                (_c = (_b = this.input) === null || _b === void 0 ? void 0 : _b.nativeElement) === null || _c === void 0 ? void 0 : _c.focus();
            }, 100);
        };
        this.onClear = ($event) => {
            var _a;
            $event === null || $event === void 0 ? void 0 : $event.stopPropagation();
            this.inputControl.setValue('');
            this.formControl.setValue([]);
            this.modelChange.emit(this.formControl.value);
            this.sdChange.emit(this.formControl.value);
            (_a = this.autocompleteTrigger) === null || _a === void 0 ? void 0 : _a.openPanel();
            this.ref.detectChanges();
        };
        this.getSelectedItems = () => __classPrivateFieldGet(this, _selectedItems);
    }
    set name(val) {
        if (val) {
            __classPrivateFieldSet(this, _name, val);
        }
    }
    set form(val) {
        if (val) {
            if (val instanceof NgForm) {
                __classPrivateFieldSet(this, _form, val.form);
            }
            else {
                __classPrivateFieldSet(this, _form, val);
            }
        }
    }
    set addable(val) {
        __classPrivateFieldSet(this, _addable, (val === '') || val);
    }
    set _removable(val) {
        this.removable = (val === '') || val;
    }
    set _disableErrorMessage(val) {
        this.disableErrorMessage = (val === '') || val;
    }
    set items(items) {
        __classPrivateFieldSet(this, _delay, 0);
        if (!items) {
            __classPrivateFieldGet(this, _itemsChanges).next([]);
        }
        else if (Array.isArray(items)) {
            __classPrivateFieldGet(this, _itemsChanges).next(items.filter(e => e !== null && e !== undefined));
        }
        else {
            __classPrivateFieldSet(this, _delay, 500);
            __classPrivateFieldGet(this, _itemsChanges).next(items);
        }
        this.formControl.updateValueAndValidity();
    }
    // model
    set model(values) {
        if (!Array.isArray(values)) {
            values = [];
        }
        this.formControl.setValue(values);
    }
    set _required(val) {
        this.required = (val === '') || val;
        __classPrivateFieldGet(this, _updateValidator).call(this);
    }
    set pMin(val) {
        this.min = +val || 0;
        __classPrivateFieldGet(this, _updateValidator).call(this);
    }
    set pMax(val) {
        this.max = +val || 0;
        __classPrivateFieldGet(this, _updateValidator).call(this);
    }
    // Optional
    set disabled(val) {
        val = (val === '') || val;
        if (val) {
            this.formControl.disable();
            this.inputControl.disable();
        }
        else {
            this.formControl.enable();
            this.inputControl.enable();
        }
    }
    ngOnInit() {
        var _a;
        this.appearance = this.appearance || ((_a = this.formConfig) === null || _a === void 0 ? void 0 : _a.appearance);
    }
    ngAfterViewInit() {
        var _a;
        __classPrivateFieldGet(this, _subscription).add(this.formControl.sdChanges.subscribe(() => {
            this.ref.markForCheck();
        }));
        __classPrivateFieldSet(this, _allItems, combineLatest([
            __classPrivateFieldGet(this, _itemsChanges).asObservable(),
            this.inputControl.valueChanges.pipe(startWith(''), debounceTime(__classPrivateFieldGet(this, _delay))),
            this.formControl.valueChanges.pipe(startWith(this.formControl.value))
        ]).pipe(switchMap(([items]) => __awaiter(this, void 0, void 0, function* () {
            const val = this.inputControl.value;
            const values = this.formControl.value || [];
            if (typeof (items) === 'function') {
                return yield __classPrivateFieldGet(this, _loadItems).call(this, val, items);
            }
            __classPrivateFieldSet(this, _allItem, items.toObject(this.valueField));
            const hasFields = !!this.valueField && !!this.displayField;
            __classPrivateFieldSet(this, _filteredItems, items.filter(item => {
                const value = hasFields ? item[this.valueField] : item;
                const display = hasFields ? item[this.displayField] : item;
                if (String.aliasIncludes(value, val) || String.aliasIncludes(display, val)) {
                    return true;
                }
                return values.some(e => e === value);
            }));
            return __classPrivateFieldGet(this, _filteredItems);
        }))));
        this.selectedItems = combineLatest([
            __classPrivateFieldGet(this, _itemsChanges).asObservable(),
            this.formControl.valueChanges.pipe(startWith(this.formControl.value))
        ])
            .pipe(switchMap(([items, val]) => __awaiter(this, void 0, void 0, function* () {
            var _b;
            // Vì một số lý do chưa xác định mà khi sử dụng sdViewDef thì khi chuyển sang dạng view sẽ trigger val = null
            // Nhưng formControl.value vẫn có giá trị đúng nên thực hiện gán val = this.formControl.value;
            val = this.formControl.value;
            if (!this.valueField) {
                __classPrivateFieldSet(this, _selectedItems, this.formControl.value);
                return __classPrivateFieldGet(this, _selectedItems);
            }
            if (typeof (items) === 'function') {
                __classPrivateFieldSet(this, _selectedItems, yield __classPrivateFieldGet(this, _loadSelectedItems).call(this, val, items));
                return __classPrivateFieldGet(this, _selectedItems);
            }
            __classPrivateFieldSet(this, _selectedItems, (_b = (this.formControl.value || [])) === null || _b === void 0 ? void 0 : _b.map(value => {
                return (items === null || items === void 0 ? void 0 : items.find(item => item[this.valueField] === value)) || {
                    [this.valueField]: value,
                    [this.displayField]: value
                };
            }));
            return __classPrivateFieldGet(this, _selectedItems);
        })));
        this.filteredItems = __classPrivateFieldGet(this, _allItems).pipe(map(allItems => allItems.filter(item => {
            const values = this.formControl.value || [];
            if (this.valueField) {
                return !values.includes(item === null || item === void 0 ? void 0 : item[this.valueField]);
            }
            return !values.includes(item);
        }).paging(this.limit)));
        // this.display = this.selectedItems.pipe(
        //   map(selectedItems => selectedItems?.map(item => this.displayField ? item[this.displayField] : item)?.join(', ')));
        // this.#subscription.add(this.formControl.valueChanges.subscribe(() => {
        //   const values: (string | number)[] = this.formControl.value || [];
        //   this.selectedItems = this.#items.filter(item => values.findIndex(value => value === item?.[this.valueField]) !== -1);
        //   this.modelChange.emit(values);
        //   this.sdChange.emit(values);
        //   setTimeout(() => {
        //     this.#form?.markAsDirty();
        //   }, 0);
        // }));
        // this.#subscription.add(this.#itemChanges.pipe(startWith(this.#items)).subscribe(() => {
        //   const values: (string | number)[] = this.formControl.value || [];
        //   this.selectedItems = [];
        //   for (const value of values) {
        //     const item = this.#items.find(e => e?.[this.valueField] === value) || {};
        //     this.selectedItems.push({
        //       ...item,
        //       [this.valueField]: value
        //     });
        //   }
        // }));
        (_a = __classPrivateFieldGet(this, _form)) === null || _a === void 0 ? void 0 : _a.addControl(__classPrivateFieldGet(this, _name), this.formControl);
    }
    ngOnDestroy() {
        var _a;
        (_a = __classPrivateFieldGet(this, _form)) === null || _a === void 0 ? void 0 : _a.removeControl(__classPrivateFieldGet(this, _name));
        __classPrivateFieldGet(this, _subscription).unsubscribe();
    }
}
_name = new WeakMap(), _form = new WeakMap(), _addable = new WeakMap(), _allItems = new WeakMap(), _allItem = new WeakMap(), _cache = new WeakMap(), _delay = new WeakMap(), _itemsChanges = new WeakMap(), _selectedItems = new WeakMap(), _filteredItems = new WeakMap(), _subscription = new WeakMap(), _updateValidator = new WeakMap(), _loadItems = new WeakMap(), _loadSelectedItems = new WeakMap();
SdChip.decorators = [
    { type: Component, args: [{
                selector: 'sd-chip',
                template: "<ng-container *ngIf=\"!appearance && sdLabelDef?.templateRef\">\r\n  <ng-container *ngTemplateOutlet=\"sdLabelDef.templateRef\">\r\n  </ng-container>\r\n</ng-container>\r\n<label *ngIf=\"!appearance && label && !sdLabelDef?.templateRef\" class=\"d-block mb-0 T14M\">{{label}} <span class=\"text-danger mb-2\"\r\n    *ngIf=\"required\">*</span></label>\r\n<div class=\"d-flex align-items-center\" [class.sd-view]=\"sdView?.templateRef\" [class.c-focused]=\"isFocused\"\r\n  [class.c-disabled]=\"formControl.disabled\" (click)=\"onClick()\">\r\n  <ng-container *ngIf=\"sdView?.templateRef && !autocompleteTrigger?.panelOpen && !isFocused; else default\">\r\n    <ng-container *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value}\">\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #default>\r\n    <mat-form-field class=\"c-md\" [ngClass]=\"{'c-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\"\r\n      [appearance]=\"appearance || 'outline'\">\r\n      <mat-label *ngIf=\"appearance && label\">{{ label }}</mat-label>\r\n      <mat-chip-list [formControl]=\"formControl\" #chipList>\r\n        <ng-container *ngFor=\"let item of selectedItems | async\">\r\n          <mat-chip *ngIf=\"item\" [selectable]=\"selectable\" [removable]=\"removable\" (removed)=\"onRemove(item)\"\r\n            [selected]=\"item.isSelected\" (selectionChange)=\"select(item)\" [disabled]=\"inputControl.disabled\"\r\n            (click)=\"onClickChip($event, item)\">\r\n            <span>{{item[displayField] || item[valueField] || item}}</span>\r\n            <mat-icon *ngIf=\"!inputControl.disabled && item | sdRemovableChip:removable\" matChipRemove>cancel</mat-icon>\r\n          </mat-chip>\r\n        </ng-container>\r\n        <input #autocompleteTrigger [formControl]=\"inputControl\" [placeholder]=\"placeholder || (appearance ? label : '')\"\r\n          [matAutocomplete]=\"auto\" [matChipInputFor]=\"chipList\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\r\n          (matChipInputTokenEnd)=\"onAdd($event)\" autocomplete=\"off\" [errorStateMatcher]=\"matcher\" (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\" [required]=\"required\" matInput #input>\r\n      </mat-chip-list>\r\n      <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelect($event)\">\r\n        <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"displayField ? item[displayField] : item\">\r\n          <ng-container *ngIf=\"sdChipDisplay?.templateRef\">\r\n            <ng-container *ngTemplateOutlet=\"sdChipDisplay.templateRef;context:{item: item}\">\r\n            </ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"!sdChipDisplay?.templateRef\">\r\n            {{ displayField ? item[displayField] : item }}\r\n          </ng-container>\r\n        </mat-option>\r\n      </mat-autocomplete>\r\n      <mat-error *ngIf=\"formControl?.errors?.required\">\r\n        <ng-container *ngIf=\"!disableErrorMessage\">{{ \"This field is required\" | sdTranslate }}</ng-container>\r\n      </mat-error>\r\n      <mat-error *ngIf=\" formControl.errors?.minLength\">\r\n        <ng-container *ngIf=\"!disableErrorMessage\">{{'Min length' | sdTranslate}} {{min}}\r\n        </ng-container>\r\n      </mat-error>\r\n      <mat-error *ngIf=\" formControl.errors?.maxLength\">\r\n        <ng-container *ngIf=\"!disableErrorMessage\">{{'Max length' | sdTranslate}} {{max}}\r\n        </ng-container>\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </ng-template>\r\n</div>",
                changeDetection: ChangeDetectionStrategy.OnPush,
                styles: [":host{display:block;padding-top:5px}:host ::ng-deep .mat-form-field.no-padding-wrapper .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep mat-form-field.c-md .mat-form-field-infix{min-height:43.5px;padding:2px 0}:host ::ng-deep mat-form-field.c-md .mat-standard-chip{min-height:26px;padding:7px 10px}:host ::ng-deep mat-form-field.c-md .mat-standard-chip.mat-chip-with-trailing-icon{padding:7px 7px 7px 10px}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}"]
            },] }
];
SdChip.ctorParameters = () => [
    { type: ChangeDetectorRef },
    { type: undefined, decorators: [{ type: Inject, args: [FORM_CONFIG,] }, { type: Optional }] }
];
SdChip.propDecorators = {
    name: [{ type: Input }],
    appearance: [{ type: Input }],
    size: [{ type: Input }],
    form: [{ type: Input }],
    addable: [{ type: Input }],
    label: [{ type: Input }],
    valueField: [{ type: Input }],
    displayField: [{ type: Input }],
    placeholder: [{ type: Input }],
    _removable: [{ type: Input, args: ['removable',] }],
    _disableErrorMessage: [{ type: Input, args: ['disableErrorMessage',] }],
    items: [{ type: Input }],
    limit: [{ type: Input }],
    cacheChecksum: [{ type: Input }],
    model: [{ type: Input }],
    _required: [{ type: Input, args: ['required',] }],
    pMin: [{ type: Input, args: ['min',] }],
    pMax: [{ type: Input, args: ['max',] }],
    modelChange: [{ type: Output }],
    disabled: [{ type: Input }],
    sdChange: [{ type: Output }],
    sdUpdate: [{ type: Output }],
    chipSelected: [{ type: Output }],
    input: [{ type: ViewChild, args: ['input',] }],
    matAutocomplete: [{ type: ViewChild, args: ['auto',] }],
    chipList: [{ type: ViewChild, args: ['chipList', { static: true },] }],
    autocompleteTrigger: [{ type: ViewChild, args: [MatAutocompleteTrigger, { read: MatAutocompleteTrigger },] }],
    sdView: [{ type: ContentChild, args: [SdViewDefDirective,] }],
    sdChipDisplay: [{ type: ContentChild, args: [SdChipDisplayDef,] }],
    sdLabelDef: [{ type: ContentChild, args: [SdLabelDefDirective,] }]
};

class SdRemovableChipPipe {
    constructor() { }
    transform(item, removable) {
        if (typeof (removable) === 'boolean') {
            return removable;
        }
        return removable(item);
    }
}
SdRemovableChipPipe.decorators = [
    { type: Pipe, args: [{
                name: 'sdRemovableChip'
            },] }
];
SdRemovableChipPipe.ctorParameters = () => [];

class SdChipModule {
}
SdChipModule.decorators = [
    { type: NgModule, args: [{
                imports: [
                    CommonModule,
                    FormsModule,
                    ReactiveFormsModule,
                    MatInputModule,
                    MatTooltipModule,
                    MatFormFieldModule,
                    MatAutocompleteModule,
                    MatIconModule,
                    MatProgressSpinnerModule,
                    MatChipsModule,
                    SdTranslateModule,
                    SdCommonModule
                ],
                declarations: [
                    SdChip,
                    SdChipDisplayDef,
                    SdRemovableChipPipe
                ],
                exports: [
                    SdCommonModule,
                    SdChip,
                    SdChipDisplayDef,
                ]
            },] }
];

/*
 * Public API Surface of superdev-angular-core
 */

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

export { SdChip, SdChipDisplayDef, SdChipModule, SdRemovableChipPipe as ɵa };
//# sourceMappingURL=sd-angular-core-chip.js.map
