@tetacom/ng-components 1.0.25 → 1.0.26

package/src/component/modal/modal-samples/modal-example/modal-example.component.ts

@@ -1,18 +0,0 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
-import { ModalCloseReason } from '../../model/modal-close-reason.enum';
-import { DynamicData } from '../../../../common/contract/dynamic-data';
-import { CurrentModal } from '../../model/current-modal';
-
-@Component({
-  selector: 'teta-modal-example',
-  templateUrl: './modal-example.component.html',
-  styleUrls: ['./modal-example.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class ModalExampleComponent implements OnInit {
-  closeReason = ModalCloseReason;
-
-  constructor(public modal: CurrentModal, private data: DynamicData) {}
-
-  ngOnInit(): void {}
-}

package/src/component/modal/modal-samples/modal-from-component/modal-from-component.component.html

@@ -1,3 +0,0 @@
-<button teta-button [palette]="'primary'" (click)="create()" [tetaIconSprite]="'assets/icons.svg'">
-  Create modal
-</button>

package/src/component/modal/modal-samples/modal-from-component/modal-from-component.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ModalFromComponentComponent } from './modal-from-component.component';
-
-describe('ModalFromComponentComponent', () => {
-  let component: ModalFromComponentComponent;
-  let fixture: ComponentFixture<ModalFromComponentComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ ModalFromComponentComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ModalFromComponentComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/component/modal/modal-samples/modal-from-component/modal-from-component.component.ts

@@ -1,31 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  OnInit,
-} from '@angular/core';
-import { ModalExampleComponent } from '../modal-example/modal-example.component';
-import { ModalService } from '../../modal.service';
-
-@Component({
-  selector: 'teta-modal-from-component',
-  templateUrl: './modal-from-component.component.html',
-  styleUrls: ['./modal-from-component.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class ModalFromComponentComponent implements OnInit {
-  @Input() name: string;
-  @Input() description: string;
-
-  constructor(private modal: ModalService) {}
-
-  ngOnInit(): void {}
-
-  create(): void {
-    const modal = this.modal.create(ModalExampleComponent, {
-      name: this.name,
-      description: this.description,
-    });
-    modal.onClose.subscribe((_) => {});
-  }
-}

package/src/component/modal/modal-samples/modal-from-template/modal-from-template.component.html

@@ -1,31 +0,0 @@
-<ng-template #content let-data="data" let-modal="modal">
-  <div class="column" [tetaIconSprite]="'assets/icons.svg'">
-    <teta-toolbar [palette]="'background'" class="justify-content-between">
-      <span>Создать проект</span>
-      <teta-icon [name]="'closeBig'" (click)="modal.close({reason: closeReason.exit })"></teta-icon>
-    </teta-toolbar>
-    <div class="padding-3 column">
-      <div class="margin-v-2">
-        <input class="input" type="text" [(ngModel)]="data.name" placeholder="'Название'">
-      </div>
-      <div class="margin-v-2">
-        <input class="input" type="text" [(ngModel)]="data.description" placeholder="'Описание'">
-      </div>
-    </div>
-    <teta-toolbar [palette]="'panel'">
-      <button teta-button
-              [palette]="'primary'"
-              (click)="modal.close({reason: closeReason.exit })">
-        Отменить
-      </button>
-      <button teta-button
-              [palette]="'primary'"
-              (click)="modal.close({reason: closeReason.resolve })">
-        Создать
-      </button>
-    </teta-toolbar>
-  </div>
-</ng-template>
-<button teta-button [palette]="'primary'" (click)="create(content)">
-  Create modal
-</button>

package/src/component/modal/modal-samples/modal-from-template/modal-from-template.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ModalFromTemplateComponent } from './modal-from-template.component';
-
-describe('ModalFromTemplateComponent', () => {
-  let component: ModalFromTemplateComponent;
-  let fixture: ComponentFixture<ModalFromTemplateComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ ModalFromTemplateComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ModalFromTemplateComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/component/modal/modal-samples/modal-from-template/modal-from-template.component.ts

@@ -1,34 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  OnInit,
-  TemplateRef,
-} from '@angular/core';
-import { ModalCloseReason } from '../../model/modal-close-reason.enum';
-import { ModalService } from '../../modal.service';
-
-@Component({
-  selector: 'app-modal-from-template',
-  templateUrl: './modal-from-template.component.html',
-  styleUrls: ['./modal-from-template.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class ModalFromTemplateComponent implements OnInit {
-  @Input() name: string;
-  @Input() description: string;
-
-  closeReason = ModalCloseReason;
-
-  constructor(private modal: ModalService) {}
-
-  ngOnInit(): void {}
-
-  create(template: TemplateRef<any>): void {
-    const modal = this.modal.create(template, {
-      name: this.name,
-      description: this.description,
-    });
-    modal.onClose.subscribe((_) => {});
-  }
-}

package/src/component/modal/modal-samples/modal-samples.module.ts

@@ -1,43 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ModalFromComponentComponent } from './modal-from-component/modal-from-component.component';
-import { ModalFromTemplateComponent } from './modal-from-template/modal-from-template.component';
-import { FormsModule } from '@angular/forms';
-import { ModalExampleComponent } from './modal-example/modal-example.component';
-import { ModalContainerComponent } from '../modal-container/modal-container.component';
-import { ModalModule } from '../modal.module';
-import { ToolbarModule } from '../../toolbar/toolbar.module';
-import { ButtonModule } from '../../button/button.module';
-import { IconModule } from '../../icon/icon.module';
-import { AlertSampleComponent } from './alert-sample/alert-sample.component';
-import { DialogComponent } from '../dialog/dialog.component';
-
-@NgModule({
-  declarations: [
-    ModalFromComponentComponent,
-    ModalFromTemplateComponent,
-    ModalExampleComponent,
-    AlertSampleComponent,
-  ],
-  exports: [
-    ModalFromComponentComponent,
-    ModalFromTemplateComponent,
-    ModalExampleComponent,
-    AlertSampleComponent,
-  ],
-  imports: [
-    CommonModule,
-    ModalModule,
-    ButtonModule,
-    ToolbarModule,
-    FormsModule,
-    IconModule,
-  ],
-  entryComponents: [
-    ModalContainerComponent,
-    DialogComponent,
-    ModalExampleComponent,
-    AlertSampleComponent,
-  ],
-})
-export class ModalSamplesModule {}

package/src/component/modal/modal.module.ts

@@ -1,28 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ModalContainerComponent } from './modal-container/modal-container.component';
-import { DialogComponent } from './dialog/dialog.component';
-import { ToolbarModule } from '../toolbar/toolbar.module';
-import { ButtonModule } from '../button/button.module';
-import { TRANSLOCO_SCOPE, TranslocoModule } from '@ngneat/transloco';
-import { IconModule } from '../icon/icon.module';
-
-@NgModule({
-  declarations: [ModalContainerComponent, DialogComponent],
-  exports: [ModalContainerComponent, DialogComponent],
-  imports: [
-    CommonModule,
-    ToolbarModule,
-    ButtonModule,
-    TranslocoModule,
-    IconModule,
-  ],
-  providers: [
-    {
-      provide: TRANSLOCO_SCOPE,
-      useValue: { scope: 'common', alias: 'common' },
-      multi: true,
-    },
-  ],
-})
-export class ModalModule {}

package/src/component/modal/modal.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { ModalService } from './modal.service';
-
-describe('ModalService', () => {
-  let service: ModalService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(ModalService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

package/src/component/modal/modal.service.ts

@@ -1,153 +0,0 @@
-import { Inject, Injectable, Injector, TemplateRef, Type } from '@angular/core';
-import { ModalInstance } from './model/modal-instance';
-import { Subject } from 'rxjs';
-import { DynamicComponentService } from '../../common/service/dynamic-component.service';
-import { ModalCloseReason } from './model/modal-close-reason.enum';
-import { IModalConfig } from './model/i-modal-config';
-import { CurrentModal } from './model/current-modal';
-import { DynamicData } from '../../common/contract/dynamic-data';
-import { ModalContainerComponent } from './modal-container/modal-container.component';
-import { IModalResult } from './model/i-modal-result';
-import { DOCUMENT } from '@angular/common';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class ModalService {
-  private _stack: ModalInstance[] = [];
-  private _modalChanged = new Subject<void>();
-  private readonly _container: any;
-
-  constructor(
-    @Inject(DOCUMENT)
-    private _document: any,
-    private _injector: Injector,
-    private _factory: DynamicComponentService
-  ) {
-    this._container = this._document.body;
-
-    this._modalChanged.subscribe(() => {
-      if (this._stack && this._stack.length > 0) {
-        this.focus(this._stack[this._stack.length - 1]);
-      }
-    });
-  }
-
-  closeAll(): void {
-    if (this._stack && this._stack.length > 0) {
-      this._stack.forEach((instance: ModalInstance) => {
-        instance.close({
-          reason: ModalCloseReason.exit,
-        });
-      });
-    }
-  }
-
-  create(
-    content: string | TemplateRef<any> | Type<any>,
-    data?: any,
-    config?: IModalConfig,
-    injector?: Injector
-  ): ModalInstance {
-    if (content === null || content === undefined) {
-      throw new Error('Specify template or component to render');
-    }
-    if (config === null || config === undefined) {
-      config = Object.assign(
-        {
-          backdrop: true,
-          class: [],
-          esc: true,
-        },
-        config
-      );
-    }
-    if (injector === null || injector === undefined) {
-      injector = this._injector;
-    }
-    const currentModal = new CurrentModal();
-    const modalData = new DynamicData(data);
-
-    injector = this.getInjector(currentModal, modalData, injector);
-    const contentInstance = this._factory.createContent(
-      content,
-      injector,
-      this.getContext(content, modalData, currentModal)
-    );
-    const window = this._factory.createComponent(
-      ModalContainerComponent,
-      contentInstance,
-      injector,
-      this._container
-    );
-    window.instance.config = config;
-
-    const instance = new ModalInstance(window, contentInstance);
-    currentModal.close = instance.close;
-    this.register(instance);
-    return instance;
-  }
-
-  private getContext(
-    content: string | TemplateRef<any> | Type<any>,
-    context: any,
-    currentModal: CurrentModal
-  ): any {
-    if (content instanceof TemplateRef) {
-      return {
-        $implicit: {
-          modal: currentModal,
-          data: context,
-        },
-        modal: currentModal,
-        data: context,
-        close: (result: IModalResult): void => {
-          currentModal.close(result);
-        },
-      };
-    }
-    return context;
-  }
-
-  private getInjector(
-    currentModal: CurrentModal,
-    data: DynamicData,
-    parent: Injector
-  ): Injector {
-    return Injector.create({
-      providers: [
-        {
-          provide: CurrentModal,
-          useValue: currentModal,
-        },
-        {
-          provide: DynamicData,
-          useValue: data,
-        },
-      ],
-      parent,
-    });
-  }
-
-  private register(instance: ModalInstance): void {
-    this._stack.push(instance);
-    this._modalChanged.next();
-    instance.onClose.subscribe(() => this.unregister(instance));
-  }
-
-  private unregister = (instance: ModalInstance) => {
-    const index = this._stack.indexOf(instance);
-    if (index > -1) {
-      this._stack.splice(index, 1);
-      this._modalChanged.next();
-    }
-  };
-
-  private focus(instance: ModalInstance): void {
-    if (instance && instance.window && instance.window.location.nativeElement) {
-      setTimeout(() => {
-        instance.window.location.nativeElement.focus();
-      }, 0);
-    }
-  }
-}

package/src/component/modal/model/current-modal.ts

@@ -1,5 +0,0 @@
-import {IModalResult} from './i-modal-result';
-
-export class CurrentModal {
-  close: (result?: IModalResult) => void;
-}

package/src/component/modal/model/i-modal-config.ts

@@ -1,12 +0,0 @@
-import { Observable } from 'rxjs';
-
-export interface IModalConfig {
-  backdrop?: boolean;
-  closeOnBackdropClick?: boolean;
-  resizable?: boolean;
-  draggable?: boolean;
-  class?: string[];
-  esc?: boolean;
-  beforeClose?: Observable<any>;
-  beforeOpen?: Observable<any>;
-}

package/src/component/modal/model/i-modal-result.ts

@@ -1,13 +0,0 @@
-import {ModalCloseReason} from './modal-close-reason.enum';
-
-export interface IModalResult {
-  /**
-   * Любые другие данные которые пользователь желает вернуть при закрытии окна
-   */
-  [key: string]: any;
-
-  /**
-   * Причина закрытия окна
-   */
-  reason: ModalCloseReason;
-}

package/src/component/modal/model/modal-close-reason.enum.ts

@@ -1,6 +0,0 @@
-export enum ModalCloseReason {
-  resolve,
-  exit,
-  backdrop,
-  esc,
-}

package/src/component/modal/model/modal-instance.ts

@@ -1,44 +0,0 @@
-import { Observable, Subject } from 'rxjs';
-import { IModalResult } from './i-modal-result';
-import { ComponentRef } from '@angular/core';
-import { TetaContentRef } from '../../../common/contract/teta-content-ref';
-import { ModalContainerComponent } from '../modal-container/modal-container.component';
-
-export class ModalInstance {
-  onClose: Observable<IModalResult>;
-  private _onClose: Subject<IModalResult> = new Subject<IModalResult>();
-
-  constructor(
-    private _window: ComponentRef<ModalContainerComponent>,
-    private _content: TetaContentRef
-  ) {
-    this.onClose = this._onClose.asObservable();
-    if (this._window && this._window.instance) {
-      this._window.instance.closeEvent.subscribe((event: IModalResult) => {
-        this.close(event);
-      });
-    }
-  }
-
-  get window(): ComponentRef<ModalContainerComponent> {
-    return this._window;
-  }
-
-  get component(): ComponentRef<any> | null {
-    return this._content.componentRef ? this._content.componentRef : null;
-  }
-
-  close = (event?: IModalResult) => {
-    this._onClose.next(event);
-    this._onClose.complete();
-    this.destroy();
-  };
-
-  private destroy(): void {
-    this._window.destroy();
-
-    if (this._content && this._content.viewRef) {
-      this._content.viewRef.destroy();
-    }
-  }
-}

package/src/component/modal/public-api.ts

@@ -1,11 +0,0 @@
-export * from './modal.module';
-export * from './modal.service';
-export * from './dialog.service';
-export * from './dialog/dialog.component';
-export * from './modal-container/modal-container.component';
-
-export * from './model/current-modal';
-export * from './model/i-modal-result';
-export * from './model/modal-close-reason.enum';
-export * from './model/i-modal-config';
-export * from './model/modal-instance';

package/src/component/pager/Pager.stories.ts

@@ -1,19 +0,0 @@
-import {Meta} from '@storybook/angular/types-6-0';
-import {withKnobs} from '@storybook/addon-knobs';
-import {PagerModule} from './pager.module';
-import {IconModule} from '../icon/icon.module';
-
-export default {
-  title: 'Component/Pager',
-  decorators: [withKnobs],
-  moduleMetadata: {
-    imports: [PagerModule]
-  }
-} as Meta;
-
-export const pagerSample = () => ({
-  moduleMetadata: {
-    imports: [PagerModule, IconModule]
-  },
-  template: `<teta-pager [tetaIconSprite]="'assets/icons.svg'"></teta-pager>`,
-});

package/src/component/pager/model/pager-state.spec.ts

@@ -1,7 +0,0 @@
-import { PagerState } from './pager-state';
-
-describe('PagerState', () => {
-  it('should create an instance', () => {
-    expect(new PagerState()).toBeTruthy();
-  });
-});

package/src/component/pager/model/pager-state.ts

@@ -1,80 +0,0 @@
-export class PagerState {
-  /**
-   * Текущая страница
-   */
-  page = 0;
-
-  /**
-   * Количество записей на странице
-   */
-  pageSize = 30;
-  /**
-   * Количество страниц
-   */
-  count: number;
-  /**
-   * Количество записей
-   */
-  totalCount: number;
-  /**
-   * первая видимая страница
-   */
-  start: number;
-  /**
-   * Последняя видимая страница
-   */
-  end: number;
-  /**
-   * Список страниц
-   */
-  pages: number[];
-
-  /**
-   * Инициализация из анонимного объекта
-   */
-  constructor(options?: {
-    page?: number;
-    pageSize?: number;
-    count?: number;
-    totalCount?: number;
-  }) {
-    if (options) {
-      this.pageSize = options.pageSize || 30;
-      this.count = options.count !== null && options.count !== undefined ? options.count : this.count;
-      this.totalCount = options.totalCount !== null && options.totalCount !== undefined ? options.totalCount : this.totalCount;
-      this.page = options.page !== null && options.page !== undefined ? options.page : 0;
-      this.createPages();
-    }
-  }
-
-  createPages() {
-    if (this.page > this.count) {
-      this.page = this.count > 0 ? this.count - 1 : 0;
-    }
-
-    let start = 0;
-    let end = this.count - 1;
-    if (this.count > 5) {
-      start = this.page - 2;
-      end = this.page + 2;
-      if (start < 0) {
-        start = 0;
-        end = 4;
-      }
-      const rightShift = this.count - 1 - end;
-      if (rightShift < 0) {
-        start = this.count - 5;
-        end = this.count - 1;
-      }
-    }
-
-    const arr = [];
-    for (let i = start; i <= end; i++) {
-      arr.push(i);
-    }
-
-    this.start = start;
-    this.end = end;
-    this.pages = arr;
-  }
-}

package/src/component/pager/pager/pager.component.html

@@ -1 +0,0 @@
-<p>pager works!</p>

package/src/component/pager/pager/pager.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { PagerComponent } from './pager.component';
-
-describe('PagerComponent', () => {
-  let component: PagerComponent;
-  let fixture: ComponentFixture<PagerComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ PagerComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(PagerComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/component/pager/pager/pager.component.ts

@@ -1,13 +0,0 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'teta-pager',
-  templateUrl: './pager.component.html',
-  styleUrls: ['./pager.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class PagerComponent implements OnInit {
-  constructor() {}
-
-  ngOnInit(): void {}
-}