@firestitch/chip 8.1.9 → 12.0.0

package/fesm2015/firestitch-chip.js

@@ -1,5 +1,8 @@
-import { Injectable, Component, forwardRef, ChangeDetectionStrategy, ChangeDetectorRef, HostBinding, Input, EventEmitter, Optional, HostListener, Output, NgModule } from '@angular/core';
+import * as i0 from '@angular/core';
+import { Injectable, forwardRef, Component, ChangeDetectionStrategy, HostBinding, Input, EventEmitter, Optional, HostListener, Output, NgModule } from '@angular/core';
+import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
+import * as i2 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
 import { FsLabelModule } from '@firestitch/label';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
@@ -7,703 +10,436 @@ import { Subject } from 'rxjs';
 import { takeUntil, debounceTime } from 'rxjs/operators';
 import { find } from 'lodash-es';
 
-/**
- * @fileoverview added by tsickle
- * Generated from: app/services/chips.service.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-class FsChipsService {
-    constructor() {
-        this.chips = [];
-        this._chipItemsChanged$ = new Subject();
-        this._selectionChanged$ = new Subject();
-        this._destroy$ = new Subject();
-    }
-    /**
-     * @return {?}
-     */
-    get selectionChanged$() {
-        return this._selectionChanged$.
-            pipe(takeUntil(this._destroy$));
-    }
-    /**
-     * @return {?}
-     */
-    get chipItemsChanged$() {
-        return this._chipItemsChanged$
-            .pipe(takeUntil(this._destroy$), debounceTime(50));
-    }
-    /**
-     * @return {?}
-     */
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    /**
-     * @param {?} selected
-     * @param {?} value
-     * @return {?}
-     */
-    selectionChanged(selected, value) {
-        this._selectionChanged$.next({
-            selected: selected,
-            value: value,
-        });
-    }
-    /**
-     * @param {?} chip
-     * @return {?}
-     */
-    register(chip) {
-        this.chips.push(chip);
-        this._chipItemsChanged$.next();
-    }
-    /**
-     * @param {?} chip
-     * @return {?}
-     */
-    destroy(chip) {
-        /** @type {?} */
-        const index = this.chips.indexOf(chip);
-        if (index > -1) {
-            this.chips.splice(index, 1);
-            this._chipItemsChanged$.next();
-        }
-    }
-}
-FsChipsService.decorators = [
-    { type: Injectable }
-];
-/** @nocollapse */
-FsChipsService.ctorParameters = () => [];
-if (false) {
-    /** @type {?} */
-    FsChipsService.prototype.chips;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipsService.prototype._chipItemsChanged$;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipsService.prototype._selectionChanged$;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipsService.prototype._destroy$;
+class FsChipsService {
+    constructor() {
+        this.chips = [];
+        this._chipItemsChanged$ = new Subject();
+        this._selectionChanged$ = new Subject();
+        this._destroy$ = new Subject();
+    }
+    get selectionChanged$() {
+        return this._selectionChanged$.
+            pipe(takeUntil(this._destroy$));
+    }
+    get chipItemsChanged$() {
+        return this._chipItemsChanged$
+            .pipe(takeUntil(this._destroy$), debounceTime(50));
+    }
+    ngOnDestroy() {
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    selectionChanged(selected, value) {
+        this._selectionChanged$.next({
+            selected: selected,
+            value: value,
+        });
+    }
+    register(chip) {
+        this.chips.push(chip);
+        this._chipItemsChanged$.next();
+    }
+    destroy(chip) {
+        const index = this.chips.indexOf(chip);
+        if (index > -1) {
+            this.chips.splice(index, 1);
+            this._chipItemsChanged$.next();
+        }
+    }
 }
+FsChipsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FsChipsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipsService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipsService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return []; } });
 
