@elderbyte/ngx-starter 12.10.1 → 12.12.0

package/lib/common/errors/exception-detail.d.ts

@@ -0,0 +1,5 @@
+export interface ExceptionDetail {
+    readonly title: string;
+    readonly detail: string;
+    readonly stacktrace: string;
+}

package/lib/common/errors/public_api.d.ts

@@ -0,0 +1,2 @@
+export * from './exception-detail';
+export * from './standard-error-detail';

package/lib/common/public_api.d.ts

@@ -8,6 +8,7 @@ export * from './http/public_api';
 export * from './i18n/public_api';
 export * from './rxjs/public_api';
 export * from './enums/public_api';
+export * from './errors/public_api';
 export * from './csv/public_api';
 export * from './async/public_api';
 export * from './objects';

package/lib/components/auditing/audited-entity/elder-audited-entity.component.d.ts

@@ -0,0 +1,17 @@
+import { OnInit } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+import { IAuditedEntity } from '../i-audited-entity';
+import { MatFormFieldAppearance } from '@angular/material/form-field/form-field';
+declare class AuditedEntityCtx {
+    readonly audited: IAuditedEntity;
+    constructor(audited: IAuditedEntity);
+}
+export declare class ElderAuditedEntityComponent implements OnInit {
+    layout: string;
+    appearance: MatFormFieldAppearance;
+    readonly auditedCtx$: BehaviorSubject<AuditedEntityCtx>;
+    constructor();
+    ngOnInit(): void;
+    set audited(audited: IAuditedEntity);
+}
+export {};

package/lib/components/auditing/elder-audit.module.d.ts

@@ -0,0 +1,4 @@
+export * from './i-audited-entity';
+export * from './audited-entity/elder-audited-entity.component';
+export declare class ElderAuditModule {
+}

package/lib/components/auditing/i-audited-entity.d.ts

@@ -0,0 +1,13 @@
+import { IsoDateStr } from '../../common/time/date-util';
+export interface IAuditedEntity {
+    readonly createdAt: IsoDateStr;
+    readonly createdBy: string;
+    readonly modifiedAt: IsoDateStr;
+    readonly modifiedBy: string;
+}
+export declare abstract class AuditedEntity implements IAuditedEntity {
+    createdAt: IsoDateStr;
+    createdBy: string;
+    modifiedAt: IsoDateStr;
+    modifiedBy: string;
+}

package/lib/components/data-view/grid/elder-grid/elder-grid.component.d.ts

@@ -1,6 +1,6 @@
-import { OnDestroy, OnInit, TemplateRef, TrackByFunction, ViewContainerRef } from '@angular/core';
+import { AfterViewInit, OnDestroy, OnInit, TemplateRef, TrackByFunction, ViewContainerRef } from '@angular/core';
 import { Observable } from 'rxjs';
-import { IDataContextContinuable } from '../../../../common/data/data-context/data-context';
+import { IDataContext, IDataContextContinuable } from '../../../../common/data/data-context/data-context';
 import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
 import { SelectionModel } from '../../../../common/selection/selection-model';
 import { MediaObserver } from '@angular/flex-layout';
@@ -8,6 +8,7 @@ import { Sort } from '../../../../common/data/sort';
 import { ElderDataViewInteractionMode } from '../../base/elder-data-view';
 import { ElderDataViewSelectionMode } from '../../../select/popup/selection-model-popup.directive';
 import { ElderDataViewBaseComponent } from '../../base/elder-data-view-base';
