@tetacom/ng-components 1.0.25 → 1.0.26

package/src/component/tree/tree.service.ts

@@ -1,41 +0,0 @@
-import { Injectable } from '@angular/core';
-import { ITreeData } from '../../common/contract/i-tree-data';
-import { BehaviorSubject, Observable } from 'rxjs';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class TreeService {
-  openItems: Observable<ITreeData[]>;
-  private _openItems: BehaviorSubject<ITreeData[]> = new BehaviorSubject<
-    ITreeData[]
-  >([]);
-
-  constructor() {
-    this.openItems = this._openItems.asObservable();
-  }
-
-  compareItems: (item: ITreeData) => any = (item: ITreeData) => item;
-
-  openItem(item: ITreeData) {
-    const newValue = this.addOrRemove(item, this._openItems.value);
-    this.setOpenItems(newValue);
-  }
-
-  setOpenItems(items: ITreeData[]) {
-    this._openItems.next(items);
-  }
-
-  private addOrRemove<G>(needle: G, list: G[]): G[] {
-    const found = list?.find(
-      (x) => this.compareItems(x) === this.compareItems(needle)
-    );
-    if (found) {
-      return list.filter(
-        (x) => this.compareItems(x) !== this.compareItems(needle)
-      );
-    } else {
-      return [...list, needle];
-    }
-  }
-}

package/src/directive/click-outside/click-outside.directive.spec.ts

@@ -1,8 +0,0 @@
-import { ClickOutsideDirective } from './click-outside.directive';
-
-describe('ClickOutsideDirective', () => {
-  it('should create an instance', () => {
-    const directive = new ClickOutsideDirective();
-    expect(directive).toBeTruthy();
-  });
-});

package/src/directive/click-outside/click-outside.directive.ts

@@ -1,64 +0,0 @@
-import {
-  Directive,
-  ElementRef,
-  EventEmitter,
-  Input,
-  OnDestroy,
-  Output,
-} from '@angular/core';
-import { DomUtil } from '../../common/util/dom-util';
-
-@Directive({
-  selector: '[tetaClickOutside]',
-})
-export class ClickOutsideDirective implements OnDestroy {
-  @Output() clickOutside = new EventEmitter<MouseEvent>();
-  @Input() rightClick = false;
-
-  private _handleEvents = false;
-
-  @Input()
-  set tetaClickOutside(val: boolean) {
-    this._handleEvents = val;
-    if (this._handleEvents) {
-      this.addListener(this.rightClick);
-    } else {
-      this.removeListener();
-    }
-  }
-
-  get tetaClickOutside(): boolean {
-    return this._handleEvents;
-  }
-
-  constructor(private _elementRef: ElementRef) {}
-
-  ngOnDestroy(): void {
-    this.removeListener();
-  }
-
-  private addListener(handleRightClick: boolean): void {
-    window.addEventListener('click', this.listener);
-    if (handleRightClick) {
-      window.addEventListener('contextmenu', this.listener);
-    }
-  }
-
-  private removeListener(): void {
-    window.removeEventListener('click', this.listener);
-    window.removeEventListener('contextmenu', this.listener);
-  }
-
-  private listener = (click: MouseEvent) => {
-    if (!this._handleEvents) {
-      return;
-    }
-    const clickedInside = DomUtil.clickedInside(
-      this._elementRef.nativeElement,
-      click
-    );
-    if (!clickedInside) {
-      this.clickOutside.emit(click);
-    }
-  };
-}

package/src/directive/click-outside/click-outside.module.ts

@@ -1,13 +0,0 @@
-import {NgModule} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {ClickOutsideDirective} from './click-outside.directive';
-
-@NgModule({
-  declarations: [ClickOutsideDirective],
-  exports: [ClickOutsideDirective],
-  imports: [
-    CommonModule
-  ]
-})
-export class ClickOutsideModule {
-}

package/src/directive/click-outside/public-api.ts

@@ -1,2 +0,0 @@
-export * from './click-outside.module';
-export * from './click-outside.directive';

package/src/directive/context-menu/ContextMenu.stories.ts