-/**
- * @fileoverview added by tsickle
- * Generated from: app/components/chips/chips.component.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-class FsChipsComponent {
-    /**
-     * @param {?} _cdRef
-     * @param {?} _chipsService
-     */
-    constructor(_cdRef, _chipsService) {
-        this._cdRef = _cdRef;
-        this._chipsService = _chipsService;
-        this.classFsChips = true;
-        this.classHasChips = false;
-        this.multiple = true;
-        this.onChange = (/**
-         * @return {?}
-         */
-        () => { });
-        this.onTouch = (/**
-         * @return {?}
-         */
-        () => { });
-        this._value = [];
-        this._destroy$ = new Subject();
-        this.subscribeToItemsChange();
-        this.subscribeToSelectionChange();
-    }
-    /**
-     * @return {?}
-     */
-    get chips() {
-        return this._chipsService.chips;
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set value(value) {
-        if (this._value !== value) {
-            this._value = value;
-            this.onChange(this._value);
-            this.onTouch(this._value);
-        }
-    }
-    /**
-     * @return {?}
-     */
-    get value() {
-        return this._value;
-    }
-    /**
-     * @return {?}
-     */
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    writeValue(value) {
-        if (value !== this.value) {
-            this._value = value;
-        }
-        this.updateChips();
-    }
-    /**
-     * @param {?} fn
-     * @return {?}
-     */
-    registerOnChange(fn) { this.onChange = fn; }
-    /**
-     * @param {?} fn
-     * @return {?}
-     */
-    registerOnTouched(fn) { this.onTouch = fn; }
-    /**
-     * Update ngModel value when selection changed
-     * @private
-     * @return {?}
-     */
-    subscribeToSelectionChange() {
-        this._chipsService.selectionChanged$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe((/**
-         * @param {?} __0
-         * @return {?}
-         */
-        ({ selected, value }) => {
-            if (!selected) {
-                /** @type {?} */
-                const valueIndex = this.value.findIndex((/**
-                 * @param {?} item
-                 * @return {?}
-                 */
-                (item) => {
-                    return this.compareFn(item, value);
-                }));
-                if (valueIndex > -1) {
-                    this.value.splice(valueIndex, 1);
-                    this.onChange(this._value);
-                    this.onTouch(this._value);
-                }
-            }
-            else {
-                this.value.push(value);
-                this.onChange(this._value);
-                this.onTouch(this._value);
-            }
-        }));
-    }
-    /**
-     * Update selection if item was added or removed
-     * @private
-     * @return {?}
-     */
-    subscribeToItemsChange() {
-        this._chipsService.chipItemsChanged$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe((/**
-         * @return {?}
-         */
-        () => {
-            this.classHasChips = !!this._chipsService.chips.length;
-            this.updateChips();
-        }));
-    }
-    /**
-     * @private
-     * @param {?} o1
-     * @param {?} o2
-     * @return {?}
-     */
-    compareFn(o1, o2) {
-        if (this.compare) {
-            return this.compare(o1, o2);
-        }
-        return o1 === o2;
-    }
-    /**
-     * @private
-     * @return {?}
-     */
-    updateChips() {
-        if (this.multiple && Array.isArray(this.value) && this.chips) {
-            this.chips.forEach((/**
-             * @param {?} chip
-             * @return {?}
-             */
-            (chip) => {
-                chip.selected = find(this.value, (/**
-                 * @param {?} o
-                 * @return {?}
-                 */
-                (o) => {
-                    return this.compareFn(o, chip.value);
-                })) !== undefined;
-            }));
-        }
-        this._cdRef.markForCheck();
-    }
-}
-FsChipsComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'fs-chips',
-                template: "<ng-content></ng-content>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        useExisting: forwardRef((/**
-                         * @return {?}
-                         */
-                        () => FsChipsComponent)),
-                        multi: true,
-                    },
-                    FsChipsService,
-                ],
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            }] }
-];
-/** @nocollapse */
-FsChipsComponent.ctorParameters = () => [
-    { type: ChangeDetectorRef },
-    { type: FsChipsService }
-];
-FsChipsComponent.propDecorators = {
-    classFsChips: [{ type: HostBinding, args: ['class.fs-chips',] }],
-    classHasChips: [{ type: HostBinding, args: ['class.has-chips',] }],
-    compare: [{ type: Input }],
-    multiple: [{ type: Input }]
-};
-if (false) {
-    /** @type {?} */
-    FsChipsComponent.prototype.classFsChips;
-    /** @type {?} */
-    FsChipsComponent.prototype.classHasChips;
-    /** @type {?} */
-    FsChipsComponent.prototype.compare;
-    /** @type {?} */
-    FsChipsComponent.prototype.multiple;
-    /** @type {?} */
-    FsChipsComponent.prototype.onChange;
-    /** @type {?} */
-    FsChipsComponent.prototype.onTouch;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipsComponent.prototype._value;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipsComponent.prototype._destroy$;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipsComponent.prototype._cdRef;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipsComponent.prototype._chipsService;
+class FsChipsComponent {
+    constructor(_cdRef, _chipsService) {
+        this._cdRef = _cdRef;
+        this._chipsService = _chipsService;
+        this.classFsChips = true;
+        this.classHasChips = false;
+        this.multiple = true;
+        this.onChange = () => { };
+        this.onTouch = () => { };
+        this._value = [];
+        this._destroy$ = new Subject();
+        this.subscribeToItemsChange();
+        this.subscribeToSelectionChange();
+    }
+    get chips() {
+        return this._chipsService.chips;
+    }
+    set value(value) {
+        if (this._value !== value) {
+            this._value = value;
+            this.onChange(this._value);
+            this.onTouch(this._value);
+        }
+    }
+    get value() {
+        return this._value;
+    }
+    ngOnDestroy() {
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    writeValue(value) {
+        if (value !== this.value) {
+            this._value = value;
+        }
+        this.updateChips();
+    }
+    registerOnChange(fn) { this.onChange = fn; }
+    registerOnTouched(fn) { this.onTouch = fn; }
+    /**
+     * Update ngModel value when selection changed
+     */
+    subscribeToSelectionChange() {
+        this._chipsService.selectionChanged$
+            .pipe(takeUntil(this._destroy$))
+            .subscribe(({ selected, value }) => {
+            if (!selected) {
+                const valueIndex = this.value.findIndex((item) => {
+                    return this.compareFn(item, value);
+                });
+                if (valueIndex > -1) {
+                    this.value.splice(valueIndex, 1);
+                    this.onChange(this._value);
+                    this.onTouch(this._value);
+                }
+            }
+            else {
+                this.value.push(value);
+                this.onChange(this._value);
+                this.onTouch(this._value);
+            }
+        });
+    }
+    /**
+     * Update selection if item was added or removed
+     */
+    subscribeToItemsChange() {
+        this._chipsService.chipItemsChanged$
+            .pipe(takeUntil(this._destroy$))
+            .subscribe(() => {
+            this.classHasChips = !!this._chipsService.chips.length;
+            this.updateChips();
+        });
+    }
+    compareFn(o1, o2) {
+        if (this.compare) {
+            return this.compare(o1, o2);
+        }
+        return o1 === o2;
+    }
+    updateChips() {
+        if (this.multiple && Array.isArray(this.value) && this.chips) {
+            this.chips.forEach((chip) => {
+                chip.selected = find(this.value, (o) => {
+                    return this.compareFn(o, chip.value);
+                }) !== undefined;
+            });
+        }
+        this._cdRef.markForCheck();
+    }
 }
+FsChipsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: FsChipsService }], target: i0.ɵɵFactoryTarget.Component });
+FsChipsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsChipsComponent, selector: "fs-chips", inputs: { compare: "compare", multiple: "multiple" }, host: { properties: { "class.fs-chips": "this.classFsChips", "class.has-chips": "this.classHasChips" } }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: forwardRef(() => FsChipsComponent),
+            multi: true,
+        },
+        FsChipsService,
+    ], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'fs-chips',
+                    templateUrl: 'chips.component.html',
+                    styleUrls: ['chips.component.scss'],
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => FsChipsComponent),
+                            multi: true,
+                        },
+                        FsChipsService,
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: FsChipsService }]; }, propDecorators: { classFsChips: [{
+                type: HostBinding,
+                args: ['class.fs-chips']
+            }], classHasChips: [{
+                type: HostBinding,
+                args: ['class.has-chips']
+            }], compare: [{
+                type: Input
+            }], multiple: [{
+                type: Input
+            }] } });
 
