@bizdoc/core 1.14.9 → 1.14.10

package/src/lib/core/popup/_popup-theme.scss

@@ -1,363 +0,0 @@
-@mixin popup-theme($theme) {
-  $background: mat.get-color-from-palette($theme, background);
-  $foreground: mat.get-color-from-palette($theme, foreground);
-  $accent: mat.get-color-from-palette($theme, accent);
-  $is-dark-theme: mat.get-color-from-palette($theme, is-dark);
-
-  $popup-background:  mat.get-color-from-palette($background, dialog);
-  $popup-border-color:  mat.get-color-from-palette($foreground, divider);
-  $popup-tooltip-size: 8px;
-  $popup-margin: 0;
-  $popup-padding: 0;
-  $tooltip-background:  mat.get-color-from-palette($background, tooltip, 0.9);
-  $tooltip-border-color:  mat.get-color-from-palette($background, tooltip, 0.9);
-  $tooltip-color: white; // mat.get-color-from-palette($foreground, text);
-  $guide-background: white;
-  $guide-border-color:  mat.get-color-from-palette($accent, 600);
-
-  .popup-panel {
-    > * {
-      flex-direction: inherit;
-      display: inherit;
-    }
-
-
-    .popup-content {
-      display: inline-table;
-      color:  mat.get-color-from-palette($foreground, text);
-      min-width: 52px;
-      background: $popup-background;
-      border-radius: 2px;
-      border: 2px solid $popup-border-color;
-      box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, .1);
-
-      > * {
-        display: flex;
-        -ms-flex-direction: column;
-        -webkit-flex-direction: column;
-        flex-direction: column;
-        -ms-flex: 1 auto 1;
-        -webkit-flex: 1 auto 1;
-      }
-
-      .mat-nav-list, form, p {
-        z-index: 1;
-      }
-    }
-
-    .tooltip-container {
-      display: none;
-
-      .tooltip {
-        display: block;
-        position: relative;
-        width: 0;
-        height: 0;
-        border: $popup-tooltip-size solid transparent;
-
-        &:after {
-          content: '\00a0';
-          position: absolute;
-          width: 0;
-          height: 0;
-          border: $popup-tooltip-size solid transparent;
-        }
-      }
-    }
-
-    &.start, &.center, &.end {
-      .tooltip-container {
-        display: flex;
-      }
-    }
-
-    &.center .tooltip-container {
-      align-self: center;
-      align-items: center;
-    }
-
-    &.end .tooltip-container {
-      align-self: flex-end;
-      align-items: flex-end;
-    }
-
-    &.before, &.after {
-      &.start .tooltip {
-        margin-top: 4px;
-      }
-
-      &.center .tooltip {
-      }
-
-      &.end .tooltip {
-        margin-bottom: 19px;
-      }
-    }
-
-    &.above, &.below {
-      margin-left: $popup-padding;
-      margin-right: $popup-padding;
-
-      &.start .tooltip {
-        margin-left: 19px;
-      }
-
-      &.end .tooltip {
-        margin-right: 6px;
-      }
-    }
-
-    &.above .tooltip, &.after .tooltip {
-    }
-
-    &.before {
-      -ms-flex-direction: row;
-      -webkit-flex-direction: row;
-      flex-direction: row;
-
-      .tooltip {
-        border-left-color: $popup-border-color;
-
-        &:after {
-          border-left-color: $popup-background;
-          left: -11px;
-          top: -8px;
-        }
-      }
-    }
-
-    &.after {
-      margin-left: $popup-margin;
-      -ms-flex-direction: row-reverse;
-      -webkit-flex-direction: row-reverse;
-      flex-direction: row-reverse;
-
-      .tooltip {
-        border-right-color: $popup-border-color;
-
-        &:after {
-          border-right-color: $popup-background;
-          left: -6px;
-          top: -8px;
-        }
-      }
-    }
-
-    &.above {
-      margin-top: $popup-padding;
-      -ms-flex-direction: column;
-      -webkit-flex-direction: column;
-      flex-direction: column;
-
-      .tooltip {
-        border-top-color: $popup-border-color;
-
-        &:after {
-          left: -8px;
-          top: -11px;
-          border-top-color: $popup-background;
-        }
-      }
-    }
-
-    &.below {
-      margin-bottom: $popup-padding;
-      -ms-flex-direction: column-reverse;
-      -webkit-flex-direction: column-reverse;
-      flex-direction: column-reverse;
-
-      .tooltip {
-        border-bottom-color: $popup-border-color;
-
-        &:after {
-          left: -8px;
-          top: -6px;
-          border-bottom-color: $popup-background;
-        }
-      }
-    }
-  }
-
-  [dir=rtl] .popup-panel {
-    &.above.start .tooltip, &.below.start .tooltip {
-      margin-right: 8px;
-      margin-left: unset;
-    }
-
-    &.above.end .tooltip, &.below.end .tooltip {
-      margin-left: 19px;
-    }
-
-    &.before {
-      margin-right: -14px;
-
-      .tooltip {
-        border-left-color: transparent !important;
-        border-right-color: $popup-border-color;
-
-        &:after {
-          left: -6px;
-          border-left-color: transparent !important;
-          border-right-color: $popup-background;
-        }
-      }
-    }
-
-    &.after {
-      margin-left: unset;
-      margin-right: $popup-margin;
-
-      .tooltip {
-        border-right-color: transparent !important;
-        border-left-color: $popup-border-color;
-
-        &:after {
-          left: -11px;
-          border-right-color: transparent !important;
-          border-left-color: $popup-background;
-        }
-      }
-    }
-  }
-
-  .tooltip-panel {
-    .popup-content {
-      /*opacity: .9;*/
-      min-width: auto !important;
-      background-color: $tooltip-background;
-      color: $tooltip-color;
-      border: none;
-      padding: 4px 8px;
-      cursor: default;
-      font-size: small;
-      display: inline-block;
-    }
-
-    .tooltip-container {
-      .tooltip {
-        /*opacity: .9;*/
-        &:after{
-            display: none;
-        }
-      }
-    }
-
-    &.before {
-      .tooltip {
-        border-left-color: $tooltip-border-color;
-
-        &:after {
-          border-left-color: $tooltip-background;
-        }
-      }
-    }
-
-    &.after {
-      .tooltip {
-        border-right-color: $tooltip-border-color;
-
-        &:after {
-          border-right-color: $tooltip-background;
-        }
-      }
-    }
-
-    &.above {
-      .tooltip {
-        border-top-color: $tooltip-border-color;
-
-        &:after {
-          border-top-color: $tooltip-background;
-        }
-      }
-    }
-
-    &.below {
-      .tooltip {
-        border-bottom-color: $tooltip-border-color;
-
-        &:after {
-          border-bottom-color: $tooltip-background;
-        }
-      }
-    }
-  }
-
-  [dir=rtl] .tooltip-panel {
-    &.before {
-      .tooltip {
-        border-left-color: transparent !important;
-        border-right-color: $tooltip-border-color;
-
-        &:after {
-          border-left-color: transparent !important;
-          border-right-color: $tooltip-background;
-        }
-      }
-    }
-
-    &.after {
-      .tooltip {
-        border-right-color: transparent !important;
-        border-left-color: $tooltip-border-color;
-
-        &:after {
-          border-right-color: transparent !important;
-          border-left-color: $tooltip-background;
-        }
-      }
-    }
-  }
-  /*.guide-panel {
-    .popup-content {
-    }
-
-    .tooltip-container {
-      .tooltip {*/
-  /*opacity: .9;*/
-  /*}
-    }
-
-    &.before {
-      flex-direction: row;
-
-      .tooltip {
-        border-left-color: $guide-border-color;
-
-        &:after {
-          border-left-color: $guide-background;
-        }
-      }
-    }
-
-    &.after {
-      .tooltip {
-        border-right-color: $guide-border-color;
-
-        &:after {
-          border-right-color: $guide-background;
-        }
-      }
-    }
-
-    &.above {
-      .tooltip {
-        border-top-color: $guide-border-color;
-
-        &:after {
-          border-top-color: $guide-background;
-        }
-      }
-    }
-
-    &.below {
-      .tooltip {
-        border-bottom-color: $guide-border-color;
-
-        &:after {
-          border-bottom-color: $guide-background;
-        }
-      }
-    }
-  }*/
-}