@@ -1,65 +0,0 @@
-import { Meta } from '@storybook/angular/types-6-0';
-import { select, withKnobs } from '@storybook/addon-knobs';
-import { ContextMenuModule } from './context-menu.module';
-import { ButtonModule } from '../../component/button/button.module';
-import { PopupContentComponent } from '../../component/dynamic-component/popup-content/popup-content.component';
-import { IconModule } from '../../component/icon/icon.module';
-import { Align } from '../../common/enum/align.enum';
-import { VerticalAlign } from '../../common/enum/vertical-align.enum';
-
-export default {
-  title: 'Directive/ContextMenu',
-  decorators: [withKnobs],
-} as Meta;
-
-export const basicContextMenu = () => ({
-  moduleMetadata: {
-    imports: [ContextMenuModule, ButtonModule, IconModule],
-    entryComponents: [PopupContentComponent],
-  },
-  props: {
-    align: select(
-      'align',
-      {
-        left: Align.left,
-        right: Align.right,
-        center: Align.center,
-        auto: Align.auto,
-      },
-      Align.left
-    ),
-    verticalAlign: select(
-      'verticalAlign',
-      {
-        bottom: VerticalAlign.bottom,
-        top: VerticalAlign.top,
-        center: VerticalAlign.center,
-        auto: VerticalAlign.auto,
-      },
-      VerticalAlign.bottom
-    ),
-  },
-  template: `<button teta-button
-                     [tetaIconSprite]="'assets/icons.svg'"
-                     [palette]="'primary'"
-                     [tetaContextMenu]="menu"
-                     [align]="align"
-                     [verticalAlign]="verticalAlign"
-                     [className]="'one'">
-              <teta-icon [palette]="'background'" [name]="'settings'"></teta-icon>
-              Right click on me
-            </button>
-            <ng-template #menu let-data="data">
-              <div class="list shadow-1" style="width: 200px">
-                <div class="list-item list-item_interactive">
-                  <teta-icon [name]="'addCircle'" [palette]="'text'" class="margin-right-2"></teta-icon>Add
-                </div>
-                <div class="list-item list-item_interactive">
-                  <teta-icon [name]="'closeBig'" [palette]="'text'" class="margin-right-2"></teta-icon>Delete
-                </div>
-                <div class="list-item list-item_interactive">
-                  <teta-icon [name]="'copy'" [palette]="'text'" class="margin-right-2"></teta-icon>Clone
-                </div>
-              </div>
-            </ng-template>`,
-});

package/src/directive/context-menu/context-menu.directive.spec.ts

@@ -1,8 +0,0 @@
-import { ContextMenuDirective } from './context-menu.directive';
-
-describe('ContextMenuDirective', () => {
-  it('should create an instance', () => {
-    const directive = new ContextMenuDirective();
-    expect(directive).toBeTruthy();
-  });
-});

package/src/directive/context-menu/context-menu.directive.ts

@@ -1,136 +0,0 @@
-import {
-  ChangeDetectorRef,
-  Directive,
-  ElementRef,
-  HostListener,
-  Inject,
-  Injector,
-  Input,
-  NgZone,
-  OnDestroy,
-  OnInit,
-  TemplateRef,
-  Type,
-} from '@angular/core';
-import { DynamicComponentService } from '../../common/service/dynamic-component.service';
-import { DOCUMENT } from '@angular/common';
-import { ArrayUtil } from '../../common/util/array-util';
-import { DomUtil } from '../../common/util/dom-util';
-import { PositionUtil } from '../../common/util/position-util';
-import { DynamicContentBaseDirective } from '../dynamic-content-base.directive';
-import { ClickService } from '../../common/service/click.service';
-import { merge } from 'rxjs';
-import { filter, takeWhile, tap } from 'rxjs/operators';
-
-@Directive({
-  selector: '[tetaContextMenu]',
-})
-export class ContextMenuDirective
-  extends DynamicContentBaseDirective
-  implements OnDestroy, OnInit
-{
-  /**
-   * Строка, шаблон или компонент для создания контекстного меню
-   */
-  @Input() tetaContextMenu: string | TemplateRef<any> | Type<any>;
-
-  get _dynamicContent() {
-    return this.tetaContextMenu;
-  }
-
-  private _eventPoint: {
-    x: number;
-    y: number;
-  };
-
-  constructor(
-    @Inject(DOCUMENT)
-    protected override _document: any,
-    protected override _elementRef: ElementRef,
-    protected override _service: DynamicComponentService,
-    protected override _injector: Injector,
-    protected override _zone: NgZone,
-    protected override _cdr: ChangeDetectorRef,
-    private _click: ClickService
-  ) {
-    super(_document, _elementRef, _service, _injector, _zone, _cdr);
-  }
-
-  @HostListener('contextmenu', ['$event'])
-  showContent(event: MouseEvent): void {
-    event.preventDefault();
-    setTimeout(() => {
-      this.createMenu(event);
-    });
-  }
-
-  @HostListener('click', ['$event'])
-  click(event: MouseEvent): void {
-    if (
-      this._componentRef &&
-      DomUtil.clickedInside(this._componentRef.location.nativeElement, event)
-    ) {
-      event.preventDefault();
-      event.stopPropagation();
-    }
-  }
-
-  override ngOnInit() {
-    super.ngOnInit();
-    merge(this._click.click, this._click.contextMenu)
-      .pipe(
-        takeWhile(() => this._alive),
-        filter(() => this._open),
-        filter(() => this._componentRef != null),
-        filter(
-          (event: MouseEvent) =>
-            !DomUtil.clickedInside(
-              this._componentRef.location.nativeElement,
-              event
-            )
-        ),
-        tap((_) => {
-          this.destroyContentRef();
-          this.openChange.emit(false);
-        })
-      )
-      .subscribe();
-  }
-
-  override ngOnDestroy() {
-    super.ngOnDestroy();
-  }
-
-  protected setPosition() {
-    if (this._componentRef && this._open) {
-      const position = PositionUtil.getPosition(
-        {
-          top: this._eventPoint.y,
-          bottom: this._eventPoint.y,
-          left: this._eventPoint.x,
-          right: this._eventPoint.x,
-        },
-        this._componentRef.location.nativeElement.getBoundingClientRect(),
-        this.align,
-        this.verticalAlign
-      );
-      PositionUtil.setElementPosition(
-        this._componentRef.location.nativeElement,
-        position
-      );
-    }
-  }
-
-  private createMenu(event: MouseEvent): void {
-    if (this.tetaContextMenu == null) {
-      return;
-    }
-    this._eventPoint = event;
-    this._componentRef = this.createContentRef();
-    this._componentRef.instance.className = [
-      ...ArrayUtil.asArray(this.className),
-      'context-menu',
-    ];
-    this.openChange.emit(true);
-  }
-}