-/**
- * @fileoverview added by tsickle
- * Generated from: app/components/chip/chip.component.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-class FsChipComponent {
-    /**
-     * @param {?} _cdRef
-     * @param {?} _chips
-     */
-    constructor(_cdRef, _chips) {
-        this._cdRef = _cdRef;
-        this._chips = _chips;
-        this.fsChip = true;
-        this._outlined = false;
-        this._selectable = false;
-        this._image = false;
-        this._selected = false;
-        this._removable = false;
-        this.styleBackgroundColor = '';
-        this.styleColor = '';
-        this.styleBorderColor = '';
-        this.classSmall = false;
-        this.classTiny = false;
-        this.classMicro = false;
-        this.value = null;
-        this.selectedToggled = new EventEmitter();
-        this.removed = new EventEmitter();
-        this.$destroy = new Subject();
-        this._backgroundColor = '';
-        this._color = '';
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set setSize(value) {
-        this._size = value;
-        this.classSmall = value === 'small';
-        this.classTiny = value === 'tiny';
-        this.classMicro = value === 'micro';
-    }
-    ;
-    /**
-     * @return {?}
-     */
-    click() {
-        if (this.selectable) {
-            this.selected = !this.selected;
-            this.selectedToggled.emit({ value: this.value, selected: this.selected });
-            if (this._chips) {
-                this._chips.selectionChanged(this.selected, this.value);
-            }
-        }
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set backgroundColor(value) {
-        this._backgroundColor = value;
-        this.updateStyles();
-    }
-    ;
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set borderColor(value) {
-        this.styleBorderColor = value;
-        this.updateStyles();
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set color(value) {
-        this._color = value;
-        this.updateStyles();
-    }
-    /**
-     * @return {?}
-     */
-    get color() {
-        return this._color;
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set outlined(value) {
-        this._outlined = value;
-        this.updateStyles();
-    }
-    ;
-    /**
-     * @return {?}
-     */
-    get outlined() {
-        return this._outlined;
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set removable(value) {
-        this._removable = value;
-        this._cdRef.markForCheck();
-    }
-    ;
-    /**
-     * @return {?}
-     */
-    get removable() {
-        return this._removable;
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set selectable(value) {
-        this._selectable = value;
-    }
-    ;
-    /**
-     * @return {?}
-     */
-    get selectable() {
-        return this._selectable;
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set selected(value) {
-        this._selected = value;
-        this._cdRef.markForCheck();
-    }
-    ;
-    /**
-     * @return {?}
-     */
-    get selected() {
-        return this._selected;
-    }
-    /**
-     * @param {?} value
-     * @return {?}
-     */
-    set image(value) {
-        this._image = value;
-        this._cdRef.markForCheck();
-    }
-    ;
-    /**
-     * @return {?}
-     */
-    get image() {
-        return this._image;
-    }
-    /**
-     * @return {?}
-     */
-    ngOnInit() {
-        if (this._chips) {
-            this._chips.register(this);
-        }
-    }
-    /**
-     * @return {?}
-     */
-    ngOnDestroy() {
-        if (this._chips) {
-            this._chips.destroy(this);
-        }
-        this.$destroy.next();
-        this.$destroy.complete();
-    }
-    /**
-     * @param {?} event
-     * @return {?}
-     */
-    remove(event) {
-        this.removed.next(event);
-    }
-    /**
-     * @private
-     * @param {?} hexcolor
-     * @return {?}
-     */
-    isContrastYIQBlack(hexcolor) {
-        if (!hexcolor) {
-            return true;
-        }
-        hexcolor = hexcolor.replace('#', '');
-        /** @type {?} */
-        const r = parseInt(hexcolor.substr(0, 2), 16);
-        /** @type {?} */
-        const g = parseInt(hexcolor.substr(2, 2), 16);
-        /** @type {?} */
-        const b = parseInt(hexcolor.substr(4, 2), 16);
-        /** @type {?} */
-        const yiq = ((r * 299) + (g * 587) + (b * 114)) / 1000;
-        return yiq >= 200;
-    }
-    /**
-     * @private
-     * @return {?}
-     */
-    updateStyles() {
-        this.styleBackgroundColor = this._backgroundColor;
-        if (this._color) {
-            this.styleColor = this._color;
-        }
-        else if (!this._outlined) {
-            this.styleColor = this.isContrastYIQBlack(this.styleBackgroundColor) ? '#474747' : '#fff';
-        }
-        if (this._outlined) {
-            this.styleBackgroundColor = '';
-            if (this._color) {
-                this.styleBorderColor = this._color;
-            }
-        }
-        this._cdRef.markForCheck();
-    }
-}
-FsChipComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'fs-chip',
-                template: "<img *ngIf=\"image\" [src]=\"image\" class=\"image\" alt=\"\">\n<div class=\"fs-chip-content\">\n  <ng-content></ng-content>\n</div>\n<div class=\"selected-check\" *ngIf=\"selected\">\n  <mat-icon [style.color]=\"styleColor\">check</mat-icon>\n</div>\n<a *ngIf=\"removable\" class=\"remove\" (click)=\"remove($event)\">\n  <mat-icon [style.color]=\"styleColor\">cancel</mat-icon>\n</a>\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            }] }
-];
-/** @nocollapse */
-FsChipComponent.ctorParameters = () => [
-    { type: ChangeDetectorRef },
-    { type: FsChipsService, decorators: [{ type: Optional }] }
-];
-FsChipComponent.propDecorators = {
-    fsChip: [{ type: HostBinding, args: ['class.fs-chip',] }],
-    _outlined: [{ type: HostBinding, args: ['class.outlined',] }],
-    _selectable: [{ type: HostBinding, args: ['class.selectable',] }],
-    _image: [{ type: HostBinding, args: ['class.imaged',] }],
-    _selected: [{ type: HostBinding, args: ['class.selected',] }],
-    _removable: [{ type: HostBinding, args: ['class.removable',] }],
-    styleBackgroundColor: [{ type: HostBinding, args: ['style.backgroundColor',] }],
-    styleColor: [{ type: HostBinding, args: ['style.color',] }],
-    styleBorderColor: [{ type: HostBinding, args: ['style.borderColor',] }],
-    classSmall: [{ type: HostBinding, args: ['class.small',] }],
-    classTiny: [{ type: HostBinding, args: ['class.tiny',] }],
-    classMicro: [{ type: HostBinding, args: ['class.micro',] }],
-    setSize: [{ type: Input, args: ['size',] }],
-    click: [{ type: HostListener, args: ['click',] }],
-    value: [{ type: Input }],
-    backgroundColor: [{ type: Input }],
-    borderColor: [{ type: Input }],
-    color: [{ type: Input }],
-    outlined: [{ type: Input }],
-    removable: [{ type: Input }],
-    selectable: [{ type: Input }],
-    selected: [{ type: Input }],
-    image: [{ type: Input }],
-    selectedToggled: [{ type: Output }],
-    removed: [{ type: Output }]
-};
-if (false) {
-    /** @type {?} */
-    FsChipComponent.prototype.fsChip;
-    /** @type {?} */
-    FsChipComponent.prototype._outlined;
-    /** @type {?} */
-    FsChipComponent.prototype._selectable;
-    /** @type {?} */
-    FsChipComponent.prototype._image;
-    /** @type {?} */
-    FsChipComponent.prototype._selected;
-    /** @type {?} */
-    FsChipComponent.prototype._removable;
-    /** @type {?} */
-    FsChipComponent.prototype.styleBackgroundColor;
-    /** @type {?} */
-    FsChipComponent.prototype.styleColor;
-    /** @type {?} */
-    FsChipComponent.prototype.styleBorderColor;
-    /** @type {?} */
-    FsChipComponent.prototype.classSmall;
-    /** @type {?} */
-    FsChipComponent.prototype.classTiny;
-    /** @type {?} */
-    FsChipComponent.prototype.classMicro;
-    /** @type {?} */
-    FsChipComponent.prototype.value;
-    /** @type {?} */
-    FsChipComponent.prototype.selectedToggled;
-    /** @type {?} */
-    FsChipComponent.prototype.removed;
-    /** @type {?} */
-    FsChipComponent.prototype.$destroy;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipComponent.prototype._backgroundColor;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipComponent.prototype._color;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipComponent.prototype._size;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipComponent.prototype._cdRef;
-    /**
-     * @type {?}
-     * @private
-     */
-    FsChipComponent.prototype._chips;
-    /* Skipping unhandled member: ;*/
-    /* Skipping unhandled member: ;*/
-    /* Skipping unhandled member: ;*/
-    /* Skipping unhandled member: ;*/
-    /* Skipping unhandled member: ;*/
-    /* Skipping unhandled member: ;*/
-    /* Skipping unhandled member: ;*/
+class FsChipComponent {
+    constructor(_cdRef, _chips) {
+        this._cdRef = _cdRef;
+        this._chips = _chips;
+        this.fsChip = true;
+        this._outlined = false;
+        this._selectable = false;
+        this._image = false;
+        this._selected = false;
+        this._removable = false;
+        this.styleBackgroundColor = '';
+        this.styleColor = '';
+        this.styleBorderColor = '';
+        this.classSmall = false;
+        this.classTiny = false;
+        this.classMicro = false;
+        this.value = null;
+        this.selectedToggled = new EventEmitter();
+        this.removed = new EventEmitter();
+        this.$destroy = new Subject();
+        this._backgroundColor = '';
+        this._color = '';
+    }
+    set setSize(value) {
+        this._size = value;
+        this.classSmall = value === 'small';
+        this.classTiny = value === 'tiny';
+        this.classMicro = value === 'micro';
+    }
+    ;
+    click() {
+        if (this.selectable) {
+            this.selected = !this.selected;
+            this.selectedToggled.emit({ value: this.value, selected: this.selected });
+            if (this._chips) {
+                this._chips.selectionChanged(this.selected, this.value);
+            }
+        }
+    }
+    set backgroundColor(value) {
+        this._backgroundColor = value;
+        this.updateStyles();
+    }
+    ;
+    set borderColor(value) {
+        this.styleBorderColor = value;
+        this.updateStyles();
+    }
+    set color(value) {
+        this._color = value;
+        this.updateStyles();
+    }
+    get color() {
+        return this._color;
+    }
+    set outlined(value) {
+        this._outlined = value;
+        this.updateStyles();
+    }
+    ;
+    get outlined() {
+        return this._outlined;
+    }
+    set removable(value) {
+        this._removable = value;
+        this._cdRef.markForCheck();
+    }
+    ;
+    get removable() {
+        return this._removable;
+    }
+    set selectable(value) {
+        this._selectable = value;
+    }
+    ;
+    get selectable() {
+        return this._selectable;
+    }
+    set selected(value) {
+        this._selected = value;
+        this._cdRef.markForCheck();
+    }
+    ;
+    get selected() {
+        return this._selected;
+    }
+    set image(value) {
+        this._image = value;
+        this._cdRef.markForCheck();
+    }
+    ;
+    get image() {
+        return this._image;
+    }
+    ngOnInit() {
+        if (this._chips) {
+            this._chips.register(this);
+        }
+    }
+    ngOnDestroy() {
+        if (this._chips) {
+            this._chips.destroy(this);
+        }
+        this.$destroy.next();
+        this.$destroy.complete();
+    }
+    remove(event) {
+        this.removed.next(event);
+    }
+    isContrastYIQBlack(hexcolor) {
+        if (!hexcolor) {
+            return true;
+        }
+        hexcolor = hexcolor.replace('#', '');
+        const r = parseInt(hexcolor.substr(0, 2), 16);
+        const g = parseInt(hexcolor.substr(2, 2), 16);
+        const b = parseInt(hexcolor.substr(4, 2), 16);
+        const yiq = ((r * 299) + (g * 587) + (b * 114)) / 1000;
+        return yiq >= 200;
+    }
+    updateStyles() {
+        this.styleBackgroundColor = this._backgroundColor;
+        if (this._color) {
+            this.styleColor = this._color;
+        }
+        else if (!this._outlined) {
+            this.styleColor = this.isContrastYIQBlack(this.styleBackgroundColor) ? '#474747' : '#fff';
+        }
+        if (this._outlined) {
+            this.styleBackgroundColor = '';
+            if (this._color) {
+                this.styleBorderColor = this._color;
+            }
+        }
+        this._cdRef.markForCheck();
+    }
 }
+FsChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: FsChipsService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+FsChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsChipComponent, selector: "fs-chip", inputs: { setSize: ["size", "setSize"], value: "value", backgroundColor: "backgroundColor", borderColor: "borderColor", color: "color", outlined: "outlined", removable: "removable", selectable: "selectable", selected: "selected", image: "image" }, outputs: { selectedToggled: "selectedToggled", removed: "removed" }, host: { listeners: { "click": "click()" }, properties: { "class.fs-chip": "this.fsChip", "class.outlined": "this._outlined", "class.selectable": "this._selectable", "class.imaged": "this._image", "class.selected": "this._selected", "class.removable": "this._removable", "style.backgroundColor": "this.styleBackgroundColor", "style.color": "this.styleColor", "style.borderColor": "this.styleBorderColor", "class.small": "this.classSmall", "class.tiny": "this.classTiny", "class.micro": "this.classMicro" } }, ngImport: i0, template: "<img *ngIf=\"image\" [src]=\"image\" class=\"image\" alt=\"\">\n<div class=\"fs-chip-content\">\n  <ng-content></ng-content>\n</div>\n<div class=\"selected-check\" *ngIf=\"selected\">\n  <mat-icon [style.color]=\"styleColor\">check</mat-icon>\n</div>\n<a *ngIf=\"removable\" class=\"remove\" (click)=\"remove($event)\">\n  <mat-icon [style.color]=\"styleColor\">cancel</mat-icon>\n</a>\n", styles: [""], components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'fs-chip',
+                    templateUrl: 'chip.component.html',
+                    styleUrls: ['chip.component.scss'],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: FsChipsService, decorators: [{
+                    type: Optional
+                }] }]; }, propDecorators: { fsChip: [{
+                type: HostBinding,
+                args: ['class.fs-chip']
+            }], _outlined: [{
+                type: HostBinding,
+                args: ['class.outlined']
+            }], _selectable: [{
+                type: HostBinding,
+                args: ['class.selectable']
+            }], _image: [{
+                type: HostBinding,
+                args: ['class.imaged']
+            }], _selected: [{
+                type: HostBinding,
+                args: ['class.selected']
+            }], _removable: [{
+                type: HostBinding,
+                args: ['class.removable']
+            }], styleBackgroundColor: [{
+                type: HostBinding,
+                args: ['style.backgroundColor']
+            }], styleColor: [{
+                type: HostBinding,
+                args: ['style.color']
+            }], styleBorderColor: [{
+                type: HostBinding,
+                args: ['style.borderColor']
+            }], classSmall: [{
+                type: HostBinding,
+                args: ['class.small']
+            }], classTiny: [{
+                type: HostBinding,
+                args: ['class.tiny']
+            }], classMicro: [{
+                type: HostBinding,
+                args: ['class.micro']
+            }], setSize: [{
+                type: Input,
+                args: ['size']
+            }], click: [{
+                type: HostListener,
+                args: ['click']
+            }], value: [{
+                type: Input
+            }], backgroundColor: [{
+                type: Input
+            }], borderColor: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], outlined: [{
+                type: Input
+            }], removable: [{
+                type: Input
+            }], selectable: [{
+                type: Input
+            }], selected: [{
+                type: Input
+            }], image: [{
+                type: Input
+            }], selectedToggled: [{
+                type: Output
+            }], removed: [{
+                type: Output
+            }] } });
 