package/src/lib/core/popup/popup-ref.ts

@@ -1,19 +0,0 @@
-import { Subject } from 'rxjs';
-
-export class PopupRef<T = any, V = any, D = any> {
-  constructor(private _data: D) { }
-  readonly _opened = new Subject<T>();
-  readonly _closed = new Subject<V>();
-  _instance: T;
-  public get data(): D {
-    return this._data;
-  }
-  get instance(): T { return this._instance; }
-  get opened() { return this._opened.asObservable(); }
-  get closed() { return this._closed.asObservable(); }
-  close(val?: V) { this._closed.next(val); }
-  _destroy() {
-    this._opened.complete();
-    this._closed.complete();
-  }
-}

package/src/lib/core/popup/popup.component.html

@@ -1,6 +0,0 @@
-<div class="popup-content">
-  <ng-container #container></ng-container>
-</div>
-<div class="tooltip-container">
-  <div class="tooltip"></div>
-</div>

package/src/lib/core/popup/popup.component.ts

@@ -1,40 +0,0 @@
-import { AfterViewInit, Component, ComponentFactoryResolver, Inject, InjectionToken, Injector, OnInit, TemplateRef, ViewChild, ViewContainerRef } from '@angular/core';
-import { ComponentType } from '@angular/cdk/portal';
-import { PopupRef } from "./popup-ref";
-
-export const POPUP_DATA = new InjectionToken('popup');
-
-export interface PopupData<T = any> {
-  data?: any;
-  component?: ComponentType<any> | TemplateRef<T>;
-  template?: TemplateRef<any>;
-}
-
-@Component({
-  selector: 'bizdoc-popup',
-  templateUrl: './popup.component.html'
-})
-export class PopupComponent implements OnInit {
-  @ViewChild('container', {static: true, read: ViewContainerRef }) _container: ViewContainerRef;
-  private _instance: any;
-  constructor(@Inject(POPUP_DATA) private _data: PopupData,
-    private _ref: PopupRef<any>,
-    private _injector: Injector,
-    private _cf: ComponentFactoryResolver) { }
-
-  ngOnInit(): void {
-    const { component, data } = this._data;
-    if (component instanceof TemplateRef) 
-      this._container.createEmbeddedView(component, { $implicit: data });
-    else {
-      const factory =
-        this._cf.resolveComponentFactory(component);
-      const injector = Injector.create([{ provide: POPUP_DATA, useValue: data }], this._injector);
-      const cRef = this._container.createComponent(factory, 0, injector);
-
-      this._instance = this._ref._instance = cRef.instance;
-    }
-    this._ref._opened.next(this._instance);
-  }
-}
-

