@firestitch/filter 12.12.14 → 12.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/app/components/filter/filter.component.d.ts +2 -1
  2. package/app/components/filter-chip/filter-chip.component.d.ts +1 -1
  3. package/app/components/filter-chips/filter-chips.component.d.ts +1 -1
  4. package/app/components/filter-drawer/filter-drawer.component.d.ts +8 -6
  5. package/app/components/filters-item/autocomplete/autocomplete.component.d.ts +1 -1
  6. package/app/components/filters-item/autocompletechips/autocompletechips.component.d.ts +1 -1
  7. package/app/components/filters-item/base-item/base-item.component.d.ts +5 -3
  8. package/app/components/filters-item/filter-item.component.d.ts +11 -9
  9. package/app/helpers/create-filter-item.d.ts +1 -1
  10. package/app/models/items/autocomplete/base-autocomplete-item.d.ts +3 -3
  11. package/app/models/items/base-item.d.ts +7 -6
  12. package/app/services/filter-overlay.service.d.ts +7 -5
  13. package/app/services/items-store.service.d.ts +3 -1
  14. package/bundles/firestitch-filter.umd.js +124 -128
  15. package/bundles/firestitch-filter.umd.js.map +1 -1
  16. package/esm2015/app/components/filter/filter.component.js +9 -8
  17. package/esm2015/app/components/filter-chip/filter-chip.component.js +4 -4
  18. package/esm2015/app/components/filter-chips/filter-chips.component.js +1 -1
  19. package/esm2015/app/components/filter-drawer/filter-drawer.component.js +15 -14
  20. package/esm2015/app/components/filters-item/autocomplete/autocomplete.component.js +3 -3
  21. package/esm2015/app/components/filters-item/autocompletechips/autocompletechips.component.js +2 -2
  22. package/esm2015/app/components/filters-item/base-item/base-item.component.js +6 -10
  23. package/esm2015/app/components/filters-item/filter-item.component.js +5 -3
  24. package/esm2015/app/fs-filter.module.js +1 -4
  25. package/esm2015/app/models/items/autocomplete/base-autocomplete-item.js +2 -1
  26. package/esm2015/app/models/items/base-item.js +6 -8
  27. package/esm2015/app/models/items/select/multiple-select-item.js +4 -6
  28. package/esm2015/app/models/items/select/simple-select-item.js +8 -10
  29. package/esm2015/app/pipes/remove-isolate-value.pipe.js +5 -7
  30. package/esm2015/app/services/filter-overlay.service.js +19 -15
  31. package/esm2015/app/services/items-store.service.js +13 -13
  32. package/fesm2015/firestitch-filter.js +116 -122
  33. package/fesm2015/firestitch-filter.js.map +1 -1
  34. package/package.json +1 -1
@@ -378,6 +378,54 @@
378
378
  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
379
379
  }
380
380
 
381
+ function objectsAreEquals(obj1, obj2) {
382
+ var oldKeys = Object.keys(obj1);
383
+ var currKeys = Object.keys(obj2);
384
+ if (oldKeys.length !== currKeys.length) {
385
+ return false;
386
+ }
387
+ for (var key in obj1) {
388
+ if (obj1.hasOwnProperty(key)) {
389
+ var oldItem = obj1[key];
390
+ var currItem = obj2[key];
391
+ var isArrays = Array.isArray(oldItem) && Array.isArray(currItem);
392
+ var isObjects = lodashEs.isObject(oldItem) && lodashEs.isObject(currItem);
393
+ if (isArrays && !arraysAreEquals(oldItem, currItem)) {
394
+ return false;
395
+ }
396
+ else if (isObjects && !objectsAreEquals(oldItem, currItem)) {
397
+ return false;
398
+ }
399
+ else if (!isArrays && !isObjects && oldItem !== currItem) {
400
+ return false;
401
+ }
402
+ }
403
+ }
404
+ return true;
405
+ }
406
+ function arraysAreEquals(arr1, arr2) {
407
+ var e_1, _a;
408
+ if (arr1.length !== arr2.length) {
409
+ return false;
410
+ }
411
+ try {
412
+ for (var arr1_1 = __values(arr1), arr1_1_1 = arr1_1.next(); !arr1_1_1.done; arr1_1_1 = arr1_1.next()) {
413
+ var el = arr1_1_1.value;
414
+ if (arr2.indexOf(el) === -1) {
415
+ return false;
416
+ }
417
+ }
418
+ }
419
+ catch (e_1_1) { e_1 = { error: e_1_1 }; }
420
+ finally {
421
+ try {
422
+ if (arr1_1_1 && !arr1_1_1.done && (_a = arr1_1.return)) _a.call(arr1_1);
423
+ }
424
+ finally { if (e_1) throw e_1.error; }
425
+ }
426
+ return true;
427
+ }
428
+
381
429
  exports.ItemType = void 0;
382
430
  (function (ItemType) {
383
431
  ItemType["Text"] = "text";
@@ -646,13 +694,13 @@
646
694
  _this._pendingDefaultValue = false;
647
695
  }));
648
696
  };