-/**
- * @fileoverview added by tsickle
- * Generated from: app/fs-chip.module.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-class FsChipModule {
-    /**
-     * @return {?}
-     */
-    static forRoot() {
-        return {
-            ngModule: FsChipModule
-        };
-    }
-}
-FsChipModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [
-                    CommonModule,
-                    MatIconModule,
-                    FsLabelModule
-                ],
-                exports: [
-                    FsChipsComponent,
-                    FsChipComponent,
-                ],
-                declarations: [
-                    FsChipsComponent,
-                    FsChipComponent,
-                ]
-            },] }
-];
+class FsChipModule {
+    static forRoot() {
+        return {
+            ngModule: FsChipModule
+        };
+    }
+}
+FsChipModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+FsChipModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipModule, declarations: [FsChipsComponent,
+        FsChipComponent], imports: [CommonModule,
+        MatIconModule,
+        FsLabelModule], exports: [FsChipsComponent,
+        FsChipComponent] });
+FsChipModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipModule, imports: [[
+            CommonModule,
+            MatIconModule,
+            FsLabelModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsChipModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        MatIconModule,
+                        FsLabelModule
+                    ],
+                    exports: [
+                        FsChipsComponent,
+                        FsChipComponent,
+                    ],
+                    declarations: [
+                        FsChipsComponent,
+                        FsChipComponent,
+                    ]
+                }]
+        }] });
 
-/**
- * @fileoverview added by tsickle
- * Generated from: public_api.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+/*
+ * Public API Surface of fs-menu
  */
 
-/**
- * @fileoverview added by tsickle
- * Generated from: firestitch-chip.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+/**
+ * Generated bundle index. Do not edit.
  */
 
-export { FsChipModule, FsChipsComponent as ɵa, FsChipsService as ɵb, FsChipComponent as ɵc };
+export { FsChipComponent, FsChipModule, FsChipsComponent };
 //# sourceMappingURL=firestitch-chip.js.map