package/src/lib/core/popup/popup.service.ts

@@ -1,156 +0,0 @@
-import { Directionality } from '@angular/cdk/bidi';
-import { ESCAPE } from '@angular/cdk/keycodes';
-import { ConnectedPosition, Overlay, OverlayRef } from '@angular/cdk/overlay';
-import { ComponentPortal, ComponentType } from '@angular/cdk/portal';
-import { ElementRef, Injectable, Injector, Input, TemplateRef } from '@angular/core';
-import { filter } from 'rxjs/operators';
-import { PopupData, PopupComponent, POPUP_DATA } from './popup.component';
-import { PopupRef } from './popup-ref';
-import { SessionService } from '../session.service';
-
-export const BELOW: ConnectedPosition[] = [{
-  originX: 'center',
-  originY: 'bottom',
-  overlayX: 'center',
-  overlayY: 'top',
-  panelClass: ['below', 'center']
-}, {
-  originX: 'start',
-  originY: 'bottom',
-  overlayX: 'start',
-  overlayY: 'top',
-  panelClass: ['below', 'start']
-}, {
-  originX: 'end',
-  originY: 'bottom',
-  overlayX: 'end',
-  overlayY: 'top',
-  panelClass: ['below', 'end']
-}],
-  ABOVE: ConnectedPosition[] = [
-    {
-      originX: 'center',
-      originY: 'top',
-      overlayX: 'center',
-      overlayY: 'bottom',
-      panelClass: ['above', 'center']
-    },
-    {
-      originX: 'start',
-      originY: 'top',
-      overlayX: 'end',
-      overlayY: 'bottom',
-      panelClass: ['above', 'end']
-    }, {
-      originX: 'start',
-      originY: 'top',
-      overlayX: 'start',
-      overlayY: 'bottom',
-      panelClass: ['above', 'start']
-    }],
-  AFTER: ConnectedPosition[] = [
-    {
-      originX: 'end',
-      originY: 'center',
-      overlayX: 'start',
-      overlayY: 'center',
-      panelClass: ['after', 'center']
-    }, {
-      originX: 'end',
-      originY: 'top',
-      overlayX: 'start',
-      overlayY: 'top',
-      panelClass: ['after', 'start']
-    },
-    {
-      originX: 'end',
-      originY: 'bottom',
-      overlayX: 'start',
-      overlayY: 'bottom',
-      panelClass: ['after', 'end']
-    }],
-  BEFORE: ConnectedPosition[] = [{
-    originX: 'start',
-    originY: 'center',
-    overlayX: 'end',
-    overlayY: 'center',
-    panelClass: ['before', 'center']
-  }, {
-    originX: 'start',
-    originY: 'center',
-    overlayX: 'end',
-    overlayY: 'bottom',
-    panelClass: ['before', 'end']
-  }, {
-    originX: 'start',
-    originY: 'top',
-    overlayX: 'end',
-    overlayY: 'top',
-    panelClass: ['before', 'start']
-  }];
-
-export type Position = 'above' | 'end' | 'start' | 'below';
-
-@Injectable({ providedIn: 'root' })
-export class Popup {
-  constructor(private _overlay: Overlay,
-    private _session: SessionService,
-    private _injector: Injector) {
-  }
-  public open<T, V = any, D = any>(component: ComponentType<T> | TemplateRef<T>, element: HTMLElement | ElementRef, options?: {
-    position?: Position,
-    disposeOnBackdrop?: boolean;
-    data?: D,
-    class?: string,
-    backdrop?: boolean,
-    injector?: Injector
-  }): PopupRef<T, V, D> {
-    let positions: ConnectedPosition[];
-    const { backdrop, position, disposeOnBackdrop, data, injector, class: clazz } = options || {};
-    switch (position) {
-      case 'above':
-        positions = [...ABOVE, ...BELOW, ...AFTER, ...BEFORE];
-        break;
-      case 'end':
-        positions = [...AFTER, ...BEFORE, ...BELOW, ...ABOVE];
-        break;
-      case 'start':
-        positions = [...BEFORE, ...AFTER, ...BELOW, ...ABOVE];
-        break;
-      default:
-        positions = [...BELOW, ...BEFORE, ...ABOVE, ...AFTER];
-        break;
-    }
-    const positionStrategy = this._overlay.position().
-      flexibleConnectedTo(element).
-      withGrowAfterOpen(true).
-      withViewportMargin(5).
-      withPositions(positions);
-    const oRef = this._overlay.create({
-      positionStrategy,
-      backdropClass: 'cdk-overlay-transparent-backdrop',
-      hasBackdrop: backdrop !== false,
-      disposeOnNavigation: true,
-      direction: this._session.direction,
-      panelClass: ['popup-panel', clazz]
-    });
-    const pRef = new PopupRef<T, V, D>(data);
-    const popupInjector = Injector.create([{ provide: POPUP_DATA, useValue: { component, data } as PopupData },
-    { provide: OverlayRef, useValue: oRef },
-    { provide: PopupRef, useValue: pRef }], injector || this._injector);
-    const portal = new ComponentPortal(PopupComponent, null, popupInjector);
-    oRef.attach(portal);
-    oRef.keydownEvents().pipe(filter(k => k.keyCode === ESCAPE)).
-      subscribe(e => {
-        e.stopPropagation();
-        pRef._closed.next(null);
-      });
-    backdrop !== false && oRef.backdropClick().subscribe(() =>
-      disposeOnBackdrop !== false && pRef._closed.next(null)
-    );
-    pRef._closed.subscribe(() =>
-      oRef.detach()
-    );
-    return pRef;
-  }
-}

