@bcgov/nr-ngx-component-lib 0.0.1

package/esm2022/components/expansion-panel/expansion-panel.component.mjs

@@ -0,0 +1,144 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild } from "@angular/core";
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/expansion";
+import * as i2 from "@angular/material/progress-spinner";
+import * as i3 from "@angular/material/icon";
+import * as i4 from "../button/button.component";
+export class ExpansionPanelComponent {
+    constructor() {
+        this.isLoading = false;
+        this.disabled = false;
+        this.expanded = false;
+        this.expandedChange = new EventEmitter();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    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.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "nrcl-expansion-panel", changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.is-loading]': 'isLoading',
+                        '[class.expanded]': 'matExpansionPanel?.expanded',
+                        '[class.disabled]': 'disabled',
+                    }, 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"] }]
+        }], propDecorators: { isLoading: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], expanded: [{
+                type: Input
+            }], expandedChange: [{
+                type: Output
+            }], matExpansionPanel: [{
+                type: ViewChild,
+                args: ['panel']
+            }] } });
+export class ExpansionPanelHeaderComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ExpansionPanelHeaderComponent, selector: "nrcl-expansion-panel-header", ngImport: i0, template: `
+        <div class="left-side">
+            <ng-content select="[left-side],h2,h3"></ng-content>
+        </div>
+
+        <div class="right-side">
+            <ng-content></ng-content>
+        </div>
+    `, isInline: true, styles: [":host{display:flex;color:#212121;width:100%}.left-side{display:flex;flex-direction:column;padding:10px 0;align-self:flex-start}.left-side ::ng-deep h2{font-size:var( --nrcl-font-size-h2);font-weight:200;padding:0;margin:0}.left-side ::ng-deep h3{font-size:var( --nrcl-font-size-h3 );font-weight:200;padding:0;margin:0}.right-side{flex-grow:1;display:flex;justify-content:flex-end;align-self:center}\n"] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "nrcl-expansion-panel-header", template: `
+        <div class="left-side">
+            <ng-content select="[left-side],h2,h3"></ng-content>
+        </div>
+
+        <div class="right-side">
+            <ng-content></ng-content>
+        </div>
+    `, styles: [":host{display:flex;color:#212121;width:100%}.left-side{display:flex;flex-direction:column;padding:10px 0;align-self:flex-start}.left-side ::ng-deep h2{font-size:var( --nrcl-font-size-h2);font-weight:200;padding:0;margin:0}.left-side ::ng-deep h3{font-size:var( --nrcl-font-size-h3 );font-weight:200;padding:0;margin:0}.right-side{flex-grow:1;display:flex;justify-content:flex-end;align-self:center}\n"] }]
+        }] });
+export class ExpansionPanelFooterComponent {
+    constructor() {
+        this.warningMessage = 'Unsaved Changes';
+        this.showWarning = false;
+        this.saveClick = new EventEmitter();
+        this.cancelClick = new EventEmitter();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ExpansionPanelFooterComponent, selector: "nrcl-expansion-panel-footer", inputs: { saveEnabled: "saveEnabled", cancelEnabled: "cancelEnabled", warningMessage: "warningMessage", showWarning: "showWarning" }, outputs: { saveClick: "saveClick", cancelClick: "cancelClick" }, ngImport: i0, template: `
+        @if ( showWarning ) {
+            <div class="warning">
+                <mat-icon>warning</mat-icon>
+                <span>{{ warningMessage }}</span>
+            </div>
+        }
+
+        @if ( cancelEnabled != null ) {
+            <nrcl-button
+                label="Cancel"
+                iconCompact="cancel"
+                compact="mobile"
+                [disabled]="!cancelEnabled"
+                click="cancelClick.emit( $event )"
+            ></nrcl-button>
+        }
+
+        @if ( saveEnabled != null ) {
+            <nrcl-button primary
+                label="Save"
+                iconCompact="save"
+                compact="mobile"
+                [disabled]="!saveEnabled"
+                click="saveClick.emit( $event )"
+            ></nrcl-button>
+        }
+
+        <ng-content></ng-content>
+    `, isInline: true, styles: [":host{border-top:1px solid #c6c8cb;padding:var(--nrcl-gutter-space);background-color:#f2f2f2;display:flex;gap:8px;justify-content:flex-end}:host:empty{display:none}.warning{display:flex;gap:4px;align-items:center}.warning .mat-icon{color:#fcba19}\n"], dependencies: [{ kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.ButtonComponent, selector: "nrcl-button", inputs: ["label", "icon", "iconRight", "iconCompact", "tooltip", "compact", "primary", "disabled"], outputs: ["click"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ExpansionPanelFooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "nrcl-expansion-panel-footer", template: `
+        @if ( showWarning ) {
+            <div class="warning">
+                <mat-icon>warning</mat-icon>
+                <span>{{ warningMessage }}</span>
+            </div>
+        }
+
+        @if ( cancelEnabled != null ) {
+            <nrcl-button
+                label="Cancel"
+                iconCompact="cancel"
+                compact="mobile"
+                [disabled]="!cancelEnabled"
+                click="cancelClick.emit( $event )"
+            ></nrcl-button>
+        }
+
+        @if ( saveEnabled != null ) {
+            <nrcl-button primary
+                label="Save"
+                iconCompact="save"
+                compact="mobile"
+                [disabled]="!saveEnabled"
+                click="saveClick.emit( $event )"
+            ></nrcl-button>
+        }
+
+        <ng-content></ng-content>
+    `, styles: [":host{border-top:1px solid #c6c8cb;padding:var(--nrcl-gutter-space);background-color:#f2f2f2;display:flex;gap:8px;justify-content:flex-end}:host:empty{display:none}.warning{display:flex;gap:4px;align-items:center}.warning .mat-icon{color:#fcba19}\n"] }]
+        }], propDecorators: { saveEnabled: [{
+                type: Input
+            }], cancelEnabled: [{
+                type: Input
+            }], warningMessage: [{
+                type: Input
+            }], showWarning: [{
+                type: Input
+            }], saveClick: [{
+                type: Output
+            }], cancelClick: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXhwYW5zaW9uLXBhbmVsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25yLW5neC1jb21wb25lbnQtbGliL3NyYy9jb21wb25lbnRzL2V4cGFuc2lvbi1wYW5lbC9leHBhbnNpb24tcGFuZWwuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbnItbmd4LWNvbXBvbmVudC1saWIvc3JjL2NvbXBvbmVudHMvZXhwYW5zaW9uLXBhbmVsL2V4cGFuc2lvbi1wYW5lbC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7Ozs7O0FBYzNHLE1BQU0sT0FBTyx1QkFBdUI7SUFYcEM7UUFZYSxjQUFTLEdBQVksS0FBSyxDQUFDO1FBQzNCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDakIsYUFBUSxHQUFHLEtBQUssQ0FBQTtRQUVmLG1CQUFjLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQTtLQUd6RDsrR0FSWSx1QkFBdUI7bUdBQXZCLHVCQUF1QixpYkNkcEMsbXVCQXNCc0I7OzRGRFJULHVCQUF1QjtrQkFYbkMsU0FBUzsrQkFDSSxzQkFBc0IsbUJBR2YsdUJBQXVCLENBQUMsTUFBTSxRQUN6Qzt3QkFDRixvQkFBb0IsRUFBSSxXQUFXO3dCQUNuQyxrQkFBa0IsRUFBTSw2QkFBNkI7d0JBQ3JELGtCQUFrQixFQUFNLFVBQVU7cUJBQ3JDOzhCQUdRLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVJLGNBQWM7c0JBQXZCLE1BQU07Z0JBRWUsaUJBQWlCO3NCQUF0QyxTQUFTO3VCQUFFLE9BQU87O0FBa0R2QixNQUFNLE9BQU8sNkJBQTZCOytHQUE3Qiw2QkFBNkI7bUdBQTdCLDZCQUE2QixtRUE3QzVCOzs7Ozs7OztLQVFUOzs0RkFxQ1EsNkJBQTZCO2tCQS9DekMsU0FBUzsrQkFDSSw2QkFBNkIsWUFDN0I7Ozs7Ozs7O0tBUVQ7O0FBZ0dMLE1BQU0sT0FBTyw2QkFBNkI7SUF6RDFDO1FBNERhLG1CQUFjLEdBQUcsaUJBQWlCLENBQUE7UUFDbEMsZ0JBQVcsR0FBRyxLQUFLLENBQUE7UUFFbEIsY0FBUyxHQUFHLElBQUksWUFBWSxFQUFnQixDQUFBO1FBQzVDLGdCQUFXLEdBQUcsSUFBSSxZQUFZLEVBQWdCLENBQUE7S0FDM0Q7K0dBUlksNkJBQTZCO21HQUE3Qiw2QkFBNkIsMFFBdkQ1Qjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7S0E2QlQ7OzRGQTBCUSw2QkFBNkI7a0JBekR6QyxTQUFTOytCQUNJLDZCQUE2QixZQUM3Qjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7S0E2QlQ7OEJBMkJRLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csYUFBYTtzQkFBckIsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBRUksU0FBUztzQkFBbEIsTUFBTTtnQkFDRyxXQUFXO3NCQUFwQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0LCBWaWV3Q2hpbGQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgTWF0RXhwYW5zaW9uUGFuZWwgfSBmcm9tIFwiQGFuZ3VsYXIvbWF0ZXJpYWwvZXhwYW5zaW9uXCI7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiBcIm5yY2wtZXhwYW5zaW9uLXBhbmVsXCIsXG4gICAgdGVtcGxhdGVVcmw6IFwiLi9leHBhbnNpb24tcGFuZWwuY29tcG9uZW50Lmh0bWxcIixcbiAgICBzdHlsZVVybDogXCIuL2V4cGFuc2lvbi1wYW5lbC5jb21wb25lbnQuc2Nzc1wiLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIGhvc3Q6IHtcbiAgICAgICAgJ1tjbGFzcy5pcy1sb2FkaW5nXSc6ICAgJ2lzTG9hZGluZycsXG4gICAgICAgICdbY2xhc3MuZXhwYW5kZWRdJzogICAgICdtYXRFeHBhbnNpb25QYW5lbD8uZXhwYW5kZWQnLFxuICAgICAgICAnW2NsYXNzLmRpc2FibGVkXSc6ICAgICAnZGlzYWJsZWQnLFxuICAgIH1cbn0pXG5leHBvcnQgY2xhc3MgRXhwYW5zaW9uUGFuZWxDb21wb25lbnQge1xuICAgIEBJbnB1dCgpIGlzTG9hZGluZzogYm9vbGVhbiA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIGRpc2FibGVkID0gZmFsc2U7XG4gICAgQElucHV0KCkgZXhwYW5kZWQgPSBmYWxzZVxuXG4gICAgQE91dHB1dCgpIGV4cGFuZGVkQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpXG5cbiAgICBAVmlld0NoaWxkKCAncGFuZWwnICkgbWF0RXhwYW5zaW9uUGFuZWw6IE1hdEV4cGFuc2lvblBhbmVsXG59XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiBcIm5yY2wtZXhwYW5zaW9uLXBhbmVsLWhlYWRlclwiLFxuICAgIHRlbXBsYXRlOiBgXG4gICAgICAgIDxkaXYgY2xhc3M9XCJsZWZ0LXNpZGVcIj5cbiAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltsZWZ0LXNpZGVdLGgyLGgzXCI+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8ZGl2IGNsYXNzPVwicmlnaHQtc2lkZVwiPlxuICAgICAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICBgLFxuICAgIHN0eWxlczogW2BcbiAgICAgICAgOmhvc3Qge1xuICAgICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICAgIGNvbG9yOiAjMjEyMTIxO1xuICAgICAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIH1cblxuICAgICAgICAubGVmdC1zaWRlIHtcbiAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgICAgICAgICAgcGFkZGluZzogMTBweCAwOyAgICAgICAgXG4gICAgICAgICAgICBhbGlnbi1zZWxmOiBmbGV4LXN0YXJ0O1xuICAgICAgICB9XG5cbiAgICAgICAgLmxlZnQtc2lkZSA6Om5nLWRlZXAgaDIge1xuICAgICAgICAgICAgZm9udC1zaXplOiB2YXIoIC0tbnJjbC1mb250LXNpemUtaDIpO1xuICAgICAgICAgICAgZm9udC13ZWlnaHQ6IDIwMDtcbiAgICAgICAgICAgIHBhZGRpbmc6IDA7XG4gICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgIH0gICAgXG5cbiAgICAgICAgLmxlZnQtc2lkZSA6Om5nLWRlZXAgaDMge1xuICAgICAgICAgICAgZm9udC1zaXplOiB2YXIoIC0tbnJjbC1mb250LXNpemUtaDMgKTtcbiAgICAgICAgICAgIGZvbnQtd2VpZ2h0OiAyMDA7XG4gICAgICAgICAgICBwYWRkaW5nOiAwO1xuICAgICAgICAgICAgbWFyZ2luOiAwO1xuICAgICAgICB9ICAgIFxuXG4gICAgICAgIC5yaWdodC1zaWRlIHtcbiAgICAgICAgICAgIGZsZXgtZ3JvdzogMTtcbiAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xuICAgICAgICAgICAgYWxpZ24tc2VsZjogY2VudGVyO1xuICAgICAgICB9XG4gICAgYF0sXG59KVxuZXhwb3J0IGNsYXNzIEV4cGFuc2lvblBhbmVsSGVhZGVyQ29tcG9uZW50IHt9XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiBcIm5yY2wtZXhwYW5zaW9uLXBhbmVsLWZvb3RlclwiLFxuICAgIHRlbXBsYXRlOiBgXG4gICAgICAgIEBpZiAoIHNob3dXYXJuaW5nICkge1xuICAgICAgICAgICAgPGRpdiBjbGFzcz1cIndhcm5pbmdcIj5cbiAgICAgICAgICAgICAgICA8bWF0LWljb24+d2FybmluZzwvbWF0LWljb24+XG4gICAgICAgICAgICAgICAgPHNwYW4+e3sgd2FybmluZ01lc3NhZ2UgfX08L3NwYW4+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgfVxuXG4gICAgICAgIEBpZiAoIGNhbmNlbEVuYWJsZWQgIT0gbnVsbCApIHtcbiAgICAgICAgICAgIDxucmNsLWJ1dHRvblxuICAgICAgICAgICAgICAgIGxhYmVsPVwiQ2FuY2VsXCJcbiAgICAgICAgICAgICAgICBpY29uQ29tcGFjdD1cImNhbmNlbFwiXG4gICAgICAgICAgICAgICAgY29tcGFjdD1cIm1vYmlsZVwiXG4gICAgICAgICAgICAgICAgW2Rpc2FibGVkXT1cIiFjYW5jZWxFbmFibGVkXCJcbiAgICAgICAgICAgICAgICBjbGljaz1cImNhbmNlbENsaWNrLmVtaXQoICRldmVudCApXCJcbiAgICAgICAgICAgID48L25yY2wtYnV0dG9uPlxuICAgICAgICB9XG5cbiAgICAgICAgQGlmICggc2F2ZUVuYWJsZWQgIT0gbnVsbCApIHtcbiAgICAgICAgICAgIDxucmNsLWJ1dHRvbiBwcmltYXJ5XG4gICAgICAgICAgICAgICAgbGFiZWw9XCJTYXZlXCJcbiAgICAgICAgICAgICAgICBpY29uQ29tcGFjdD1cInNhdmVcIlxuICAgICAgICAgICAgICAgIGNvbXBhY3Q9XCJtb2JpbGVcIlxuICAgICAgICAgICAgICAgIFtkaXNhYmxlZF09XCIhc2F2ZUVuYWJsZWRcIlxuICAgICAgICAgICAgICAgIGNsaWNrPVwic2F2ZUNsaWNrLmVtaXQoICRldmVudCApXCJcbiAgICAgICAgICAgID48L25yY2wtYnV0dG9uPlxuICAgICAgICB9XG5cbiAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgIGAsXG4gICAgc3R5bGVzOiBbYFxuICAgICAgICA6aG9zdCB7XG4gICAgICAgICAgICBib3JkZXItdG9wOiAxcHggc29saWQgI2M2YzhjYjtcbiAgICAgICAgICAgIHBhZGRpbmc6IHZhcigtLW5yY2wtZ3V0dGVyLXNwYWNlKTtcbiAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICNmMmYyZjI7XG4gICAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgICAgZ2FwOiA4cHg7XG4gICAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3Q6ZW1wdHkge1xuICAgICAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICAgICAgfVxuXG4gICAgICAgIC53YXJuaW5nIHtcbiAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICBnYXA6IDRweDtcbiAgICAgICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgIH1cblxuICAgICAgICAud2FybmluZyAubWF0LWljb24ge1xuICAgICAgICAgICAgY29sb3I6ICNGQ0JBMTk7ICAgICAgICBcbiAgICAgICAgfVxuICAgIGBdLFxufSlcbmV4cG9ydCBjbGFzcyBFeHBhbnNpb25QYW5lbEZvb3RlckNvbXBvbmVudCB7XG4gICAgQElucHV0KCkgc2F2ZUVuYWJsZWQgXG4gICAgQElucHV0KCkgY2FuY2VsRW5hYmxlZCBcbiAgICBASW5wdXQoKSB3YXJuaW5nTWVzc2FnZSA9ICdVbnNhdmVkIENoYW5nZXMnXG4gICAgQElucHV0KCkgc2hvd1dhcm5pbmcgPSBmYWxzZVxuXG4gICAgQE91dHB1dCgpIHNhdmVDbGljayA9IG5ldyBFdmVudEVtaXR0ZXI8UG9pbnRlckV2ZW50PigpXG4gICAgQE91dHB1dCgpIGNhbmNlbENsaWNrID0gbmV3IEV2ZW50RW1pdHRlcjxQb2ludGVyRXZlbnQ+KClcbn1cbiIsIjxtYXQtZXhwYW5zaW9uLXBhbmVsICNwYW5lbCBcbiAgICB0b2dnbGVQb3NpdGlvbj1cImJlZm9yZVwiXG4gICAgW2V4cGFuZGVkXT1cImV4cGFuZGVkXCIgXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCIgXG4gICAgKG9wZW5lZCk9XCJleHBhbmRlZENoYW5nZS5lbWl0KCB0cnVlIClcIiAgIFxuICAgIChjbG9zZWQpPVwiZXhwYW5kZWRDaGFuZ2UuZW1pdCggZmFsc2UgKVwiICAgXG4+XG4gICAgPG1hdC1leHBhbnNpb24tcGFuZWwtaGVhZGVyPlxuICAgICAgICA8bWF0LXBhbmVsLWRlc2NyaXB0aW9uPlxuICAgICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwibnJjbC1leHBhbnNpb24tcGFuZWwtaGVhZGVyXCI+PC9uZy1jb250ZW50PlxuXG4gICAgICAgICAgICBAaWYgKCBpc0xvYWRpbmcgKSB7XG4gICAgICAgICAgICAgICAgPG1hdC1zcGlubmVyIGNsYXNzPVwibG9hZGluZ1wiIFtkaWFtZXRlcl09XCIzMFwiPjwvbWF0LXNwaW5uZXI+XG4gICAgICAgICAgICB9XG4gICAgICAgIDwvbWF0LXBhbmVsLWRlc2NyaXB0aW9uPlxuICAgIDwvbWF0LWV4cGFuc2lvbi1wYW5lbC1oZWFkZXI+XG5cbiAgICA8ZGl2IGNsYXNzPVwiYm9keVwiPlxuICAgICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJucmNsLWV4cGFuc2lvbi1wYW5lbC1mb290ZXJcIj48L25nLWNvbnRlbnQ+XG48L21hdC1leHBhbnNpb24tcGFuZWw+Il19

package/esm2022/components/filter-container/filter-container.component.mjs

@@ -0,0 +1,20 @@
+import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/form-field";
+import * as i2 from "@angular/material/input";
+export class FilterContainerComponent {
+    constructor() {
+        this.label = '[label]';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FilterContainerComponent, selector: "nrcl-filter-container", inputs: { label: "label", hint: "hint" }, ngImport: i0, template: "<mat-form-field\n    floatLabel=\"always\"\n    appearance=\"outline\"\n    subscriptSizing=\"dynamic\"\n>\n    <mat-label>{{ label }}</mat-label>\n\n    <input matInput>\n\n    <div class=\"content\">\n        <ng-content></ng-content>\n    </div>\n\n    @if ( hint ) {\n        <mat-hint>{{ hint }}</mat-hint>\n    }\n</mat-form-field>\n", styles: ["::ng-deep :root{--nrcl-filter-container-width: var( --nrcl-filter-width-default );--nrcl-filter-container-height: var( --nrcl-filter-height-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-container-width, var(--nrcl-filter-width-default));display:block}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent,:host ::ng-deep mat-selection-list .mat-mdc-list-option{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size)}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox{padding-left:0;padding-right:0}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mdc-checkbox__native-control~.mdc-checkbox__background,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control~.mdc-checkbox__background{left:0;border:1px solid #c6c8cb}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background{background-color:#fff}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple,:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mat-mdc-checkbox-ripple,:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mdc-checkbox__ripple,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mat-mdc-checkbox-ripple,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__ripple{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%,-50%)}:host ::ng-deep .table-search-header .search-and-filters .field.filter-checkbox-group .checkbox-group{gap:15px}:host ::ng-deep .mat-mdc-radio-button.mat-accent{--mdc-radio-selected-focus-icon-color: #003366;--mdc-radio-selected-hover-icon-color: #003366;--mdc-radio-selected-icon-color: #003366;--mdc-radio-selected-pressed-icon-color: #003366;--mat-mdc-radio-checked-ripple-color: #003366}:host ::ng-deep .mat-mdc-radio-button.mat-accent .mdc-form-field .mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__outer-circle{background-color:#fff}: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-container-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-container-width, var(--nrcl-filter-width-default));padding:0}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix>input{display:none}:host .content{display:flex;gap:var(--nrcl-gutter-space);align-items:center;height:var(--nrcl-filter-container-height, var(--nrcl-filter-height-default))}:host .content ::ng-deep .mdc-checkbox{padding:0}:host .content ::ng-deep .mdc-checkbox .mdc-checkbox__background{top:0}:host .content ::ng-deep .mat-mdc-radio-group{display:flex;gap:var(--nrcl-gutter-space)}:host .content ::ng-deep .mat-mdc-radio-group .mdc-radio{padding:0}\n"], dependencies: [{ kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "nrcl-filter-container", changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field\n    floatLabel=\"always\"\n    appearance=\"outline\"\n    subscriptSizing=\"dynamic\"\n>\n    <mat-label>{{ label }}</mat-label>\n\n    <input matInput>\n\n    <div class=\"content\">\n        <ng-content></ng-content>\n    </div>\n\n    @if ( hint ) {\n        <mat-hint>{{ hint }}</mat-hint>\n    }\n</mat-form-field>\n", styles: ["::ng-deep :root{--nrcl-filter-container-width: var( --nrcl-filter-width-default );--nrcl-filter-container-height: var( --nrcl-filter-height-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-container-width, var(--nrcl-filter-width-default));display:block}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent,:host ::ng-deep mat-selection-list .mat-mdc-list-option{font-family:var(--nrcl-font-family);font-size:var(--nrcl-font-size)}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox{padding-left:0;padding-right:0}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mdc-checkbox__native-control~.mdc-checkbox__background,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control~.mdc-checkbox__background{left:0;border:1px solid #c6c8cb}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background{background-color:#fff}:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple,:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mat-mdc-checkbox-ripple,:host ::ng-deep mat-checkbox.mat-mdc-checkbox.mat-accent .mdc-checkbox .mdc-checkbox__ripple,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mat-mdc-checkbox-ripple,:host ::ng-deep mat-selection-list .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__ripple{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%,-50%)}:host ::ng-deep .table-search-header .search-and-filters .field.filter-checkbox-group .checkbox-group{gap:15px}:host ::ng-deep .mat-mdc-radio-button.mat-accent{--mdc-radio-selected-focus-icon-color: #003366;--mdc-radio-selected-hover-icon-color: #003366;--mdc-radio-selected-icon-color: #003366;--mdc-radio-selected-pressed-icon-color: #003366;--mat-mdc-radio-checked-ripple-color: #003366}:host ::ng-deep .mat-mdc-radio-button.mat-accent .mdc-form-field .mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__outer-circle{background-color:#fff}: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-container-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-container-width, var(--nrcl-filter-width-default));padding:0}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix>input{display:none}:host .content{display:flex;gap:var(--nrcl-gutter-space);align-items:center;height:var(--nrcl-filter-container-height, var(--nrcl-filter-height-default))}:host .content ::ng-deep .mdc-checkbox{padding:0}:host .content ::ng-deep .mdc-checkbox .mdc-checkbox__background{top:0}:host .content ::ng-deep .mat-mdc-radio-group{display:flex;gap:var(--nrcl-gutter-space)}:host .content ::ng-deep .mat-mdc-radio-group .mdc-radio{padding:0}\n"] }]
+        }], propDecorators: { label: [{
+                type: Input
+            }], hint: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsdGVyLWNvbnRhaW5lci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uci1uZ3gtY29tcG9uZW50LWxpYi9zcmMvY29tcG9uZW50cy9maWx0ZXItY29udGFpbmVyL2ZpbHRlci1jb250YWluZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbnItbmd4LWNvbXBvbmVudC1saWIvc3JjL2NvbXBvbmVudHMvZmlsdGVyLWNvbnRhaW5lci9maWx0ZXItY29udGFpbmVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDSCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULEtBQUssRUFDUixNQUFNLGVBQWUsQ0FBQzs7OztBQVF2QixNQUFNLE9BQU8sd0JBQXdCO0lBTnJDO1FBT2EsVUFBSyxHQUFHLFNBQVMsQ0FBQTtLQUU3QjsrR0FIWSx3QkFBd0I7bUdBQXhCLHdCQUF3Qix1R0NackMscVZBaUJBOzs0RkRMYSx3QkFBd0I7a0JBTnBDLFNBQVM7K0JBQ0ksdUJBQXVCLG1CQUdoQix1QkFBdUIsQ0FBQyxNQUFNOzhCQUd0QyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgICBDb21wb25lbnQsXG4gICAgSW5wdXRcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcblxuQENvbXBvbmVudCgge1xuICAgIHNlbGVjdG9yOiBcIm5yY2wtZmlsdGVyLWNvbnRhaW5lclwiLFxuICAgIHRlbXBsYXRlVXJsOiBcIi4vZmlsdGVyLWNvbnRhaW5lci5jb21wb25lbnQuaHRtbFwiLFxuICAgIHN0eWxlVXJsOiBcIi4vZmlsdGVyLWNvbnRhaW5lci5jb21wb25lbnQuc2Nzc1wiLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSApXG5leHBvcnQgY2xhc3MgRmlsdGVyQ29udGFpbmVyQ29tcG9uZW50IHtcbiAgICBASW5wdXQoKSBsYWJlbCA9ICdbbGFiZWxdJ1xuICAgIEBJbnB1dCgpIGhpbnRcbn1cbiIsIjxtYXQtZm9ybS1maWVsZFxuICAgIGZsb2F0TGFiZWw9XCJhbHdheXNcIlxuICAgIGFwcGVhcmFuY2U9XCJvdXRsaW5lXCJcbiAgICBzdWJzY3JpcHRTaXppbmc9XCJkeW5hbWljXCJcbj5cbiAgICA8bWF0LWxhYmVsPnt7IGxhYmVsIH19PC9tYXQtbGFiZWw+XG5cbiAgICA8aW5wdXQgbWF0SW5wdXQ+XG5cbiAgICA8ZGl2IGNsYXNzPVwiY29udGVudFwiPlxuICAgICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG5cbiAgICBAaWYgKCBoaW50ICkge1xuICAgICAgICA8bWF0LWhpbnQ+e3sgaGludCB9fTwvbWF0LWhpbnQ+XG4gICAgfVxuPC9tYXQtZm9ybS1maWVsZD5cbiJdfQ==

package/esm2022/components/filter-date/filter-date.component.mjs

@@ -0,0 +1,43 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from "@angular/core";
+import moment from "moment";
+import { DATE_FORMATS } from "../../utils/date.util";
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+import * as i2 from "@angular/material/button";
+import * as i3 from "@angular/material/form-field";
+import * as i4 from "@angular/material/icon";
+import * as i5 from "@angular/material/input";
+import * as i6 from "@busacca/ng-pick-datetime";
+export class FilterDateComponent {
+    constructor() {
+        this.label = '[label]]';
+        this.placeholder = 'Select...';
+        this.value = moment().format(DATE_FORMATS.datePickerInput);
+        this.valueChange = new EventEmitter();
+    }
+    onDateChange(ev) {
+        if (!ev) {
+            this.valueChange.emit(null);
+            return;
+        }
+        let date = ev.format(DATE_FORMATS.datePickerInput);
+        this.valueChange.emit(date);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    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.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4.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 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterDateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "nrcl-filter-date", changeDetection: ChangeDetectionStrategy.OnPush, 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"] }]
+        }], propDecorators: { label: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], hint: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsdGVyLWRhdGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbnItbmd4LWNvbXBvbmVudC1saWIvc3JjL2NvbXBvbmVudHMvZmlsdGVyLWRhdGUvZmlsdGVyLWRhdGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbnItbmd4LWNvbXBvbmVudC1saWIvc3JjL2NvbXBvbmVudHMvZmlsdGVyLWRhdGUvZmlsdGVyLWRhdGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsWUFBWSxFQUNaLEtBQUssRUFDTCxNQUFNLEVBQ1QsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxNQUFNLE1BQU0sUUFBUSxDQUFDO0FBQzVCLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQzs7Ozs7Ozs7QUFRckQsTUFBTSxPQUFPLG1CQUFtQjtJQU5oQztRQU9hLFVBQUssR0FBRyxVQUFVLENBQUE7UUFDbEIsZ0JBQVcsR0FBRyxXQUFXLENBQUE7UUFFekIsVUFBSyxHQUFHLE1BQU0sRUFBRSxDQUFDLE1BQU0sQ0FBRSxZQUFZLENBQUMsZUFBZSxDQUFFLENBQUE7UUFFdEQsZ0JBQVcsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO0tBV3REO0lBVEcsWUFBWSxDQUFFLEVBQUU7UUFDWixJQUFLLENBQUMsRUFBRSxFQUFHLENBQUM7WUFDUixJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBRSxJQUFJLENBQUUsQ0FBQTtZQUM3QixPQUFNO1FBQ1YsQ0FBQztRQUVELElBQUksSUFBSSxHQUFHLEVBQUUsQ0FBQyxNQUFNLENBQUUsWUFBWSxDQUFDLGVBQWUsQ0FBRSxDQUFBO1FBQ3BELElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFFLElBQUksQ0FBRSxDQUFBO0lBQ2pDLENBQUM7K0dBaEJRLG1CQUFtQjttR0FBbkIsbUJBQW1CLHVMQ2hCaEMsNHpCQStCQTs7NEZEZmEsbUJBQW1CO2tCQU4vQixTQUFTOytCQUNJLGtCQUFrQixtQkFHWCx1QkFBdUIsQ0FBQyxNQUFNOzhCQUd0QyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUVJLFdBQVc7c0JBQXBCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBFdmVudEVtaXR0ZXIsXG4gICAgSW5wdXQsXG4gICAgT3V0cHV0XG59IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgbW9tZW50IGZyb20gXCJtb21lbnRcIjtcbmltcG9ydCB7IERBVEVfRk9STUFUUyB9IGZyb20gXCIuLi8uLi91dGlscy9kYXRlLnV0aWxcIjtcblxuQENvbXBvbmVudCgge1xuICAgIHNlbGVjdG9yOiBcIm5yY2wtZmlsdGVyLWRhdGVcIixcbiAgICB0ZW1wbGF0ZVVybDogXCIuL2ZpbHRlci1kYXRlLmNvbXBvbmVudC5odG1sXCIsXG4gICAgc3R5bGVVcmw6IFwiLi9maWx0ZXItZGF0ZS5jb21wb25lbnQuc2Nzc1wiLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSApXG5leHBvcnQgY2xhc3MgRmlsdGVyRGF0ZUNvbXBvbmVudCB7XG4gICAgQElucHV0KCkgbGFiZWwgPSAnW2xhYmVsXV0nXG4gICAgQElucHV0KCkgcGxhY2Vob2xkZXIgPSAnU2VsZWN0Li4uJ1xuICAgIEBJbnB1dCgpIGhpbnRcbiAgICBASW5wdXQoKSB2YWx1ZSA9IG1vbWVudCgpLmZvcm1hdCggREFURV9GT1JNQVRTLmRhdGVQaWNrZXJJbnB1dCApXG5cbiAgICBAT3V0cHV0KCkgdmFsdWVDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcblxuICAgIG9uRGF0ZUNoYW5nZSggZXYgKSB7XG4gICAgICAgIGlmICggIWV2ICkge1xuICAgICAgICAgICAgdGhpcy52YWx1ZUNoYW5nZS5lbWl0KCBudWxsIClcbiAgICAgICAgICAgIHJldHVyblxuICAgICAgICB9XG5cbiAgICAgICAgbGV0IGRhdGUgPSBldi5mb3JtYXQoIERBVEVfRk9STUFUUy5kYXRlUGlja2VySW5wdXQgKVxuICAgICAgICB0aGlzLnZhbHVlQ2hhbmdlLmVtaXQoIGRhdGUgKVxuICAgIH1cbn1cbiIsIjxtYXQtZm9ybS1maWVsZFxuICAgIGZsb2F0TGFiZWw9XCJhdXRvXCJcbiAgICBhcHBlYXJhbmNlPVwib3V0bGluZVwiXG4gICAgc3Vic2NyaXB0U2l6aW5nPVwiZHluYW1pY1wiXG4+XG4gICAgPG1hdC1sYWJlbD57eyBsYWJlbCB9fTwvbWF0LWxhYmVsPlxuXG4gICAgPGlucHV0IG1hdElucHV0IGNsYXNzPVwic2VhcmNoLWlucHV0XCIgICAgICAgICAgICBcbiAgICAgICAgW25nTW9kZWxdPVwidmFsdWVcIiBcbiAgICAgICAgKG5nTW9kZWxDaGFuZ2UpPVwib25EYXRlQ2hhbmdlKCAkZXZlbnQgKVwiXG4gICAgICAgIFtwbGFjZWhvbGRlcl09XCJwbGFjZWhvbGRlclwiXG4gICAgICAgIFtvd2xEYXRlVGltZV09XCJzZWxlY3RlZERhdGVEVFwiIFxuICAgICAgICBtYXhsZW5ndGg9XCIxMFwiIFxuICAgICAgICBhcHBXRkRhdGVNYXNrXG4gICAgPlxuXG4gICAgQGlmICggaGludCApIHtcbiAgICAgICAgPG1hdC1oaW50Pnt7IGhpbnQgfX08L21hdC1oaW50PlxuICAgIH1cblxuICAgIDxidXR0b24gY2xhc3M9XCJzZWxlY3QtZGF0ZVwiXG4gICAgICAgIFtvd2xEYXRlVGltZVRyaWdnZXJdPVwic2VsZWN0ZWREYXRlRFRcIiBcbiAgICAgICAgYXJpYS1sYWJlbD1cIk9wZW4gU2VsZWN0IERhdGUgUGlja2VyXCJcbiAgICAgICAgbWF0LWljb24tYnV0dG9uXG4gICAgICAgIG1hdFN1ZmZpeFxuICAgID5cbiAgICAgICAgPG1hdC1pY29uPmV2ZW50PC9tYXQtaWNvbj5cbiAgICA8L2J1dHRvbj5cbjwvbWF0LWZvcm0tZmllbGQ+XG5cbjxvd2wtZGF0ZS10aW1lICNzZWxlY3RlZERhdGVEVCBwaWNrZXJUeXBlPVwiY2FsZW5kYXJcIj48L293bC1kYXRlLXRpbWU+XG4iXX0=

package/esm2022/components/filter-search/filter-search.component.mjs

@@ -0,0 +1,52 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, inject, Input, Output, ViewChild } from "@angular/core";
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/button";
+import * as i2 from "@angular/material/form-field";
+import * as i3 from "@angular/material/icon";
+import * as i4 from "@angular/material/input";
+export class FilterSearchComponent {
+    constructor() {
+        this.label = 'Search';
+        this.placeholder = 'Search...';
+        this.valueChange = new EventEmitter();
+        this.hasValue = false;
+        this.changeDetectorRef = inject(ChangeDetectorRef);
+    }
+    emitValueChange(val) {
+        this.hasValue = !!val;
+        this.valueChange.emit(val);
+    }
+    onInput(ev) {
+        this.value = ev?.target?.value;
+        this.emitValueChange(ev?.target?.value);
+    }
+    onCancelClick() {
+        this.value = null;
+        this.emitValueChange();
+    }
+    focus() {
+        this.inputEl.nativeElement.focus();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FilterSearchComponent, selector: "nrcl-filter-search", inputs: { label: "label", placeholder: "placeholder", hint: "hint", value: "value" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.has-value": "hasValue" } }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true }], 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 class=\"search-input\" #input\n        matInput\n        [value]=\"value || ''\"\n        (input)=\"onInput( $event )\"\n        [placeholder]=\"placeholder\"\n    >\n\n    @if ( hint ) {\n        <mat-hint>{{ hint }}</mat-hint>\n    }\n\n    @if ( value ) {\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</mat-form-field>\n", styles: ["::ng-deep :root{--nrcl-filter-search-width: calc( var( --nrcl-filter-width-default ) * 2 + 8px )}: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-search-width, calc(var(--nrcl-filter-width-default) * 2 + 8px));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)}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{width:var(--nrcl-filter-search-width, calc(var(--nrcl-filter-width-default) * 2 + 8px))}:host .cancel{padding:0;width:36px;height:36px;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.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: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterSearchComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "nrcl-filter-search", changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.has-value]': "hasValue"
+                    }, template: "<mat-form-field\n    floatLabel=\"auto\"\n    appearance=\"outline\"\n    subscriptSizing=\"dynamic\"\n>\n    <mat-label>{{ label }}</mat-label>\n\n    <input class=\"search-input\" #input\n        matInput\n        [value]=\"value || ''\"\n        (input)=\"onInput( $event )\"\n        [placeholder]=\"placeholder\"\n    >\n\n    @if ( hint ) {\n        <mat-hint>{{ hint }}</mat-hint>\n    }\n\n    @if ( value ) {\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</mat-form-field>\n", styles: ["::ng-deep :root{--nrcl-filter-search-width: calc( var( --nrcl-filter-width-default ) * 2 + 8px )}: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-search-width, calc(var(--nrcl-filter-width-default) * 2 + 8px));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)}:host ::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{width:var(--nrcl-filter-search-width, calc(var(--nrcl-filter-width-default) * 2 + 8px))}:host .cancel{padding:0;width:36px;height:36px;display:flex;justify-content:center;align-items:center}\n"] }]
+        }], propDecorators: { label: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], hint: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }], inputEl: [{
+                type: ViewChild,
+                args: ['input']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsdGVyLXNlYXJjaC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uci1uZ3gtY29tcG9uZW50LWxpYi9zcmMvY29tcG9uZW50cy9maWx0ZXItc2VhcmNoL2ZpbHRlci1zZWFyY2guY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbnItbmd4LWNvbXBvbmVudC1saWIvc3JjL2NvbXBvbmVudHMvZmlsdGVyLXNlYXJjaC9maWx0ZXItc2VhcmNoLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDSCx1QkFBdUIsRUFDdkIsaUJBQWlCLEVBQ2pCLFNBQVMsRUFFVCxZQUFZLEVBQ1osTUFBTSxFQUNOLEtBQUssRUFDTCxNQUFNLEVBQ04sU0FBUyxFQUNaLE1BQU0sZUFBZSxDQUFDOzs7Ozs7QUFXdkIsTUFBTSxPQUFPLHFCQUFxQjtJQVRsQztRQVVhLFVBQUssR0FBRyxRQUFRLENBQUE7UUFDaEIsZ0JBQVcsR0FBRyxXQUFXLENBQUE7UUFJeEIsZ0JBQVcsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBSW5ELGFBQVEsR0FBRyxLQUFLLENBQUE7UUFDaEIsc0JBQWlCLEdBQUcsTUFBTSxDQUFFLGlCQUFpQixDQUFFLENBQUE7S0FvQmxEO0lBbEJHLGVBQWUsQ0FBRSxHQUFJO1FBQ2pCLElBQUksQ0FBQyxRQUFRLEdBQUcsQ0FBQyxDQUFDLEdBQUcsQ0FBQTtRQUNyQixJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBRSxHQUFHLENBQUUsQ0FBQTtJQUNoQyxDQUFDO0lBRUQsT0FBTyxDQUFFLEVBQUU7UUFDUCxJQUFJLENBQUMsS0FBSyxHQUFHLEVBQUUsRUFBRSxNQUFNLEVBQUUsS0FBSyxDQUFBO1FBQzlCLElBQUksQ0FBQyxlQUFlLENBQUUsRUFBRSxFQUFFLE1BQU0sRUFBRSxLQUFLLENBQUUsQ0FBQTtJQUM3QyxDQUFDO0lBRUQsYUFBYTtRQUNULElBQUksQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFBO1FBQ2pCLElBQUksQ0FBQyxlQUFlLEVBQUUsQ0FBQTtJQUMxQixDQUFDO0lBRUQsS0FBSztRQUNELElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxDQUFDLEtBQUssRUFBRSxDQUFBO0lBQ3RDLENBQUM7K0dBOUJRLHFCQUFxQjttR0FBckIscUJBQXFCLG9WQ3JCbEMsb3JCQTRCQTs7NEZEUGEscUJBQXFCO2tCQVRqQyxTQUFTOytCQUNJLG9CQUFvQixtQkFHYix1QkFBdUIsQ0FBQyxNQUFNLFFBQ3pDO3dCQUNGLG1CQUFtQixFQUFFLFVBQVU7cUJBQ2xDOzhCQUdRLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBRUksV0FBVztzQkFBcEIsTUFBTTtnQkFFZSxPQUFPO3NCQUE1QixTQUFTO3VCQUFFLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENoYW5nZURldGVjdG9yUmVmLFxuICAgIENvbXBvbmVudCxcbiAgICBFbGVtZW50UmVmLFxuICAgIEV2ZW50RW1pdHRlcixcbiAgICBpbmplY3QsXG4gICAgSW5wdXQsXG4gICAgT3V0cHV0LFxuICAgIFZpZXdDaGlsZFxufSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuXG5AQ29tcG9uZW50KCB7XG4gICAgc2VsZWN0b3I6IFwibnJjbC1maWx0ZXItc2VhcmNoXCIsXG4gICAgdGVtcGxhdGVVcmw6IFwiLi9maWx0ZXItc2VhcmNoLmNvbXBvbmVudC5odG1sXCIsXG4gICAgc3R5bGVVcmw6IFwiLi9maWx0ZXItc2VhcmNoLmNvbXBvbmVudC5zY3NzXCIsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgaG9zdDoge1xuICAgICAgICAnW2NsYXNzLmhhcy12YWx1ZV0nOiBcImhhc1ZhbHVlXCJcbiAgICB9XG59IClcbmV4cG9ydCBjbGFzcyBGaWx0ZXJTZWFyY2hDb21wb25lbnQge1xuICAgIEBJbnB1dCgpIGxhYmVsID0gJ1NlYXJjaCdcbiAgICBASW5wdXQoKSBwbGFjZWhvbGRlciA9ICdTZWFyY2guLi4nXG4gICAgQElucHV0KCkgaGludFxuICAgIEBJbnB1dCgpIHZhbHVlOiBzdHJpbmdcblxuICAgIEBPdXRwdXQoKSB2YWx1ZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8c3RyaW5nPigpO1xuXG4gICAgQFZpZXdDaGlsZCggJ2lucHV0JyApIGlucHV0RWw6IEVsZW1lbnRSZWZcblxuICAgIGhhc1ZhbHVlID0gZmFsc2VcbiAgICBjaGFuZ2VEZXRlY3RvclJlZiA9IGluamVjdCggQ2hhbmdlRGV0ZWN0b3JSZWYgKVxuXG4gICAgZW1pdFZhbHVlQ2hhbmdlKCB2YWw/ICkge1xuICAgICAgICB0aGlzLmhhc1ZhbHVlID0gISF2YWxcbiAgICAgICAgdGhpcy52YWx1ZUNoYW5nZS5lbWl0KCB2YWwgKVxuICAgIH1cblxuICAgIG9uSW5wdXQoIGV2ICkge1xuICAgICAgICB0aGlzLnZhbHVlID0gZXY/LnRhcmdldD8udmFsdWVcbiAgICAgICAgdGhpcy5lbWl0VmFsdWVDaGFuZ2UoIGV2Py50YXJnZXQ/LnZhbHVlIClcbiAgICB9XG5cbiAgICBvbkNhbmNlbENsaWNrKCkge1xuICAgICAgICB0aGlzLnZhbHVlID0gbnVsbFxuICAgICAgICB0aGlzLmVtaXRWYWx1ZUNoYW5nZSgpXG4gICAgfVxuXG4gICAgZm9jdXMoKSB7XG4gICAgICAgIHRoaXMuaW5wdXRFbC5uYXRpdmVFbGVtZW50LmZvY3VzKClcbiAgICB9XG59XG4iLCI8bWF0LWZvcm0tZmllbGRcbiAgICBmbG9hdExhYmVsPVwiYXV0b1wiXG4gICAgYXBwZWFyYW5jZT1cIm91dGxpbmVcIlxuICAgIHN1YnNjcmlwdFNpemluZz1cImR5bmFtaWNcIlxuPlxuICAgIDxtYXQtbGFiZWw+e3sgbGFiZWwgfX08L21hdC1sYWJlbD5cblxuICAgIDxpbnB1dCBjbGFzcz1cInNlYXJjaC1pbnB1dFwiICNpbnB1dFxuICAgICAgICBtYXRJbnB1dFxuICAgICAgICBbdmFsdWVdPVwidmFsdWUgfHwgJydcIlxuICAgICAgICAoaW5wdXQpPVwib25JbnB1dCggJGV2ZW50IClcIlxuICAgICAgICBbcGxhY2Vob2xkZXJdPVwicGxhY2Vob2xkZXJcIlxuICAgID5cblxuICAgIEBpZiAoIGhpbnQgKSB7XG4gICAgICAgIDxtYXQtaGludD57eyBoaW50IH19PC9tYXQtaGludD5cbiAgICB9XG5cbiAgICBAaWYgKCB2YWx1ZSApIHtcbiAgICAgICAgPGJ1dHRvbiBjbGFzcz1cImNhbmNlbFwiXG4gICAgICAgICAgICBtYXQtaWNvbi1idXR0b25cbiAgICAgICAgICAgIG1hdFN1ZmZpeFxuICAgICAgICAgICAgKGNsaWNrKT1cIm9uQ2FuY2VsQ2xpY2soJGV2ZW50KTsgJGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpXCJcbiAgICAgICAgPlxuICAgICAgICAgICAgPG1hdC1pY29uPmNsb3NlPC9tYXQtaWNvbj5cbiAgICAgICAgPC9idXR0b24+XG4gICAgfSAgICAgICAgICAgICAgICBcbjwvbWF0LWZvcm0tZmllbGQ+XG4iXX0=