@bcgov/nr-ngx-component-lib 0.0.3 → 0.0.4

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.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, inject, ChangeDetectorRef, Directive, EventEmitter, NgZone, booleanAttribute, Component, Input, Output, ElementRef, ChangeDetectionStrategy, ViewChild, ViewContainerRef, numberAttribute, Renderer2, HostListener, Inject, NgModule } from '@angular/core';
2
+ import { Injectable, inject, ChangeDetectorRef, Directive, EventEmitter, NgZone, booleanAttribute, Component, Input, Output, ElementRef, ContentChild, ChangeDetectionStrategy, ViewChild, ViewContainerRef, numberAttribute, Renderer2, HostListener, Inject, NgModule } from '@angular/core';
3
3
  import { BehaviorSubject, fromEvent } from 'rxjs';
4
4
  import * as i3 from '@angular/material/icon';
5
5
  import { MatIconModule } from '@angular/material/icon';
@@ -7,7 +7,9 @@ import * as i2 from '@angular/material/core';
7
7
  import { MatRippleModule } from '@angular/material/core';
8
8
  import * as i3$1 from '@angular/material/tooltip';
9
9
  import { MatTooltipModule } from '@angular/material/tooltip';
10
- import * as i1 from '@angular/material/expansion';
10
+ import * as i1 from '@angular/common';
11
+ import { CommonModule } from '@angular/common';
12
+ import * as i1$1 from '@angular/material/expansion';
11
13
  import { MatExpansionModule } from '@angular/material/expansion';
12
14
  import * as i2$1 from '@angular/material/progress-spinner';
13
15
  import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
@@ -16,7 +18,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
16
18
  import * as i5 from '@angular/material/input';
17
19
  import { MatInputModule } from '@angular/material/input';
18
20
  import moment from 'moment';
19
- import * as i1$1 from '@angular/forms';
21
+ import * as i1$2 from '@angular/forms';
20
22
  import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
21
23
  import * as i2$2 from '@angular/material/button';
22
24
  import { MatButtonModule } from '@angular/material/button';
@@ -27,19 +29,18 @@ import { TemplatePortal } from '@angular/cdk/portal';
27
29
  import { filter } from 'rxjs/operators';
28
30
  import * as i6$1 from '@angular/material/list';
29
31
  import { MatListModule } from '@angular/material/list';
30
- import * as i1$3 from '@angular/material/card';
32
+ import * as i1$4 from '@angular/material/card';
31
33
  import { MatCardModule } from '@angular/material/card';
32
34
  import * as i3$3 from '@angular/material/sort';
33
35
  import { MatSortModule } from '@angular/material/sort';
34
36
  import * as i4 from '@angular/material/table';
35
37
  import { MatTableModule } from '@angular/material/table';
36
- import * as i1$2 from 'ngx-pagination';
38
+ import * as i1$3 from 'ngx-pagination';
37
39
  import { NgxPaginationModule } from 'ngx-pagination';
38
40
  import * as i2$3 from '@angular/material/radio';
39
41
  import { MatRadioModule } from '@angular/material/radio';
40
- import * as i1$4 from '@angular/material/snack-bar';
42
+ import * as i1$5 from '@angular/material/snack-bar';
41
43
  import { MAT_SNACK_BAR_DATA, MatSnackBar } from '@angular/material/snack-bar';
42
- import { CommonModule } from '@angular/common';
43
44
  import { MatCheckboxModule } from '@angular/material/checkbox';
44
45
  import { MatMenuModule } from '@angular/material/menu';
45
46
  import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@@ -199,36 +200,71 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
199
200
  type: Input
200
201
  }] } });
201
202
 
202
- class DesktopViewComponent extends ConfigurationSubscriberBase {
203
- get visible() { return this.configuration.displayMode == 'desktop'; }
204
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DesktopViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
205
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DesktopViewComponent, selector: "nrcl-desktop-view", host: { properties: { "class.nrcl-device-desktop": "true" } }, usesInheritance: true, ngImport: i0, template: '@if ( visible ) { <ng-content></ng-content> }', isInline: true }); }
203
+ class DesktopViewDirective {
204
+ constructor(templateRef) {
205
+ this.templateRef = templateRef;
206
+ }
207
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DesktopViewDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
208
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: DesktopViewDirective, selector: "[desktop-view]", ngImport: i0 }); }
206
209
  }
207
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DesktopViewComponent, decorators: [{
208
- type: Component,
210
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DesktopViewDirective, decorators: [{
211
+ type: Directive,
209
212
  args: [{
210
- selector: "nrcl-desktop-view",
211
- template: '@if ( visible ) { <ng-content></ng-content> }',
212
- host: {
213
- '[class.nrcl-device-desktop]': 'true'
214
- }
213
+ selector: "[desktop-view]"
215
214
  }]
216
- }] });
217
- class MobileViewComponent extends ConfigurationSubscriberBase {
218
- get visible() { return this.configuration.displayMode == 'mobile'; }
219
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MobileViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
220
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: MobileViewComponent, selector: "nrcl-mobile-view", host: { properties: { "class.nrcl-device-mobile": "true" } }, usesInheritance: true, ngImport: i0, template: '@if ( visible ) { <ng-content></ng-content> }', isInline: true }); }
215
+ }], ctorParameters: () => [{ type: i0.TemplateRef }] });
216
+ class MobileViewDirective {
217
+ constructor(templateRef) {
218
+ this.templateRef = templateRef;
219
+ }
220
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MobileViewDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
221
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: MobileViewDirective, selector: "[mobile-view]", ngImport: i0 }); }
221
222
  }
222
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MobileViewComponent, decorators: [{
223
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MobileViewDirective, decorators: [{
224
+ type: Directive,
225
+ args: [{
226
+ selector: "[mobile-view]"
227
+ }]
228
+ }], ctorParameters: () => [{ type: i0.TemplateRef }] });
229
+ class DeviceViewComponent extends ConfigurationSubscriberBase {
230
+ constructor() {
231
+ super(...arguments);
232
+ this.changeDetectorRef = inject(ChangeDetectorRef);
233
+ }
234
+ get desktopVisible() { return this.configuration.displayMode == 'desktop'; }
235
+ get mobileVisible() { return this.configuration.displayMode == 'mobile'; }
236
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DeviceViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
237
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DeviceViewComponent, selector: "nrcl-device-view", queries: [{ propertyName: "desktopContent", first: true, predicate: DesktopViewDirective, descendants: true }, { propertyName: "mobileContent", first: true, predicate: MobileViewDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: `
238
+ @if ( mobileVisible && mobileContent ) {
239
+ <ng-container [ngTemplateOutlet]="mobileContent.templateRef"></ng-container>
240
+ }
241
+
242
+ @if ( desktopVisible && desktopContent ) {
243
+ <ng-container [ngTemplateOutlet]="desktopContent.templateRef"></ng-container>
244
+ }
245
+ `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
246
+ }
247
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DeviceViewComponent, decorators: [{
223
248
  type: Component,
224
249
  args: [{
225
- selector: "nrcl-mobile-view",
226
- template: '@if ( visible ) { <ng-content></ng-content> }',
227
- host: {
228
- '[class.nrcl-device-mobile]': 'true'
229
- }
250
+ selector: "nrcl-device-view",
251
+ template: `
252
+ @if ( mobileVisible && mobileContent ) {
253
+ <ng-container [ngTemplateOutlet]="mobileContent.templateRef"></ng-container>
254
+ }
255
+
256
+ @if ( desktopVisible && desktopContent ) {
257
+ <ng-container [ngTemplateOutlet]="desktopContent.templateRef"></ng-container>
258
+ }
259
+ `,
230
260
  }]
231
- }] });
261
+ }], propDecorators: { desktopContent: [{
262
+ type: ContentChild,
263
+ args: [DesktopViewDirective]
264
+ }], mobileContent: [{
265
+ type: ContentChild,
266
+ args: [MobileViewDirective]
267
+ }] } });
232
268
 