package/src/lib/core/popup/tooltip.directive.ts

@@ -1,58 +0,0 @@
-import { Component, Directive, ElementRef, Inject, Input, OnInit, TemplateRef } from '@angular/core';
-import { PopupRef } from './popup-ref';
-import { POPUP_DATA } from './popup.component';
-import { Popup, Position } from './popup.service';
-
-@Component({ template: '' })
-export class TooltipComponent {
-  constructor(
-    @Inject(POPUP_DATA) private _data: string,
-    private _element: ElementRef<HTMLElement>
-  ) {
-    _element.nativeElement.innerHTML = _data;
-  }
-}
-@Directive({ selector: '[bizdocTooltip]' }) export
-  class TooltipDirective implements OnInit {
-  @Input('bizdocTooltip') content: string;
-  @Input('bizdocTooltipTemplate') template: TemplateRef<any>;
-  @Input('bizdocTooltipContext') context: any;
-  @Input('bizdocTooltipPosition') position: Position = 'below';
-  @Input('bizdocTooltipDuration') duration: number = 2000;
-  @Input('bizdocTooltipDisabled') disabled = false;
-  private _ref: PopupRef;
-  private static _active: PopupRef[] = [];
-  constructor(
-    private _element: ElementRef<HTMLElement>,
-    private _popup: Popup,
-  ) {
-
-  }
-  ngOnInit(): void {
-    this._element.nativeElement.addEventListener('mouseenter', this._enter.bind(this))
-    this._element.nativeElement.addEventListener('click', this._click.bind(this))
-  }
-  private _enter() {
-    if (!this.disabled) {
-      while (TooltipDirective._active.length) {
-        TooltipDirective._active[0].close();
-        TooltipDirective._active.splice(0, 1);
-      }
-      this._ref = this._popup.open(this.template || TooltipComponent, this._element, {
-        class: 'tooltip-panel',
-        position: this.position,
-        backdrop: false,
-        data: this.template ? this.context : this.content
-      });
-      TooltipDirective._active.push(this._ref);
-      setTimeout(() => this.close(), this.duration);
-    }
-  }
-  close() {
-    this._ref.close();
-    TooltipDirective._active.remove(this._ref);
-  }
-  private _click() {
-    this._ref && this.close();
-  }
-}

