npm - @c8y/ngx-components - Versions diffs - 1018.503.56 → 1018.503.63 - Mend

@c8y/ngx-components 1018.503.56 → 1018.503.63

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 (55) hide show

package/fesm2020/c8y-ngx-components-ecosystem-shared.mjs CHANGED Viewed

@@ -1893,10 +1893,10 @@ class ListFiltersComponent {
     }
 }
 ListFiltersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ListFiltersComponent, deps: [{ token: i1.FormBuilder }, { token: i2.AppStateService }, { token: i3.TranslateService }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component });
-ListFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: ListFiltersComponent, selector: "c8y-list-filters", inputs: { packageTypes: "packageTypes", packageAvailabilities: "packageAvailabilities", packageContents: "packageContents" }, outputs: { filterPipeChange: "filterPipeChange" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: FilterInputComponent, descendants: true }], ngImport: i0, template: "<form class=\"d-flex a-i-center\" [formGroup]=\"formGroup\">\n  <c8y-filter (onSearch)=\"setFilterTerm($event)\"></c8y-filter>\n\n  <div\n    *ngIf=\"predefinedFiltersVisible\"\n    class=\"dropdown m-l-8 m-r-4\"\n    dropdown\n    (isOpenChange)=\"toggleDropdown($event)\"\n    #filtersDropdown=\"bs-dropdown\"\n    [cdkTrapFocus]=\"filtersDropdown.isOpen\"\n    [insideClick]=\"true\"\n  >\n    <div class=\"input-group d-inline-flex\">\n      <button\n        class=\"btn-clean form-control p-l-8 p-r-16 a-s-stretch d-flex a-i-center w-auto\"\n        title=\"{{ 'Filters' | translate }}\"\n        dropdownToggle\n      >\n        <span [ngPlural]=\"chips.length\">\n          <ng-template ngPluralCase=\"=0\">\n            {{ 'Filters' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"=1\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filter' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"other\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filters' | translate }}\n          </ng-template>\n        </span>\n        <span class=\"caret\"></span>\n      </button>\n      <div\n        class=\"input-group-addon p-t-0 p-b-0 d-flex gap-4 a-i-center inner-scroll\"\n        *ngIf=\"chips.length > 0\"\n      >\n        <ng-container *ngFor=\"let chip of chips\">\n          <span class=\"label label-info chip\" *ngIf=\"chip[1].value\">\n            <button\n              class=\"btn btn-xs btn-clean text-10\"\n              type=\"button\"\n              title=\"{{ 'Remove' | translate }} {{ chip[0] | translate | titlecase }}\"\n              (click)=\"deselectChip(chip)\"\n            >\n              <i c8yIcon=\"times\"></i>\n            </button>\n            {{ chip[0] | translate | titlecase }}\n          </span>\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"dropdown-menu\" *dropdownMenu>\n      <div class=\"dropdown-form\">\n        <c8y-form-group *ngIf=\"packageTypes.length\" formGroupName=\"type\">\n          <label>\n            {{ 'Type' | translate }}\n          </label>\n          <label class=\"c8y-checkbox\" *ngFor=\"let type of packageTypes\" [title]=\"type | translate\">\n            <input type=\"checkbox\" [formControlName]=\"type\" [value]=\"type\" />\n            <span></span>\n            <span>{{ type | translate | titlecase }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageAvailabilities.length\" formGroupName=\"availability\">\n          <label>\n            {{ 'Availability' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let availability of packageAvailabilities\"\n            [title]=\"availability | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"availability\" [value]=\"availability\" />\n            <span></span>\n            <span>{{ availability | translate }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageContents.length\" formGroupName=\"content\">\n          <label>\n            {{ 'Content' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let content of packageContents\"\n            [title]=\"content | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"content\" [value]=\"content\" />\n            <span></span>\n            <span>{{ content | translate }}</span>\n          </label>\n        </c8y-form-group>\n      </div>\n      <div class=\"p-16 d-flex gap-8 separator-top\">\n        <button\n          class=\"btn btn-default btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Reset' | translate }}\"\n          (click)=\"reset(); filtersDropdown.isOpen = false\"\n          translate\n        >\n          Reset\n        </button>\n\n        <button\n          class=\"btn btn-primary btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Apply' | translate }}\"\n          (click)=\"applyPredefinedFilters(); filtersDropdown.isOpen = false\"\n          [disabled]=\"formGroup.pristine && formGroup.untouched\"\n          translate\n        >\n          Apply\n        </button>\n      </div>\n    </div>\n  </div>\n</form>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.NgPlural, selector: "[ngPlural]", inputs: ["ngPlural"] }, { kind: "directive", type: i3$2.NgPluralCase, selector: "[ngPluralCase]" }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: i2.FilterInputComponent, selector: "c8y-filter", inputs: ["icon"], outputs: ["onSearch"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i6.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i6.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i6.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: i8$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3$2.TitleCasePipe, name: "titlecase" }] });
+ListFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: ListFiltersComponent, selector: "c8y-list-filters", inputs: { packageTypes: "packageTypes", packageAvailabilities: "packageAvailabilities", packageContents: "packageContents" }, outputs: { filterPipeChange: "filterPipeChange" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: FilterInputComponent, descendants: true }], ngImport: i0, template: "<form class=\"d-flex a-i-center\" [formGroup]=\"formGroup\">\n  <c8y-filter (onSearch)=\"setFilterTerm($event)\"></c8y-filter>\n\n  <div\n    *ngIf=\"predefinedFiltersVisible\"\n    class=\"dropdown m-l-8 m-r-4\"\n    dropdown\n    (isOpenChange)=\"toggleDropdown($event)\"\n    #filtersDropdown=\"bs-dropdown\"\n    [cdkTrapFocus]=\"filtersDropdown.isOpen\"\n    [insideClick]=\"true\"\n  >\n    <div class=\"input-group d-inline-flex\">\n      <button\n        class=\"btn-clean form-control p-l-8 p-r-16 a-s-stretch d-flex a-i-center w-auto\"\n        title=\"{{ 'Filters' | translate }}\"\n        dropdownToggle\n      >\n        <span [ngPlural]=\"chips.length\">\n          <ng-template ngPluralCase=\"=0\">\n            {{ 'Filters' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"=1\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filter' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"other\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filters' | translate }}\n          </ng-template>\n        </span>\n        <span class=\"caret\"></span>\n      </button>\n      <div\n        class=\"input-group-addon p-t-0 p-b-0 d-flex gap-4 a-i-center inner-scroll\"\n        *ngIf=\"chips.length > 0\"\n      >\n        <ng-container *ngFor=\"let chip of chips\">\n          <span class=\"label label-info chip\" *ngIf=\"chip[1].value\">\n            <button\n              class=\"btn btn-xs btn-clean text-10\"\n              type=\"button\"\n              title=\"{{ 'Remove' | translate }} {{ chip[0] | translate | titlecase }}\"\n              (click)=\"deselectChip(chip)\"\n            >\n              <i c8yIcon=\"times\"></i>\n            </button>\n            {{ chip[0] | translate | titlecase }}\n          </span>\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"dropdown-menu\" *dropdownMenu>\n      <div class=\"dropdown-form\">\n        <c8y-form-group *ngIf=\"packageTypes.length\" formGroupName=\"type\">\n          <label>\n            {{ 'Type' | translate }}\n          </label>\n          <label class=\"c8y-checkbox\" *ngFor=\"let type of packageTypes\" [title]=\"type | translate\">\n            <input type=\"checkbox\" [formControlName]=\"type\" [value]=\"type\" />\n            <span></span>\n            <span>{{ type | translate | titlecase }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageAvailabilities.length\" formGroupName=\"availability\">\n          <label>\n            {{ 'Availability`of package based on app state`' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let availability of packageAvailabilities\"\n            [title]=\"availability | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"availability\" [value]=\"availability\" />\n            <span></span>\n            <span>{{ availability | translate }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageContents.length\" formGroupName=\"content\">\n          <label>\n            {{ 'Content' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let content of packageContents\"\n            [title]=\"content | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"content\" [value]=\"content\" />\n            <span></span>\n            <span>{{ content | translate }}</span>\n          </label>\n        </c8y-form-group>\n      </div>\n      <div class=\"p-16 d-flex gap-8 separator-top\">\n        <button\n          class=\"btn btn-default btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Reset' | translate }}\"\n          (click)=\"reset(); filtersDropdown.isOpen = false\"\n          translate\n        >\n          Reset\n        </button>\n\n        <button\n          class=\"btn btn-primary btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Apply' | translate }}\"\n          (click)=\"applyPredefinedFilters(); filtersDropdown.isOpen = false\"\n          [disabled]=\"formGroup.pristine && formGroup.untouched\"\n          translate\n        >\n          Apply\n        </button>\n      </div>\n    </div>\n  </div>\n</form>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.NgPlural, selector: "[ngPlural]", inputs: ["ngPlural"] }, { kind: "directive", type: i3$2.NgPluralCase, selector: "[ngPluralCase]" }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: i2.FilterInputComponent, selector: "c8y-filter", inputs: ["icon"], outputs: ["onSearch"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i6.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i6.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i6.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: i8$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3$2.TitleCasePipe, name: "titlecase" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ListFiltersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-list-filters', template: "<form class=\"d-flex a-i-center\" [formGroup]=\"formGroup\">\n  <c8y-filter (onSearch)=\"setFilterTerm($event)\"></c8y-filter>\n\n  <div\n    *ngIf=\"predefinedFiltersVisible\"\n    class=\"dropdown m-l-8 m-r-4\"\n    dropdown\n    (isOpenChange)=\"toggleDropdown($event)\"\n    #filtersDropdown=\"bs-dropdown\"\n    [cdkTrapFocus]=\"filtersDropdown.isOpen\"\n    [insideClick]=\"true\"\n  >\n    <div class=\"input-group d-inline-flex\">\n      <button\n        class=\"btn-clean form-control p-l-8 p-r-16 a-s-stretch d-flex a-i-center w-auto\"\n        title=\"{{ 'Filters' | translate }}\"\n        dropdownToggle\n      >\n        <span [ngPlural]=\"chips.length\">\n          <ng-template ngPluralCase=\"=0\">\n            {{ 'Filters' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"=1\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filter' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"other\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filters' | translate }}\n          </ng-template>\n        </span>\n        <span class=\"caret\"></span>\n      </button>\n      <div\n        class=\"input-group-addon p-t-0 p-b-0 d-flex gap-4 a-i-center inner-scroll\"\n        *ngIf=\"chips.length > 0\"\n      >\n        <ng-container *ngFor=\"let chip of chips\">\n          <span class=\"label label-info chip\" *ngIf=\"chip[1].value\">\n            <button\n              class=\"btn btn-xs btn-clean text-10\"\n              type=\"button\"\n              title=\"{{ 'Remove' | translate }} {{ chip[0] | translate | titlecase }}\"\n              (click)=\"deselectChip(chip)\"\n            >\n              <i c8yIcon=\"times\"></i>\n            </button>\n            {{ chip[0] | translate | titlecase }}\n          </span>\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"dropdown-menu\" *dropdownMenu>\n      <div class=\"dropdown-form\">\n        <c8y-form-group *ngIf=\"packageTypes.length\" formGroupName=\"type\">\n          <label>\n            {{ 'Type' | translate }}\n          </label>\n          <label class=\"c8y-checkbox\" *ngFor=\"let type of packageTypes\" [title]=\"type | translate\">\n            <input type=\"checkbox\" [formControlName]=\"type\" [value]=\"type\" />\n            <span></span>\n            <span>{{ type | translate | titlecase }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageAvailabilities.length\" formGroupName=\"availability\">\n          <label>\n            {{ 'Availability' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let availability of packageAvailabilities\"\n            [title]=\"availability | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"availability\" [value]=\"availability\" />\n            <span></span>\n            <span>{{ availability | translate }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageContents.length\" formGroupName=\"content\">\n          <label>\n            {{ 'Content' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let content of packageContents\"\n            [title]=\"content | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"content\" [value]=\"content\" />\n            <span></span>\n            <span>{{ content | translate }}</span>\n          </label>\n        </c8y-form-group>\n      </div>\n      <div class=\"p-16 d-flex gap-8 separator-top\">\n        <button\n          class=\"btn btn-default btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Reset' | translate }}\"\n          (click)=\"reset(); filtersDropdown.isOpen = false\"\n          translate\n        >\n          Reset\n        </button>\n\n        <button\n          class=\"btn btn-primary btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Apply' | translate }}\"\n          (click)=\"applyPredefinedFilters(); filtersDropdown.isOpen = false\"\n          [disabled]=\"formGroup.pristine && formGroup.untouched\"\n          translate\n        >\n          Apply\n        </button>\n      </div>\n    </div>\n  </div>\n</form>\n" }]
+            args: [{ selector: 'c8y-list-filters', template: "<form class=\"d-flex a-i-center\" [formGroup]=\"formGroup\">\n  <c8y-filter (onSearch)=\"setFilterTerm($event)\"></c8y-filter>\n\n  <div\n    *ngIf=\"predefinedFiltersVisible\"\n    class=\"dropdown m-l-8 m-r-4\"\n    dropdown\n    (isOpenChange)=\"toggleDropdown($event)\"\n    #filtersDropdown=\"bs-dropdown\"\n    [cdkTrapFocus]=\"filtersDropdown.isOpen\"\n    [insideClick]=\"true\"\n  >\n    <div class=\"input-group d-inline-flex\">\n      <button\n        class=\"btn-clean form-control p-l-8 p-r-16 a-s-stretch d-flex a-i-center w-auto\"\n        title=\"{{ 'Filters' | translate }}\"\n        dropdownToggle\n      >\n        <span [ngPlural]=\"chips.length\">\n          <ng-template ngPluralCase=\"=0\">\n            {{ 'Filters' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"=1\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filter' | translate }}\n          </ng-template>\n          <ng-template ngPluralCase=\"other\">\n            <span class=\"badge badge-info\">{{ chips.length }}</span>\n            {{ 'Filters' | translate }}\n          </ng-template>\n        </span>\n        <span class=\"caret\"></span>\n      </button>\n      <div\n        class=\"input-group-addon p-t-0 p-b-0 d-flex gap-4 a-i-center inner-scroll\"\n        *ngIf=\"chips.length > 0\"\n      >\n        <ng-container *ngFor=\"let chip of chips\">\n          <span class=\"label label-info chip\" *ngIf=\"chip[1].value\">\n            <button\n              class=\"btn btn-xs btn-clean text-10\"\n              type=\"button\"\n              title=\"{{ 'Remove' | translate }} {{ chip[0] | translate | titlecase }}\"\n              (click)=\"deselectChip(chip)\"\n            >\n              <i c8yIcon=\"times\"></i>\n            </button>\n            {{ chip[0] | translate | titlecase }}\n          </span>\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"dropdown-menu\" *dropdownMenu>\n      <div class=\"dropdown-form\">\n        <c8y-form-group *ngIf=\"packageTypes.length\" formGroupName=\"type\">\n          <label>\n            {{ 'Type' | translate }}\n          </label>\n          <label class=\"c8y-checkbox\" *ngFor=\"let type of packageTypes\" [title]=\"type | translate\">\n            <input type=\"checkbox\" [formControlName]=\"type\" [value]=\"type\" />\n            <span></span>\n            <span>{{ type | translate | titlecase }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageAvailabilities.length\" formGroupName=\"availability\">\n          <label>\n            {{ 'Availability`of package based on app state`' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let availability of packageAvailabilities\"\n            [title]=\"availability | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"availability\" [value]=\"availability\" />\n            <span></span>\n            <span>{{ availability | translate }}</span>\n          </label>\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"packageContents.length\" formGroupName=\"content\">\n          <label>\n            {{ 'Content' | translate }}\n          </label>\n          <label\n            class=\"c8y-checkbox\"\n            *ngFor=\"let content of packageContents\"\n            [title]=\"content | translate\"\n          >\n            <input type=\"checkbox\" [formControlName]=\"content\" [value]=\"content\" />\n            <span></span>\n            <span>{{ content | translate }}</span>\n          </label>\n        </c8y-form-group>\n      </div>\n      <div class=\"p-16 d-flex gap-8 separator-top\">\n        <button\n          class=\"btn btn-default btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Reset' | translate }}\"\n          (click)=\"reset(); filtersDropdown.isOpen = false\"\n          translate\n        >\n          Reset\n        </button>\n\n        <button\n          class=\"btn btn-primary btn-sm flex-grow\"\n          type=\"button\"\n          title=\"{{ 'Apply' | translate }}\"\n          (click)=\"applyPredefinedFilters(); filtersDropdown.isOpen = false\"\n          [disabled]=\"formGroup.pristine && formGroup.untouched\"\n          translate\n        >\n          Apply\n        </button>\n      </div>\n    </div>\n  </div>\n</form>\n" }]
         }], ctorParameters: function () { return [{ type: i1.FormBuilder }, { type: i2.AppStateService }, { type: i3.TranslateService }, { type: i2.GainsightService }]; }, propDecorators: { packageTypes: [{
                 type: Input
             }], packageAvailabilities: [{