233
269
  class ExpansionPanelComponent {
234
270
  constructor() {
@@ -238,7 +274,7 @@ class ExpansionPanelComponent {
238
274
  this.expandedChange = new EventEmitter();
239
275
  }
240
276
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
241
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ExpansionPanelComponent, selector: "nrcl-expansion-panel", inputs: { isLoading: "isLoading", disabled: "disabled", expanded: "expanded" }, outputs: { expandedChange: "expandedChange" }, host: { properties: { "class.is-loading": "isLoading", "class.expanded": "matExpansionPanel?.expanded", "class.disabled": "disabled" } }, viewQueries: [{ propertyName: "matExpansionPanel", first: true, predicate: ["panel"], descendants: true }], ngImport: i0, template: "<mat-expansion-panel #panel \n togglePosition=\"before\"\n [expanded]=\"expanded\" \n [disabled]=\"disabled\" \n (opened)=\"expandedChange.emit( true )\" \n (closed)=\"expandedChange.emit( false )\" \n>\n <mat-expansion-panel-header>\n <mat-panel-description>\n <ng-content select=\"nrcl-expansion-panel-header\"></ng-content>\n\n @if ( isLoading ) {\n <mat-spinner class=\"loading\" [diameter]=\"30\"></mat-spinner>\n }\n </mat-panel-description>\n </mat-expansion-panel-header>\n\n <div class=\"body\">\n <ng-content></ng-content>\n </div>\n\n <ng-content select=\"nrcl-expansion-panel-footer\"></ng-content>\n</mat-expansion-panel>", styles: [":host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host mat-expansion-panel>.mat-expansion-panel-header{padding-left:var(--nrcl-gutter-space);padding-right:var(--nrcl-gutter-space);height:unset;min-height:50px;border-bottom:1px solid #c6c8cb;border-bottom-left-radius:0;border-bottom-right-radius:0;font-family:var(--nrcl-font-family);align-items:flex-start}:host mat-expansion-panel>.mat-expansion-panel-header>::ng-deep .mat-expansion-indicator{align-self:center;padding-bottom:4px}:host mat-expansion-panel>.mat-expansion-panel-header.mat-expanded>::ng-deep .mat-expansion-indicator{padding-bottom:0}:host mat-expansion-panel>.mat-expansion-panel-header .mat-expansion-panel-header-description{position:relative;margin-right:0}:host mat-expansion-panel>.mat-expansion-panel-header .mat-expansion-panel-header-description .loading{position:absolute;top:10px;right:0}:host mat-expansion-panel>::ng-deep .mat-expansion-panel-content{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size)}:host mat-expansion-panel>::ng-deep .mat-expansion-panel-content .mat-expansion-panel-body{padding:0}:host mat-expansion-panel>::ng-deep .mat-expansion-panel-content .mat-expansion-panel-body .body{padding-left:var(--nrcl-gutter-space);padding-right:var(--nrcl-gutter-space)}:host.is-loading .mat-expansion-panel>.mat-expansion-panel-header ::ng-deep nrcl-expansion-panel-header .right-side{visibility:hidden}:host.disabled .mat-expansion-panel>.mat-expansion-panel-header>::ng-deep .mat-content{margin-left:0}\n"], dependencies: [{ kind: "component", type: i1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: i2$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
277
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ExpansionPanelComponent, selector: "nrcl-expansion-panel", inputs: { isLoading: "isLoading", disabled: "disabled", expanded: "expanded" }, outputs: { expandedChange: "expandedChange" }, host: { properties: { "class.is-loading": "isLoading", "class.expanded": "matExpansionPanel?.expanded", "class.disabled": "disabled" } }, viewQueries: [{ propertyName: "matExpansionPanel", first: true, predicate: ["panel"], descendants: true }], ngImport: i0, template: "<mat-expansion-panel #panel \n togglePosition=\"before\"\n [expanded]=\"expanded\" \n [disabled]=\"disabled\" \n (opened)=\"expandedChange.emit( true )\" \n (closed)=\"expandedChange.emit( false )\" \n>\n <mat-expansion-panel-header>\n <mat-panel-description>\n <ng-content select=\"nrcl-expansion-panel-header\"></ng-content>\n\n @if ( isLoading ) {\n <mat-spinner class=\"loading\" [diameter]=\"30\"></mat-spinner>\n }\n </mat-panel-description>\n </mat-expansion-panel-header>\n\n <div class=\"body\">\n <ng-content></ng-content>\n </div>\n\n <ng-content select=\"nrcl-expansion-panel-footer\"></ng-content>\n</mat-expansion-panel>", styles: [":host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host mat-expansion-panel>.mat-expansion-panel-header{padding-left:var(--nrcl-gutter-space);padding-right:var(--nrcl-gutter-space);height:unset;min-height:50px;border-bottom:1px solid #c6c8cb;border-bottom-left-radius:0;border-bottom-right-radius:0;font-family:var(--nrcl-font-family);align-items:flex-start}:host mat-expansion-panel>.mat-expansion-panel-header>::ng-deep .mat-expansion-indicator{align-self:center;padding-bottom:4px}:host mat-expansion-panel>.mat-expansion-panel-header.mat-expanded>::ng-deep .mat-expansion-indicator{padding-bottom:0}:host mat-expansion-panel>.mat-expansion-panel-header .mat-expansion-panel-header-description{position:relative;margin-right:0}:host mat-expansion-panel>.mat-expansion-panel-header .mat-expansion-panel-header-description .loading{position:absolute;top:10px;right:0}:host mat-expansion-panel>::ng-deep .mat-expansion-panel-content{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size)}:host mat-expansion-panel>::ng-deep .mat-expansion-panel-content .mat-expansion-panel-body{padding:0}:host mat-expansion-panel>::ng-deep .mat-expansion-panel-content .mat-expansion-panel-body .body{padding-left:var(--nrcl-gutter-space);padding-right:var(--nrcl-gutter-space)}:host.is-loading .mat-expansion-panel>.mat-expansion-panel-header ::ng-deep nrcl-expansion-panel-header .right-side{visibility:hidden}:host.disabled .mat-expansion-panel>.mat-expansion-panel-header>::ng-deep .mat-content{margin-left:0}\n"], dependencies: [{ kind: "component", type: i1$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: i2$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
242
278
  }
243
279
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelComponent, decorators: [{
244
280
  type: Component,
@@ -415,7 +451,7 @@ class FilterDateComponent {
415
451
  this.valueChange.emit(date);
416
452
  }
417
453
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
418
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FilterDateComponent, selector: "nrcl-filter-date", inputs: { label: "label", placeholder: "placeholder", hint: "hint", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<mat-form-field\n floatLabel=\"auto\"\n appearance=\"outline\"\n subscriptSizing=\"dynamic\"\n>\n <mat-label>{{ label }}</mat-label>\n\n <input matInput class=\"search-input\" \n [ngModel]=\"value\" \n (ngModelChange)=\"onDateChange( $event )\"\n [placeholder]=\"placeholder\"\n [owlDateTime]=\"selectedDateDT\" \n maxlength=\"10\" \n appWFDateMask\n >\n\n @if ( hint ) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n\n <button class=\"select-date\"\n [owlDateTimeTrigger]=\"selectedDateDT\" \n aria-label=\"Open Select Date Picker\"\n mat-icon-button\n matSuffix\n >\n <mat-icon>event</mat-icon>\n </button>\n</mat-form-field>\n\n<owl-date-time #selectedDateDT pickerType=\"calendar\"></owl-date-time>\n", styles: ["::ng-deep :root{--nrcl-filter-date-width: var( --nrcl-filter-width-default )}:host{--mat-form-field-container-height: calc( var( --nrcl-filter-height-default ) - 4px );--mat-form-field-container-vertical-padding: 10px;--mat-form-field-container-text-size: 15px;--mdc-outlined-text-field-focus-label-text-color: black;--mdc-outlined-text-field-hover-label-text-color: black;width:var(--nrcl-filter-date-width, var(--nrcl-filter-width-default));display:block}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep .mat-mdc-form-field{width:100%}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:#fff;height:var(--nrcl-filter-height-default)}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{width:var(--nrcl-filter-date-width, var(--nrcl-filter-width-default))}:host .select-date{padding:0;width:36px;height:36px;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.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: i6.OwlDateTimeTriggerDirective, selector: "[owlDateTimeTrigger]", inputs: ["owlDateTimeTrigger", "disabled"] }, { kind: "directive", type: i6.OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["owlDateTime", "owlDateTimeFilter", "_disabled", "min", "max", "selectMode", "rangeSeparator", "value", "values"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { kind: "component", type: i6.OwlDateTimeComponent, selector: "owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "afterPickerOpen", "yearSelected", "monthSelected"], exportAs: ["owlDateTime"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
454
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FilterDateComponent, selector: "nrcl-filter-date", inputs: { label: "label", placeholder: "placeholder", hint: "hint", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<mat-form-field\n floatLabel=\"auto\"\n appearance=\"outline\"\n subscriptSizing=\"dynamic\"\n>\n <mat-label>{{ label }}</mat-label>\n\n <input matInput class=\"search-input\" \n [ngModel]=\"value\" \n (ngModelChange)=\"onDateChange( $event )\"\n [placeholder]=\"placeholder\"\n [owlDateTime]=\"selectedDateDT\" \n maxlength=\"10\" \n appWFDateMask\n >\n\n @if ( hint ) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n\n <button class=\"select-date\"\n [owlDateTimeTrigger]=\"selectedDateDT\" \n aria-label=\"Open Select Date Picker\"\n mat-icon-button\n matSuffix\n >\n <mat-icon>event</mat-icon>\n </button>\n</mat-form-field>\n\n<owl-date-time #selectedDateDT pickerType=\"calendar\"></owl-date-time>\n", styles: ["::ng-deep :root{--nrcl-filter-date-width: var( --nrcl-filter-width-default )}:host{--mat-form-field-container-height: calc( var( --nrcl-filter-height-default ) - 4px );--mat-form-field-container-vertical-padding: 10px;--mat-form-field-container-text-size: 15px;--mdc-outlined-text-field-focus-label-text-color: black;--mdc-outlined-text-field-hover-label-text-color: black;width:var(--nrcl-filter-date-width, var(--nrcl-filter-width-default));display:block}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep .mat-mdc-form-field{width:100%}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:#fff;height:var(--nrcl-filter-height-default)}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{width:var(--nrcl-filter-date-width, var(--nrcl-filter-width-default))}:host .select-date{padding:0;width:36px;height:36px;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.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: i6.OwlDateTimeTriggerDirective, selector: "[owlDateTimeTrigger]", inputs: ["owlDateTimeTrigger", "disabled"] }, { kind: "directive", type: i6.OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["owlDateTime", "owlDateTimeFilter", "_disabled", "min", "max", "selectMode", "rangeSeparator", "value", "values"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { kind: "component", type: i6.OwlDateTimeComponent, selector: "owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "afterPickerOpen", "yearSelected", "monthSelected"], exportAs: ["owlDateTime"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
419
455
  }
420
456
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterDateComponent, decorators: [{
421
457
  type: Component,
@@ -689,7 +725,7 @@ class FilterSelectComponent {
689
725
  return this.options.find(o => o.code == code)?.description;
690
726
  }
691
727
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
692
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FilterSelectComponent, selector: "nrcl-filter-select", inputs: { label: "label", placeholder: "placeholder", hint: "hint", options: "options", value: "value", selectMax: ["selectMax", "selectMax", numberAttribute], tooltips: ["tooltips", "tooltips", booleanAttribute], summary: ["summary", "summary", booleanAttribute], clear: ["clear", "clear", booleanAttribute] }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.has-value": "hasValue", "class.is-open": "isOpen", "class.is-closed": "!isOpen" } }, viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, read: ElementRef }, { propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true }, { propertyName: "overlayTemplate", first: true, predicate: ["overlayTemplate"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-form-field #trigger\n [floatLabel]=\"floatLabel\"\n appearance=\"outline\"\n subscriptSizing=\"dynamic\"\n>\n @if ( label ) {\n <mat-label>{{ label }}</mat-label>\n }\n\n <input class=\"filter-input\" #searchInput\n matInput \n [placeholder]=\"placeholder\" \n [value]=\"inputValue\"\n (input)=\"onInput( $event )\"\n (keydown.escape)=\"close()\"\n (focus)=\"onInputFocus()\"\n [matTooltip]=\"inputValue\"\n >\n\n @if ( isOpen ) {\n <mat-icon matSuffix>arrow_drop_up</mat-icon>\n }\n @else if ( selection?.value?.length > 0 && clear ) {\n <button class=\"cancel\"\n mat-icon-button\n matSuffix\n (click)=\"onCancelClick($event); $event.stopPropagation()\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n @else {\n <mat-icon matSuffix>arrow_drop_down</mat-icon>\n } \n\n @if ( hint ) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n</mat-form-field> \n\n<ng-template #overlayTemplate>\n <div class=\"filter-select-options\" [class.multiple]=\"!single\" [class.single]=\"single\">\n @if ( !isFiltered && !single && summary ) {\n @if ( selection?.value?.length > 0 && selection?.value?.length < options?.length ) {\n <div class=\"selection-overview\">\n <div class=\"summary\">{{ selection?.value?.length }} selected of {{ options?.length }}</div>\n\n <mat-selection-list\n (selectionChange)=\"onUpperSelectionChange( $event )\"\n >\n @for ( code of selection?.value; track code ) {\n <mat-list-option \n [value]=\"code\" \n togglePosition=\"before\"\n selected\n [matTooltip]=\"tooltips ? descriptionForCode( code ) : null\"\n matTooltipPosition=\"after\"\n >\n {{ descriptionForCode( code ) }}\n </mat-list-option>\n }\n </mat-selection-list>\n </div>\n }\n\n @if ( selection?.value?.length == options?.length ) {\n <div class=\"selection-overview\">\n <div class=\"summary\">All options selected</div>\n </div>\n }\n }\n\n <mat-selection-list\n [formControl]=\"selection\"\n (selectionChange)=\"onSelectionChange( $event )\"\n [multiple]=\"!single\"\n hideSingleSelectionIndicator\n >\n @for ( option of options; track option ) {\n <mat-list-option [class.hide]=\"!matchesFilter( option )\"\n [value]=\"option.code\" \n togglePosition=\"before\" \n [matTooltip]=\"tooltips ? option.description : null\"\n matTooltipPosition=\"after\" \n >\n {{ option.description }}\n </mat-list-option>\n }\n </mat-selection-list>\n </div>\n</ng-template>\n", styles: ["::ng-deep :root{--nrcl-filter-select-width: var( --nrcl-filter-width-default )}:host{--mat-form-field-container-height: calc( var( --nrcl-filter-height-default ) - 4px );--mat-form-field-container-vertical-padding: 10px;--mat-form-field-container-text-size: 15px;--mdc-outlined-text-field-focus-label-text-color: black;--mdc-outlined-text-field-hover-label-text-color: black;width:var(--nrcl-filter-select-width, var(--nrcl-filter-width-default));display:block}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host.has-value{--mdc-outlined-text-field-label-text-color: black}:host ::ng-deep .mat-mdc-form-field{width:100%}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:#fff;height:var(--nrcl-filter-height-default);cursor:pointer}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{width:var(--nrcl-filter-select-width, var(--nrcl-filter-width-default))}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .filter-input{cursor:pointer}:host.is-open ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .filter-input{cursor:text}:host .cancel{padding:0;width:36px;height:36px;display:flex;justify-content:center;align-items:center;cursor:default}::ng-deep .filter-select-options{--mdc-list-list-item-selected-container-color: #007bff;font-family:var(--nrcl-font-family);overflow-x:hidden;overflow-y:auto;padding:0;background:#fff;color:#000;border:1px solid #aaa;border-radius:4px;font-size:var(--nrcl-font-size);pointer-events:all;box-shadow:0 4px 5px #00000026;display:block;width:100%}::ng-deep .filter-select-options .selection-overview{background-color:#eee;border-bottom:1px solid black}::ng-deep .filter-select-options .selection-overview .summary{padding-top:4px;padding-left:4px;font-size:14px;color:#000000bc;font-family:var(--nrcl-font-family)}::ng-deep .filter-select-options .mat-mdc-selection-list{padding-top:0;padding-bottom:0}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option{height:30px;font-size:var(--nrcl-font-size);padding-left:4px;padding-right:8px}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option.hide{display:none}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option .mdc-list-item__start{margin:0;padding:0 8px}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option .mdc-list-item__primary-text{flex-grow:1;font-size:var(--nrcl-font-size)}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option.mdc-list-item--selected .mdc-list-item__primary-text{color:#fff}::ng-deep .filter-select-options.single .mat-mdc-selection-list .mat-mdc-list-option{padding-left:12px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.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: "component", type: i6$1.MatSelectionList, selector: "mat-selection-list", inputs: ["color", "compareWith", "multiple", "hideSingleSelectionIndicator", "disabled"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { kind: "component", type: i6$1.MatListOption, selector: "mat-list-option", inputs: ["togglePosition", "checkboxPosition", "color", "value", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }, { kind: "directive", type: i3$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
728
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FilterSelectComponent, selector: "nrcl-filter-select", inputs: { label: "label", placeholder: "placeholder", hint: "hint", options: "options", value: "value", selectMax: ["selectMax", "selectMax", numberAttribute], tooltips: ["tooltips", "tooltips", booleanAttribute], summary: ["summary", "summary", booleanAttribute], clear: ["clear", "clear", booleanAttribute] }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.has-value": "hasValue", "class.is-open": "isOpen", "class.is-closed": "!isOpen" } }, viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, read: ElementRef }, { propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true }, { propertyName: "overlayTemplate", first: true, predicate: ["overlayTemplate"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-form-field #trigger\n [floatLabel]=\"floatLabel\"\n appearance=\"outline\"\n subscriptSizing=\"dynamic\"\n>\n @if ( label ) {\n <mat-label>{{ label }}</mat-label>\n }\n\n <input class=\"filter-input\" #searchInput\n matInput \n [placeholder]=\"placeholder\" \n [value]=\"inputValue\"\n (input)=\"onInput( $event )\"\n (keydown.escape)=\"close()\"\n (focus)=\"onInputFocus()\"\n [matTooltip]=\"inputValue\"\n >\n\n @if ( isOpen ) {\n <mat-icon matSuffix>arrow_drop_up</mat-icon>\n }\n @else if ( selection?.value?.length > 0 && clear ) {\n <button class=\"cancel\"\n mat-icon-button\n matSuffix\n (click)=\"onCancelClick($event); $event.stopPropagation()\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n @else {\n <mat-icon matSuffix>arrow_drop_down</mat-icon>\n } \n\n @if ( hint ) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n</mat-form-field> \n\n<ng-template #overlayTemplate>\n <div class=\"filter-select-options\" [class.multiple]=\"!single\" [class.single]=\"single\">\n @if ( !isFiltered && !single && summary ) {\n @if ( selection?.value?.length > 0 && selection?.value?.length < options?.length ) {\n <div class=\"selection-overview\">\n <div class=\"summary\">{{ selection?.value?.length }} selected of {{ options?.length }}</div>\n\n <mat-selection-list\n (selectionChange)=\"onUpperSelectionChange( $event )\"\n >\n @for ( code of selection?.value; track code ) {\n <mat-list-option \n [value]=\"code\" \n togglePosition=\"before\"\n selected\n [matTooltip]=\"tooltips ? descriptionForCode( code ) : null\"\n matTooltipPosition=\"after\"\n >\n {{ descriptionForCode( code ) }}\n </mat-list-option>\n }\n </mat-selection-list>\n </div>\n }\n\n @if ( selection?.value?.length == options?.length ) {\n <div class=\"selection-overview\">\n <div class=\"summary\">All options selected</div>\n </div>\n }\n }\n\n <mat-selection-list\n [formControl]=\"selection\"\n (selectionChange)=\"onSelectionChange( $event )\"\n [multiple]=\"!single\"\n hideSingleSelectionIndicator\n >\n @for ( option of options; track option ) {\n <mat-list-option [class.hide]=\"!matchesFilter( option )\"\n [value]=\"option.code\" \n togglePosition=\"before\" \n [matTooltip]=\"tooltips ? option.description : null\"\n matTooltipPosition=\"after\" \n >\n {{ option.description }}\n </mat-list-option>\n }\n </mat-selection-list>\n </div>\n</ng-template>\n", styles: ["::ng-deep :root{--nrcl-filter-select-width: var( --nrcl-filter-width-default )}:host{--mat-form-field-container-height: calc( var( --nrcl-filter-height-default ) - 4px );--mat-form-field-container-vertical-padding: 10px;--mat-form-field-container-text-size: 15px;--mdc-outlined-text-field-focus-label-text-color: black;--mdc-outlined-text-field-hover-label-text-color: black;width:var(--nrcl-filter-select-width, var(--nrcl-filter-width-default));display:block}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host.has-value{--mdc-outlined-text-field-label-text-color: black}:host ::ng-deep .mat-mdc-form-field{width:100%}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:#fff;height:var(--nrcl-filter-height-default);cursor:pointer}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{width:var(--nrcl-filter-select-width, var(--nrcl-filter-width-default))}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .filter-input{cursor:pointer}:host.is-open ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .filter-input{cursor:text}:host .cancel{padding:0;width:36px;height:36px;display:flex;justify-content:center;align-items:center;cursor:default}::ng-deep .filter-select-options{--mdc-list-list-item-selected-container-color: #007bff;font-family:var(--nrcl-font-family);overflow-x:hidden;overflow-y:auto;padding:0;background:#fff;color:#000;border:1px solid #aaa;border-radius:4px;font-size:var(--nrcl-font-size);pointer-events:all;box-shadow:0 4px 5px #00000026;display:block;width:100%}::ng-deep .filter-select-options .selection-overview{background-color:#eee;border-bottom:1px solid black}::ng-deep .filter-select-options .selection-overview .summary{padding-top:4px;padding-left:4px;font-size:14px;color:#000000bc;font-family:var(--nrcl-font-family)}::ng-deep .filter-select-options .mat-mdc-selection-list{padding-top:0;padding-bottom:0}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option{height:30px;font-size:var(--nrcl-font-size);padding-left:4px;padding-right:8px}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option.hide{display:none}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option .mdc-list-item__start{margin:0;padding:0 8px}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option .mdc-list-item__primary-text{flex-grow:1;font-size:var(--nrcl-font-size)}::ng-deep .filter-select-options .mat-mdc-selection-list .mat-mdc-list-option.mdc-list-item--selected .mdc-list-item__primary-text{color:#fff}::ng-deep .filter-select-options.single .mat-mdc-selection-list .mat-mdc-list-option{padding-left:12px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.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: "component", type: i6$1.MatSelectionList, selector: "mat-selection-list", inputs: ["color", "compareWith", "multiple", "hideSingleSelectionIndicator", "disabled"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { kind: "component", type: i6$1.MatListOption, selector: "mat-list-option", inputs: ["togglePosition", "checkboxPosition", "color", "value", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }, { kind: "directive", type: i3$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
693
729
  }
694
730
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterSelectComponent, decorators: [{
695
731
  type: Component,
@@ -752,11 +788,11 @@ class FiltersPanelComponent {
752
788
  this.showFiltersChange.emit(true);
753
789
  }
754
790
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FiltersPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
755
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FiltersPanelComponent, selector: "nrcl-filters-panel", inputs: { showClear: "showClear", showFilters: "showFilters" }, outputs: { clearFilters: "clearFilters", showFiltersChange: "showFiltersChange" }, ngImport: i0, template: "@if ( showFilters ) {\n <ng-content></ng-content>\n}\n\n<div class=\"actions\">\n <nrcl-mobile-view>\n @if ( showFilters ) {\n <button mat-stroked-button class=\"hide\"\n (click)=\"onHideClick()\"\n >\n <mat-icon>expand_less</mat-icon>\n Hide Filters\n </button>\n }\n @else {\n <button mat-stroked-button class=\"show\"\n (click)=\"onShowClick()\"\n >\n <mat-icon>expand_more</mat-icon>\n Show Filters\n </button>\n }\n </nrcl-mobile-view>\n\n <div class=\"spacer\"></div> \n\n @if ( showClear && showFilters ) {\n <button mat-stroked-button class=\"clear\"\n (click)=\"onClearClick()\"\n >\n <mat-icon>filter_list_off</mat-icon>\n Clear\n </button>\n }\n</div>\n", styles: [":host{display:flex;flex-flow:row wrap;gap:8px;position:relative;border:1px solid #c6c8cb;padding:8px;background-color:#f2f2f2}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button,:host ::ng-deep button.mat-mdc-button,:host ::ng-deep button.mat-mdc-icon-button,:host ::ng-deep button.mat-mdc-outlined-button,:host ::ng-deep button.mat-mdc-unelevated-button,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);white-space:nowrap;font-weight:500}:host ::ng-deep button.mat-mdc-fab[disabled],:host ::ng-deep button.mat-mdc-raised-button[disabled],:host ::ng-deep button.mat-mdc-button[disabled],:host ::ng-deep button.mat-mdc-icon-button[disabled],:host ::ng-deep button.mat-mdc-outlined-button[disabled],:host ::ng-deep button.mat-mdc-unelevated-button[disabled],:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item[disabled]{border:1px solid #d7d7d7!important}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]),:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]){background-color:var(--nrcl-button-primary-background-color);color:var(--nrcl-button-primary-foreground-color)}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]).intermediate-action{background-color:#2e7940}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]):hover{background-color:var(--nrcl-button-primary-hover-background-color)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button{background-color:#aaa;color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);box-shadow:none!important;border:1px solid #003366}:host ::ng-deep button.mat-mdc-fab:not([class*=mat-elevation-z]),:host ::ng-deep button.mat-mdc-raised-button:not([class*=mat-elevation-z]){box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f!important}:host ::ng-deep button.mdc-button.right-side-icon{display:flex}:host ::ng-deep button.mdc-button.right-side-icon mat-icon{order:1;margin-left:8px;margin-right:-4px}:host .actions{flex-grow:1;flex-direction:row;justify-content:flex-end;align-items:flex-end;width:unset;display:flex}:host .actions button{height:40px}:host .actions .spacer{flex-grow:1}:host-context(.nrcl-device-mobile) :host{display:grid;grid-template-columns:1fr 1fr}:host-context(.nrcl-device-mobile) :host .actions{grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-search{--nrcl-filter-search-width: auto;grid-row:1;grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-select{--nrcl-filter-select-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-date{--nrcl-filter-date-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-container{--nrcl-filter-container-width: auto}\n"], dependencies: [{ kind: "component", type: i2$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MobileViewComponent, selector: "nrcl-mobile-view" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
791
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FiltersPanelComponent, selector: "nrcl-filters-panel", inputs: { showClear: "showClear", showFilters: "showFilters" }, outputs: { clearFilters: "clearFilters", showFiltersChange: "showFiltersChange" }, ngImport: i0, template: "@if ( showFilters ) {\n <ng-content></ng-content>\n}\n\n<div class=\"actions\">\n <nrcl-device-view>\n <ng-template mobile-view>\n @if ( showFilters ) {\n <button mat-stroked-button class=\"hide\"\n (click)=\"onHideClick()\"\n >\n <mat-icon>expand_less</mat-icon>\n Hide Filters\n </button>\n }\n @else {\n <button mat-stroked-button class=\"show\"\n (click)=\"onShowClick()\"\n >\n <mat-icon>expand_more</mat-icon>\n Show Filters\n </button>\n }\n </ng-template>\n </nrcl-device-view>\n\n <div class=\"spacer\"></div> \n\n @if ( showClear && showFilters ) {\n <button mat-stroked-button class=\"clear\"\n (click)=\"onClearClick()\"\n >\n <mat-icon>filter_list_off</mat-icon>\n Clear\n </button>\n }\n</div>\n", styles: [":host{display:flex;flex-flow:row wrap;gap:8px;position:relative;border:1px solid #c6c8cb;padding:8px;background-color:#f2f2f2}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button,:host ::ng-deep button.mat-mdc-button,:host ::ng-deep button.mat-mdc-icon-button,:host ::ng-deep button.mat-mdc-outlined-button,:host ::ng-deep button.mat-mdc-unelevated-button,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);white-space:nowrap;font-weight:500}:host ::ng-deep button.mat-mdc-fab[disabled],:host ::ng-deep button.mat-mdc-raised-button[disabled],:host ::ng-deep button.mat-mdc-button[disabled],:host ::ng-deep button.mat-mdc-icon-button[disabled],:host ::ng-deep button.mat-mdc-outlined-button[disabled],:host ::ng-deep button.mat-mdc-unelevated-button[disabled],:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item[disabled]{border:1px solid #d7d7d7!important}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]),:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]){background-color:var(--nrcl-button-primary-background-color);color:var(--nrcl-button-primary-foreground-color)}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]).intermediate-action{background-color:#2e7940}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]):hover{background-color:var(--nrcl-button-primary-hover-background-color)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button{background-color:#aaa;color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);box-shadow:none!important;border:1px solid #003366}:host ::ng-deep button.mat-mdc-fab:not([class*=mat-elevation-z]),:host ::ng-deep button.mat-mdc-raised-button:not([class*=mat-elevation-z]){box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f!important}:host ::ng-deep button.mdc-button.right-side-icon{display:flex}:host ::ng-deep button.mdc-button.right-side-icon mat-icon{order:1;margin-left:8px;margin-right:-4px}:host .actions{flex-grow:1;flex-direction:row;justify-content:flex-end;align-items:flex-end;width:unset;display:flex}:host .actions button{height:40px}:host .actions .spacer{flex-grow:1}:host-context(.nrcl-device-mobile) :host{display:grid;grid-template-columns:1fr 1fr}:host-context(.nrcl-device-mobile) :host .actions{grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-search{--nrcl-filter-search-width: auto;grid-row:1;grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-select{--nrcl-filter-select-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-date{--nrcl-filter-date-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-container{--nrcl-filter-container-width: auto}\n"], dependencies: [{ kind: "component", type: i2$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MobileViewDirective, selector: "[mobile-view]" }, { kind: "component", type: DeviceViewComponent, selector: "nrcl-device-view" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
756
792
  }
757
793
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FiltersPanelComponent, decorators: [{
758
794
  type: Component,
759
- args: [{ selector: "nrcl-filters-panel", changeDetection: ChangeDetectionStrategy.OnPush, template: "@if ( showFilters ) {\n <ng-content></ng-content>\n}\n\n<div class=\"actions\">\n <nrcl-mobile-view>\n @if ( showFilters ) {\n <button mat-stroked-button class=\"hide\"\n (click)=\"onHideClick()\"\n >\n <mat-icon>expand_less</mat-icon>\n Hide Filters\n </button>\n }\n @else {\n <button mat-stroked-button class=\"show\"\n (click)=\"onShowClick()\"\n >\n <mat-icon>expand_more</mat-icon>\n Show Filters\n </button>\n }\n </nrcl-mobile-view>\n\n <div class=\"spacer\"></div> \n\n @if ( showClear && showFilters ) {\n <button mat-stroked-button class=\"clear\"\n (click)=\"onClearClick()\"\n >\n <mat-icon>filter_list_off</mat-icon>\n Clear\n </button>\n }\n</div>\n", styles: [":host{display:flex;flex-flow:row wrap;gap:8px;position:relative;border:1px solid #c6c8cb;padding:8px;background-color:#f2f2f2}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button,:host ::ng-deep button.mat-mdc-button,:host ::ng-deep button.mat-mdc-icon-button,:host ::ng-deep button.mat-mdc-outlined-button,:host ::ng-deep button.mat-mdc-unelevated-button,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);white-space:nowrap;font-weight:500}:host ::ng-deep button.mat-mdc-fab[disabled],:host ::ng-deep button.mat-mdc-raised-button[disabled],:host ::ng-deep button.mat-mdc-button[disabled],:host ::ng-deep button.mat-mdc-icon-button[disabled],:host ::ng-deep button.mat-mdc-outlined-button[disabled],:host ::ng-deep button.mat-mdc-unelevated-button[disabled],:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item[disabled]{border:1px solid #d7d7d7!important}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]),:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]){background-color:var(--nrcl-button-primary-background-color);color:var(--nrcl-button-primary-foreground-color)}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]).intermediate-action{background-color:#2e7940}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]):hover{background-color:var(--nrcl-button-primary-hover-background-color)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button{background-color:#aaa;color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);box-shadow:none!important;border:1px solid #003366}:host ::ng-deep button.mat-mdc-fab:not([class*=mat-elevation-z]),:host ::ng-deep button.mat-mdc-raised-button:not([class*=mat-elevation-z]){box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f!important}:host ::ng-deep button.mdc-button.right-side-icon{display:flex}:host ::ng-deep button.mdc-button.right-side-icon mat-icon{order:1;margin-left:8px;margin-right:-4px}:host .actions{flex-grow:1;flex-direction:row;justify-content:flex-end;align-items:flex-end;width:unset;display:flex}:host .actions button{height:40px}:host .actions .spacer{flex-grow:1}:host-context(.nrcl-device-mobile) :host{display:grid;grid-template-columns:1fr 1fr}:host-context(.nrcl-device-mobile) :host .actions{grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-search{--nrcl-filter-search-width: auto;grid-row:1;grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-select{--nrcl-filter-select-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-date{--nrcl-filter-date-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-container{--nrcl-filter-container-width: auto}\n"] }]
795
+ args: [{ selector: "nrcl-filters-panel", changeDetection: ChangeDetectionStrategy.OnPush, template: "@if ( showFilters ) {\n <ng-content></ng-content>\n}\n\n<div class=\"actions\">\n <nrcl-device-view>\n <ng-template mobile-view>\n @if ( showFilters ) {\n <button mat-stroked-button class=\"hide\"\n (click)=\"onHideClick()\"\n >\n <mat-icon>expand_less</mat-icon>\n Hide Filters\n </button>\n }\n @else {\n <button mat-stroked-button class=\"show\"\n (click)=\"onShowClick()\"\n >\n <mat-icon>expand_more</mat-icon>\n Show Filters\n </button>\n }\n </ng-template>\n </nrcl-device-view>\n\n <div class=\"spacer\"></div> \n\n @if ( showClear && showFilters ) {\n <button mat-stroked-button class=\"clear\"\n (click)=\"onClearClick()\"\n >\n <mat-icon>filter_list_off</mat-icon>\n Clear\n </button>\n }\n</div>\n", styles: [":host{display:flex;flex-flow:row wrap;gap:8px;position:relative;border:1px solid #c6c8cb;padding:8px;background-color:#f2f2f2}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button,:host ::ng-deep button.mat-mdc-button,:host ::ng-deep button.mat-mdc-icon-button,:host ::ng-deep button.mat-mdc-outlined-button,:host ::ng-deep button.mat-mdc-unelevated-button,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);white-space:nowrap;font-weight:500}:host ::ng-deep button.mat-mdc-fab[disabled],:host ::ng-deep button.mat-mdc-raised-button[disabled],:host ::ng-deep button.mat-mdc-button[disabled],:host ::ng-deep button.mat-mdc-icon-button[disabled],:host ::ng-deep button.mat-mdc-outlined-button[disabled],:host ::ng-deep button.mat-mdc-unelevated-button[disabled],:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item[disabled]{border:1px solid #d7d7d7!important}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]),:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]),:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]){background-color:var(--nrcl-button-primary-background-color);color:var(--nrcl-button-primary-foreground-color)}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]).intermediate-action,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]).intermediate-action{background-color:#2e7940}:host ::ng-deep button.primary.mat-mdc-fab:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-raised-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-icon-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-outlined-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-unelevated-button:not([disabled]):hover,:host ::ng-deep button.primary.mat-mdc-mini-fab .mat-mdc-menu-item:not([disabled]):hover{background-color:var(--nrcl-button-primary-hover-background-color)}:host ::ng-deep button.mat-mdc-fab,:host ::ng-deep button.mat-mdc-raised-button{background-color:#aaa;color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);box-shadow:none!important;border:1px solid #003366}:host ::ng-deep button.mat-mdc-fab:not([class*=mat-elevation-z]),:host ::ng-deep button.mat-mdc-raised-button:not([class*=mat-elevation-z]){box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f!important}:host ::ng-deep button.mdc-button.right-side-icon{display:flex}:host ::ng-deep button.mdc-button.right-side-icon mat-icon{order:1;margin-left:8px;margin-right:-4px}:host .actions{flex-grow:1;flex-direction:row;justify-content:flex-end;align-items:flex-end;width:unset;display:flex}:host .actions button{height:40px}:host .actions .spacer{flex-grow:1}:host-context(.nrcl-device-mobile) :host{display:grid;grid-template-columns:1fr 1fr}:host-context(.nrcl-device-mobile) :host .actions{grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-search{--nrcl-filter-search-width: auto;grid-row:1;grid-column:1/span 2}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-select{--nrcl-filter-select-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-date{--nrcl-filter-date-width: auto}:host-context(.nrcl-device-mobile) :host ::ng-deep nrcl-filter-container{--nrcl-filter-container-width: auto}\n"] }]
760
796
  }], propDecorators: { showClear: [{
761
797
  type: Input
762
798
  }], showFilters: [{
@@ -1201,7 +1237,7 @@ class RowListPaginationComponent {
1201
1237
  return this.rowCount && this.pageSize;
1202
1238
  }
1203
1239
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RowListPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1204
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RowListPaginationComponent, selector: "nrcl-row-list-pagination", inputs: { paginationId: "paginationId", pageSizeOptions: "pageSizeOptions", pageSize: "pageSize", pageNumber: "pageNumber", rowCount: "rowCount", showPageSize: "showPageSize" }, outputs: { pageSizeChange: "pageSizeChange", pageNumberChange: "pageNumberChange" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.width-sufficient": "componentWidth == 'sufficient'", "class.width-tight": "componentWidth == 'tight'", "class.width-restrictive": "componentWidth == 'restrictive'" } }, ngImport: i0, template: "@if ( hasRows ) {\n <nrcl-filter-container class=\"summary\"\n label=\"Showing Rows\"\n >\n <span>{{ firstRow }} to {{ lastRow }} <small>(of {{ rowCount }})</small></span>\n </nrcl-filter-container>\n}\n@else {\n <div class=\"no-rows\">No records to display.</div>\n}\n\n@if ( hasRows ) {\n <div class=\"pagination\">\n <pagination-controls \n [id]=\"paginationId\" \n [maxSize]=\"paginationMaxSize\"\n [responsive]=\"false\"\n [directionLinks]=\"true\"\n previousLabel=\"\"\n nextLabel=\"\"\n [autoHide]=\"false\"\n (pageChange)=\"onPageNumberChange( $event )\"\n ></pagination-controls>\n </div>\n}\n\n@if ( hasRows && showPageSize ) {\n <nrcl-filter-select class=\"page-size\"\n label=\"Page Size\"\n [value]=\"[ pageSize ]\"\n [options]=\"pageSizeOptions\"\n (valueChange)=\"onPageSizeChange( $event[ 0 ] )\"\n selectMax=\"1\"\n [clear]=\"false\"\n ></nrcl-filter-select>\n}\n", styles: [":host{display:block;font-family:var(--nrcl-font-family);position:relative;min-height:40px}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host .summary{--nrcl-filter-container-width: min-content;position:absolute;top:0;left:0;bottom:0;white-space:nowrap}:host .pagination{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}:host .pagination ::ng-deep .ngx-pagination{text-align:center;padding-inline-start:0;margin:0}:host .pagination ::ng-deep .ngx-pagination li{border-left:#c6c8cb solid 1px;border-top:#c6c8cb solid 1px;border-bottom:#c6c8cb solid 1px;border-right:none;vertical-align:middle;margin:0;height:35px;padding:0}:host .pagination ::ng-deep .ngx-pagination li a{padding:0;line-height:35px;text-decoration:none}:host .pagination ::ng-deep .ngx-pagination li>*>span{padding:0 15px;line-height:35px}:host .pagination ::ng-deep .ngx-pagination li.current{color:#036;font-weight:700;background:#fff;border:2px solid #003366;border-radius:2px}:host .pagination ::ng-deep .ngx-pagination li.disabled span{display:none}:host .pagination ::ng-deep .ngx-pagination li:first-child{border-left:none;border-top:none;border-bottom:none}:host .pagination ::ng-deep .ngx-pagination li:last-child{border-top:none;border-bottom:none}:host .pagination ::ng-deep .ngx-pagination a:hover,:host .pagination ::ng-deep .ngx-pagination button:hover{color:#131313;background-color:#ffd3a0}:host .pagination ::ng-deep .ngx-pagination .pagination-next a:after,:host .pagination ::ng-deep .ngx-pagination .pagination-next a:before,:host .pagination ::ng-deep .ngx-pagination .pagination-next.disabled:after,:host .pagination ::ng-deep .ngx-pagination .pagination-next.disabled:before,:host .pagination ::ng-deep .ngx-pagination .pagination-previous a:after,:host .pagination ::ng-deep .ngx-pagination .pagination-previous a:before,:host .pagination ::ng-deep .ngx-pagination .pagination-previous.disabled:after,:host .pagination ::ng-deep .ngx-pagination .pagination-previous.disabled:before{font-family:Material Symbols Outlined;vertical-align:middle;display:inline;font-size:25px;margin:0;line-height:40px;padding:0 10px}:host .pagination ::ng-deep .ngx-pagination .pagination-previous a:before,:host .pagination ::ng-deep .ngx-pagination .pagination-previous.disabled:before{content:\"arrow_back\"}:host .pagination ::ng-deep .ngx-pagination .pagination-next a:after,:host .pagination ::ng-deep .ngx-pagination .pagination-next.disabled:after{content:\"arrow_forward\"}:host .page-size{--nrcl-filter-select-width: 140px;position:absolute;top:0;right:0;bottom:0;display:flex;gap:8px;align-items:center;pointer-events:auto}:host.width-restrictive{display:grid;grid-template-columns:1fr 1fr;gap:var(--nrcl-gutter-space)}:host.width-restrictive .summary{--nrcl-filter-container-width: auto;position:static;grid-column:1;grid-row:1}:host.width-restrictive .page-size{--nrcl-filter-select-width: auto;position:static;grid-column:2;grid-row:1}:host.width-restrictive .pagination{position:static;grid-column:1/span 2;grid-row:2}\n"], dependencies: [{ kind: "component", type: i1$2.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "component", type: FilterContainerComponent, selector: "nrcl-filter-container", inputs: ["label", "hint"] }, { kind: "component", type: FilterSelectComponent, selector: "nrcl-filter-select", inputs: ["label", "placeholder", "hint", "options", "value", "selectMax", "tooltips", "summary", "clear"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1240
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RowListPaginationComponent, selector: "nrcl-row-list-pagination", inputs: { paginationId: "paginationId", pageSizeOptions: "pageSizeOptions", pageSize: "pageSize", pageNumber: "pageNumber", rowCount: "rowCount", showPageSize: "showPageSize" }, outputs: { pageSizeChange: "pageSizeChange", pageNumberChange: "pageNumberChange" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.width-sufficient": "componentWidth == 'sufficient'", "class.width-tight": "componentWidth == 'tight'", "class.width-restrictive": "componentWidth == 'restrictive'" } }, ngImport: i0, template: "@if ( hasRows ) {\n <nrcl-filter-container class=\"summary\"\n label=\"Showing Rows\"\n >\n <span>{{ firstRow }} to {{ lastRow }} <small>(of {{ rowCount }})</small></span>\n </nrcl-filter-container>\n}\n@else {\n <div class=\"no-rows\">No records to display.</div>\n}\n\n@if ( hasRows ) {\n <div class=\"pagination\">\n <pagination-controls \n [id]=\"paginationId\" \n [maxSize]=\"paginationMaxSize\"\n [responsive]=\"false\"\n [directionLinks]=\"true\"\n previousLabel=\"\"\n nextLabel=\"\"\n [autoHide]=\"false\"\n (pageChange)=\"onPageNumberChange( $event )\"\n ></pagination-controls>\n </div>\n}\n\n@if ( hasRows && showPageSize ) {\n <nrcl-filter-select class=\"page-size\"\n label=\"Page Size\"\n [value]=\"[ pageSize ]\"\n [options]=\"pageSizeOptions\"\n (valueChange)=\"onPageSizeChange( $event[ 0 ] )\"\n selectMax=\"1\"\n [clear]=\"false\"\n ></nrcl-filter-select>\n}\n", styles: [":host{display:block;font-family:var(--nrcl-font-family);position:relative;min-height:40px}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host .summary{--nrcl-filter-container-width: min-content;position:absolute;top:0;left:0;bottom:0;white-space:nowrap}:host .pagination{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}:host .pagination ::ng-deep .ngx-pagination{text-align:center;padding-inline-start:0;margin:0}:host .pagination ::ng-deep .ngx-pagination li{border-left:#c6c8cb solid 1px;border-top:#c6c8cb solid 1px;border-bottom:#c6c8cb solid 1px;border-right:none;vertical-align:middle;margin:0;height:35px;padding:0}:host .pagination ::ng-deep .ngx-pagination li a{padding:0;line-height:35px;text-decoration:none}:host .pagination ::ng-deep .ngx-pagination li>*>span{padding:0 15px;line-height:35px}:host .pagination ::ng-deep .ngx-pagination li.current{color:#036;font-weight:700;background:#fff;border:2px solid #003366;border-radius:2px}:host .pagination ::ng-deep .ngx-pagination li.disabled span{display:none}:host .pagination ::ng-deep .ngx-pagination li:first-child{border-left:none;border-top:none;border-bottom:none}:host .pagination ::ng-deep .ngx-pagination li:last-child{border-top:none;border-bottom:none}:host .pagination ::ng-deep .ngx-pagination a:hover,:host .pagination ::ng-deep .ngx-pagination button:hover{color:#131313;background-color:#ffd3a0}:host .pagination ::ng-deep .ngx-pagination .pagination-next a:after,:host .pagination ::ng-deep .ngx-pagination .pagination-next a:before,:host .pagination ::ng-deep .ngx-pagination .pagination-next.disabled:after,:host .pagination ::ng-deep .ngx-pagination .pagination-next.disabled:before,:host .pagination ::ng-deep .ngx-pagination .pagination-previous a:after,:host .pagination ::ng-deep .ngx-pagination .pagination-previous a:before,:host .pagination ::ng-deep .ngx-pagination .pagination-previous.disabled:after,:host .pagination ::ng-deep .ngx-pagination .pagination-previous.disabled:before{font-family:Material Symbols Outlined;vertical-align:middle;display:inline;font-size:25px;margin:0;line-height:40px;padding:0 10px}:host .pagination ::ng-deep .ngx-pagination .pagination-previous a:before,:host .pagination ::ng-deep .ngx-pagination .pagination-previous.disabled:before{content:\"arrow_back\"}:host .pagination ::ng-deep .ngx-pagination .pagination-next a:after,:host .pagination ::ng-deep .ngx-pagination .pagination-next.disabled:after{content:\"arrow_forward\"}:host .page-size{--nrcl-filter-select-width: 140px;position:absolute;top:0;right:0;bottom:0;display:flex;gap:8px;align-items:center;pointer-events:auto}:host.width-restrictive{display:grid;grid-template-columns:1fr 1fr;gap:var(--nrcl-gutter-space)}:host.width-restrictive .summary{--nrcl-filter-container-width: auto;position:static;grid-column:1;grid-row:1}:host.width-restrictive .page-size{--nrcl-filter-select-width: auto;position:static;grid-column:2;grid-row:1}:host.width-restrictive .pagination{position:static;grid-column:1/span 2;grid-row:2}\n"], dependencies: [{ kind: "component", type: i1$3.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "component", type: FilterContainerComponent, selector: "nrcl-filter-container", inputs: ["label", "hint"] }, { kind: "component", type: FilterSelectComponent, selector: "nrcl-filter-select", inputs: ["label", "placeholder", "hint", "options", "value", "selectMax", "tooltips", "summary", "clear"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1205
1241
  }
1206
1242
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RowListPaginationComponent, decorators: [{
1207
1243
  type: Component,
@@ -1282,11 +1318,11 @@ class ListAttachmentsComponent extends RowListBase {
1282
1318
  return this.rowListProvider.deleteItem(item);
1283
1319
  }
1284
1320
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ListAttachmentsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1285
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ListAttachmentsComponent, selector: "nrcl-list-attachments", inputs: { rowListProvider: "rowListProvider", canDelete: "canDelete", showPagination: "showPagination" }, usesInheritance: true, ngImport: i0, template: "<nrcl-desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }\"\n >\n <ng-container matColumnDef=\"make\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Make</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.make }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"attachmentTypeCode\">\n <th mat-header-cell *matHeaderCellDef>Attachment Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"fileName\">\n <th mat-header-cell *matHeaderCellDef>File Name</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileName }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"sourceObjectNameCode\">\n <th mat-header-cell *matHeaderCellDef>File Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileExtension }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedBy\">\n <th mat-header-cell *matHeaderCellDef>Uploaded By</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedBy }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedTimestamp\">\n <th mat-header-cell *matHeaderCellDef>Uploaded At</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th mat-header-cell *matHeaderCellDef>Description</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"download\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"delete\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n</nrcl-desktop-view>\n\n<nrcl-mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.fileName }}</h2>\n </section>\n\n <section actions>\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n\n @if ( canDelete ) {\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n }\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>Attachment Type</mat-label>\n <div class=\"value\">{{ item.attachmentTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>File Type</mat-label>\n <div class=\"value\">{{ item.fileExtension }}</div>\n </section>\n\n <section>\n <mat-label>Uploaded By</mat-label>\n <div class=\"value\">{{ item.uploadedBy }}</div>\n </section> \n\n <section>\n <mat-label>Uploaded At</mat-label>\n <div class=\"value\">{{ item.uploadedTimestamp }}</div>\n </section> \n\n <section full-width>\n <mat-label>Description</mat-label>\n <div class=\"value\">{{ item.attachmentDescription }}</div>\n </section> \n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n</nrcl-mobile-view>\n", styles: [":host .mat-mdc-table .mat-column-attachmentTypeCode{min-width:100px}:host .mat-mdc-table .mat-column-orgUnit{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-fileName{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-sourceObjectNameCode{min-width:60px;max-width:60px}:host .mat-mdc-table .mat-column-uploadedBy{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-uploadedTimestamp{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-description{width:100%;min-width:200px;max-width:100px;white-space:normal}:host .mat-mdc-table .mat-column-download .button-container,:host .mat-mdc-table .mat-column-delete .button-container{display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: i1$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$3.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i1$3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "component", type: i3$3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: ButtonComponent, selector: "nrcl-button", inputs: ["label", "icon", "iconRight", "iconCompact", "tooltip", "compact", "primary", "disabled"], outputs: ["click"] }, { kind: "component", type: CellContentComponent, selector: "nrcl-cell-content", inputs: ["tooltip", "content"] }, { kind: "component", type: DesktopViewComponent, selector: "nrcl-desktop-view" }, { kind: "component", type: GapComponent, selector: "nrcl-gap", inputs: ["horizontal", "vertical"] }, { kind: "component", type: MobileViewComponent, selector: "nrcl-mobile-view" }, { kind: "component", type: RowListDesktopComponent, selector: "nrcl-row-list-desktop" }, { kind: "component", type: RowListMobileComponent, selector: "nrcl-row-list-mobile" }, { kind: "component", type: RowListPaginationComponent, selector: "nrcl-row-list-pagination", inputs: ["paginationId", "pageSizeOptions", "pageSize", "pageNumber", "rowCount", "showPageSize"], outputs: ["pageSizeChange", "pageNumberChange"] }, { kind: "pipe", type: i1$2.PaginatePipe, name: "paginate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1321
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ListAttachmentsComponent, selector: "nrcl-list-attachments", inputs: { rowListProvider: "rowListProvider", canDelete: "canDelete", showPagination: "showPagination" }, usesInheritance: true, ngImport: i0, template: "<nrcl-device-view>\n <ng-template desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }\"\n >\n <ng-container matColumnDef=\"make\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Make</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.make }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"attachmentTypeCode\">\n <th mat-header-cell *matHeaderCellDef>Attachment Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"fileName\">\n <th mat-header-cell *matHeaderCellDef>File Name</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileName }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"sourceObjectNameCode\">\n <th mat-header-cell *matHeaderCellDef>File Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileExtension }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedBy\">\n <th mat-header-cell *matHeaderCellDef>Uploaded By</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedBy }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedTimestamp\">\n <th mat-header-cell *matHeaderCellDef>Uploaded At</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th mat-header-cell *matHeaderCellDef>Description</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"download\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"delete\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n </ng-template>\n\n <ng-template mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.fileName }}</h2>\n </section>\n\n <section actions>\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n\n @if ( canDelete ) {\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n }\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>Attachment Type</mat-label>\n <div class=\"value\">{{ item.attachmentTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>File Type</mat-label>\n <div class=\"value\">{{ item.fileExtension }}</div>\n </section>\n\n <section>\n <mat-label>Uploaded By</mat-label>\n <div class=\"value\">{{ item.uploadedBy }}</div>\n </section> \n\n <section>\n <mat-label>Uploaded At</mat-label>\n <div class=\"value\">{{ item.uploadedTimestamp }}</div>\n </section> \n\n <section full-width>\n <mat-label>Description</mat-label>\n <div class=\"value\">{{ item.attachmentDescription }}</div>\n </section> \n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n </ng-template>\n</nrcl-device-view>\n", styles: [":host .mat-mdc-table .mat-column-attachmentTypeCode{min-width:100px}:host .mat-mdc-table .mat-column-orgUnit{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-fileName{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-sourceObjectNameCode{min-width:60px;max-width:60px}:host .mat-mdc-table .mat-column-uploadedBy{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-uploadedTimestamp{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-description{width:100%;min-width:200px;max-width:100px;white-space:normal}:host .mat-mdc-table .mat-column-download .button-container,:host .mat-mdc-table .mat-column-delete .button-container{display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: i1$4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$4.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i1$4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "component", type: i3$3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: ButtonComponent, selector: "nrcl-button", inputs: ["label", "icon", "iconRight", "iconCompact", "tooltip", "compact", "primary", "disabled"], outputs: ["click"] }, { kind: "component", type: CellContentComponent, selector: "nrcl-cell-content", inputs: ["tooltip", "content"] }, { kind: "component", type: GapComponent, selector: "nrcl-gap", inputs: ["horizontal", "vertical"] }, { kind: "component", type: RowListDesktopComponent, selector: "nrcl-row-list-desktop" }, { kind: "component", type: RowListMobileComponent, selector: "nrcl-row-list-mobile" }, { kind: "component", type: RowListPaginationComponent, selector: "nrcl-row-list-pagination", inputs: ["paginationId", "pageSizeOptions", "pageSize", "pageNumber", "rowCount", "showPageSize"], outputs: ["pageSizeChange", "pageNumberChange"] }, { kind: "directive", type: DesktopViewDirective, selector: "[desktop-view]" }, { kind: "directive", type: MobileViewDirective, selector: "[mobile-view]" }, { kind: "component", type: DeviceViewComponent, selector: "nrcl-device-view" }, { kind: "pipe", type: i1$3.PaginatePipe, name: "paginate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1286
1322
  }
1287
1323
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ListAttachmentsComponent, decorators: [{
1288
1324
  type: Component,
1289
- args: [{ selector: "nrcl-list-attachments", changeDetection: ChangeDetectionStrategy.OnPush, template: "<nrcl-desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }\"\n >\n <ng-container matColumnDef=\"make\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Make</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.make }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"attachmentTypeCode\">\n <th mat-header-cell *matHeaderCellDef>Attachment Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"fileName\">\n <th mat-header-cell *matHeaderCellDef>File Name</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileName }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"sourceObjectNameCode\">\n <th mat-header-cell *matHeaderCellDef>File Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileExtension }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedBy\">\n <th mat-header-cell *matHeaderCellDef>Uploaded By</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedBy }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedTimestamp\">\n <th mat-header-cell *matHeaderCellDef>Uploaded At</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th mat-header-cell *matHeaderCellDef>Description</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"download\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"delete\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n</nrcl-desktop-view>\n\n<nrcl-mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.fileName }}</h2>\n </section>\n\n <section actions>\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n\n @if ( canDelete ) {\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n }\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>Attachment Type</mat-label>\n <div class=\"value\">{{ item.attachmentTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>File Type</mat-label>\n <div class=\"value\">{{ item.fileExtension }}</div>\n </section>\n\n <section>\n <mat-label>Uploaded By</mat-label>\n <div class=\"value\">{{ item.uploadedBy }}</div>\n </section> \n\n <section>\n <mat-label>Uploaded At</mat-label>\n <div class=\"value\">{{ item.uploadedTimestamp }}</div>\n </section> \n\n <section full-width>\n <mat-label>Description</mat-label>\n <div class=\"value\">{{ item.attachmentDescription }}</div>\n </section> \n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n</nrcl-mobile-view>\n", styles: [":host .mat-mdc-table .mat-column-attachmentTypeCode{min-width:100px}:host .mat-mdc-table .mat-column-orgUnit{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-fileName{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-sourceObjectNameCode{min-width:60px;max-width:60px}:host .mat-mdc-table .mat-column-uploadedBy{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-uploadedTimestamp{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-description{width:100%;min-width:200px;max-width:100px;white-space:normal}:host .mat-mdc-table .mat-column-download .button-container,:host .mat-mdc-table .mat-column-delete .button-container{display:flex;justify-content:center;align-items:center}\n"] }]
1325
+ args: [{ selector: "nrcl-list-attachments", changeDetection: ChangeDetectionStrategy.OnPush, template: "<nrcl-device-view>\n <ng-template desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }\"\n >\n <ng-container matColumnDef=\"make\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Make</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.make }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"attachmentTypeCode\">\n <th mat-header-cell *matHeaderCellDef>Attachment Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"fileName\">\n <th mat-header-cell *matHeaderCellDef>File Name</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileName }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"sourceObjectNameCode\">\n <th mat-header-cell *matHeaderCellDef>File Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.fileExtension }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedBy\">\n <th mat-header-cell *matHeaderCellDef>Uploaded By</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedBy }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"uploadedTimestamp\">\n <th mat-header-cell *matHeaderCellDef>Uploaded At</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.uploadedTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th mat-header-cell *matHeaderCellDef>Description</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.attachmentDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"download\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"delete\">\n <th mat-header-cell *matHeaderCellDef></th>\n <td mat-cell *matCellDef=\"let item\">\n <div class=\"button-container\">\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n </div>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n </ng-template>\n\n <ng-template mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-attachments', \n itemsPerPage: showPagination ? pageSize : totalRowCount, \n currentPage: showPagination ? pageNumber : 1, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.fileName }}</h2>\n </section>\n\n <section actions>\n <nrcl-button compact\n label=\"Download\"\n icon=\"download\"\n (click)=\"onDownloadClick( item )\" \n ></nrcl-button>\n\n @if ( canDelete ) {\n <nrcl-button compact\n label=\"Delete\"\n icon=\"delete\"\n (click)=\"onDeleteClick( item )\"\n ></nrcl-button>\n }\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>Attachment Type</mat-label>\n <div class=\"value\">{{ item.attachmentTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>File Type</mat-label>\n <div class=\"value\">{{ item.fileExtension }}</div>\n </section>\n\n <section>\n <mat-label>Uploaded By</mat-label>\n <div class=\"value\">{{ item.uploadedBy }}</div>\n </section> \n\n <section>\n <mat-label>Uploaded At</mat-label>\n <div class=\"value\">{{ item.uploadedTimestamp }}</div>\n </section> \n\n <section full-width>\n <mat-label>Description</mat-label>\n <div class=\"value\">{{ item.attachmentDescription }}</div>\n </section> \n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n @if ( showPagination ) {\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-attachments\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n }\n </ng-template>\n</nrcl-device-view>\n", styles: [":host .mat-mdc-table .mat-column-attachmentTypeCode{min-width:100px}:host .mat-mdc-table .mat-column-orgUnit{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-fileName{min-width:100px;max-width:200px}:host .mat-mdc-table .mat-column-sourceObjectNameCode{min-width:60px;max-width:60px}:host .mat-mdc-table .mat-column-uploadedBy{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-uploadedTimestamp{min-width:140px;max-width:140px}:host .mat-mdc-table .mat-column-description{width:100%;min-width:200px;max-width:100px;white-space:normal}:host .mat-mdc-table .mat-column-download .button-container,:host .mat-mdc-table .mat-column-delete .button-container{display:flex;justify-content:center;align-items:center}\n"] }]
1290
1326
  }], propDecorators: { rowListProvider: [{
1291
1327
  type: Input
1292
1328
  }], canDelete: [{
@@ -1330,11 +1366,11 @@ class ListEventHistoryComponent extends RowListBase {
1330
1366
  };
1331
1367
  }
1332
1368
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ListEventHistoryComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1333
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ListEventHistoryComponent, selector: "nrcl-list-event-history", inputs: { rowListProvider: "rowListProvider", canDelete: "canDelete", showPagination: "showPagination", isSupplier: "isSupplier" }, usesInheritance: true, ngImport: i0, template: "<nrcl-desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }\"\n matSort \n [matSortActive]=\"sortActive\"\n [matSortDirection]=\"sortDirection\"\n (matSortChange)=\"onSortChange( $event )\">\n >\n <ng-container matColumnDef=\"dateTime\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Date and Time</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"changedBy\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>User ID</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.createdByUserId }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"type\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventHistoryTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"section\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Section</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.sourceObjectNameDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"comment\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Comment</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.comment }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n</nrcl-desktop-view>\n\n<nrcl-mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.comment }}</h2>\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>User ID</mat-label>\n <div class=\"value\">{{ item.createdByUserId }}</div>\n </section>\n\n <section>\n <mat-label>Time</mat-label>\n <div class=\"value\">{{ item.eventTimestamp }}</div>\n </section>\n\n <section>\n <mat-label>Type</mat-label>\n <div class=\"value\">{{ item.eventHistoryTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>Section</mat-label>\n <div class=\"value\">{{ item.sourceObjectNameDescription }}</div>\n </section> \n\n <!-- <section full-width>\n <mat-label>Comment</mat-label>\n <div class=\"value\">{{ item.comment }}</div>\n </section> -->\n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n</nrcl-mobile-view>\n\n", styles: [":host .mat-mdc-table .mat-column-dateTime{min-width:150px;max-width:150px}:host .mat-mdc-table .mat-column-changedBy{min-width:120px;max-width:unset}:host .mat-mdc-table .mat-column-type{min-width:80px;max-width:80px}:host .mat-mdc-table .mat-column-section{min-width:150px;max-width:unset}:host .mat-mdc-table .mat-column-comment{width:100%;min-width:200px;max-width:100px;white-space:normal}\n"], dependencies: [{ kind: "component", type: i1$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$3.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i1$3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$3.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i3$3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: CellContentComponent, selector: "nrcl-cell-content", inputs: ["tooltip", "content"] }, { kind: "component", type: DesktopViewComponent, selector: "nrcl-desktop-view" }, { kind: "component", type: GapComponent, selector: "nrcl-gap", inputs: ["horizontal", "vertical"] }, { kind: "component", type: MobileViewComponent, selector: "nrcl-mobile-view" }, { kind: "component", type: RowListDesktopComponent, selector: "nrcl-row-list-desktop" }, { kind: "component", type: RowListMobileComponent, selector: "nrcl-row-list-mobile" }, { kind: "component", type: RowListPaginationComponent, selector: "nrcl-row-list-pagination", inputs: ["paginationId", "pageSizeOptions", "pageSize", "pageNumber", "rowCount", "showPageSize"], outputs: ["pageSizeChange", "pageNumberChange"] }, { kind: "pipe", type: i1$2.PaginatePipe, name: "paginate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1369
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ListEventHistoryComponent, selector: "nrcl-list-event-history", inputs: { rowListProvider: "rowListProvider", canDelete: "canDelete", showPagination: "showPagination", isSupplier: "isSupplier" }, usesInheritance: true, ngImport: i0, template: "<nrcl-device-view>\n <ng-template desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }\"\n matSort \n [matSortActive]=\"sortActive\"\n [matSortDirection]=\"sortDirection\"\n (matSortChange)=\"onSortChange( $event )\">\n >\n <ng-container matColumnDef=\"dateTime\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Date and Time</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"changedBy\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>User ID</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.createdByUserId }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"type\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventHistoryTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"section\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Section</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.sourceObjectNameDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"comment\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Comment</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.comment }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n </ng-template>\n\n <ng-template mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.comment }}</h2>\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>User ID</mat-label>\n <div class=\"value\">{{ item.createdByUserId }}</div>\n </section>\n\n <section>\n <mat-label>Time</mat-label>\n <div class=\"value\">{{ item.eventTimestamp }}</div>\n </section>\n\n <section>\n <mat-label>Type</mat-label>\n <div class=\"value\">{{ item.eventHistoryTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>Section</mat-label>\n <div class=\"value\">{{ item.sourceObjectNameDescription }}</div>\n </section> \n\n <!-- <section full-width>\n <mat-label>Comment</mat-label>\n <div class=\"value\">{{ item.comment }}</div>\n </section> -->\n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n </ng-template>\n</nrcl-device-view>\n", styles: [":host .mat-mdc-table .mat-column-dateTime{min-width:150px;max-width:150px}:host .mat-mdc-table .mat-column-changedBy{min-width:120px;max-width:unset}:host .mat-mdc-table .mat-column-type{min-width:80px;max-width:80px}:host .mat-mdc-table .mat-column-section{min-width:150px;max-width:unset}:host .mat-mdc-table .mat-column-comment{width:100%;min-width:200px;max-width:100px;white-space:normal}\n"], dependencies: [{ kind: "component", type: i1$4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$4.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i1$4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$3.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i3$3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: CellContentComponent, selector: "nrcl-cell-content", inputs: ["tooltip", "content"] }, { kind: "component", type: GapComponent, selector: "nrcl-gap", inputs: ["horizontal", "vertical"] }, { kind: "component", type: RowListDesktopComponent, selector: "nrcl-row-list-desktop" }, { kind: "component", type: RowListMobileComponent, selector: "nrcl-row-list-mobile" }, { kind: "component", type: RowListPaginationComponent, selector: "nrcl-row-list-pagination", inputs: ["paginationId", "pageSizeOptions", "pageSize", "pageNumber", "rowCount", "showPageSize"], outputs: ["pageSizeChange", "pageNumberChange"] }, { kind: "directive", type: DesktopViewDirective, selector: "[desktop-view]" }, { kind: "directive", type: MobileViewDirective, selector: "[mobile-view]" }, { kind: "component", type: DeviceViewComponent, selector: "nrcl-device-view" }, { kind: "pipe", type: i1$3.PaginatePipe, name: "paginate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1334
1370
  }
1335
1371
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ListEventHistoryComponent, decorators: [{
1336
1372
  type: Component,
1337
- args: [{ selector: "nrcl-list-event-history", changeDetection: ChangeDetectionStrategy.OnPush, template: "<nrcl-desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }\"\n matSort \n [matSortActive]=\"sortActive\"\n [matSortDirection]=\"sortDirection\"\n (matSortChange)=\"onSortChange( $event )\">\n >\n <ng-container matColumnDef=\"dateTime\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Date and Time</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"changedBy\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>User ID</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.createdByUserId }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"type\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventHistoryTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"section\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Section</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.sourceObjectNameDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"comment\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Comment</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.comment }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n</nrcl-desktop-view>\n\n<nrcl-mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.comment }}</h2>\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>User ID</mat-label>\n <div class=\"value\">{{ item.createdByUserId }}</div>\n </section>\n\n <section>\n <mat-label>Time</mat-label>\n <div class=\"value\">{{ item.eventTimestamp }}</div>\n </section>\n\n <section>\n <mat-label>Type</mat-label>\n <div class=\"value\">{{ item.eventHistoryTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>Section</mat-label>\n <div class=\"value\">{{ item.sourceObjectNameDescription }}</div>\n </section> \n\n <!-- <section full-width>\n <mat-label>Comment</mat-label>\n <div class=\"value\">{{ item.comment }}</div>\n </section> -->\n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n</nrcl-mobile-view>\n\n", styles: [":host .mat-mdc-table .mat-column-dateTime{min-width:150px;max-width:150px}:host .mat-mdc-table .mat-column-changedBy{min-width:120px;max-width:unset}:host .mat-mdc-table .mat-column-type{min-width:80px;max-width:80px}:host .mat-mdc-table .mat-column-section{min-width:150px;max-width:unset}:host .mat-mdc-table .mat-column-comment{width:100%;min-width:200px;max-width:100px;white-space:normal}\n"] }]
1373
+ args: [{ selector: "nrcl-list-event-history", changeDetection: ChangeDetectionStrategy.OnPush, template: "<nrcl-device-view>\n <ng-template desktop-view>\n <nrcl-row-list-desktop>\n <table mat-table\n [dataSource]=\"rows | paginate: { \n id: 'desktop-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }\"\n matSort \n [matSortActive]=\"sortActive\"\n [matSortDirection]=\"sortDirection\"\n (matSortChange)=\"onSortChange( $event )\">\n >\n <ng-container matColumnDef=\"dateTime\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Date and Time</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventTimestamp }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"changedBy\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>User ID</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.createdByUserId }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"type\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Type</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.eventHistoryTypeDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"section\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Section</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.sourceObjectNameDescription }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"comment\">\n <th mat-header-cell *matHeaderCellDef mat-sort-header>Comment</th>\n <td mat-cell *matCellDef=\"let item\">\n <nrcl-cell-content tooltip>{{ item.comment }}</nrcl-cell-content>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columns; sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let item; columns: columns;\"></tr>\n </table>\n </nrcl-row-list-desktop>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"desktop-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n </ng-template>\n\n <ng-template mobile-view>\n <nrcl-row-list-mobile>\n @for ( item of rows | paginate: { \n id: 'mobile-event-history', \n itemsPerPage: pageSize, \n currentPage: pageNumber, \n totalItems: totalRowCount \n }; track item.attachmentId ) {\n <mat-card>\n <mat-card-title>\n <section title>\n <h2>{{ item.comment }}</h2>\n </section>\n </mat-card-title>\n\n <mat-card-content>\n <section>\n <mat-label>User ID</mat-label>\n <div class=\"value\">{{ item.createdByUserId }}</div>\n </section>\n\n <section>\n <mat-label>Time</mat-label>\n <div class=\"value\">{{ item.eventTimestamp }}</div>\n </section>\n\n <section>\n <mat-label>Type</mat-label>\n <div class=\"value\">{{ item.eventHistoryTypeDescription }}</div>\n </section>\n\n <section>\n <mat-label>Section</mat-label>\n <div class=\"value\">{{ item.sourceObjectNameDescription }}</div>\n </section> \n\n <!-- <section full-width>\n <mat-label>Comment</mat-label>\n <div class=\"value\">{{ item.comment }}</div>\n </section> -->\n </mat-card-content>\n </mat-card>\n }\n </nrcl-row-list-mobile>\n\n <nrcl-gap vertical/>\n\n <nrcl-row-list-pagination\n paginationId=\"mobile-event-history\"\n [pageSize]=\"pageSize\"\n [pageNumber]=\"pageNumber\"\n [rowCount]=\"totalRowCount\"\n (pageNumberChange)=\"onPageNumberChange( $event )\"\n (pageSizeChange)=\"onPageSizeChange( $event )\"\n ></nrcl-row-list-pagination>\n </ng-template>\n</nrcl-device-view>\n", styles: [":host .mat-mdc-table .mat-column-dateTime{min-width:150px;max-width:150px}:host .mat-mdc-table .mat-column-changedBy{min-width:120px;max-width:unset}:host .mat-mdc-table .mat-column-type{min-width:80px;max-width:80px}:host .mat-mdc-table .mat-column-section{min-width:150px;max-width:unset}:host .mat-mdc-table .mat-column-comment{width:100%;min-width:200px;max-width:100px;white-space:normal}\n"] }]
1338
1374
  }], propDecorators: { rowListProvider: [{
1339
1375
  type: Input
1340
1376
  }], canDelete: [{
@@ -1417,7 +1453,7 @@ class RowListSortingComponent {
1417
1453
  });
1418
1454
  }
1419
1455
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RowListSortingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1420
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: RowListSortingComponent, selector: "nrcl-row-list-sorting", inputs: { sortColumn: "sortColumn", sortColumnOptions: "sortColumnOptions", sortDirection: "sortDirection" }, outputs: { sortChange: "sortChange" }, ngImport: i0, template: "<nrcl-filter-select class=\"sort-order\" \n label=\"Sort By\"\n [value]=\"wrapFilterValue( sortColumn )\"\n [options]=\"sortColumnOptions\"\n (valueChange)=\"onSortColumnChange( unwrapFilterValue( $event ) )\"\n selectMax=\"1\" \n></nrcl-filter-select>\n\n<nrcl-filter-container class=\"sort-direction\" \n label=\"Sort Order\"\n>\n <mat-radio-group\n [(ngModel)]=\"sortDirection\" \n (ngModelChange)=\"onSortDirectionChange()\"\n [disabled]=\"!sortColumn\"\n >\n <mat-radio-button aria-label=\"Sort A to Z\" value=\"asc\">A &rarr; Z</mat-radio-button>\n <mat-radio-button aria-label=\"Sort Z to A\" value=\"desc\">Z &rarr; A</mat-radio-button>\n </mat-radio-group>\n</nrcl-filter-container>\n", styles: [":host{gap:8px;width:100%;display:grid;grid-template-columns:1fr 1fr}:host .sort-order{--nrcl-filter-select-width: auto;grid-column:1}:host .sort-direction{--nrcl-filter-container-width: auto;grid-column:2}:host .sort-direction ::ng-deep .content .mat-mdc-radio-group{justify-content:space-evenly;width:100%}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$3.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i2$3.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: FilterContainerComponent, selector: "nrcl-filter-container", inputs: ["label", "hint"] }, { kind: "component", type: FilterSelectComponent, selector: "nrcl-filter-select", inputs: ["label", "placeholder", "hint", "options", "value", "selectMax", "tooltips", "summary", "clear"], outputs: ["valueChange"] }] }); }
1456
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: RowListSortingComponent, selector: "nrcl-row-list-sorting", inputs: { sortColumn: "sortColumn", sortColumnOptions: "sortColumnOptions", sortDirection: "sortDirection" }, outputs: { sortChange: "sortChange" }, ngImport: i0, template: "<nrcl-filter-select class=\"sort-order\" \n label=\"Sort By\"\n [value]=\"wrapFilterValue( sortColumn )\"\n [options]=\"sortColumnOptions\"\n (valueChange)=\"onSortColumnChange( unwrapFilterValue( $event ) )\"\n selectMax=\"1\" \n></nrcl-filter-select>\n\n<nrcl-filter-container class=\"sort-direction\" \n label=\"Sort Order\"\n>\n <mat-radio-group\n [(ngModel)]=\"sortDirection\" \n (ngModelChange)=\"onSortDirectionChange()\"\n [disabled]=\"!sortColumn\"\n >\n <mat-radio-button aria-label=\"Sort A to Z\" value=\"asc\">A &rarr; Z</mat-radio-button>\n <mat-radio-button aria-label=\"Sort Z to A\" value=\"desc\">Z &rarr; A</mat-radio-button>\n </mat-radio-group>\n</nrcl-filter-container>\n", styles: [":host{gap:8px;width:100%;display:grid;grid-template-columns:1fr 1fr}:host .sort-order{--nrcl-filter-select-width: auto;grid-column:1}:host .sort-direction{--nrcl-filter-container-width: auto;grid-column:2}:host .sort-direction ::ng-deep .content .mat-mdc-radio-group{justify-content:space-evenly;width:100%}\n"], dependencies: [{ kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$3.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i2$3.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: FilterContainerComponent, selector: "nrcl-filter-container", inputs: ["label", "hint"] }, { kind: "component", type: FilterSelectComponent, selector: "nrcl-filter-select", inputs: ["label", "placeholder", "hint", "options", "value", "selectMax", "tooltips", "summary", "clear"], outputs: ["valueChange"] }] }); }
1421
1457
  }
1422
1458
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RowListSortingComponent, decorators: [{
1423
1459
  type: Component,
@@ -1440,7 +1476,7 @@ class SnackbarComponent {
1440
1476
  get className() {
1441
1477
  return 'snackbar-type-' + this.config.type;
1442
1478
  }
1443
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SnackbarComponent, deps: [{ token: i1$4.MatSnackBarRef }, { token: MAT_SNACK_BAR_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
1479
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SnackbarComponent, deps: [{ token: i1$5.MatSnackBarRef }, { token: MAT_SNACK_BAR_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
1444
1480
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SnackbarComponent, selector: "nrcl-snackbar", host: { properties: { "class": "className" } }, ngImport: i0, template: "<div class=\"icon\">\n @switch ( config.type ) {\n @case ( 'success' ) {\n <mat-icon>check_circle</mat-icon>\n }\n @case ( 'error' ) {\n <mat-icon>cancel</mat-icon>\n }\n @case ( 'info' ) {\n <mat-icon>info</mat-icon>\n }\n @case ( 'update' ) {\n <mat-icon>error</mat-icon>\n }\n }\n</div>\n\n<div class=\"message\">\n <span>{{ config.message }}</span>\n</div>\n\n<div class=\"button\">\n <button (click)=\"snackBarRef.dismissWithAction()\">Close</button>\n</div>\n", styles: ["::ng-deep :root{--nrcl-snackbar-success-background-color: #2E7940;--nrcl-snackbar-error-background-color: #D8292F;--nrcl-snackbar-info-background-color: #37474f;--nrcl-snackbar-update-background-color: #37474f;--nrcl-snackbar-update-button-color: #f9ca81}:host{display:flex;align-items:stretch;height:100%;color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);word-break:break-word;background-color:var(--snackbar-background-color)}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host.snackbar-type-success{--snackbar-background-color: var(--nrcl-snackbar-success-background-color )}:host.snackbar-type-error{--snackbar-background-color: var(--nrcl-snackbar-error-background-color )}:host.snackbar-type-info{--snackbar-background-color: var( --nrcl-snackbar-info-background-color )}:host.snackbar-type-update{--snackbar-background-color: var( --nrcl-snackbar-update-background-color );--snackbar-button-color: var( --nrcl-snackbar-update-button-color )}:host .icon{display:flex;background-color:#f2f2f2;align-items:center;justify-content:center;pointer-events:none}:host .icon mat-icon{padding:var(--nrcl-gutter-space);color:var(--snackbar-background-color)}:host .message{padding:var(--nrcl-gutter-space);flex:1;cursor:default;pointer-events:none}:host .button{padding-right:8px;display:flex;align-items:center;justify-content:center}:host .button button{padding:calc(var(--nrcl-gutter-space) / 2);border:1px white solid;border-radius:5px;color:#fff;cursor:pointer;font-family:var(--nrcl-font-family);background-color:var(--snackbar-button-color, --snackbar-background-color)}::ng-deep .mat-mdc-snack-bar-container{color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);word-break:break-word}::ng-deep .mat-mdc-snack-bar-container .mat-mdc-snackbar-surface{padding-right:0}::ng-deep .mat-mdc-snack-bar-container .mat-mdc-snackbar-surface .mat-mdc-snack-bar-label{padding:0}\n"], dependencies: [{ kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
1445
1481
  }
1446
1482
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SnackbarComponent, decorators: [{
@@ -1448,7 +1484,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1448
1484
  args: [{ selector: 'nrcl-snackbar', host: {
1449
1485
  '[class]': 'className'
1450
1486
  }, template: "<div class=\"icon\">\n @switch ( config.type ) {\n @case ( 'success' ) {\n <mat-icon>check_circle</mat-icon>\n }\n @case ( 'error' ) {\n <mat-icon>cancel</mat-icon>\n }\n @case ( 'info' ) {\n <mat-icon>info</mat-icon>\n }\n @case ( 'update' ) {\n <mat-icon>error</mat-icon>\n }\n }\n</div>\n\n<div class=\"message\">\n <span>{{ config.message }}</span>\n</div>\n\n<div class=\"button\">\n <button (click)=\"snackBarRef.dismissWithAction()\">Close</button>\n</div>\n", styles: ["::ng-deep :root{--nrcl-snackbar-success-background-color: #2E7940;--nrcl-snackbar-error-background-color: #D8292F;--nrcl-snackbar-info-background-color: #37474f;--nrcl-snackbar-update-background-color: #37474f;--nrcl-snackbar-update-button-color: #f9ca81}:host{display:flex;align-items:stretch;height:100%;color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);word-break:break-word;background-color:var(--snackbar-background-color)}:host ::ng-deep .material-icons{font-family:Material Symbols Outlined;font-feature-settings:\"liga\"}:host ::ng-deep .mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host ::ng-deep button.mat-mdc-fab>.mat-icon,:host ::ng-deep button.mat-mdc-raised-button>.mat-icon,:host ::ng-deep button.mat-mdc-button>.mat-icon,:host ::ng-deep button.mat-mdc-icon-button>.mat-icon,:host ::ng-deep button.mat-mdc-outlined-button>.mat-icon,:host ::ng-deep button.mat-mdc-unelevated-button>.mat-icon,:host ::ng-deep button.mat-mdc-mini-fab .mat-mdc-menu-item>.mat-icon{width:var(--nrcl-icon-size);height:var(--nrcl-icon-size);font-size:var(--nrcl-icon-size);line-height:var(--nrcl-icon-size)}:host.snackbar-type-success{--snackbar-background-color: var(--nrcl-snackbar-success-background-color )}:host.snackbar-type-error{--snackbar-background-color: var(--nrcl-snackbar-error-background-color )}:host.snackbar-type-info{--snackbar-background-color: var( --nrcl-snackbar-info-background-color )}:host.snackbar-type-update{--snackbar-background-color: var( --nrcl-snackbar-update-background-color );--snackbar-button-color: var( --nrcl-snackbar-update-button-color )}:host .icon{display:flex;background-color:#f2f2f2;align-items:center;justify-content:center;pointer-events:none}:host .icon mat-icon{padding:var(--nrcl-gutter-space);color:var(--snackbar-background-color)}:host .message{padding:var(--nrcl-gutter-space);flex:1;cursor:default;pointer-events:none}:host .button{padding-right:8px;display:flex;align-items:center;justify-content:center}:host .button button{padding:calc(var(--nrcl-gutter-space) / 2);border:1px white solid;border-radius:5px;color:#fff;cursor:pointer;font-family:var(--nrcl-font-family);background-color:var(--snackbar-button-color, --snackbar-background-color)}::ng-deep .mat-mdc-snack-bar-container{color:#fff;font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size);word-break:break-word}::ng-deep .mat-mdc-snack-bar-container .mat-mdc-snackbar-surface{padding-right:0}::ng-deep .mat-mdc-snack-bar-container .mat-mdc-snackbar-surface .mat-mdc-snack-bar-label{padding:0}\n"] }]
1451
- }], ctorParameters: () => [{ type: i1$4.MatSnackBarRef }, { type: undefined, decorators: [{
1487
+ }], ctorParameters: () => [{ type: i1$5.MatSnackBarRef }, { type: undefined, decorators: [{
1452
1488
  type: Inject,
1453
1489
  args: [MAT_SNACK_BAR_DATA]
1454
1490
  }] }] });
@@ -1545,7 +1581,6 @@ class NrNgxComponentLibModule {
1545
1581
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NrNgxComponentLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
1546
1582
  static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: NrNgxComponentLibModule, declarations: [ButtonComponent,
1547
1583
  CellContentComponent,
1548
- DesktopViewComponent,
1549
1584
  ExpansionPanelComponent,
1550
1585
  ExpansionPanelHeaderComponent,
1551
1586
  ExpansionPanelFooterComponent,
@@ -1559,14 +1594,16 @@ class NrNgxComponentLibModule {
1559
1594
  GapComponent,
1560
1595
  ListAttachmentsComponent,
1561
1596
  ListEventHistoryComponent,
1562
- MobileViewComponent,
1563
1597
  PageContainerComponent,
1564
1598
  PageHeaderComponent,
1565
1599
  RowListDesktopComponent,
1566
1600
  RowListMobileComponent,
1567
1601
  RowListPaginationComponent,
1568
1602
  RowListSortingComponent,
1569
- SnackbarComponent], imports: [BrowserAnimationsModule,
1603
+ SnackbarComponent,
1604
+ DesktopViewDirective,
1605
+ MobileViewDirective,
1606
+ DeviceViewComponent], imports: [BrowserAnimationsModule,
1570
1607
  CommonModule,
1571
1608
  FormsModule,
1572
1609
  MatButtonModule,
@@ -1590,7 +1627,6 @@ class NrNgxComponentLibModule {
1590
1627
  OwlMomentDateTimeModule,
1591
1628
  NgxPaginationModule], exports: [ButtonComponent,
1592
1629
  CellContentComponent,
1593
- DesktopViewComponent,
1594
1630
  ExpansionPanelComponent,
1595
1631
  ExpansionPanelHeaderComponent,
1596
1632
  ExpansionPanelFooterComponent,
@@ -1604,14 +1640,16 @@ class NrNgxComponentLibModule {
1604
1640
  GapComponent,
1605
1641
  ListAttachmentsComponent,
1606
1642
  ListEventHistoryComponent,
1607
- MobileViewComponent,
1608
1643
  PageContainerComponent,
1609
1644
  PageHeaderComponent,
1610
1645
  RowListDesktopComponent,
1611
1646
  RowListMobileComponent,
1612
1647
  RowListPaginationComponent,
1613
1648
  RowListSortingComponent,
1614
- SnackbarComponent] }); }
1649
+ SnackbarComponent,
1650
+ DesktopViewDirective,
1651
+ MobileViewDirective,
1652
+ DeviceViewComponent] }); }
1615
1653
  static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NrNgxComponentLibModule, providers: [
1616
1654
  SnackbarUtilService,
1617
1655
  ConfigurationService,
@@ -1672,7 +1710,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1672
1710
  declarations: [
1673
1711
  ButtonComponent,
1674
1712
  CellContentComponent,
1675
- DesktopViewComponent,
1676
1713
  ExpansionPanelComponent,
1677
1714
  ExpansionPanelHeaderComponent,
1678
1715
  ExpansionPanelFooterComponent,
@@ -1686,7 +1723,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1686
1723
  GapComponent,
1687
1724
  ListAttachmentsComponent,
1688
1725
  ListEventHistoryComponent,
1689
- MobileViewComponent,
1690
1726
  PageContainerComponent,
1691
1727
  PageHeaderComponent,
1692
1728
  RowListDesktopComponent,
@@ -1694,11 +1730,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1694
1730
  RowListPaginationComponent,
1695
1731
  RowListSortingComponent,
1696
1732
  SnackbarComponent,
1733
+ DesktopViewDirective,
1734
+ MobileViewDirective,
1735
+ DeviceViewComponent
1697
1736
  ],
1698
1737
  exports: [
1699
1738
  ButtonComponent,
1700
1739
  CellContentComponent,
1701
- DesktopViewComponent,
1702
1740
  ExpansionPanelComponent,
1703
1741
  ExpansionPanelHeaderComponent,
1704
1742
  ExpansionPanelFooterComponent,
@@ -1712,7 +1750,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1712
1750
  GapComponent,
1713
1751
  ListAttachmentsComponent,
1714
1752
  ListEventHistoryComponent,
1715
- MobileViewComponent,
1716
1753
  PageContainerComponent,
1717
1754
  PageHeaderComponent,
1718
1755
  RowListDesktopComponent,
@@ -1720,6 +1757,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1720
1757
  RowListPaginationComponent,
1721
1758
  RowListSortingComponent,
1722
1759
  SnackbarComponent,
1760
+ DesktopViewDirective,
1761
+ MobileViewDirective,
1762
+ DeviceViewComponent
1723
1763
  ],
1724
1764
  providers: [
1725
1765
  SnackbarUtilService,
@@ -1738,5 +1778,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1738
1778
  * Generated bundle index. Do not edit.
1739
1779
  */
1740
1780
 
1741
- export { Aborted, ButtonComponent, CellContentComponent, CodeTable, ConfigurationService, ConfigurationSubscriberBase, DATE_FORMATS, DesktopViewComponent, ExpansionPanelComponent, ExpansionPanelFooterComponent, ExpansionPanelHeaderComponent, FilterContainerComponent, FilterDateComponent, FilterSearchComponent, FilterSelectComponent, FiltersPanelComponent, FormFieldComponent, FormLayoutComponent, GapComponent, ListAttachmentsComponent, ListEventHistoryComponent, MobileViewComponent, NrNgxComponentLibModule, ObservableAborter, PageContainerComponent, PageHeaderComponent, PageStateService, RowListBase, RowListDesktopComponent, RowListMobileComponent, RowListPaginationComponent, RowListSortingComponent, SnackbarComponent, SnackbarUtilService, makeSummary, mapToCodeDescription, unwrapFilterValue, wrapFilterValue };
1781
+ export { Aborted, ButtonComponent, CellContentComponent, CodeTable, ConfigurationService, ConfigurationSubscriberBase, DATE_FORMATS, DesktopViewDirective, DeviceViewComponent, ExpansionPanelComponent, ExpansionPanelFooterComponent, ExpansionPanelHeaderComponent, FilterContainerComponent, FilterDateComponent, FilterSearchComponent, FilterSelectComponent, FiltersPanelComponent, FormFieldComponent, FormLayoutComponent, GapComponent, ListAttachmentsComponent, ListEventHistoryComponent, MobileViewDirective, NrNgxComponentLibModule, ObservableAborter, PageContainerComponent, PageHeaderComponent, PageStateService, RowListBase, RowListDesktopComponent, RowListMobileComponent, RowListPaginationComponent, RowListSortingComponent, SnackbarComponent, SnackbarUtilService, makeSummary, mapToCodeDescription, unwrapFilterValue, wrapFilterValue };
1742
1782
  //# sourceMappingURL=bcgov-nr-ngx-component-lib.mjs.map