package/src/directive/context-menu/context-menu.module.ts

@@ -1,15 +0,0 @@
-import {NgModule} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {ContextMenuDirective} from './context-menu.directive';
-import {DynamicComponentModule} from '../../component/dynamic-component/dynamic-component.module';
-
-@NgModule({
-  declarations: [ContextMenuDirective],
-  exports: [ContextMenuDirective],
-  imports: [
-    CommonModule,
-    DynamicComponentModule
-  ]
-})
-export class ContextMenuModule {
-}

package/src/directive/context-menu/public-api.ts

@@ -1,2 +0,0 @@
-export * from './context-menu.module';
-export * from './context-menu.directive';

package/src/directive/disable-control/disable-control.directive.spec.ts

@@ -1,8 +0,0 @@
-import { DisableControlDirective } from './disable-control.directive';
-
-describe('DisableControlDirective', () => {
-  it('should create an instance', () => {
-    const directive = new DisableControlDirective();
-    expect(directive).toBeTruthy();
-  });
-});

package/src/directive/disable-control/disable-control.directive.ts

@@ -1,20 +0,0 @@
-import {Directive, Input} from '@angular/core';
-import {NgControl} from '@angular/forms';
-
-@Directive({
-  selector: '[tetaDisableControl]'
-})
-export class DisableControlDirective {
-  @Input() set tetaDisableControl(val: boolean) {
-    if (this.ngControl.control) {
-      if (val) {
-        this.ngControl.control.disable();
-      } else {
-        this.ngControl.control.enable();
-      }
-    }
-  }
-
-  constructor(private ngControl: NgControl) {
-  }
-}

package/src/directive/disable-control/disable-control.module.ts

@@ -1,16 +0,0 @@
-import {NgModule} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {DisableControlDirective} from './disable-control.directive';
-
-
-@NgModule({
-  declarations: [DisableControlDirective],
-  imports: [
-    CommonModule
-  ],
-  exports: [
-    DisableControlDirective
-  ]
-})
-export class DisableControlModule {
-}

package/src/directive/disable-control/public-api.ts

@@ -1,2 +0,0 @@
-export * from './disable-control.module';
-export * from './disable-control.directive';

package/src/directive/drag-sort/DragSort.stories.ts