649
- BaseItem.prototype.initValues = function (persistedValue) {
697
+ BaseItem.prototype.initValues = function (filter, persistedValue) {
650
698
  // this._initialized = false;
651
699
  this.persistedValue = persistedValue;
652
700
  this._initDefaultModel();
653
701
  var isAutocomplete = this.type === exports.ItemType.AutoComplete || this.type === exports.ItemType.AutoCompleteChips;
654
702
  if (this._valuesFn && !isAutocomplete) {
655
- var valuesResult = this._valuesFn();
703
+ var valuesResult = this._valuesFn(null, filter);
656
704
  if (rxjs.isObservable(valuesResult)) {
657
705
  this._pendingValues = true;
658
706
  }
@@ -668,12 +716,12 @@
668
716
  // this._initialized = true;
669
717
  }
670
718
  };
671
- BaseItem.prototype.loadAsyncValues = function (reload) {
719
+ BaseItem.prototype.loadAsyncValues = function (filter, reload) {
672
720
  var _this = this;
673
721
  if (reload === void 0) { reload = true; }
674
722
  if (reload || (!this.loading && this.hasPendingValues)) {
675
723
  this.loading = true;
676
- this._valuesFn()
724
+ this._valuesFn(null, filter)
677
725
  .pipe(operators.take(1), operators.takeUntil(this._destroy$))
678
726
  .subscribe(function (values) {
679
727
  _this.values = values;
@@ -693,7 +741,6 @@
693
741
  this._clear$.next(defaultValue);
694
742
  this._clearValue(defaultValue);
695
743
  };
696
- ;
697
744
  BaseItem.prototype.getChipsContent = function (type) {
698
745
  return '';
699
746
  };
@@ -728,7 +775,6 @@
728
775
  this.values = item.values;
729
776
  }
730
777
  };
731
- ;
732
778
  BaseItem.prototype._initDefaultModel = function () {
733
779
  var _a;
734
780
  var model = (_a = this.persistedValue) !== null && _a !== void 0 ? _a : this.defaultValue;
@@ -783,54 +829,6 @@
783
829
  return BaseSelectItem;
784
830
  }(BaseItem));
785
831
 
786
- function objectsAreEquals(obj1, obj2) {
787
- var oldKeys = Object.keys(obj1);
788
- var currKeys = Object.keys(obj2);
789
- if (oldKeys.length !== currKeys.length) {
790
- return false;
791
- }
792
- for (var key in obj1) {
793
- if (obj1.hasOwnProperty(key)) {
794
- var oldItem = obj1[key];
795
- var currItem = obj2[key];
796
- var isArrays = Array.isArray(oldItem) && Array.isArray(currItem);
797
- var isObjects = lodashEs.isObject(oldItem) && lodashEs.isObject(currItem);
798
- if (isArrays && !arraysAreEquals(oldItem, currItem)) {
799
- return false;
800
- }
801
- else if (isObjects && !objectsAreEquals(oldItem, currItem)) {
802
- return false;
803
- }
804
- else if (!isArrays && !isObjects && oldItem !== currItem) {
805
- return false;
806
- }
807
- }
808
- }
809
- return true;
810
- }
811
- function arraysAreEquals(arr1, arr2) {
812
- var e_1, _a;
813
- if (arr1.length !== arr2.length) {
814
- return false;
815
- }
816
- try {
817
- for (var arr1_1 = __values(arr1), arr1_1_1 = arr1_1.next(); !arr1_1_1.done; arr1_1_1 = arr1_1.next()) {
818
- var el = arr1_1_1.value;
819
- if (arr2.indexOf(el) === -1) {
820
- return false;
821
- }
822
- }
823
- }
824
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
825
- finally {
826
- try {
827
- if (arr1_1_1 && !arr1_1_1.done && (_a = arr1_1.return)) _a.call(arr1_1);
828
- }
829
- finally { if (e_1) throw e_1.error; }
830
- }
831
- return true;
832
- }
833
-
834
832
  var MultipleSelectItem = /** @class */ (function (_super) {
835
833
  __extends(MultipleSelectItem, _super);
836
834
  function MultipleSelectItem(itemConfig, _persistedValues) {
@@ -910,9 +908,7 @@
910
908
  if (isNaN(val)) {
911
909
  return val;
912
910
  }
913
- else {
914
- return +val;
915
- }
911
+ return +val;
916
912
  });
917
913
  }
918
914
  _super.prototype._setModel.call(this, value);
@@ -996,17 +992,15 @@
996
992
  var _this = this;
997
993
  if (type === void 0) { type = null; }
998
994
  if (this.children) {
999
- var itemValue = findValue(this.values, this.model, this.children);
1000
- return itemValue && itemValue.name;
995
+ var itemValue_1 = findValue(this.values, this.model, this.children);
996
+ return itemValue_1 && itemValue_1.name;
1001
997
  }
1002
- else {
1003
- var itemValue = this.values.find(function (val) { return val.value === _this.model; });
1004
- if (itemValue) {
1005
- return itemValue.name;
1006
- }
1007
- else if (this.isolate) {
1008
- return this.isolate.label;
1009
- }
998
+ var itemValue = this.values.find(function (val) { return val.value === _this.model; });
999
+ if (itemValue) {
1000
+ return itemValue.name;
1001
+ }
1002
+ else if (this.isolate) {
1003
+ return this.isolate.label;
1010
1004
  }
1011
1005
  };
1012
1006
  Object.defineProperty(SimpleSelectItem.prototype, "isChipVisible", {
@@ -1602,6 +1596,7 @@
1602
1596
  configurable: true
1603
1597
  });
1604
1598
  BaseAutocompleteItem.prototype._validateModel = function () {
1599
+ //
1605
1600
  };
1606
1601
  BaseAutocompleteItem.prototype._parseConfig = function (item) {
1607
1602
  var _a;
@@ -2223,9 +2218,10 @@
2223
2218
  (_a = this.keywordItem) === null || _a === void 0 ? void 0 : _a.clear();
2224
2219
  };
2225
2220
  FsFilterItemsStore.prototype.loadAsyncValues = function () {
2221
+ var _this = this;
2226
2222
  this.items
2227
2223
  .filter(function (item) { return item.hasPendingValues; })
2228
- .forEach(function (item) { return item.loadAsyncValues(); });
2224
+ .forEach(function (item) { return item.loadAsyncValues(_this.filter); });
2229
2225
  };
2230
2226
  FsFilterItemsStore.prototype.loadAsyncDefaults = function () {
2231
2227
  var _this = this;
@@ -2246,7 +2242,7 @@
2246
2242
  rxjs.forkJoin(__spreadArray(__spreadArray([], __read(defaultValuesToBeLoaded
2247
2243
  .map(function (item) { return item.loadDefaultValue(); }))), __read(valuesToBeLoaded
2248
2244
  .map(function (item) {
2249
- item.loadAsyncValues();
2245
+ item.loadAsyncValues(_this.filter);
2250
2246
  return item.loading$
2251
2247
  .pipe();
2252
2248
  }))))
@@ -2310,9 +2306,10 @@
2310
2306
  return params;
2311
2307
  };
2312
2308
  FsFilterItemsStore.prototype.init = function (p) {
2309
+ var _this = this;
2313
2310
  this.items
2314
2311
  .forEach(function (item) {
2315
- item.initValues(p[item.name]);
2312
+ item.initValues(_this.filter, p[item.name]);
2316
2313
  });
2317
2314
  this._initSortingItems(p);
2318
2315
  this.loadAsyncDefaults();
@@ -2424,8 +2421,8 @@
2424
2421
  };
2425
2422
  FsFilterItemsStore.prototype._initSortingItems = function (p) {
2426
2423
  if (this.sortByItem && this.sortDirectionItem) {
2427
- this.sortByItem.initValues(p[this.sortByItem.name]);
2428
- this.sortDirectionItem.initValues(p[this.sortDirectionItem.name]);
2424
+ this.sortByItem.initValues(this.filter, p[this.sortByItem.name]);
2425
+ this.sortDirectionItem.initValues(this.filter, p[this.sortDirectionItem.name]);
2429
2426
  }
2430
2427
  };
2431
2428
  FsFilterItemsStore.prototype._createSortingItems = function () {
@@ -2435,7 +2432,7 @@
2435
2432
  name: SORT_BY_FIELD,
2436
2433
  type: exports.ItemType.Select,
2437
2434
  label: 'Sort By',
2438
- values: this._config.sortValues
2435
+ values: this._config.sortValues,
2439
2436
  };
2440
2437
  if (this._config.sort && this._config.sort.value) {
2441
2438
  sortByItem.default = this._config.sort.value;
@@ -2447,8 +2444,8 @@
2447
2444
  label: 'Sort Direction',
2448
2445
  values: [
2449
2446
  { name: 'Ascending', value: 'asc' },
2450
- { name: 'Descending', value: 'desc' }
2451
- ]
2447
+ { name: 'Descending', value: 'desc' },
2448
+ ],
2452
2449
  };
2453
2450
  if (this._config.sort && this._config.sort.direction) {
2454
2451
  sortDirectionItem.default = this._config.sort.direction;
@@ -3309,7 +3306,7 @@
3309
3306
  this.listenValueChangesForRanges();
3310
3307
  this._updateVisibility();
3311
3308
  if (this.item.hasPendingValues) {
3312
- this.item.loadAsyncValues(false);
3309
+ this.item.loadAsyncValues(null, false);
3313
3310
  this.item.values$
3314
3311
  .pipe(operators.take(2), operators.takeUntil(this._destroy$))
3315
3312
  .subscribe(function () {
@@ -3354,7 +3351,7 @@
3354
3351
  FsFilterChipComponent.prototype._initDelayRender = function () {
3355
3352
  this.chipDelayedRender$ = rxjs.combineLatest([
3356
3353
  this.item.values$,
3357
- this._chipRenderTimer$.pipe(operators.startWith(false))
3354
+ this._chipRenderTimer$.pipe(operators.startWith(false)),
3358
3355
  ])
3359
3356
  .pipe(operators.map(function (_a) {
3360
3357
  var _b = __read(_a, 2), values = _b[0], timerValue = _b[1];
@@ -3464,7 +3461,6 @@
3464
3461
  enumerable: false,
3465
3462
  configurable: true
3466
3463
  });
3467
- ;
3468
3464
  BaseItemComponent.prototype.ngDoCheck = function () {
3469
3465
  if (this._kvDiffer) {
3470
3466
  var changes = this._kvDiffer.diff(this.item);
@@ -3475,12 +3471,7 @@
3475
3471
  };
3476
3472
  BaseItemComponent.prototype.ngOnChanges = function (changes) {
3477
3473
  if (changes.item) {
3478
- if (Array.isArray(this.item.label)) {
3479
- this.label = this.item.label[0];
3480
- }
3481
- else {
3482
- this.label = this.item.label;
3483
- }
3474
+ this.label = Array.isArray(this.item.label) ? this.item.label[0] : this.item.label;
3484
3475
  }
3485
3476
  };
3486
3477
  BaseItemComponent.prototype.ngOnDestroy = function () {
@@ -3501,7 +3492,7 @@
3501
3492
  return BaseItemComponent;
3502
3493
  }());
3503
3494
  BaseItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BaseItemComponent, deps: [{ token: i0__namespace.KeyValueDiffers }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
3504
- BaseItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BaseItemComponent, selector: "base-item", inputs: { item: "item", inline: "inline" }, usesOnChanges: true, ngImport: i0__namespace, template: '', isInline: true, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
3495
+ BaseItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BaseItemComponent, selector: "base-item", inputs: { item: "item", inline: "inline", filter: "filter" }, usesOnChanges: true, ngImport: i0__namespace, template: '', isInline: true, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
3505
3496
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BaseItemComponent, decorators: [{
3506
3497
  type: i0.Component,
3507
3498
  args: [{
@@ -3513,6 +3504,8 @@
3513
3504
  type: i0.Input
3514
3505
  }], inline: [{
3515
3506
  type: i0.Input
3507
+ }], filter: [{
3508
+ type: i0.Input
3516
3509
  }] } });
3517
3510
 
3518
3511
  var FocusToItemDirective = /** @class */ (function () {
@@ -3688,11 +3681,9 @@
3688
3681
  if (!isolate) {
3689
3682
  return values;
3690
3683
  }
3691
- else {
3692
- return values.filter(function (value) {
3693
- return value.value !== isolate.value;
3694
- });
3695
- }
3684
+ return values.filter(function (value) {
3685
+ return value.value !== isolate.value;
3686
+ });
3696
3687
  };
3697
3688
  return FsFilterIsolateValues;
3698
3689
  }());
@@ -3701,7 +3692,7 @@
3701
3692
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsFilterIsolateValues, decorators: [{
3702
3693
  type: i0.Pipe,
3703
3694
  args: [{
3704
- name: 'fsFilterIsolateValues'
3695
+ name: 'fsFilterIsolateValues',
3705
3696
  }]
3706
3697
  }] });
3707
3698
 
@@ -3953,7 +3944,7 @@
3953
3944
  return data ? data.name : data;
3954
3945
  };
3955
3946
  _this.fetch = function (keyword) {
3956
- return _this.item.valuesFn(keyword);
3947
+ return _this.item.valuesFn(keyword, _this.filter);
3957
3948
  };
3958
3949
  return _this;
3959
3950
  }
@@ -3977,7 +3968,7 @@
3977
3968
  _this._kvDiffers = _kvDiffers;
3978
3969
  _this._cd = _cd;
3979
3970
  _this.fetch = function (keyword) {
3980
- return _this.item.valuesFn(keyword);
3971
+ return _this.item.valuesFn(keyword, _this.filter);
3981
3972
  };
3982
3973
  return _this;
3983
3974
  }
@@ -4132,8 +4123,8 @@
4132
4123
  var FilterItemComponent = /** @class */ (function () {
4133
4124
  function FilterItemComponent(_cdRef) {
4134
4125
  this._cdRef = _cdRef;
4135
- this._destroy$ = new rxjs.Subject();
4136
4126
  this.itemType = exports.ItemType;
4127
+ this._destroy$ = new rxjs.Subject();
4137
4128
  }
4138
4129
  Object.defineProperty(FilterItemComponent.prototype, "textItem", {
4139
4130
  get: function () {
@@ -4234,7 +4225,7 @@
4234
4225
  return FilterItemComponent;
4235
4226
  }());
4236
4227
  FilterItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FilterItemComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
4237
- FilterItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterItemComponent, selector: "filter-item", inputs: { item: "item" }, ngImport: i0__namespace, template: "<div class=\"filter filter-{{ item.type }}\">\n\n <ng-container [ngSwitch]=\"item.type\">\n <filter-item-text class=\"interface\"\n *ngSwitchCase=\"itemType.Text\"\n [item]=\"textItem\">\n </filter-item-text>\n\n <filter-item-select class=\"interface\"\n *ngSwitchCase=\"itemType.Select\"\n [item]=\"baseSelectItem\">\n </filter-item-select>\n\n <filter-item-chips class=\"interface\"\n *ngSwitchCase=\"itemType.Chips\"\n [item]=\"chipsItem\">\n </filter-item-chips>\n\n <filter-item-range class=\"interface interface-range\"\n *ngSwitchCase=\"itemType.Range\"\n [item]=\"rangeItem\">\n </filter-item-range>\n\n <filter-item-autocomplete class=\"interface\"\n *ngSwitchCase=\"itemType.AutoComplete\"\n [item]=\"autocompleteItem\">\n </filter-item-autocomplete>\n\n <filter-item-autocompletechips class=\"interface\"\n *ngSwitchCase=\"itemType.AutoCompleteChips\"\n [item]=\"autocompleteChipsItem\">\n </filter-item-autocompletechips>\n\n <filter-item-date class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.Date\"\n [item]=\"dateItem\">\n </filter-item-date>\n\n <filter-item-date class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.DateTime\"\n [item]=\"dateTimeItem\">\n </filter-item-date>\n\n <filter-item-date-range class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.DateRange\"\n [item]=\"dateRangeItem\">\n </filter-item-date-range>\n\n <filter-item-date-range class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.DateTimeRange\"\n [item]=\"dateTimeRangeItem\">\n </filter-item-date-range>\n\n <filter-item-week class=\"interface\"\n *ngSwitchCase=\"itemType.Week\"\n [item]=\"weekItem\">\n </filter-item-week>\n\n <filter-item-checkbox class=\"interface interface-checkbox\"\n *ngSwitchCase=\"itemType.Checkbox\"\n [item]=\"checkboxItem\">\n </filter-item-checkbox>\n </ng-container>\n\n</div>\n", components: [{ type: TextComponent, selector: "filter-item-text" }, { type: SelectComponent, selector: "filter-item-select" }, { type: ChipsComponent, selector: "filter-item-chips" }, { type: RangeComponent, selector: "filter-item-range" }, { type: AutocompleteComponent, selector: "filter-item-autocomplete" }, { type: AutocompletechipsComponent, selector: "filter-item-autocompletechips" }, { type: DateComponent, selector: "filter-item-date" }, { type: DateRangeComponent, selector: "filter-item-date-range" }, { type: WeekComponent, selector: "filter-item-week" }, { type: CheckboxComponent, selector: "filter-item-checkbox" }], directives: [{ type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
4228
+ FilterItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterItemComponent, selector: "filter-item", inputs: { item: "item", filter: "filter" }, ngImport: i0__namespace, template: "<div class=\"filter filter-{{ item.type }}\">\n\n <ng-container [ngSwitch]=\"item.type\">\n <filter-item-text \n class=\"interface\"\n *ngSwitchCase=\"itemType.Text\"\n [item]=\"textItem\">\n </filter-item-text>\n\n <filter-item-select \n class=\"interface\"\n *ngSwitchCase=\"itemType.Select\"\n [item]=\"baseSelectItem\">\n </filter-item-select>\n\n <filter-item-chips \n class=\"interface\"\n *ngSwitchCase=\"itemType.Chips\"\n [item]=\"chipsItem\">\n </filter-item-chips>\n\n <filter-item-range \n class=\"interface interface-range\"\n *ngSwitchCase=\"itemType.Range\"\n [item]=\"rangeItem\">\n </filter-item-range>\n\n <filter-item-autocomplete \n class=\"interface\"\n *ngSwitchCase=\"itemType.AutoComplete\"\n [item]=\"autocompleteItem\"\n [filter]=\"filter\">\n </filter-item-autocomplete>\n\n <filter-item-autocompletechips \n class=\"interface\"\n *ngSwitchCase=\"itemType.AutoCompleteChips\"\n [item]=\"autocompleteChipsItem\"\n [filter]=\"filter\">\n </filter-item-autocompletechips>\n\n <filter-item-date \n class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.Date\"\n [item]=\"dateItem\">\n </filter-item-date>\n\n <filter-item-date \n class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.DateTime\"\n [item]=\"dateTimeItem\">\n </filter-item-date>\n\n <filter-item-date-range \n class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.DateRange\"\n [item]=\"dateRangeItem\">\n </filter-item-date-range>\n\n <filter-item-date-range \n class=\"interface interface-date\"\n *ngSwitchCase=\"itemType.DateTimeRange\"\n [item]=\"dateTimeRangeItem\">\n </filter-item-date-range>\n\n <filter-item-week \n class=\"interface\"\n *ngSwitchCase=\"itemType.Week\"\n [item]=\"weekItem\">\n </filter-item-week>\n\n <filter-item-checkbox \n class=\"interface interface-checkbox\"\n *ngSwitchCase=\"itemType.Checkbox\"\n [item]=\"checkboxItem\">\n </filter-item-checkbox>\n </ng-container>\n\n</div>\n", components: [{ type: TextComponent, selector: "filter-item-text" }, { type: SelectComponent, selector: "filter-item-select" }, { type: ChipsComponent, selector: "filter-item-chips" }, { type: RangeComponent, selector: "filter-item-range" }, { type: AutocompleteComponent, selector: "filter-item-autocomplete" }, { type: AutocompletechipsComponent, selector: "filter-item-autocompletechips" }, { type: DateComponent, selector: "filter-item-date" }, { type: DateRangeComponent, selector: "filter-item-date-range" }, { type: WeekComponent, selector: "filter-item-week" }, { type: CheckboxComponent, selector: "filter-item-checkbox" }], directives: [{ type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
4238
4229
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FilterItemComponent, decorators: [{
4239
4230
  type: i0.Component,
4240
4231
  args: [{
@@ -4244,20 +4235,23 @@
4244
4235
  }]
4245
4236
  }], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { item: [{
4246
4237
  type: i0.Input
4238
+ }], filter: [{
4239
+ type: i0.Input
4247
4240
  }] } });
4248
4241
 
4249
4242
  var FilterDrawerComponent = /** @class */ (function () {
4250
- function FilterDrawerComponent(externalParams, _cd, _itemsStore, overlayRef, data) {
4243
+ function FilterDrawerComponent(externalParams, _cd, _itemsStore, _overlayRef, _data) {
4251
4244
  this.externalParams = externalParams;
4252
4245
  this._cd = _cd;
4253
4246
  this._itemsStore = _itemsStore;
4254
- this.overlayRef = overlayRef;
4255
- this.data = data;
4247
+ this._overlayRef = _overlayRef;
4248
+ this._data = _data;
4256
4249
  this.inline = false;
4257
4250
  this.windowDesktop = false;
4258
4251
  this._itemsStore.prepareItems();
4259
- this._clear = data.clear;
4260
- this._done = data.done;
4252
+ this._clear = _data.clear;
4253
+ this._done = _data.done;
4254
+ this.filter = _data.filter;
4261
4255
  this.updateWindowWidth();
4262
4256
  }
4263
4257
  FilterDrawerComponent.prototype.updateWindowWidth = function () {
@@ -4290,7 +4284,7 @@
4290
4284
  };
4291
4285
  FilterDrawerComponent.prototype.done = function () {
4292
4286
  this._done();
4293
- this.overlayRef.detach();
4287
+ this._overlayRef.detach();
4294
4288
  };
4295
4289
  FilterDrawerComponent.prototype.backdropClick = function () {
4296
4290
  this.done();
@@ -4298,12 +4292,12 @@
4298
4292
  return FilterDrawerComponent;
4299
4293
  }());
4300
4294
  FilterDrawerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FilterDrawerComponent, deps: [{ token: ExternalParamsController }, { token: i0__namespace.ChangeDetectorRef }, { token: FsFilterItemsStore }, { token: FILTER_DRAWER_OVERLAY }, { token: FILTER_DRAWER_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
4301
- FilterDrawerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterDrawerComponent, selector: "ng-component", inputs: { inline: "inline" }, host: { listeners: { "window:resize": "updateWindowWidth()" } }, ngImport: i0__namespace, template: "<div class=\"filters\">\n <div class=\"filters-wrap\">\n\n <div class=\"filter-by\">\n <mat-icon>tune</mat-icon>\n <span class=\"text\">Filters</span>\n </div>\n\n <div class=\"overflow-shadow filter-items\">\n <div class=\"overflow-shadow-content\">\n <ng-container *fsSkeleton=\"(externalParams.pending$ | async) !== true\">\n <filter-item \n *ngFor=\"let filterItem of items$ | async\"\n class=\"filter-group\"\n [item]=\"filterItem\">\n </filter-item>\n\n <ng-container *ngIf=\"sortItem && sortItem.values && sortItem.values.length > 0\">\n <filter-item \n class=\"filter-group sort\"\n [item]=\"sortItem\">\n </filter-item>\n <filter-item \n class=\"filter-group sort\"\n [item]=\"sortDirectionItem\">\n </filter-item>\n </ng-container>\n </ng-container>\n </div>\n </div>\n\n <fs-filter-drawer-actions \n class=\"filter-actions\"\n *ngIf=\"(externalParams.pending$ | async) !== true\"\n (clear)=\"clear()\"\n (done)=\"done()\">\n </fs-filter-drawer-actions>\n </div>\n</div>\n<div class=\"backdrop\" *ngIf=\"!windowDesktop\" (click)=\"backdropClick()\"></div>\n", styles: [":host ::ng-deep mat-form-field{width:100%}.filter-by{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;padding:20px 25px}.filter-by mat-icon{margin-right:8px}.filter-by .text{font-weight:400;font-size:19px}.filter-actions{display:block;box-sizing:border-box;padding:13px}.filter-actions button{margin-right:6px}.filter-actions button:last-child{margin-right:0}.filters{position:fixed;display:block;top:0;right:0;z-index:1002;bottom:0}.filters .filters-wrap{background:#fff;box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f;width:85vw;max-width:350px;display:flex;flex-direction:column;height:100%;padding-top:calc(env(safe-area-inset-top))}.filters .filters-wrap .filter-items{overflow-y:auto}.filters .filters-wrap .filter-items .overflow-shadow-content{padding:0 25px;box-sizing:border-box}.filters .filter-group{margin:10px 0 0}.filters .filter-group:first-child{margin:0}.filters .filter label{white-space:nowrap;color:#0000008a}.filters .filter .interface.interface-range input,.filters .filter .interface.interface-range .mat-input-wrapper{text-align:center}.filters .filter .interface.interface-range{text-align:center}.filters .filter .interface.interface-datetime fs-datetime.has-time .md-input{width:100%}.filters .filter .interface fs-datetime-range input{text-align:center}.filters .filter .filter-label{width:1%;white-space:nowrap;vertical-align:middle;padding-right:15px}.filters md-autocomplete-container md-input-container{margin:0}.filters .isolate{margin-top:-12px}.filters .isolate .interface{line-height:20px;padding-bottom:1.25em}.filters .isolate md-checkbox{margin:0 0 0 2px}.backdrop{position:fixed;top:0;bottom:0;left:0;right:0;z-index:900;outline:none}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: FilterItemComponent, selector: "filter-item", inputs: ["item"] }, { type: FsFilterDrawerActionsComponent, selector: "fs-filter-drawer-actions", outputs: ["clear", "done"] }], directives: [{ type: i6__namespace$1.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3__namespace.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
4295
+ FilterDrawerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterDrawerComponent, selector: "ng-component", inputs: { inline: "inline" }, host: { listeners: { "window:resize": "updateWindowWidth()" } }, ngImport: i0__namespace, template: "<div class=\"filters\">\n <div class=\"filters-wrap\">\n\n <div class=\"filter-by\">\n <mat-icon>tune</mat-icon>\n <span class=\"text\">Filters</span>\n </div>\n\n <div class=\"overflow-shadow filter-items\">\n <div class=\"overflow-shadow-content\">\n <ng-container *fsSkeleton=\"(externalParams.pending$ | async) !== true\">\n <filter-item \n *ngFor=\"let filterItem of items$ | async\"\n class=\"filter-group\"\n [item]=\"filterItem\"\n [filter]=\"filter\">\n </filter-item>\n\n <ng-container *ngIf=\"sortItem && sortItem.values && sortItem.values.length > 0\">\n <filter-item \n class=\"filter-group sort\"\n [item]=\"sortItem\"\n [filter]=\"filter\">\n </filter-item>\n <filter-item \n class=\"filter-group sort\"\n [item]=\"sortDirectionItem\"\n [filter]=\"filter\">\n </filter-item>\n </ng-container>\n </ng-container>\n </div>\n </div>\n\n <fs-filter-drawer-actions \n class=\"filter-actions\"\n *ngIf=\"(externalParams.pending$ | async) !== true\"\n (clear)=\"clear()\"\n (done)=\"done()\">\n </fs-filter-drawer-actions>\n </div>\n</div>\n<div class=\"backdrop\" *ngIf=\"!windowDesktop\" (click)=\"backdropClick()\"></div>\n", styles: [":host ::ng-deep mat-form-field{width:100%}.filter-by{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;padding:20px 25px}.filter-by mat-icon{margin-right:8px}.filter-by .text{font-weight:400;font-size:19px}.filter-actions{display:block;box-sizing:border-box;padding:13px}.filter-actions button{margin-right:6px}.filter-actions button:last-child{margin-right:0}.filters{position:fixed;display:block;top:0;right:0;z-index:1002;bottom:0}.filters .filters-wrap{background:#fff;box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f;width:85vw;max-width:350px;display:flex;flex-direction:column;height:100%;padding-top:calc(env(safe-area-inset-top))}.filters .filters-wrap .filter-items{overflow-y:auto}.filters .filters-wrap .filter-items .overflow-shadow-content{padding:0 25px;box-sizing:border-box}.filters .filter-group{margin:10px 0 0}.filters .filter-group:first-child{margin:0}.filters .filter label{white-space:nowrap;color:#0000008a}.filters .filter .interface.interface-range input,.filters .filter .interface.interface-range .mat-input-wrapper{text-align:center}.filters .filter .interface.interface-range{text-align:center}.filters .filter .interface.interface-datetime fs-datetime.has-time .md-input{width:100%}.filters .filter .interface fs-datetime-range input{text-align:center}.filters .filter .filter-label{width:1%;white-space:nowrap;vertical-align:middle;padding-right:15px}.filters md-autocomplete-container md-input-container{margin:0}.filters .isolate{margin-top:-12px}.filters .isolate .interface{line-height:20px;padding-bottom:1.25em}.filters .isolate md-checkbox{margin:0 0 0 2px}.backdrop{position:fixed;top:0;bottom:0;left:0;right:0;z-index:900;outline:none}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: FilterItemComponent, selector: "filter-item", inputs: ["item", "filter"] }, { type: FsFilterDrawerActionsComponent, selector: "fs-filter-drawer-actions", outputs: ["clear", "done"] }], directives: [{ type: i6__namespace$1.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3__namespace.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
4302
4296
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FilterDrawerComponent, decorators: [{
4303
4297
  type: i0.Component,
4304
4298
  args: [{
4305
4299
  templateUrl: './filter-drawer.component.html',
4306
- styleUrls: ['filter-drawer.component.scss'],
4300
+ styleUrls: ['./filter-drawer.component.scss'],
4307
4301
  // Commented out because filter items are not updating with a delayed observable. Need to figure this out.
4308
4302
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
4309
4303
  }]
@@ -4315,11 +4309,11 @@
4315
4309
  type: i0.Inject,
4316
4310
  args: [FILTER_DRAWER_DATA]
4317
4311
  }] }];
4318
- }, propDecorators: { updateWindowWidth: [{
4312
+ }, propDecorators: { inline: [{
4313
+ type: i0.Input
4314
+ }], updateWindowWidth: [{
4319
4315
  type: i0.HostListener,
4320
4316
  args: ['window:resize']
4321
- }], inline: [{
4322
- type: i0.Input
4323
4317
  }] } });
4324
4318
 
4325
4319
  var ActionMenuItem = /** @class */ (function () {
@@ -4692,9 +4686,9 @@
4692
4686
  });
4693
4687
 
4694
4688
  var FsFilterOverlayService = /** @class */ (function () {
4695
- function FsFilterOverlayService(_injector, _filterMeta, _overlay, _focusController) {
4696
- this._injector = _injector;
4689
+ function FsFilterOverlayService(_filterMeta, _injector, _overlay, _focusController) {
4697
4690
  this._filterMeta = _filterMeta;
4691
+ this._injector = _injector;
4698
4692
  this._overlay = _overlay;
4699
4693
  this._focusController = _focusController;
4700
4694
  this.detach$ = new rxjs.Subject();
@@ -4719,7 +4713,7 @@
4719
4713
  if (this._overlayRef) {
4720
4714
  this._overlayRef.detach();
4721
4715
  this._overlayRef = null;
4722
- this.removeFilterClass();
4716
+ this._removeFilterClass();
4723
4717
  }
4724
4718
  };
4725
4719
  FsFilterOverlayService.prototype.open = function () {
@@ -4740,8 +4734,8 @@
4740
4734
  .subscribe(function () {
4741
4735
  _this.attach$.next();
4742
4736
  });
4743
- this.addFilterClass();
4744
- return this.openPortalPreview();
4737
+ this._addFilterClass();
4738
+ return this._openPortalPreview();
4745
4739
  };
4746
4740
  FsFilterOverlayService.prototype.ngOnDestroy = function () {
4747
4741
  this._destroy$.next();
@@ -4750,12 +4744,16 @@
4750
4744
  FsFilterOverlayService.prototype._createOverlay = function () {
4751
4745
  var overlayConfig = new i1$6.OverlayConfig({
4752
4746
  hasBackdrop: true,
4753
- backdropClass: 'fs-filter-backdrop'
4747
+ backdropClass: 'fs-filter-backdrop',
4754
4748
  });
4755
4749
  return this._overlay.create(overlayConfig);
4756
4750
  };
4757
- FsFilterOverlayService.prototype.openPortalPreview = function () {
4758
- var data = { done: this._doneFn, clear: this._clearFn };
4751
+ FsFilterOverlayService.prototype._openPortalPreview = function () {
4752
+ var data = {
4753
+ done: this._doneFn,
4754
+ clear: this._clearFn,
4755
+ filter: this.filter,
4756
+ };
4759
4757
  var injector = this._createInjector(this._injector, data, this._overlayRef);
4760
4758
  var containerPortal = new portal.ComponentPortal(FilterDrawerComponent, undefined, injector);
4761
4759
  var containerRef = this._overlayRef.attach(containerPortal);
@@ -4768,13 +4766,13 @@
4768
4766
  ]);
4769
4767
  return new portal.PortalInjector(parentInjector, injectionTokens);
4770
4768
  };
4771
- FsFilterOverlayService.prototype.removeFilterClass = function () {
4769
+ FsFilterOverlayService.prototype._removeFilterClass = function () {
4772
4770
  this._filterMeta.openedFilters--;
4773
4771
  if (this._filterMeta.openedFilters === 0) {
4774
4772
  window.document.body.classList.remove('fs-filter-open');
4775
4773
  }
4776
4774
  };
4777
- FsFilterOverlayService.prototype.addFilterClass = function () {
4775
+ FsFilterOverlayService.prototype._addFilterClass = function () {
4778
4776
  this._filterMeta.openedFilters++;
4779
4777
  if (this._filterMeta.openedFilters === 1) {
4780
4778
  window.document.body.classList.add('fs-filter-open');
@@ -4792,15 +4790,15 @@
4792
4790
  };
4793
4791
  return FsFilterOverlayService;
4794
4792
  }());
4795
- FsFilterOverlayService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsFilterOverlayService, deps: [{ token: i0__namespace.Injector }, { token: FS_FILTER_META }, { token: i1__namespace$6.Overlay }, { token: FocusControllerService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
4793
+ FsFilterOverlayService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsFilterOverlayService, deps: [{ token: FS_FILTER_META }, { token: i0__namespace.Injector }, { token: i1__namespace$6.Overlay }, { token: FocusControllerService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
4796
4794
  FsFilterOverlayService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsFilterOverlayService });
4797
4795
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsFilterOverlayService, decorators: [{
4798
4796
  type: i0.Injectable
4799
4797
  }], ctorParameters: function () {
4800
- return [{ type: i0__namespace.Injector }, { type: undefined, decorators: [{
4798
+ return [{ type: undefined, decorators: [{
4801
4799
  type: i0.Inject,
4802
4800
  args: [FS_FILTER_META]
4803
- }] }, { type: i1__namespace$6.Overlay }, { type: FocusControllerService }];
4801
+ }] }, { type: i0__namespace.Injector }, { type: i1__namespace$6.Overlay }, { type: FocusControllerService }];
4804
4802
  } });
4805
4803
 
4806
4804
  var FilterStatusBarDirective = /** @class */ (function () {
@@ -4845,6 +4843,8 @@
4845
4843
  this._hasFilterChips$ = new rxjs.BehaviorSubject(false);
4846
4844
  this._keyword$ = new rxjs.Subject();
4847
4845
  this._destroy$ = new rxjs.Subject();
4846
+ this._filterItems.filter = this;
4847
+ this._filterOverlay.filter = this;
4848
4848
  this._listenWhenFilterReady();
4849
4849
  this._updateWindowWidth();
4850
4850
  this._filterOverlay.attach$
@@ -5146,9 +5146,7 @@
5146
5146
  return item.model;
5147
5147
  }));
5148
5148
  }
5149
- else {
5150
- return null;
5151
- }
5149
+ return null;
5152
5150
  };
5153
5151
  FilterComponent.prototype.changeVisibility = function (state) {
5154
5152
  if (state === this.showFilterMenu) {
@@ -5236,6 +5234,7 @@
5236
5234
  };
5237
5235
  /**
5238
5236
  * Update filter actions config
5237
+ *
5239
5238
  * @param actions
5240
5239
  */
5241
5240
  FilterComponent.prototype.updateActions = function (actions) {
@@ -5284,6 +5283,9 @@
5284
5283
  this._externalParams.initItems();
5285
5284
  this._syncSearchInputWithKeyword();
5286
5285
  };
5286
+ FilterComponent.prototype.keywordChange = function (keyword) {
5287
+ this._keyword$.next(keyword);
5288
+ };
5287
5289
  FilterComponent.prototype._initFilterWithConfig = function (config) {
5288
5290
  if (this.config) {
5289
5291
  this._filterItems.destroyItems();
@@ -5328,9 +5330,6 @@
5328
5330
  });
5329
5331
  });
5330
5332
  };
5331
- FilterComponent.prototype.keywordChange = function (keyword) {
5332
- this._keyword$.next(keyword);
5333
- };
5334
5333
  FilterComponent.prototype._listenInputChanges = function () {
5335
5334
  var _this = this;
5336
5335
  this._keyword$
@@ -5717,9 +5716,6 @@
5717
5716
  FilterStatusBarDirective,
5718
5717
  FsSavedFiltersMenuComponent,
5719
5718
  ],
5720
- entryComponents: [
5721
- FilterDrawerComponent,
5722
- ],
5723
5719
  }]
5724
5720
  }] });
5725
5721