+import { MatPaginator } from '@angular/material/paginator';
 export declare class ElderGridTileDirective {
     templateRef: TemplateRef<any>;
     viewContainer: ViewContainerRef;
@@ -21,7 +22,7 @@ export declare class ElderGridToolbarDirective {
     viewContainer: ViewContainerRef;
     constructor(templateRef: TemplateRef<any>, viewContainer: ViewContainerRef);
 }
-export declare class ElderGridComponent extends ElderDataViewBaseComponent implements OnInit, OnDestroy {
+export declare class ElderGridComponent extends ElderDataViewBaseComponent implements OnInit, AfterViewInit, OnDestroy {
     private mediaObserver;
     /***************************************************************************
      *                                                                         *
@@ -54,8 +55,11 @@ export declare class ElderGridComponent extends ElderDataViewBaseComponent imple
     idField: string;
     selectionVisible: boolean;
     interactionMode: ElderDataViewInteractionMode;
+    pageSizeOptions: number[];
+    matPaginator: MatPaginator;
     toolbarTemplateQuery: TemplateRef<any>;
     private _toolbarTemplate;
+    private readonly destroy$;
     /***************************************************************************
      *                                                                         *
      * Constructor                                                             *
@@ -68,6 +72,7 @@ export declare class ElderGridComponent extends ElderDataViewBaseComponent imple
      *                                                                         *
      **************************************************************************/
     ngOnInit(): void;
+    ngAfterViewInit(): void;
     ngOnDestroy(): void;
     /***************************************************************************
      *                                                                         *
@@ -78,7 +83,7 @@ export declare class ElderGridComponent extends ElderDataViewBaseComponent imple
     get tileTemplate(): TemplateRef<any>;
     set toolbarTemplate(template: TemplateRef<any>);
     get toolbarTemplate(): TemplateRef<any>;
-    set data(data: IDataContextContinuable<any>);
+    set data(data: IDataContext<any>);
     get dataSnapshot(): IDataContextContinuable<any>;
     set columnCount(count: number);
     get columnCount(): number;

package/lib/components/errors/elder-error.module.d.ts

@@ -0,0 +1,6 @@
+export * from './exception-detail/elder-exception-detail.component';
+/**
+ * Provides Error Indicators and Exception detail components.
+ */
+export declare class ElderErrorModule {
+}

package/lib/components/errors/exception-detail/elder-exception-detail.component.d.ts

@@ -0,0 +1,39 @@
+import { OnInit } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+import { ExceptionDetail } from '../../../common/errors/exception-detail';
+export declare class ExceptionDetailCtx {
+    readonly detail: ExceptionDetail;
+    static Empty: ExceptionDetailCtx;
+    readonly panelTitle: string;
+    readonly panelDescription: string;
+    static of(detail: ExceptionDetail): ExceptionDetailCtx;
+    constructor(detail: ExceptionDetail);
+}
+export declare class ElderExceptionDetailComponent implements OnInit {
+    /***************************************************************************
+     *                                                                         *
+     * Fields                                                                  *
+     *                                                                         *
+     **************************************************************************/
+    readonly errorCtx$: BehaviorSubject<ExceptionDetailCtx>;
+    expanded: boolean;
+    stacktraceRows: number;
+    /***************************************************************************
+     *                                                                         *
+     * Constructor                                                             *
+     *                                                                         *
+     **************************************************************************/
+    constructor();
+    /***************************************************************************
+     *                                                                         *
+     * Life Cycle                                                              *
+     *                                                                         *
+     **************************************************************************/
+    ngOnInit(): void;
+    /***************************************************************************
+     *                                                                         *
+     * Properties                                                              *
+     *                                                                         *
+     **************************************************************************/
+    set error(error: ExceptionDetail);
+}

package/lib/components/files/blob-viewer/elder-blob-viewer.component.d.ts

@@ -41,7 +41,7 @@ export declare class ElderBlobViewerComponent implements OnInit, OnDestroy {
     readonly blobContext$: BehaviorSubject<BlobContext>;
     private readonly _url$;
     private readonly _mimeType$;
-    private readonly unsubscribe$;
+    private readonly destroy$;
     private _displayUnknownAsText;
     /***************************************************************************
      *                                                                         *

package/lib/components/public_api.d.ts

@@ -34,3 +34,5 @@ export * from './containers/public_api';
 export * from './csv/elder-csv.module';
 export * from './input/public_api';
 export * from './iframes/elder-iframe.module';
+export * from './errors/elder-error.module';
+export * from './auditing/elder-audit.module';

package/lib/components/time/duration/iso-duration-str.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Represents a raw ISO duration formatted string such as 'P23DT23H'
+ * A parsed duration is represented by a joda Duration class.
+ */
+export declare type IsoDurationStr = string;

package/lib/components/time/public_api.d.ts

@@ -1,6 +1,7 @@
 export * from './date-adapters/custom-date-adapter';
 export * from './duration/duration-bucket';
 export * from './duration/duration-format';
+export * from './duration/iso-duration-str';
 export * from './period/period-bucket';
 export * from './period/period-format';
 export * from './elder-time.module';

package/lib/pipes/iso-duration.pipe.d.ts

@@ -2,6 +2,7 @@ import { PipeTransform } from '@angular/core';
 import { Duration, Period } from '@js-joda/core';
 import { ElderUnitService } from '../components/measures/elder-unit.service';
 import { PeriodDuration } from '../common/time/period-duration';
+import { IsoDurationStr } from '../components/time/duration/iso-duration-str';
 /**
  * Converts any valid input of standard ISO 8601 duration format
  * example input: PT2H10M12.1235675S, output: 2h, 10min, 12s, 124 ms
@@ -18,5 +19,5 @@ export declare class IsoDurationPipe implements PipeTransform {
      * Public API                                                              *
      *                                                                         *
      **************************************************************************/
-    transform(value: string | Duration | Period | PeriodDuration, format?: string): string;
+    transform(value: IsoDurationStr | Duration | Period | PeriodDuration, format?: string): string;
 }

package/lib/pipes/time-ago.pipe.d.ts

@@ -8,7 +8,7 @@ export declare class TimeAgoPipe implements PipeTransform, OnDestroy {
     private ngZone;
     private timer;
     constructor(changeDetectorRef: ChangeDetectorRef, ngZone: NgZone);
-    transform(value: string): string;
+    transform(value: string | number | Date): string;
     ngOnDestroy(): void;
     private removeTimer;
     private getSecondsUntilUpdate;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elderbyte/ngx-starter",
-  "version": "12.10.1",
+  "version": "12.12.0",
   "peerDependencies": {
     "@angular/common": "^12.0.1",
     "@angular/core": "^12.0.1",

package/src/lib/components/auditing/audited-entity/elder-audited-entity.component.scss

@@ -0,0 +1,4 @@
+
+.decent {
+  opacity: 0.5;
+}

package/src/lib/components/errors/exception-detail/elder-exception-detail.component.scss

@@ -0,0 +1,9 @@
+.stacktrace {
+  font-size: 11px;
+  font-family: monospace;
+  white-space: pre;
+  overflow-wrap: normal;
+  overflow-x: scroll;
+  background-color: #575757;
+  color: #d0b795;
+}

package/src/lib/components/files/blob-viewer/elder-blob-viewer.component.scss

@@ -1,3 +1,6 @@
+:host {
+  overflow: hidden;
+}
 
 .document-viewer {
   background-color: #dedede;

package/theming.scss

@@ -11,6 +11,7 @@
 @use "src/lib/components/card-organizer/card-stack/elder-card-stack.component" as elder-card-stack;
 @use "src/lib/components/cards/elder-card/elder-card.component" as elder-card;
 @use "src/lib/components/button-group/elder-button-group/elder-button-group.component" as elder-button-group;
+@use "src/lib/components/iframes/iframe-host/iframe-host.component" as iframe-host;
 
 /***************************************************************************
  *                                                                         *
@@ -145,6 +146,10 @@ td.mat-footer-cell.elder-number-cell  {
 Material Form Field
 *******************************/
 
+.elder-form-field-gap {
+  width: 12px;
+}
+
 // two fields plus 12px gap add up to elder-std-form-field width
 .elder-form-field-small {
   width: 84px;
@@ -160,6 +165,59 @@ Material Form Field
   overflow: hidden; // This allows flex items to shrink (min/max is not defaulting auto)
 }
 
+.elder-form-field-large {
+  width: 244px;
+  overflow: hidden;
+}
+
+.elder-form-field-xl {
+  width: 276px;
+  overflow: hidden;
+}
+
+.elder-form-field-xxl {
+  width: 372px;
+  overflow: hidden;
+}
+
+/**
+ * mat-form-field style shorthands
+ */
+mat-form-field {
+  // three fields plus 12px gap add up to elder-std-form-field width
+  .tiny {
+    width: 52px; // (180-(2*12)) / 3
+  }
+
+  // two fields plus 12px gap add up to elder-std-form-field width
+  .small {
+    width: 84px; // (180-(1*12)) / 2
+  }
+
+  .standard {
+    width: 180px;
+    overflow: hidden; // This allows flex items to shrink (min/max is not defaulting auto)
+  }
+
+  // one and a half plus 12px gap 180 + 52 + 12
+  .large {
+    width: 244px;
+    overflow: hidden;
+  }
+
+  // one and a half plus 12px gap 180 + 84 + 12
+  .xl {
+    width: 276px;
+    overflow: hidden;
+  }
+
+  // two standard fields plus 12px gap (180 + 180 + 12)
+  .xxl {
+    width: 372px;
+    overflow: hidden;
+  }
+}
+
 /***************************************************************************
  *                                                                         *
  * Style for hiding spinner on inputs                                      *
@@ -378,6 +436,7 @@ $ebs-elder-gold: $elder-gold;
   @include elder-card.theme($theme);
   @include elder-grid.theme($theme);
   @include elder-button-group.theme($theme);
+  @include iframe-host.theme($theme);
 }
 
 /***************************************************************************