@@ -1,60 +0,0 @@
-import { Meta } from '@storybook/angular/types-6-0';
-import { withKnobs } from '@storybook/addon-knobs';
-import { DragSortModule } from './drag-sort.module';
-import { DragSortEvent } from './drag-sort-event';
-import { ArrayUtil } from '../../common/util/array-util';
-
-export default {
-  title: 'Directive/DragSort',
-  decorators: [withKnobs],
-} as Meta;
-
-export const dragSort = () => ({
-  moduleMetadata: {
-    imports: [DragSortModule],
-  },
-  props: {
-    items: [
-      {
-        id: 0,
-        name: 0,
-      },
-      {
-        id: 1,
-        name: 1,
-      },
-      {
-        id: 2,
-        name: 2,
-      },
-      {
-        id: 3,
-        name: 3,
-      },
-    ],
-    update: (event: DragSortEvent<any>, list: any[]) => {
-      return ArrayUtil.moveItem(list, event.previousIndex, event.newIndex);
-    },
-  },
-  template: `<div tetaDragSortContainer
-                  (dragSorted)="items = update($event, items)"
-                  [dragSortList]="items"
-                  class="padding-10 margin-10 row row_auto border border-text-5">
-              <div [tetaDragSortItem]="item"
-                    *ngFor="let item of items"
-                    class="padding-4 border border-text-10">
-                {{item.name}}
-              </div>
-            </div>
-            <div tetaDragSortContainer
-                  (dragSorted)="items = update($event, items)"
-                  [dragSortList]="items"
-                  class="padding-10 margin-10 column row_auto border border-text-5">
-              <div [tetaDragSortItem]="item"
-                    [dragSortDirection]="'vertical'"
-                    *ngFor="let item of items"
-                    class="padding-4 border border-text-10">
-                {{item.name}}
-              </div>
-            </div>`,
-});

package/src/directive/drag-sort/drag-sort-container.directive.spec.ts

@@ -1,8 +0,0 @@
-import { DragSortContainerDirective } from './drag-sort-container.directive';
-
-describe('DragSortContainerDirective', () => {
-  it('should create an instance', () => {
-    const directive = new DragSortContainerDirective();
-    expect(directive).toBeTruthy();
-  });
-});

package/src/directive/drag-sort/drag-sort-container.directive.ts

@@ -1,71 +0,0 @@
-import {
-  // ContentChildren,
-  Directive,
-  EventEmitter,
-  HostListener,
-  Input,
-  Output,
-  // QueryList,
-} from '@angular/core';
-import {DragSortEvent} from './drag-sort-event';
-// import {DragSortItemDirective} from './drag-sort-item.directive';
-
-@Directive({
-  selector: '[tetaDragSortContainer]',
-})
-export class DragSortContainerDirective<T> {
-  @Input() dragSortList: T[];
-  @Output() dragSorted: EventEmitter<DragSortEvent<T>> = new EventEmitter<DragSortEvent<T>>();
-
-  // @ContentChildren(DragSortItemDirective, {descendants: true})
-  // private items: QueryList<DragSortItemDirective<T>>;
-  private _dragItem: T;
-
-  constructor() {
-  }
-
-  @HostListener('drop', ['$event']) drop(event: DragEvent): void {
-    event.stopPropagation();
-    event.preventDefault();
-  }
-
-  setDragItem(item: T) {
-    this._dragItem = item;
-  }
-
-  getDragItem(): T {
-    return this._dragItem;
-  }
-
-  getList(): T[] {
-    return this.dragSortList;
-  }
-
-  setList(list: T[]) {
-    this.dragSortList = list;
-  }
-
-  updateSortOrder(source: T, target: T, insertBefore: boolean) {
-    if (source === target) {
-      return;
-    }
-    const list = this.getList();
-    const sourceIndex = list.indexOf(source);
-    const targetIndex = list.indexOf(target);
-    if (
-      (insertBefore && sourceIndex + 1 === targetIndex) ||
-      (!insertBefore && sourceIndex === targetIndex + 1)
-    ) {
-      return;
-    }
-    const newIndex = list.indexOf(target) + (insertBefore ? 0 : 1);
-
-    this.dragSorted.emit({
-      list,
-      source,
-      target,
-      newIndex,
-      previousIndex: sourceIndex,
-    });
-  }
-}

package/src/directive/drag-sort/drag-sort-event.spec.ts

@@ -1,7 +0,0 @@
-import { DragSortEvent } from './drag-sort-event';
-
-describe('DragSortResult', () => {
-  it('should create an instance', () => {
-    expect(new DragSortEvent()).toBeTruthy();
-  });
-});

package/src/directive/drag-sort/drag-sort-event.ts

@@ -1,7 +0,0 @@
-export interface DragSortEvent<T> {
-  previousIndex: number;
-  newIndex: number;
-  source: T;
-  target: T;
-  list: T[];
-}

package/src/directive/drag-sort/drag-sort-item.directive.spec.ts

@@ -1,8 +0,0 @@
-import { DragSortItemDirective } from './drag-sort-item.directive';
-
-describe('DragSortItemDirective', () => {
-  it('should create an instance', () => {
-    const directive = new DragSortItemDirective();
-    expect(directive).toBeTruthy();
-  });
-});