package/src/lib/core/prompt/ask/ask.dialog.html

@@ -1,6 +0,0 @@
-<h2 mat-dialog-title>{{title}}</h2>
-<mat-dialog-content class="mat-body">{{content}}</mat-dialog-content>
-<mat-dialog-actions>
-  <button mat-button [mat-dialog-close]="true" [color]="color">{{ok}}</button>
-  <button mat-button mat-dialog-close>{{cancel}}</button>
-</mat-dialog-actions>

package/src/lib/core/prompt/ask/ask.dialog.ts

@@ -1,35 +0,0 @@
-import { Component, Inject } from '@angular/core';
-import { MAT_DIALOG_DATA } from '@angular/material/dialog';
-import { TranslateService } from '../../translate.service';
-import { ThemePalette } from '@angular/material/core';
-
-@Component({
-  selector: 'bizdoc-ask',
-  templateUrl: './ask.dialog.html'
-})
-/** ask component*/
-export class AskDialog {
-  ok: string;
-  cancel: string;
-  title: string;
-  content: string;
-  color: ThemePalette;
-  /** ask ctor */
-  constructor(@Inject(MAT_DIALOG_DATA) data: AskDialogData, translate: TranslateService) {
-    Object.assign(this, {
-      content: data.i18n ? translate.get(data.content) : data.content,
-      title: data.title ? data.i18n ? translate.get(data.title) : data.title : null,
-      cancel: data.cancel ? data.i18n ? translate.get(data.cancel) : data.cancel : translate.get('Cancel'),
-      ok: data.ok ? data.i18n ? translate.get(data.ok) : data.ok : translate.get('OK'),
-      color: data.color || 'primary'
-    });
-  }
-}
-export interface AskDialogData {
-  ok?: string;
-  cancel?: string;
-  title?: string;
-  content: string;
-  color?: ThemePalette;
-  i18n?: boolean;
-}

package/src/lib/core/prompt/mask/mask.component.html

@@ -1 +0,0 @@
-<h1 class="mat-display-2">{{resource|translate}}</h1>

package/src/lib/core/prompt/mask/mask.component.scss

@@ -1,14 +0,0 @@
-:host {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  background-color: white;
-  padding: 2em;
-  opacity: .8;
-  display: flex;
-  flex-direction: row;
-  place-content: center center;
-  align-items: center;
-}