@tetacom/ng-components 1.0.25 → 1.0.26

package/src/Introduction.stories.mdx

@@ -1,178 +0,0 @@
-import { Meta } from '@storybook/addon-docs';
-
-<Meta title="Example/Introduction" />
-
-<style>{`
-  .subheading {
-    --mediumdark: '#999999';
-    font-weight: 900;
-    font-size: 13px;
-    color: #999;
-    letter-spacing: 6px;
-    line-height: 24px;
-    text-transform: uppercase;
-    margin-bottom: 12px;
-    margin-top: 40px;
-  }
-
-  .link-list {
-    display: grid;
-    grid-template-columns: 1fr;
-    grid-template-rows: 1fr 1fr;
-    row-gap: 10px;
-  }
-
-  @media (min-width: 620px) {
-    .link-list {
-      row-gap: 20px;
-      column-gap: 20px;
-      grid-template-columns: 1fr 1fr;
-    }
-  }
-
-  @media all and (-ms-high-contrast:none) {
-  .link-list {
-      display: -ms-grid;
-      -ms-grid-columns: 1fr 1fr;
-      -ms-grid-rows: 1fr 1fr;
-    }
-  }
-
-  .link-item {
-    display: block;
-    padding: 20px 30px 20px 15px;
-    border: 1px solid #00000010;
-    border-radius: 5px;
-    transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;
-    color: #333333;
-    display: flex;
-    align-items: flex-start;
-  }
-
-  .link-item:hover {
-    border-color: #1EA7FD50;
-    transform: translate3d(0, -3px, 0);
-    box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;
-  }
-
-  .link-item:active {
-    border-color: #1EA7FD;
-    transform: translate3d(0, 0, 0);
-  }
-
-  .link-item strong {
-    font-weight: 700;
-    display: block;
-    margin-bottom: 2px;
-  }
-
-  .link-item img {
-    height: 40px;
-    width: 40px;
-    margin-right: 15px;
-    flex: none;
-  }
-
-  .link-item span {
-    font-size: 14px;
-    line-height: 20px;
-  }
-
-  .tip {
-    display: inline-block;
-    border-radius: 1em;
-    font-size: 11px;
-    line-height: 12px;
-    font-weight: 700;
-    background: #E7FDD8;
-    color: #66BF3C;
-    padding: 4px 12px;
-    margin-right: 10px;
-    vertical-align: top;
-  }
-
-  .tip-wrapper {
-    font-size: 13px;
-    line-height: 20px;
-    margin-top: 40px;
-    margin-bottom: 40px;
-  }
-
-  .tip-wrapper code {
-    font-size: 12px;
-    display: inline-block;
-  }
-
-
-`}</style>
-
-# Welcome to Storybook
-
-Storybook helps you build UI components in isolation from your app's business logic, data, and context.
-That makes it easy to develop hard-to-reach states. Save these UI states as **stories** to revisit during development, testing, or QA.
-
-Browse example stories now by navigating to them in the sidebar.
-View their code in the `src/storybook-examples` directory to learn how they work.
-We recommend building UIs with a [**component-driven**](https://componentdriven.org) process starting with atomic components and ending with pages.
-
-<div class="subheading">Configure</div>
-
-<div class="link-list">
-  <a class="link-item" href="https://storybook.js.org/docs/react/api/presets" target="_blank">
-    <span>
-      <strong>Presets for popular tools</strong>
-      Easy setup for TypeScript, SCSS and more.
-    </span>
-  </a>
-  <a class="link-item" href="https://storybook.js.org/docs/react/configure/webpack" target="_blank">
-    <span>
-      <strong>Build configuration</strong>
-      How to customize webpack and Babel
-    </span>
-  </a>
-  <a class="link-item" href="https://storybook.js.org/docs/react/configure/styling-and-css" target="_blank">
-    <span>
-      <strong>Styling</strong>
-      How to load and configure CSS libraries
-    </span>
-  </a>
-  <a class="link-item" href="https://storybook.js.org/docs/react/get-started/setup#configure-storybook-for-your-stack" target="_blank">
-    <span>
-      <strong>Data</strong>
-      Providers and mocking for data libraries
-    </span>
-  </a>
-</div>
-
-<div class="subheading">Learn</div>
-
-<div class="link-list">
-  <a class="link-item" href="https://storybook.js.org/docs" target="_blank">
-    <span>
-      <strong>Storybook documentation</strong>
-      Configure, customize, and extend
-    </span>
-  </a>
-  <a class="link-item" href="https://www.learnstorybook.com" target="_blank">
-    <span>
-      <strong>In-depth guides</strong>
-      Best practices from leading teams
-    </span>
-  </a>
-  <a class="link-item" href="https://github.com/storybookjs/storybook" target="_blank">
-    <span>
-      <strong>GitHub project</strong>
-      View the source and add issues
-    </span>
-  </a>
-  <a class="link-item" href="https://discord.gg/UUt2PJb" target="_blank">
-    <span>
-      <strong>Discord chat</strong>
-      Chat with maintainers and the community
-    </span>
-  </a>
-</div>
-
-<div class="tip-wrapper">
-  <span class="tip">Tip</span>Edit the Markdown in <code>src/storybook-examples/welcome.mdx</code>
-</div>

package/src/common/contract/auto-close-ignore-case.ts

@@ -1 +0,0 @@
-export type AutoCloseIgnoreCase = 'esc' | 'enter' | 'inside' | 'outside';

package/src/common/contract/constructor-type.ts

@@ -1 +0,0 @@
-export type Ctor<T> = new (...params: any[]) => T;

package/src/common/contract/dynamic-data.ts

@@ -1,11 +0,0 @@
-export class DynamicData {
-  [key: string]: any;
-
-  constructor(value: { [key: string]: any }) {
-    for (const key in value) {
-      if (value.hasOwnProperty(key)) {
-        this[key] = value[key];
-      }
-    }
-  }
-}

package/src/common/contract/i-dictionary.ts

@@ -1,3 +0,0 @@
-export interface IDictionary<T> {
-  [key: string]: T;
-}

package/src/common/contract/i-id-name.ts

@@ -1,6 +0,0 @@
-export interface IIdName<T> {
-  [key: string]: any;
-  id: T;
-  name: string;
-  parentId?: T;
-}

package/src/common/contract/i-rect.ts

@@ -1,8 +0,0 @@
-export interface IRect {
-  top?: number;
-  bottom?: number;
-  left?: number;
-  right?: number;
-  maxHeight?: number;
-  minWidth?: number;
-}

package/src/common/contract/i-tree-data.ts

@@ -1,4 +0,0 @@
-export interface ITreeData {
-  children?: ITreeData[] | undefined | null;
-  [key: string]: any;
-}

package/src/common/contract/public-api.ts

@@ -1,8 +0,0 @@
-export * from './constructor-type';
-export * from './dynamic-data';
-export * from './i-id-name';
-export * from './i-dictionary';
-export * from './i-tree-data';
-export * from './i-rect';
-export * from './teta-content-ref';
-export * from './auto-close-ignore-case';

package/src/common/contract/teta-content-ref.ts

@@ -1,6 +0,0 @@
-import {ComponentRef, ViewRef} from '@angular/core';
-
-export class TetaContentRef {
-  constructor(public nodes: any[], public viewRef?: ViewRef, public componentRef?: ComponentRef<any>) {
-  }
-}

package/src/common/enum/align.enum.ts

@@ -1,8 +0,0 @@
-export enum Align {
-  left,
-  right,
-  center,
-  auto,
-  fitWidth,
-  minWidth,
-}

package/src/common/enum/public-api.ts

@@ -1,3 +0,0 @@
-export * from './teta-size.enum';
-export * from './align.enum';
-export * from './vertical-align.enum';

package/src/common/enum/teta-size.enum.ts

@@ -1,7 +0,0 @@
-export enum TetaSize {
-  XS,
-  S,
-  M,
-  L,
-  XL
-}

package/src/common/enum/vertical-align.enum.ts

@@ -1,6 +0,0 @@
-export enum VerticalAlign {
-  top,
-  bottom,
-  center,
-  auto
-}

package/src/common/public-api.ts

@@ -1,4 +0,0 @@
-export * from './contract/public-api';
-export * from './enum/public-api';
-export * from './service/public-api';
-export * from './util/public-api';

package/src/common/service/click.service.spec.ts

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

package/src/common/service/click.service.ts

@@ -1,16 +0,0 @@
-import { Inject, Injectable } from '@angular/core';
-import { DOCUMENT } from '@angular/common';
-import { fromEvent, Observable } from 'rxjs';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class ClickService {
-  click: Observable<MouseEvent>;
-  contextMenu: Observable<MouseEvent>;
-
-  constructor(@Inject(DOCUMENT) protected _document: any) {
-    this.click = fromEvent(this._document, 'click');
-    this.contextMenu = fromEvent(this._document, 'contextmenu');
-  }
-}

package/src/common/service/dynamic-component.service.spec.ts

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

package/src/common/service/dynamic-component.service.ts

@@ -1,134 +0,0 @@
-import {
-  ApplicationRef,
-  ComponentFactoryResolver,
-  ComponentRef,
-  Injectable,
-  Injector,
-  Renderer2,
-  RendererFactory2,
-  TemplateRef,
-  Type,
-} from '@angular/core';
-import { TetaContentRef } from '../contract/teta-content-ref';
-import { DynamicData } from '../contract/dynamic-data';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class DynamicComponentService {
-  private _renderer: Renderer2;
-
-  constructor(
-    private _componentFactoryResolver: ComponentFactoryResolver,
-    private _rendererFactory: RendererFactory2,
-    private _appRef: ApplicationRef
-  ) {
-    this._renderer = this._rendererFactory.createRenderer(null, null);
-  }
-
-  createComponent<T>(
-    component: Type<T>,
-    contentRef: TetaContentRef,
-    injector: Injector,
-    container: any
-  ): ComponentRef<T> {
-    const componentRef = this._componentFactoryResolver
-      .resolveComponentFactory(component)
-      .create(injector, contentRef.nodes);
-    this._appRef.attachView(componentRef.hostView);
-    container.appendChild(componentRef.location.nativeElement);
-    return componentRef;
-  }
-
-  createContent(
-    content: string | TemplateRef<any> | Type<any>,
-    injector: Injector,
-    context?: any
-  ): TetaContentRef {
-    if (content === null || content === undefined) {
-      throw new Error('Content is undefined');
-    }
-    if (typeof content === 'string') {
-      return this.fromString(content);
-    } else if (content instanceof TemplateRef) {
-      return this.fromTemplate(content, context);
-    } else {
-      return this.fromComponent(content, injector, context);
-    }
-  }
-
-  destroy<T>(
-    component: ComponentRef<T>,
-    content: TetaContentRef,
-    container: HTMLElement
-  ): void {
-    if (component) {
-      this._appRef.detachView(component.hostView);
-      component.destroy();
-    }
-    if (content && content.viewRef) {
-      content.viewRef.destroy();
-    }
-    content = null;
-  }
-
-  getContext(
-    content: string | TemplateRef<any> | Type<any>,
-    context: any
-  ): any {
-    if (content instanceof TemplateRef) {
-      return {
-        $implicit: context,
-        data: context,
-      };
-    }
-    return context;
-  }
-
-  getInjector(data: DynamicData, parent: Injector): Injector {
-    return Injector.create({
-      providers: [
-        {
-          provide: DynamicData,
-          useValue: data,
-        },
-      ],
-      parent,
-    });
-  }
-
-  private fromString(content: string): TetaContentRef {
-    return new TetaContentRef([[this._renderer.createText(`${content}`)]]);
-  }
-
-  private fromTemplate(
-    content: TemplateRef<any>,
-    context: any
-  ): TetaContentRef {
-    const viewRef = content.createEmbeddedView(context);
-    this._appRef.attachView(viewRef);
-    return new TetaContentRef([viewRef.rootNodes], viewRef);
-  }
-
-  private fromComponent(
-    content: any,
-    injector: Injector,
-    context: any
-  ): TetaContentRef {
-    const componentFactory =
-      this._componentFactoryResolver.resolveComponentFactory<any>(content);
-    const componentRef = componentFactory.create(injector);
-    for (const key in context) {
-      if (context.hasOwnProperty(key)) {
-        componentRef.instance[key] = context[key];
-      }
-    }
-    const componentNativeEl = componentRef.location.nativeElement;
-    this._appRef.attachView(componentRef.hostView);
-    return new TetaContentRef(
-      [[componentNativeEl]],
-      componentRef.hostView,
-      componentRef
-    );
-  }
-}

package/src/common/service/overlay-container.service.spec.ts

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

package/src/common/service/overlay-container.service.ts

@@ -1,37 +0,0 @@
-import {Inject, Injectable, OnDestroy} from '@angular/core';
-import {DOCUMENT} from '@angular/common';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class OverlayContainerService implements OnDestroy {
-  private _containerClass = 'overlay-container';
-  private _container: HTMLElement;
-
-  constructor(@Inject(DOCUMENT) private document$: any) {
-  }
-
-  getContainer(): HTMLElement {
-    if (!this._container) {
-      this.createContainer();
-    }
-    return this._container;
-  }
-
-  private createContainer(): void {
-    const container = this.document$.createElement('div');
-    container.classList.add(this._containerClass);
-    this.document$.body.appendChild(container);
-    this._container = container;
-  }
-
-  private removeContainer(): void {
-    if (this._container && this._container.parentNode) {
-      this._container.parentNode.removeChild(this._container);
-    }
-  }
-
-  ngOnDestroy(): void {
-    this.removeContainer();
-  }
-}

package/src/common/service/public-api.ts

@@ -1,3 +0,0 @@
-export * from './click.service';
-export * from './dynamic-component.service';
-export * from './overlay-container.service';

package/src/common/util/array-util.ts

@@ -1,140 +0,0 @@
-export class ArrayUtil {
-  public static asArray<T>(value: T | T[]): T[] {
-    if (value === null || value === undefined) {
-      return [];
-    }
-    if (value instanceof Array) {
-      return value;
-    }
-    return [value];
-  }
-
-  public static flatten(
-    data: any[],
-    children?: string | ((item: any) => any[]),
-    onlyLeafs?: boolean
-  ): any[] {
-    const result: any[] = [];
-    data.forEach((child) => {
-      let childItems: any[];
-      if (children) {
-        if (typeof children === 'string') {
-          childItems = child[children];
-        }
-        if (typeof children === 'function') {
-          childItems = children(child);
-        }
-      } else {
-        childItems = child.children;
-      }
-      if (
-        childItems !== null &&
-        childItems !== undefined &&
-        childItems.length > 0
-      ) {
-        if (!onlyLeafs) {
-          result.push(child);
-        }
-        result.push(...ArrayUtil.flatten(childItems, children, onlyLeafs));
-      } else {
-        result.push(child);
-      }
-    });
-    return result;
-  }
-
-  static findRecursive(
-    tree: any[],
-    comparer: (iterableNode: any) => boolean,
-    children: string = 'children'
-  ): any {
-    const found = tree.find((x) => comparer(x));
-    if (found !== null && found !== undefined) {
-      return found;
-    }
-    for (let i = 0, l = tree.length; i < l; i++) {
-      const item = tree[i];
-      if (item[children] && item[children].length) {
-        const res = ArrayUtil.findRecursive(item[children], comparer);
-        if (res !== null && res !== undefined) {
-          return res;
-        }
-      }
-    }
-    return null;
-  }
-
-  static filterRecursive(
-    array: any[],
-    filter: (item: any) => boolean,
-    children: string = 'children',
-    keepChildren: boolean = true
-  ): any {
-    const result = [];
-    if (array && array.length) {
-      for (const item of array) {
-        const resultItem = Object.assign({}, item);
-        if (filter(resultItem)) {
-          result.push(resultItem);
-          if (!keepChildren) {
-            resultItem[children] = [];
-            break;
-          }
-        } else if (item[children] && item[children].length > 0) {
-          resultItem[children] = [];
-          const found = ArrayUtil.filterRecursive(
-            item[children],
-            filter,
-            children,
-            keepChildren
-          );
-          if (found?.length > 0) {
-            resultItem[children] = found;
-            result.push(resultItem);
-          }
-        }
-      }
-    }
-    return result;
-  }
-
-  static distinct<T>(array: T[], comparator: (item: T) => any): T[] {
-    const result: T[] = [];
-    if (array && array.length) {
-      for (const item of array) {
-        const found = result.find((_) => comparator(_) === comparator(item));
-        if (!found) {
-          result.push(item);
-        }
-      }
-    }
-    return result;
-  }
-
-  static findParents(tree: any[], item: any) {
-    if (tree.indexOf(item) >= 0) {
-      return tree;
-    }
-    if (Array.isArray(tree)) {
-      for (const treeNode of tree) {
-        const childResult = this.findParents(treeNode.children, item);
-        if (Array.isArray(childResult)) {
-          return [treeNode].concat(childResult);
-        }
-      }
-    }
-  }
-
-  static moveItem(list: any[], sourceIndex, targetIndex) {
-    const res = [...list];
-    const item = list[sourceIndex];
-    if (targetIndex > sourceIndex) {
-      res.splice(targetIndex, 0, item);
-      res.splice(sourceIndex, 1);
-    } else {
-      res.splice(sourceIndex, 1);
-      res.splice(targetIndex, 0, item);
-    }
-    return res;
-  }
-}

package/src/common/util/dom-util.ts

@@ -1,16 +0,0 @@
-export class DomUtil {
-  public static clickedInside(target: HTMLElement, event: MouseEvent): boolean {
-    return event.composedPath().indexOf(target) >= 0;
-  }
-
-  public static findTransformedParent(node: HTMLElement) {
-    while (node !== null && node.tagName !== 'BODY') {
-      const style = getComputedStyle(node);
-      if (style.transform !== 'none') {
-        return node;
-      }
-      node = node.parentNode as HTMLElement;
-    }
-    return null;
-  }
-}