@tilde-nlp/ngx-common 2.0.18 → 2.0.20
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.
- package/esm2020/lib/filter-bar/filter-bar.component.mjs +5 -22
- package/esm2020/lib/filter-bar/filter-bar.module.mjs +8 -4
- package/esm2020/lib/pipes/index.mjs +2 -1
- package/esm2020/lib/pipes/sort-translations-by-property/index.mjs +3 -0
- package/esm2020/lib/pipes/sort-translations-by-property/sort-translations-by-property.module.mjs +18 -0
- package/esm2020/lib/pipes/sort-translations-by-property/sort-translations-by-property.pipe.mjs +38 -0
- package/fesm2015/tilde-nlp-ngx-common.mjs +65 -32
- package/fesm2015/tilde-nlp-ngx-common.mjs.map +1 -1
- package/fesm2020/tilde-nlp-ngx-common.mjs +59 -25
- package/fesm2020/tilde-nlp-ngx-common.mjs.map +1 -1
- package/lib/filter-bar/filter-bar.component.d.ts +0 -1
- package/lib/filter-bar/filter-bar.module.d.ts +2 -1
- package/lib/pipes/index.d.ts +1 -0
- package/lib/pipes/sort-translations-by-property/index.d.ts +2 -0
- package/lib/pipes/sort-translations-by-property/sort-translations-by-property.module.d.ts +8 -0
- package/lib/pipes/sort-translations-by-property/sort-translations-by-property.pipe.d.ts +15 -0
- package/package.json +1 -1
|
@@ -373,6 +373,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
373
373
|
}]
|
|
374
374
|
}] });
|
|
375
375
|
|
|
376
|
+
/**
|
|
377
|
+
* Pipe transforms an array of objects by sorting them based on a provided localization key in A-Z order.
|
|
378
|
+
* Unlike the "sortTranslations" pipe, it does not require knowledge of the current language, and it does not require the use of the async pipe.
|
|
379
|
+
*/
|
|
380
|
+
class SortTranslationsByPropertyPipe {
|
|
381
|
+
constructor(translate) {
|
|
382
|
+
this.translate = translate;
|
|
383
|
+
}
|
|
384
|
+
/**
|
|
385
|
+
* Transforms the input array of objects by sorting them based on the specified sortingValueKey.
|
|
386
|
+
* @param values An array of objects to be sorted.
|
|
387
|
+
* @param sortingValueKey The key by which the provided values should be sorted.
|
|
388
|
+
*/
|
|
389
|
+
transform(values, sortingValueKey) {
|
|
390
|
+
values.sort((a, b) => {
|
|
391
|
+
const aTranslated = this.translate.instant(a[sortingValueKey]).toLowerCase();
|
|
392
|
+
const bTranslated = this.translate.instant(b[sortingValueKey]).toLowerCase();
|
|
393
|
+
if (aTranslated < bTranslated)
|
|
394
|
+
return -1;
|
|
395
|
+
if (aTranslated > bTranslated)
|
|
396
|
+
return 1;
|
|
397
|
+
return 0;
|
|
398
|
+
});
|
|
399
|
+
return values;
|
|
400
|
+
}
|
|
401
|
+
}
|
|
402
|
+
SortTranslationsByPropertyPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortTranslationsByPropertyPipe, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
403
|
+
SortTranslationsByPropertyPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: SortTranslationsByPropertyPipe, name: "sortTranslationsByProperty" });
|
|
404
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortTranslationsByPropertyPipe, decorators: [{
|
|
405
|
+
type: Pipe,
|
|
406
|
+
args: [{
|
|
407
|
+
name: 'sortTranslationsByProperty',
|
|
408
|
+
}]
|
|
409
|
+
}], ctorParameters: function () { return [{ type: i1$1.TranslateService }]; } });
|
|
410
|
+
|
|
411
|
+
class SortTranslationsByPropertyModule {
|
|
412
|
+
}
|
|
413
|
+
SortTranslationsByPropertyModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortTranslationsByPropertyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
414
|
+
SortTranslationsByPropertyModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: SortTranslationsByPropertyModule, declarations: [SortTranslationsByPropertyPipe], imports: [CommonModule], exports: [SortTranslationsByPropertyPipe] });
|
|
415
|
+
SortTranslationsByPropertyModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortTranslationsByPropertyModule, imports: [CommonModule] });
|
|
416
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortTranslationsByPropertyModule, decorators: [{
|
|
417
|
+
type: NgModule,
|
|
418
|
+
args: [{
|
|
419
|
+
declarations: [SortTranslationsByPropertyPipe],
|
|
420
|
+
imports: [CommonModule],
|
|
421
|
+
exports: [SortTranslationsByPropertyPipe],
|
|
422
|
+
}]
|
|
423
|
+
}] });
|
|
424
|
+
|
|
376
425
|
const DateAgoSettingsToken = "DATE_AGO_SETTINGS";
|
|
377
426
|
|
|
378
427
|
/**
|
|
@@ -1192,7 +1241,7 @@ class FilterBarComponent {
|
|
|
1192
1241
|
this.emitFilters();
|
|
1193
1242
|
}
|
|
1194
1243
|
ngOnInit() {
|
|
1195
|
-
this.
|
|
1244
|
+
this.settings.filters?.forEach((field) => {
|
|
1196
1245
|
this.filterFormGroup.addControl(field.fieldName, new FormControl([]));
|
|
1197
1246
|
});
|
|
1198
1247
|
this.subscribeToFormValueChanges();
|
|
@@ -1232,24 +1281,6 @@ class FilterBarComponent {
|
|
|
1232
1281
|
const newArray = control.value;
|
|
1233
1282
|
newArray.splice(ix, 1);
|
|
1234
1283
|
control.setValue(newArray);
|
|
1235
|
-
// this.form.setValue(this.filters.filters);
|
|
1236
|
-
}
|
|
1237
|
-
getSortedFilters() {
|
|
1238
|
-
if (this.settings?.filters) {
|
|
1239
|
-
this.settings.filters.forEach((item) => {
|
|
1240
|
-
item.values.sort((a, b) => {
|
|
1241
|
-
const aTranslated = this.translate.instant(a.key).toLowerCase();
|
|
1242
|
-
const bTranslated = this.translate.instant(b.key).toLowerCase();
|
|
1243
|
-
if (aTranslated < bTranslated)
|
|
1244
|
-
return -1;
|
|
1245
|
-
if (aTranslated > bTranslated)
|
|
1246
|
-
return 1;
|
|
1247
|
-
return 0;
|
|
1248
|
-
});
|
|
1249
|
-
});
|
|
1250
|
-
return this.settings.filters;
|
|
1251
|
-
}
|
|
1252
|
-
return [];
|
|
1253
1284
|
}
|
|
1254
1285
|
checkOverflow() {
|
|
1255
1286
|
if (this.filterWrapper) {
|
|
@@ -1272,10 +1303,10 @@ class FilterBarComponent {
|
|
|
1272
1303
|
}
|
|
1273
1304
|
}
|
|
1274
1305
|
FilterBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1275
|
-
FilterBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FilterBarComponent, selector: "tld-filter-bar", inputs: { settings: "settings", filterRowVisible: "filterRowVisible" }, outputs: { filterBarChange: "filterBarChange" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "filterWrapper", first: true, predicate: ["filterWrapper"], descendants: true }], ngImport: i0, template: "<div class=\"filter-row\" *ngIf=\"filterRowVisible\">\r\n <div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper [formGroup]=\"form\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch && !filterOverflow || activeFilterIndex === searchIndex\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [placeholder]=\"searchTitle | translate\"\r\n [formControlName]=\"inputFormControlName\">\r\n </mat-form-field>\r\n <ng-container [formGroup]=\"filterFormGroup\">\r\n\r\n <mat-form-field [ngClass]=\"{'hidden': filterOverflow && activeFilterIndex !== i}\" *ngFor=\"let filter of settings?.filters; let i = index\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple [formControlName]=\"filter.fieldName\">\r\n <mat-option *ngFor=\"let value of filter.values\" [value]=\"value\">\r\n
|
|
1306
|
+
FilterBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FilterBarComponent, selector: "tld-filter-bar", inputs: { settings: "settings", filterRowVisible: "filterRowVisible" }, outputs: { filterBarChange: "filterBarChange" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "filterWrapper", first: true, predicate: ["filterWrapper"], descendants: true }], ngImport: i0, template: "<div class=\"filter-row\" *ngIf=\"filterRowVisible\">\r\n <div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper [formGroup]=\"form\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch && !filterOverflow || activeFilterIndex === searchIndex\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [placeholder]=\"searchTitle | translate\"\r\n [formControlName]=\"inputFormControlName\">\r\n </mat-form-field>\r\n <ng-container [formGroup]=\"filterFormGroup\">\r\n\r\n <mat-form-field [ngClass]=\"{'hidden': filterOverflow && activeFilterIndex !== i, 'engine-filter': !filterOverflow}\" *ngFor=\"let filter of settings?.filters; let i = index\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple [formControlName]=\"filter.fieldName\">\r\n <ng-container *ngIf=\"filter.values.length\">\r\n <mat-option *ngFor=\"let value of filter.values | sortTranslationsByProperty:'key'\" [value]=\"value\">\r\n {{value.key | translate : {default: value.value | titlecase } }}\r\n </mat-option>\r\n </ng-container>\r\n </mat-select>\r\n </mat-form-field>\r\n </ng-container>\r\n </div>\r\n <button mat-icon-button (click)=\"switchLeft()\" *ngIf=\"filterOverflow\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_back_ios\r\n </span>\r\n </button>\r\n <button mat-icon-button *ngIf=\"filterOverflow\" (click)=\"switchRight()\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_forward_ios\r\n </span>\r\n </button>\r\n</div>\r\n<mat-chip-list>\r\n <div *ngFor=\"let filter of settings?.filters\">\r\n <mat-chip *ngFor=\"let filterValue of filterFormGroupValue[filter.fieldName]; let ix=index\"\r\n (removed)=\"removeFilter(filter.fieldName, ix)\" class=\"text-s\">\r\n <button matChipRemove>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <span class=\"chip-filter-title\">{{filter.title | translate}}:</span>\r\n <span class=\"chip-value semi-bold\"> {{filterValue.key | translate : {default: filterValue.value | titlecase }\r\n }}</span>\r\n </mat-chip>\r\n </div>\r\n</mat-chip-list>\r\n", styles: [":host{display:inline-block}.filter-row{display:flex;background-color:var(--base-95);min-height:40px;min-width:100%;border-radius:.5rem;padding:.5rem 1.25rem 1rem;max-width:100%;align-items:baseline;margin-bottom:.5rem}.filter-row ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}.filter-row ::ng-deep .mat-form-field-underline{bottom:0!important}.search-input{background-color:unset;border:none}.engine-filter{margin-left:1rem}.filter-bar-search-input{width:100%}.filter-bar-search-input::ng-deep .material-icons-outlined{vertical-align:bottom}.material-icons-outlined{color:var(--base-40)}.filter-wrapper{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;flex:1}.mat-chip.mat-standard-chip{background-color:var(--base-95);padding-left:.5em;padding-right:.75em;border:.5px solid var(--base-70)}.mat-chip.mat-standard-chip span{display:inline-block}.mat-chip.mat-standard-chip .chip-filter-title+.chip-value{margin-left:.25rem}.mat-chip .mat-chip-remove{margin-left:0;margin-right:.5em;color:var(--base-40);opacity:1}.hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i2$3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2$3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i3.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$2.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i1$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i12.MatChipList, selector: "mat-chip-list", inputs: ["role", "aria-describedby", "errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { kind: "directive", type: i12.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "role", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { kind: "directive", type: i12.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i2$1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: SortTranslationsByPropertyPipe, name: "sortTranslationsByProperty" }] });
|
|
1276
1307
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarComponent, decorators: [{
|
|
1277
1308
|
type: Component,
|
|
1278
|
-
args: [{ selector: 'tld-filter-bar', template: "<div class=\"filter-row\" *ngIf=\"filterRowVisible\">\r\n <div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper [formGroup]=\"form\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch && !filterOverflow || activeFilterIndex === searchIndex\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [placeholder]=\"searchTitle | translate\"\r\n [formControlName]=\"inputFormControlName\">\r\n </mat-form-field>\r\n <ng-container [formGroup]=\"filterFormGroup\">\r\n\r\n <mat-form-field [ngClass]=\"{'hidden': filterOverflow && activeFilterIndex !== i}\" *ngFor=\"let filter of settings?.filters; let i = index\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple [formControlName]=\"filter.fieldName\">\r\n <mat-option *ngFor=\"let value of filter.values\" [value]=\"value\">\r\n
|
|
1309
|
+
args: [{ selector: 'tld-filter-bar', template: "<div class=\"filter-row\" *ngIf=\"filterRowVisible\">\r\n <div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper [formGroup]=\"form\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch && !filterOverflow || activeFilterIndex === searchIndex\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [placeholder]=\"searchTitle | translate\"\r\n [formControlName]=\"inputFormControlName\">\r\n </mat-form-field>\r\n <ng-container [formGroup]=\"filterFormGroup\">\r\n\r\n <mat-form-field [ngClass]=\"{'hidden': filterOverflow && activeFilterIndex !== i, 'engine-filter': !filterOverflow}\" *ngFor=\"let filter of settings?.filters; let i = index\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple [formControlName]=\"filter.fieldName\">\r\n <ng-container *ngIf=\"filter.values.length\">\r\n <mat-option *ngFor=\"let value of filter.values | sortTranslationsByProperty:'key'\" [value]=\"value\">\r\n {{value.key | translate : {default: value.value | titlecase } }}\r\n </mat-option>\r\n </ng-container>\r\n </mat-select>\r\n </mat-form-field>\r\n </ng-container>\r\n </div>\r\n <button mat-icon-button (click)=\"switchLeft()\" *ngIf=\"filterOverflow\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_back_ios\r\n </span>\r\n </button>\r\n <button mat-icon-button *ngIf=\"filterOverflow\" (click)=\"switchRight()\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_forward_ios\r\n </span>\r\n </button>\r\n</div>\r\n<mat-chip-list>\r\n <div *ngFor=\"let filter of settings?.filters\">\r\n <mat-chip *ngFor=\"let filterValue of filterFormGroupValue[filter.fieldName]; let ix=index\"\r\n (removed)=\"removeFilter(filter.fieldName, ix)\" class=\"text-s\">\r\n <button matChipRemove>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <span class=\"chip-filter-title\">{{filter.title | translate}}:</span>\r\n <span class=\"chip-value semi-bold\"> {{filterValue.key | translate : {default: filterValue.value | titlecase }\r\n }}</span>\r\n </mat-chip>\r\n </div>\r\n</mat-chip-list>\r\n", styles: [":host{display:inline-block}.filter-row{display:flex;background-color:var(--base-95);min-height:40px;min-width:100%;border-radius:.5rem;padding:.5rem 1.25rem 1rem;max-width:100%;align-items:baseline;margin-bottom:.5rem}.filter-row ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}.filter-row ::ng-deep .mat-form-field-underline{bottom:0!important}.search-input{background-color:unset;border:none}.engine-filter{margin-left:1rem}.filter-bar-search-input{width:100%}.filter-bar-search-input::ng-deep .material-icons-outlined{vertical-align:bottom}.material-icons-outlined{color:var(--base-40)}.filter-wrapper{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;flex:1}.mat-chip.mat-standard-chip{background-color:var(--base-95);padding-left:.5em;padding-right:.75em;border:.5px solid var(--base-70)}.mat-chip.mat-standard-chip span{display:inline-block}.mat-chip.mat-standard-chip .chip-filter-title+.chip-value{margin-left:.25rem}.mat-chip .mat-chip-remove{margin-left:0;margin-right:.5em;color:var(--base-40);opacity:1}.hidden{display:none}\n"] }]
|
|
1279
1310
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }]; }, propDecorators: { filterWrapper: [{
|
|
1280
1311
|
type: ViewChild,
|
|
1281
1312
|
args: ["filterWrapper"]
|
|
@@ -1304,7 +1335,8 @@ FilterBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version
|
|
|
1304
1335
|
MatButtonModule,
|
|
1305
1336
|
MatChipsModule,
|
|
1306
1337
|
MatIconModule,
|
|
1307
|
-
ReactiveFormsModule
|
|
1338
|
+
ReactiveFormsModule,
|
|
1339
|
+
SortTranslationsByPropertyModule], exports: [FilterBarComponent] });
|
|
1308
1340
|
FilterBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarModule, imports: [CommonModule,
|
|
1309
1341
|
TranslateModule,
|
|
1310
1342
|
MatInputModule,
|
|
@@ -1316,7 +1348,8 @@ FilterBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
|
|
|
1316
1348
|
MatButtonModule,
|
|
1317
1349
|
MatChipsModule,
|
|
1318
1350
|
MatIconModule,
|
|
1319
|
-
ReactiveFormsModule
|
|
1351
|
+
ReactiveFormsModule,
|
|
1352
|
+
SortTranslationsByPropertyModule] });
|
|
1320
1353
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarModule, decorators: [{
|
|
1321
1354
|
type: NgModule,
|
|
1322
1355
|
args: [{
|
|
@@ -1335,7 +1368,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1335
1368
|
MatButtonModule,
|
|
1336
1369
|
MatChipsModule,
|
|
1337
1370
|
MatIconModule,
|
|
1338
|
-
ReactiveFormsModule
|
|
1371
|
+
ReactiveFormsModule,
|
|
1372
|
+
SortTranslationsByPropertyModule
|
|
1339
1373
|
],
|
|
1340
1374
|
exports: [
|
|
1341
1375
|
FilterBarComponent
|
|
@@ -1674,5 +1708,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1674
1708
|
* Generated bundle index. Do not edit.
|
|
1675
1709
|
*/
|
|
1676
1710
|
|
|
1677
|
-
export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, Confirmation, ConfirmationModalComponent, ConfirmationModalModule, ConfirmationService, DISABLE_EXPORT_ATTRIBUTE_NAME, DOMService, DateAgoModule, DateAgoPipe, DragAndDropDirective, DragAndDropModule, ExportFormat, FileUploadComponent, FileUploadErrorTypeEnum, FileUploadModule, FilterBarComponent, FilterBarModule, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, HtmlElementParseHelper, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MatButtonLoadingDirective, MatButtonLoadingModule, MissingTranslationHelper, MultiFunctionalTableComponent, MultiFunctionalTableModule, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SaveFileHelper, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
|
|
1711
|
+
export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, Confirmation, ConfirmationModalComponent, ConfirmationModalModule, ConfirmationService, DISABLE_EXPORT_ATTRIBUTE_NAME, DOMService, DateAgoModule, DateAgoPipe, DragAndDropDirective, DragAndDropModule, ExportFormat, FileUploadComponent, FileUploadErrorTypeEnum, FileUploadModule, FilterBarComponent, FilterBarModule, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, HtmlElementParseHelper, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MatButtonLoadingDirective, MatButtonLoadingModule, MissingTranslationHelper, MultiFunctionalTableComponent, MultiFunctionalTableModule, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SaveFileHelper, SortTranslationsByPropertyModule, SortTranslationsByPropertyPipe, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
|
|
1678
1712
|
//# sourceMappingURL=tilde-nlp-ngx-common.mjs.map
|