@firestitch/chip 8.1.9 → 12.0.0

package/bundles/firestitch-chip.umd.js

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