@ngx-stoui/core 19.0.2 → 20.0.1

package/fesm2022/ngx-stoui-core.mjs

@@ -1,7 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, HostListener, Output, Input, Directive, ContentChildren, inject, ElementRef, HostBinding, NgModule, Pipe } from '@angular/core';
-import '@angular/forms';
-import '@angular/material/datepicker';
+import { input, output, HostListener, Directive, ContentChildren, inject, ElementRef, HostBinding, Input, NgModule, Pipe } from '@angular/core';
 import { MatInput } from '@angular/material/input';
 import { Subject, fromEvent } from 'rxjs';
 import { takeUntil, switchMap, take } from 'rxjs/operators';
@@ -154,23 +152,28 @@ var Key;
  */
 class QuickKeysDirective {
     constructor() {
+        this.quickKeys = input(...(ngDevMode ? [undefined, { debugName: "quickKeys" }] : []));
+        /**
+         * Optional formGroup input, when used in combination with a reactive form
+         */
+        this.formGroup = input(...(ngDevMode ? [undefined, { debugName: "formGroup" }] : []));
         /**
          * Emits when ctrl + enter is clicked in combination
          * <form (quickSubmit)="save()">
          */
-        this.quickSubmit = new EventEmitter();
+        this.quickSubmit = output();
         /**
          * Emits when escape is clicked
          * <form (quickCancel)="cancel()">
          */
-        this.quickCancel = new EventEmitter();
+        this.quickCancel = output();
     }
     /**
      * Listens on the host element for any keyup events
      * @param e
      */
     onKeyUp(e) {
-        if (this.formGroup) {
+        if (this.formGroup()) {
             this.handleFormKeys(e);
         }
         this.handleGenericKeydown(e);
@@ -183,9 +186,11 @@ class QuickKeysDirective {
     handleGenericKeydown(e) {
         // Shortcuts that are useful outside of forms
         if (e.keyCode === Key.Escape) {
+            // TODO: The 'emit' function requires a mandatory void argument
             this.quickCancel.emit();
         }
-        if (!this.formGroup && e.keyCode === Key.Enter && e.ctrlKey) {
+        if (!this.formGroup() && e.keyCode === Key.Enter && e.ctrlKey) {
+            // TODO: The 'emit' function requires a mandatory void argument
             this.quickSubmit.emit();
         }
     }
@@ -194,31 +199,24 @@ class QuickKeysDirective {
      * @param e
      */
     handleFormKeys(e) {
-        if (this.formGroup.pristine) {
+        if (this.formGroup()?.pristine) {
             return;
         }
         if (e.keyCode === Key.Enter && e.ctrlKey) {
+            // TODO: The 'emit' function requires a mandatory void argument
             this.quickSubmit.emit();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: QuickKeysDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: QuickKeysDirective, isStandalone: true, selector: "[stoQuickKeys]", inputs: { quickKeys: "quickKeys", formGroup: "formGroup" }, outputs: { quickSubmit: "quickSubmit", quickCancel: "quickCancel" }, host: { listeners: { "keyup": "onKeyUp($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: QuickKeysDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.1", type: QuickKeysDirective, isStandalone: true, selector: "[stoQuickKeys]", inputs: { quickKeys: { classPropertyName: "quickKeys", publicName: "quickKeys", isSignal: true, isRequired: false, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { quickSubmit: "quickSubmit", quickCancel: "quickCancel" }, host: { listeners: { "keyup": "onKeyUp($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: QuickKeysDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: QuickKeysDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoQuickKeys]',
-                    standalone: true
+                    standalone: true,
                 }]
-        }], propDecorators: { quickKeys: [{
-                type: Input
-            }], formGroup: [{
-                type: Input
-            }], quickSubmit: [{
-                type: Output
-            }], quickCancel: [{
-                type: Output
-            }], onKeyUp: [{
+        }], propDecorators: { onKeyUp: [{
                 type: HostListener,
                 args: ['keyup', ['$event']]
             }] } });
@@ -231,33 +229,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
  */
 class DateFormFieldClickDirective {
     constructor() {
+        this.stoDateFormFieldClick = input.required(...(ngDevMode ? [{ debugName: "stoDateFormFieldClick" }] : []));
         this.destroy$ = new Subject();
     }
     clickEvent() {
-        this.stoDateFormFieldClick.open();
+        this.stoDateFormFieldClick().open();
     }
     ngOnInit() {
-        this.stoDateFormFieldClick.closedStream
-            .pipe(takeUntil(this.destroy$)).subscribe(() => this.inputs.first.focus());
+        this.stoDateFormFieldClick()
+            .closedStream.pipe(takeUntil(this.destroy$))
+            .subscribe(() => this.inputs.first.focus());
     }
     ngOnDestroy() {
         this.destroy$.next(true);
         this.destroy$.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DateFormFieldClickDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: DateFormFieldClickDirective, isStandalone: true, selector: "[stoDateFormFieldClick]", inputs: { stoDateFormFieldClick: "stoDateFormFieldClick" }, host: { listeners: { "click": "clickEvent()" } }, queries: [{ propertyName: "inputs", predicate: MatInput }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DateFormFieldClickDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.1", type: DateFormFieldClickDirective, isStandalone: true, selector: "[stoDateFormFieldClick]", inputs: { stoDateFormFieldClick: { classPropertyName: "stoDateFormFieldClick", publicName: "stoDateFormFieldClick", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "click": "clickEvent()" } }, queries: [{ propertyName: "inputs", predicate: MatInput }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DateFormFieldClickDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DateFormFieldClickDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoDateFormFieldClick]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], propDecorators: { inputs: [{
                 type: ContentChildren,
                 args: [MatInput]
-            }], stoDateFormFieldClick: [{
-                type: Input
             }], clickEvent: [{
                 type: HostListener,
                 args: ['click']
@@ -280,10 +278,10 @@ class StoSelectTextOnFocusDirective {
             this._el.select();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoSelectTextOnFocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: StoSelectTextOnFocusDirective, isStandalone: true, selector: "[stoSelectTextOnFocus]", host: { listeners: { "focus": "onFocus()", "dblclick": "onFocus()" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoSelectTextOnFocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: StoSelectTextOnFocusDirective, isStandalone: true, selector: "[stoSelectTextOnFocus]", host: { listeners: { "focus": "onFocus()", "dblclick": "onFocus()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoSelectTextOnFocusDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoSelectTextOnFocusDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoSelectTextOnFocus]',
@@ -312,10 +310,10 @@ class StoGridSpacerDirective {
     constructor() {
         this.useClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoGridSpacerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: StoGridSpacerDirective, isStandalone: true, selector: "[stoGridSpacer]", host: { properties: { "class.sto-f-grid__col": "this.useClass", "class.sto-f-grid__col--spacer": "this.useClass" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoGridSpacerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: StoGridSpacerDirective, isStandalone: true, selector: "[stoGridSpacer]", host: { properties: { "class.sto-f-grid__col": "this.useClass", "class.sto-f-grid__col--spacer": "this.useClass" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoGridSpacerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoGridSpacerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoGridSpacer]',
@@ -332,10 +330,10 @@ class StoGridColumnDirective {
     constructor() {
         this.useClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoGridColumnDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: StoGridColumnDirective, isStandalone: true, selector: "[stoGridColumn]", inputs: { stoGridColumnDouble: "stoGridColumnDouble" }, host: { properties: { "class.sto-f-grid__col": "this.useClass", "class.sto-f-grid__col--2": "this.stoGridColumnDouble" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoGridColumnDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: StoGridColumnDirective, isStandalone: true, selector: "[stoGridColumn]", inputs: { stoGridColumnDouble: "stoGridColumnDouble" }, host: { properties: { "class.sto-f-grid__col": "this.useClass", "class.sto-f-grid__col--2": "this.stoGridColumnDouble" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoGridColumnDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoGridColumnDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoGridColumn]',
@@ -353,9 +351,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
 class StoGridDirective {
     constructor() {
         this.elRef = inject(ElementRef);
+        // TODO: Skipped for migration because:
+        //  This input is used in combination with `@HostBinding` and migrating would
+        //  break.
         this.maxWidth = 1000;
+        // TODO: Skipped for migration because:
+        //  This input is used in combination with `@HostBinding` and migrating would
+        //  break.
         this.minWidth = 250;
         this.baseClass = true;
+        this.breakpoints = input(...(ngDevMode ? [undefined, { debugName: "breakpoints" }] : []));
     }
     ngAfterViewInit() {
         const el = this.elRef.nativeElement;
@@ -363,7 +368,7 @@ class StoGridDirective {
             for (const entry of entries) {
                 const cr = entry.contentRect;
                 const { width } = cr;
-                const breakpoints = this.breakpoints || { 2: 400, 4: 800 };
+                const breakpoints = this.breakpoints() || { 2: 400, 4: 800 };
                 const gridType = getClass(width, breakpoints[2], breakpoints[4]);
                 if (!el.classList.contains(gridType)) {
                     el.classList.remove(...ALL_GRIDS);
@@ -378,10 +383,10 @@ class StoGridDirective {
             this.observer.disconnect();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoGridDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: StoGridDirective, isStandalone: true, selector: "[stoGrid]", inputs: { maxWidth: "maxWidth", minWidth: "minWidth", breakpoints: "breakpoints" }, host: { properties: { "style.max-width.px": "this.maxWidth", "style.min-width.px": "this.minWidth", "class.sto-f-grid": "this.baseClass" } }, queries: [{ propertyName: "columns", predicate: StoGridColumnDirective, read: ElementRef }], exportAs: ["stoGrid"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoGridDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.1", type: StoGridDirective, isStandalone: true, selector: "[stoGrid]", inputs: { maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: false, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: false, isRequired: false, transformFunction: null }, breakpoints: { classPropertyName: "breakpoints", publicName: "breakpoints", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.max-width.px": "this.maxWidth", "style.min-width.px": "this.minWidth", "class.sto-f-grid": "this.baseClass" } }, queries: [{ propertyName: "columns", predicate: StoGridColumnDirective, read: ElementRef }], exportAs: ["stoGrid"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoGridDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoGridDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoGrid]',
@@ -404,8 +409,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
             }], columns: [{
                 type: ContentChildren,
                 args: [StoGridColumnDirective, { read: ElementRef }]
-            }], breakpoints: [{
-                type: Input
             }] } });
 
 class MenuOverlayDirective {
@@ -432,10 +435,10 @@ class MenuOverlayDirective {
         element.style.height = '1px';
         element.style.width = '1px';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: MenuOverlayDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: MenuOverlayDirective, isStandalone: true, selector: "[stoMenuOverlay]", host: { properties: { "style.left.px": "this.left", "style.top.px": "this.top" } }, exportAs: ["stoMenuOverlay"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: MenuOverlayDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: MenuOverlayDirective, isStandalone: true, selector: "[stoMenuOverlay]", host: { properties: { "style.left.px": "this.left", "style.top.px": "this.top" } }, exportAs: ["stoMenuOverlay"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: MenuOverlayDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: MenuOverlayDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoMenuOverlay]',
@@ -451,40 +454,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
             }] } });
 
 class ContextMenuDirective {
+    constructor() {
+        this.menuTrigger = input.required(...(ngDevMode ? [{ debugName: "menuTrigger" }] : []));
+        this.overlayDirective = input.required(...(ngDevMode ? [{ debugName: "overlayDirective" }] : []));
+        this.menuContext = input(...(ngDevMode ? [undefined, { debugName: "menuContext" }] : []));
+    }
     contextMenu(event) {
         event.preventDefault();
-        if (this.menuTrigger.menuOpen) {
-            this.menuTrigger.closeMenu();
+        if (this.menuTrigger().menuOpen) {
+            this.menuTrigger().closeMenu();
         }
-        this.overlayDirective.updatePosition(event);
+        this.overlayDirective().updatePosition(event);
         setTimeout(() => {
-            this.menuTrigger.menuData = this.menuContext;
-            this.menuTrigger.openMenu();
+            this.menuTrigger().menuData = this.menuContext();
+            this.menuTrigger().openMenu();
         }, 150);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ContextMenuDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: ContextMenuDirective, isStandalone: true, selector: "[stoContextMenu]", inputs: { menuTrigger: "menuTrigger", overlayDirective: "overlayDirective", menuContext: "menuContext" }, host: { listeners: { "contextmenu": "contextMenu($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ContextMenuDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.1", type: ContextMenuDirective, isStandalone: true, selector: "[stoContextMenu]", inputs: { menuTrigger: { classPropertyName: "menuTrigger", publicName: "menuTrigger", isSignal: true, isRequired: true, transformFunction: null }, overlayDirective: { classPropertyName: "overlayDirective", publicName: "overlayDirective", isSignal: true, isRequired: true, transformFunction: null }, menuContext: { classPropertyName: "menuContext", publicName: "menuContext", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "contextmenu": "contextMenu($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ContextMenuDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ContextMenuDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[stoContextMenu]',
-                    standalone: true
+                    standalone: true,
                 }]
-        }], propDecorators: { menuTrigger: [{
-                type: Input
-            }], overlayDirective: [{
-                type: Input
-            }], menuContext: [{
-                type: Input
-            }], contextMenu: [{
+        }], propDecorators: { contextMenu: [{
                 type: HostListener,
                 args: ['contextmenu', ['$event']]
             }] } });
 
 class StoDirectivesModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoDirectivesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: StoDirectivesModule, imports: [QuickKeysDirective,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoDirectivesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: StoDirectivesModule, imports: [QuickKeysDirective,
             DateFormFieldClickDirective,
             StoSelectTextOnFocusDirective,
             StoGridDirective,
@@ -499,9 +501,9 @@ class StoDirectivesModule {
             StoGridSpacerDirective,
             MenuOverlayDirective,
             ContextMenuDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoDirectivesModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoDirectivesModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoDirectivesModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoDirectivesModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -593,10 +595,10 @@ class NumberFormatPipe {
         }
         return returnValue.toFixed(precision);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NumberFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: NumberFormatPipe, isStandalone: true, name: "numberFormat" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: NumberFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: NumberFormatPipe, isStandalone: true, name: "numberFormat" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NumberFormatPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: NumberFormatPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'numberFormat',
@@ -627,10 +629,10 @@ class CurrencyFormatPipe {
         const intl = new Intl.NumberFormat('en-US', { maximumFractionDigits }).format(value);
         return intl.replace(/,/g, ' ').replace('.', ',') + ` ${unit}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: CurrencyFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: CurrencyFormatPipe, isStandalone: true, name: "currencyFormat" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: CurrencyFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: CurrencyFormatPipe, isStandalone: true, name: "currencyFormat" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: CurrencyFormatPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: CurrencyFormatPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'currencyFormat',
@@ -653,10 +655,10 @@ class KeysPipe {
         }
         return [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: KeysPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: KeysPipe, isStandalone: true, name: "keys" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: KeysPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: KeysPipe, isStandalone: true, name: "keys" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: KeysPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: KeysPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'keys',
@@ -704,10 +706,10 @@ class DateFormatPipe {
                 return format(value, 'MMM d, yyyy');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DateFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: DateFormatPipe, isStandalone: true, name: "formatDate" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DateFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: DateFormatPipe, isStandalone: true, name: "formatDate" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DateFormatPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DateFormatPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'formatDate',
@@ -731,10 +733,10 @@ class GetUnit {
         }
         return value;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: GetUnit, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: GetUnit, isStandalone: true, name: "getUnit" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: GetUnit, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: GetUnit, isStandalone: true, name: "getUnit" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: GetUnit, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: GetUnit, decorators: [{
             type: Pipe,
             args: [{ name: 'getUnit', standalone: true }]
         }] });
@@ -748,10 +750,10 @@ class ExcludeUnit {
         }
         return value;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ExcludeUnit, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: ExcludeUnit, isStandalone: true, name: "excludeUnit" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ExcludeUnit, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: ExcludeUnit, isStandalone: true, name: "excludeUnit" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ExcludeUnit, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ExcludeUnit, decorators: [{
             type: Pipe,
             args: [{ name: 'excludeUnit', standalone: true }]
         }] });
@@ -767,17 +769,17 @@ class YesNoPipe {
         }
         return valueStr;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: YesNoPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: YesNoPipe, isStandalone: true, name: "yesNo" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: YesNoPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: YesNoPipe, isStandalone: true, name: "yesNo" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: YesNoPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: YesNoPipe, decorators: [{
             type: Pipe,
             args: [{ name: 'yesNo', standalone: true }]
         }] });
 
 class StoPipesModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoPipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: StoPipesModule, imports: [DateFormatPipe,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoPipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: StoPipesModule, imports: [DateFormatPipe,
             KeysPipe,
             NumberFormatPipe,
             CurrencyFormatPipe,
@@ -790,9 +792,9 @@ class StoPipesModule {
             GetUnit,
             ExcludeUnit,
             YesNoPipe] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoPipesModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoPipesModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: StoPipesModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: StoPipesModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [