@elderbyte/ngx-starter 14.12.0-beta6 → 14.12.1

package/src/lib/components/overlays/elder-overlay.component.ts

@@ -1,262 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component, ElementRef,
-  EmbeddedViewRef,
-  Inject,
-  Input,
-  OnDestroy,
-  OnInit, Output,
-  TemplateRef,
-  ViewChild,
-  ViewContainerRef
-} from '@angular/core';
-import {
-  FlexibleConnectedPositionStrategyOrigin,
-  Overlay,
-  OverlayConfig,
-  OverlayPositionBuilder,
-  OverlayRef,
-  OverlaySizeConfig,
-  PositionStrategy
-} from '@angular/cdk/overlay';
-import {LoggerFactory} from '@elderbyte/ts-logger';
-import {TemplatePortal} from '@angular/cdk/portal';
-import {merge, Observable, Subject} from 'rxjs';
-import {map, takeUntil} from 'rxjs/operators';
-
-
-export class OverlayShowOptions {
-  public source?: ElementRef;
-}
-
-
-@Component({
-  selector: 'elder-overlay',
-  exportAs: 'elderOverlay',
-  template: `
-    <ng-template>
-      <ng-content></ng-content>
-    </ng-template>
-  `,
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class ElderOverlayComponent implements OnInit, OnDestroy {
-
-  /***************************************************************************
-   *                                                                         *
-   * Fields                                                                  *
-   *                                                                         *
-   **************************************************************************/
-
-  private readonly logger = LoggerFactory.getLogger(this.constructor.name);
-
-  private _overlayRef: OverlayRef;
-  private readonly unsubscribe$ = new Subject<void>();
-
-  @ViewChild(TemplateRef, { static: true }) templateRef: TemplateRef<any>;
-
-  private _hasCustomPositionStrategy = false;
-  private _origin: FlexibleConnectedPositionStrategyOrigin | null = null;
-
-  @Input()
-  public originX: 'start' | 'center' | 'end' = 'start';
-
-  @Input()
-  public originY: 'top' | 'center' | 'bottom' = 'bottom';
-
-  @Input()
-  public overlayX: 'start' | 'center' | 'end' = 'start';
-
-  @Input()
-  public overlayY: 'top' | 'center' | 'bottom' = 'top';
-
-  @Input()
-  public offsetY = 10;
-
-  @Input()
-  public offsetX = 0;
-
-  @Input()
-  public backdrop = true;
-
-  @Input()
-  public backdropVisible = false;
-
-  private readonly _attachedChange = new Subject<boolean>();
-  private readonly _keydownEvents = new Subject<KeyboardEvent>();
-
-  /***************************************************************************
-   *                                                                         *
-   * Constructor                                                             *
-   *                                                                         *
-   **************************************************************************/
-
-  constructor(
-    private viewContainer: ViewContainerRef,
-    private overlay: Overlay,
-    private positionBuilder: OverlayPositionBuilder
-  ) {
-
-  }
-
-  /***************************************************************************
-   *                                                                         *
-   * Life Cycle                                                              *
-   *                                                                         *
-   **************************************************************************/
-
-
-  public ngOnInit(): void {
-
-    const config = <OverlayConfig> {
-      hasBackdrop: this.backdrop,
-      backdropClass: (this.backdropVisible) ? undefined : 'cdk-overlay-transparent-backdrop'
-    };
-
-    this._overlayRef = this.overlay.create(config);
-
-    this._overlayRef.backdropClick().pipe(
-      takeUntil(this.unsubscribe$)
-    ).subscribe(ev => this.closeOverlay());
-
-    this._overlayRef.keydownEvents().pipe(
-      takeUntil(this.unsubscribe$)
-    ).subscribe(ev => {
-        this._keydownEvents.next(ev);
-        if (ev.key === 'Escape') {
-          this.closeOverlay();
-        }
-      });
-
-    merge(
-      this._overlayRef.attachments().pipe(map(() => true)),
-      this._overlayRef.detachments().pipe(map(() => false))
-    ).pipe(
-      takeUntil(this.unsubscribe$)
-    ).subscribe(ev => {
-      this._attachedChange.next(ev);
-    });
-  }
-
-  public ngOnDestroy(): void {
-    this.unsubscribe$.next();
-    this.unsubscribe$.complete();
-    this._overlayRef.dispose();
-  }
-
-  /***************************************************************************
-   *                                                                         *
-   * Properties                                                              *
-   *                                                                         *
-   **************************************************************************/
-
-  @Input()
-  public set origin(origin: FlexibleConnectedPositionStrategyOrigin) {
-    this._origin = origin;
-  }
-
-  @Input()
-  public set positionStrategy(strategy: PositionStrategy) {
-    if (this._overlayRef) {
-      this._overlayRef.updatePositionStrategy(strategy);
-      this._hasCustomPositionStrategy = true;
-    }
-  }
-
-  @Input()
-  public set overlaySize(size: OverlaySizeConfig) {
-    if (this._overlayRef) {
-      this._overlayRef.updateSize(size);
-    }
-  }
-
-  /**
-   * Emits all key events on the overlay
-   */
-  @Output()
-  public get keydownEvents() {
-    return this._keydownEvents;
-  }
-
-
-
-  /**
-   * Emits when the overlay is attached (true) or de-attached (false)
-   */
-  @Output()
-  public get attachedChange(): Observable<boolean> {
-    return this._attachedChange;
-  }
-
-  /**
-   * Is this overlay currently attached and thus visible?
-   */
-  public get attached(): boolean {
-    return this._overlayRef ? this._overlayRef.hasAttached() : false;
-  }
-
-  /***************************************************************************
-   *                                                                         *
-   * Public API                                                              *
-   *                                                                         *
-   **************************************************************************/
-
-  /**
-   * Show this overlay
-   */
-  public showOverlay(options?: OverlayShowOptions): EmbeddedViewRef<any> {
-
-
-    if (!this._hasCustomPositionStrategy) {
-
-      let origin: FlexibleConnectedPositionStrategyOrigin;
-      if (!this._origin && options && options.source) {
-        origin = options.source;
-      } else {
-        origin = this._origin;
-      }
-      this._overlayRef.updatePositionStrategy(
-        this.buildDefaultStrategy(origin)
-      );
-    }
-
-    if (!this.attached) {
-      return this.attachOverlay();
-    }
-  }
-
-  /**
-   * Hide this overlay
-   */
-  public closeOverlay(): any {
-    if (this._overlayRef) {
-      this._overlayRef.detach();
-    }
-  }
-
-  /***************************************************************************
-   *                                                                         *
-   * Private methods                                                         *
-   *                                                                         *
-   **************************************************************************/
-
-  private buildDefaultStrategy(origin: FlexibleConnectedPositionStrategyOrigin): PositionStrategy {
-    return this.positionBuilder.flexibleConnectedTo(origin)
-      .withPositions([{
-        originX: this.originX,
-        originY: this.originY,
-        overlayX: this.overlayX,
-        overlayY: this.overlayY,
-        offsetY: this.offsetY,
-        offsetX: this.offsetX
-      }]);
-  }
-
-  private attachOverlay(): EmbeddedViewRef<any> {
-    const searchPanelPortal = new TemplatePortal(
-      this.templateRef,
-      this.viewContainer
-    );
-    return this._overlayRef.attach(searchPanelPortal);
-  }
-}

package/src/lib/components/overlays/elder-overlay.module.ts

@@ -1,29 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ElderOverlayComponent } from './elder-overlay.component';
-import {OverlayModule} from '@angular/cdk/overlay';
-import { ElderOverlayTriggerDirective } from './elder-overlay-trigger.directive';
-import {ElderOverlayOriginDirective} from './elder-overlay-origin.directive';
-
-export {ElderOverlayComponent} from './elder-overlay.component';
-export {ElderOverlayTriggerDirective} from './elder-overlay-trigger.directive';
-export {ElderOverlayOriginDirective} from './elder-overlay-origin.directive';
-
-@NgModule({
-  imports: [
-    CommonModule,
-
-    OverlayModule
-  ],
-  declarations: [
-    ElderOverlayComponent,
-    ElderOverlayTriggerDirective,
-    ElderOverlayOriginDirective
-  ],
-  exports: [
-    ElderOverlayComponent,
-    ElderOverlayTriggerDirective,
-    ElderOverlayOriginDirective
-  ]
-})
-export class ElderOverlayModule { }

package/src/lib/components/panels/card-panel/elder-card-panel.component.html

@@ -1,4 +0,0 @@
-<div class="layout-col elder-card-panel">
-  <ng-content></ng-content>
-</div>
-

package/src/lib/components/panels/card-panel/elder-card-panel.component.ts

@@ -1,11 +0,0 @@
-import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
-
-@Component({
-  selector: 'elder-card-panel',
-  templateUrl: './elder-card-panel.component.html',
-  styleUrls: ['./elder-card-panel.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class ElderCardPanelComponent {
-  constructor() { }
-}

package/src/lib/components/panels/elder-dialog-panel/elder-dialog-panel.component.html

@@ -1,4 +0,0 @@
-<div class="layout-col elder-dialog-panel">
-  <ng-content></ng-content>
-</div>
-

package/src/lib/components/panels/elder-dialog-panel/elder-dialog-panel.component.ts

@@ -1,11 +0,0 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'elder-dialog-panel',
-  templateUrl: './elder-dialog-panel.component.html',
-  styleUrls: ['./elder-dialog-panel.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class ElderDialogPanelComponent {
-  constructor() { }
-}

package/src/lib/components/panels/elder-panel.module.ts

@@ -1,28 +0,0 @@
-
-import {NgModule} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import { MatCommonModule } from '@angular/material/core';
-import {ElderPanelComponent} from './flat/elder-panel.component';
-import { ElderCardPanelComponent } from './card-panel/elder-card-panel.component';
-import { ElderDialogPanelComponent } from './elder-dialog-panel/elder-dialog-panel.component';
-
-export {ElderPanelComponent} from './flat/elder-panel.component';
-export {ElderCardPanelComponent} from './card-panel/elder-card-panel.component';
-export {ElderDialogPanelComponent} from './elder-dialog-panel/elder-dialog-panel.component';
-
-@NgModule({
-  imports : [
-    CommonModule, MatCommonModule,
-  ],
-  declarations: [
-    ElderPanelComponent,
-    ElderCardPanelComponent,
-    ElderDialogPanelComponent
-  ],
-  exports : [
-    ElderPanelComponent,
-    ElderCardPanelComponent,
-    ElderDialogPanelComponent
-  ]
-})
-export class ElderPanelModule { }

package/src/lib/components/panels/flat/elder-panel.component.html

@@ -1,2 +0,0 @@
-<ng-content></ng-content>
-

package/src/lib/components/panels/flat/elder-panel.component.ts

@@ -1,30 +0,0 @@
-import {ChangeDetectionStrategy, Component, ElementRef, Input, OnInit, Renderer2} from '@angular/core';
-import {CanColor, ThemePalette, mixinColor, _Constructor} from '@angular/material/core';
-
-export class ElderPanelComponentBase {
-  constructor(public _renderer: Renderer2, public _elementRef: ElementRef) {}
-}
-
-export const _ElderPanelMixinBase: _Constructor<CanColor> & typeof ElderPanelComponentBase =  mixinColor(ElderPanelComponentBase);
-
-
-@Component({
-  selector: 'elder-panel, mat-panel',
-  templateUrl: './elder-panel.component.html',
-  inputs: ['color'],
-  styleUrls: ['./elder-panel.component.scss'],
-  host: {
-    'class': 'mat-panel',
-  },
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class ElderPanelComponent extends _ElderPanelMixinBase implements CanColor {
-
-  @Input()
-  public color: ThemePalette; // Fix CanColor interface issue
-
-  constructor(renderer: Renderer2, elementRef: ElementRef) {
-    super(renderer, elementRef);
-  }
-
-}

package/src/lib/components/select/auto/elder-auto-select-first.directive.ts

@@ -1,87 +0,0 @@
-import {AfterViewInit, Directive, Input} from '@angular/core';
-import {LoggerFactory} from '@elderbyte/ts-logger';
-import {coerceBooleanProperty} from '@angular/cdk/coercion';
-import {EMPTY, Observable, of} from 'rxjs';
-import {catchError, filter, first, map, switchMap, takeUntil, tap, timeout} from 'rxjs/operators';
-import {ElderSelectComponentState} from '../elder-select-base';
-import {IDataContext} from '../../../common/data/data-context/data-context';
-import {DataSourceAdapter} from '../../../common/data/datasource/data-source-adapter';
-import {ElderSelectComponent} from '../single/elder-select/elder-select.component';
-import {ElderSelectFirstUtil} from './elder-select-first-util';
-
-@Directive({
-  selector: '[autoSelectFirst]'
-})
-export class ElderAutoSelectFirstDirective<TEntity = any, TId = any> implements AfterViewInit {
-
-  /***************************************************************************
-   *                                                                         *
-   * Fields                                                                  *
-   *                                                                         *
-   **************************************************************************/
-
-  private readonly log = LoggerFactory.getLogger(this.constructor.name);
-
-  private _enabled: boolean;
-
-  /***************************************************************************
-   *                                                                         *
-   * Constructor                                                             *
-   *                                                                         *
-   **************************************************************************/
-
-  constructor(
-    public readonly elderSelect: ElderSelectComponent<TEntity, TId, any>
-  ) { }
-
-  /***************************************************************************
-   *                                                                         *
-   * Life Cycle                                                              *
-   *                                                                         *
-   **************************************************************************/
-
-  public ngAfterViewInit(): void {
-    setTimeout(() => { // HACK: Wait until ngModel has done its strange null/empty value init...
-      this.log.info('autoSelectFirst after-view init, auto selecting value');
-      this.handleAutoSelectFirst();
-    }, 10);
-  }
-
-  /***************************************************************************
-   *                                                                         *
-   * Properties                                                              *
-   *                                                                         *
-   **************************************************************************/
-
-  /**
-   * After data is loaded into this select, ensure that
-   * a value is selected or select the first automatically.
-   */
-  @Input('autoSelectFirst')
-  public set autoSelectFirstEnabled(val: boolean | string) {
-    this.enabled = coerceBooleanProperty(val);
-  }
-
-  public set enabled(val: boolean) {
-    this._enabled = val;
-  }
-
-  public get enabled(): boolean {
-    return this._enabled;
-  }
-
-  /***************************************************************************
-   *                                                                         *
-   * Private methods                                                         *
-   *                                                                         *
-   **************************************************************************/
-
-  private handleAutoSelectFirst(): void {
-    if (!this.elderSelect.value) {
-      this.log.debug('Attempting to auto select first entity...');
-      ElderSelectFirstUtil.trySelectFirst(this.elderSelect);
-    } else {
-      this.log.warn('Conflict avoided: Aborted auto selection because value id already present!');
-    }
-  }
-}

package/src/lib/components/select/auto/elder-select-first-util.ts

@@ -1,98 +0,0 @@
-import {EMPTY, Observable, of} from 'rxjs';
-import {catchError, filter, first, map, switchMap, takeUntil, tap, timeout} from 'rxjs/operators';
-import {ElderSelectComponentState} from '../elder-select-base';
-import {IDataContext} from '../../../common/data/data-context/data-context';
-import {DataSourceAdapter} from '../../../common/data/datasource/data-source-adapter';
-import {ElderSelectComponent} from '../single/elder-select/elder-select.component';
-import {LoggerFactory} from '@elderbyte/ts-logger';
-
-export class ElderSelectFirstUtil {
-
-  /***************************************************************************
-   *                                                                         *
-   * Fields                                                                  *
-   *                                                                         *
-   **************************************************************************/
-
-  private static readonly log = LoggerFactory.getLogger('ElderSelectFirstUtil');
-
-  /***************************************************************************
-   *                                                                         *
-   * Public methods                                                          *
-   *                                                                         *
-   **************************************************************************/
-
-  public static trySelectFirst<TEntity, TId>(
-    elderSelect: ElderSelectComponent<TEntity, TId, any>
-  ): void {
-
-    const suggestionsDc = elderSelect.dataContext;
-
-    const dataContextFirstItem: Observable<TEntity> = suggestionsDc?.isStarted
-      ? this.firstItemInDataContextSoon(suggestionsDc)
-      : of(null);
-
-    dataContextFirstItem.pipe(
-      takeUntil(elderSelect.valueChange.pipe(filter(value => !!value))),
-      switchMap(firstItem => firstItem ? of(firstItem) : this.firstSuggestionItem(elderSelect))
-    ).subscribe(
-      firstItem => {
-        if (firstItem && !elderSelect.entityId) {
-          elderSelect.updateValueByEntity(firstItem);
-        }
-      },
-      err => {
-        elderSelect.updateState(ElderSelectComponentState.error(err));
-        this.log.error('Failed to load first entity for auto-select-first flow!', err);
-      }
-    );
-  }
-
-  /***************************************************************************
-   *                                                                         *
-   * Private methods                                                         *
-   *                                                                         *
-   **************************************************************************/
-
-  private static firstItemInDataContextSoon<TEntity>(dataContext: IDataContext<TEntity>): Observable<TEntity | null> {
-    return dataContext.data.pipe(
-      filter(data => data && data.length > 0),
-      map(data => data[0]),
-      timeout(250),
-      catchError(timeoutError => {
-        this.log.warn('Gave up waiting for DataContext items, timeout reached. Falling back to sugestion lookup.', timeoutError);
-        return of(null);
-      }),
-      first()
-    );
-  }
-
-  private static firstSuggestionItem<TEntity, TId>(
-    elderSelect: ElderSelectComponent<TEntity, TId, any>
-  ): Observable<TEntity | null> {
-
-    const suggestionsDc = elderSelect.dataContext;
-    const dataSource = suggestionsDc?.dataSource;
-
-    if (dataSource) {
-
-      elderSelect.updateState(ElderSelectComponentState.loading());
-
-      return DataSourceAdapter.from(dataSource)
-        .findFirst(elderSelect.filters, elderSelect.sorts).pipe(
-          tap(() => elderSelect.updateState(ElderSelectComponentState.idle())),
-          catchError(err => {
-            this.log.error('Failed to load suggestions!', err);
-            elderSelect.updateState(ElderSelectComponentState.error(err));
-            return of(null);
-          }),
-        );
-    } else {
-      this.log.warn('Failed to load first suggestion!');
-      elderSelect.updateState(ElderSelectComponentState.idle());
-      return EMPTY;
-    }
-  }
-
-
-}