@morozeckiy/dd-lib 0.1.1 → 0.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morozeckiy/dd-lib",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "license": "MIT",
   "repository": "https://gitlab.com/Morozeckiy/dd-lib",
   "publishConfig": {
@@ -13,5 +13,18 @@
   "dependencies": {
     "tslib": "^2.3.0"
   },
-  "sideEffects": false
-}
+  "sideEffects": false,
+  "module": "fesm2022/morozeckiy-dd-lib.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/morozeckiy-dd-lib.mjs",
+      "esm": "./esm2022/morozeckiy-dd-lib.mjs",
+      "default": "./fesm2022/morozeckiy-dd-lib.mjs"
+    }
+  }
+}

package/public-api.d.ts

@@ -0,0 +1,30 @@
+export declare const t = true;
+export * from './lib/common/lib-common-button';
+export * from './lib/common/lib-common-input-text';
+export * from './lib/lib-loader/lib-loader.component';
+export * from './lib/lib-button/lib-button.component';
+export * from './lib/lib-accordion/lib-accordion.component';
+export * from './lib/lib-back-button/lib-back-button.component';
+export * from './lib/lib-calendar/lib-calendar.component';
+export * from './lib/lib-card/lib-card.component';
+export * from './lib/lib-checkbox/lib-checkbox.component';
+export * from './lib/lib-comment-input/lib-comment-input.component';
+export * from './lib/lib-file-upload/lib-file-upload.component';
+export * from './lib/lib-filter-button/lib-filter-button.component';
+export * from './lib/lib-image-loader/lib-image-loader.component';
+export * from './lib/lib-input/lib-input.component';
+export * from './lib/lib-period/lib-period.component';
+export * from './lib/lib-radio/lib-radio.component';
+export * from './lib/lib-search-input/lib-search-input.component';
+export * from './lib/lib-select/lib-select.component';
+export * from './lib/lib-skeleton/lib-skeleton.component';
+export * from './lib/lib-sort/lib-sort.component';
+export * from './lib/lib-step/lib-step.component';
+export * from './lib/lib-svg/lib-svg.component';
+export * from './lib/lib-svg-icon/lib-svg-icon.component';
+export * from './lib/lib-tabs-fragment/lib-tabs-fragment.component';
+export * from './lib/lib-textarea/lib-textarea.component';
+export * from './lib/utils/decorators';
+export * from './lib/toast/toast.service';
+export * from './lib/toast/toast-placeholder/toast-placeholder.component';
+export * from './lib/core/index';

package/ng-package.json

@@ -1,8 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/dd-lib",
-  "assets": ["assets"],
-  "lib": {
-    "entryFile": "src/public-api.ts"
-  }
-}

package/src/lib/common/lib-common-button.ts

@@ -1,34 +0,0 @@
-import { Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@angular/core';
-
-@Component({
-  template: '',
-})
-export abstract class LibCommonButtonComponent {
-  @Input() public width: string | undefined;
-  @Input() public height: string | undefined;
-  @Input() public size: 'md' | 'lg' | '' = '';
-  @Input() public fontSize: number | null | undefined;
-  @Input() public autofocus = false;
-  @Input() public btnColor: 'white' | 'green' | 'red' | 'transparent' | 'dark' = 'green';
-  @Input() public active = false;
-  @Input() public disabled: boolean | null = false;
-
-  @Input() public showLoader: null | boolean | undefined = false;
-  @Input() public buttonType: 'submit' | 'reset' | 'button' = 'button';
-
-  @ViewChild('contentData', { static: false }) public content: ElementRef | undefined;
-  @ViewChild('btn', { static: false }) public button: ElementRef | undefined;
-
-  @Output() public clickEvent = new EventEmitter<null>();
-
-  public onClick(event: Event): void {
-    if (this.disabled || this.showLoader || this.active) {
-      event.stopPropagation();
-      event.preventDefault();
-    } else {
-      this.clickEvent.emit();
-      const el = document.activeElement as HTMLElement;
-      el?.blur();
-    }
-  }
-}

package/src/lib/common/lib-common-input-text.ts

@@ -1,154 +0,0 @@
-import {
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  EventEmitter,
-  forwardRef,
-  Input,
-  Output,
-  ViewChild,
-} from '@angular/core';
-import { AbstractControl, NG_VALUE_ACCESSOR } from '@angular/forms';
-
-@Component({
-  selector: 'dd-lib-common-input',
-  template: '',
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => LibCommonInputTextComponent),
-      multi: true,
-    },
-  ],
-})
-export abstract class LibCommonInputTextComponent {
-  @ViewChild('searchInput') protected inputSearchElement: ElementRef<HTMLInputElement> | undefined;
-  @ViewChild('input') protected inputElement: ElementRef<HTMLInputElement> | undefined;
-  @ViewChild('textarea') protected textAreaElement: ElementRef<HTMLTextAreaElement> | undefined;
-  @Input() public name: string | undefined;
-  @Input() public label: string | undefined;
-  @Input() public formControlName: string | undefined;
-  @Input() public type: 'password' | 'email' | 'number' | 'text' | undefined;
-  @Input() public contextClass: string | undefined; // класс разметки для deep стилей
-  @Input() public minlength: string | number | undefined;
-  @Input() public maxlength = 700;
-  @Input() public placeholder?: string;
-  @Input() public autocomplete?: string;
-  @Input() public tabIndex?: string | number;
-  @Input() public readOnly?: boolean;
-  @Input() public required = false;
-  @Input() public disabled = false;
-  @Input() public commitOnInput = true; // коммитить по input или по change
-  @Input() public clearable = false;
-  @Input() public uppercase = false;
-  @Input() public invalid = false;
-  @Input() public errorText: string | undefined;
-  @Output() public cleared = new EventEmitter<void>();
-  @Output() public focus = new EventEmitter<any>();
-  @Output() public blur = new EventEmitter<any>();
-  public get id() {
-    return this._ID;
-  }
-  public focused = false;
-  public touched = false;
-  public control: AbstractControl | undefined | null;
-  public value: string | undefined = '';
-  public changeDetection: ChangeDetectorRef;
-
-  protected destroyed = false;
-  protected onTouchedCallback: (() => void) | undefined;
-  private _ID = '';
-
-  protected constructor(changeDetection: ChangeDetectorRef) {
-    this.changeDetection = changeDetection;
-  }
-
-  public handleInput(_e: Event): void {
-    if (this.commitOnInput) {
-      this.commit(this.value);
-    }
-  }
-
-  public notifyFocusEvent(e: Event): void {
-    // this.focusManager.notifyFocusMayChanged(this, e.type === 'focus');
-  }
-
-  // public writeValue(value: string | number | null): void {
-  //   this.value = value === null || value === undefined ? '' : '' + value;
-  //   if (!this.destroyed) {
-  //     this.changeDetection.detectChanges();
-  //   }
-  // }
-
-  // public clearValue(e: Event): void {
-  //   if (!this.disabled) {
-  //     this.writeValue(null);
-  //     this.commit(null);
-  //     this.cleared.emit();
-  //     this.returnFocus(e);
-  //   }
-  //   e.stopPropagation();
-  // }
-
-  public handleBlur(): void {
-    this.focused = false;
-    if (this.onTouchedCallback) {
-      this.onTouchedCallback();
-    }
-
-    this.blur.emit();
-    this.changeDetection.detectChanges();
-  }
-
-  public handleFocus(): void {
-    this.focused = this.touched = true;
-    if (this.onTouchedCallback) {
-      this.onTouchedCallback();
-    }
-    this.focus.emit();
-  }
-
-  public returnFocus(e?: Event): void {
-    if (
-      this.inputElement &&
-      this.inputElement.nativeElement &&
-      (!e || e.target !== this.inputElement.nativeElement)
-    ) {
-      this.inputElement.nativeElement.focus();
-      // HelperService.resetSelection(this.inputElement.nativeElement);
-    }
-  }
-
-  public loseFocus(): void {
-    this.inputElement?.nativeElement.blur();
-  }
-
-  public forceChange(): void {
-    if (this.inputElement) {
-      // this.inputElement.nativeElement.dispatchEvent(HelperService.createEvent('change', true, false));
-    }
-  }
-
-  public registerOnChange(fn: any): void {
-    this.commit = fn;
-  }
-
-  public registerOnTouched(fn: any): void {
-    this.onTouchedCallback = fn;
-  }
-
-  public setDisabledState(isDisabled: boolean): void {
-    this.disabled = isDisabled;
-    if (!this.destroyed) {
-      this.changeDetection.detectChanges();
-    }
-  }
-
-  public handleChange(): void {
-    if (!this.commitOnInput) {
-      this.commit(this.value);
-    }
-  }
-
-  public commit(_value: string | null | undefined): void {}
-}

package/src/lib/core/dialog/dialog-config.ts

@@ -1,19 +0,0 @@
-import { InjectionToken, ViewContainerRef } from '@angular/core';
-
-export const DIALOG_CONFIG = new InjectionToken<DialogConfig>('Default options');
-
-export class DialogConfig<D = any> {
-  public hasBackdrop = true;
-  public backdropClass = 'modal-overlay';
-  public dialogClass = '';
-  public closeOnBackdropClick = true;
-  public closeOnEsc = true;
-  public hasScroll = false;
-  public autoFocus = true;
-  public viewContainerRef: ViewContainerRef | undefined;
-  public context: D | undefined;
-
-  constructor(config: Partial<DialogConfig>) {
-    Object.assign(this, config);
-  }
-}

package/src/lib/core/dialog/dialog-container.component.ts

@@ -1,38 +0,0 @@
-import { Component, ComponentRef, ElementRef, EmbeddedViewRef, ViewChild } from '@angular/core';
-import { CdkPortalOutlet, ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
-import { DialogConfig } from './dialog-config';
-import { FocusTrap, FocusTrapFactory } from '@angular/cdk/a11y';
-
-@Component({
-  selector: 'dd-dialog-container',
-  standalone: true,
-  imports: [CdkPortalOutlet],
-  template: '<ng-template cdkPortalOutlet></ng-template>',
-})
-export class DialogContainerComponent {
-  @ViewChild(CdkPortalOutlet, { static: true }) public portalOutlet: CdkPortalOutlet | undefined;
-
-  protected focusTrap: FocusTrap | undefined;
-
-  constructor(
-    protected config: DialogConfig,
-    protected elementRef: ElementRef,
-    protected focusTrapFactory: FocusTrapFactory,
-  ) {}
-
-  public ngOnInit(): void {
-    if (this.config.autoFocus) {
-      this.focusTrap = this.focusTrapFactory.create(this.elementRef.nativeElement);
-      // this.focusTrap.blurPreviouslyFocusedElement();
-      this.focusTrap.focusInitialElement();
-    }
-  }
-
-  public attachComponentPortal<T>(portal: ComponentPortal<T>): ComponentRef<T> {
-    return this.portalOutlet!.attachComponentPortal(portal);
-  }
-
-  public attachTemplatePortal<C>(portal: TemplatePortal<C>): EmbeddedViewRef<C> {
-    return this.portalOutlet!.attachTemplatePortal(portal);
-  }
-}

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

@@ -1,28 +0,0 @@
-import { ComponentRef } from '@angular/core';
-import { Observable, Subject } from 'rxjs';
-import { OverlayRef } from '@angular/cdk/overlay';
-
-export class DDDialogRef<T> {
-  public componentRef: ComponentRef<T> | undefined;
-
-  /**
-   * Stream of backdrop click events.
-   * */
-  public readonly onBackdropClick: Observable<MouseEvent>;
-  protected onClose$: Subject<any> = new Subject();
-  public readonly onClose: Observable<any> = this.onClose$.asObservable();
-
-  constructor(protected overlayRef: OverlayRef) {
-    this.onBackdropClick = this.overlayRef.backdropClick();
-  }
-
-  /**
-   * Hides dialog.
-   * */
-  public close(res?: any) {
-    this.overlayRef.detach();
-    this.overlayRef.dispose();
-    this.onClose$.next(res);
-    this.onClose$.complete();
-  }
-}

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

@@ -1,144 +0,0 @@
-import {
-  ComponentFactoryResolver,
-  Inject,
-  Injectable,
-  Injector,
-  TemplateRef,
-  Type,
-  ViewContainerRef,
-} from '@angular/core';
-import { DDDialogRef as DialogRef } from './dialog-ref';
-import { DIALOG_CONFIG, DialogConfig } from './dialog-config';
-import { DOCUMENT } from '@angular/common';
-import {
-  GlobalPositionStrategy,
-  Overlay,
-  OverlayRef,
-  PositionStrategy,
-  ScrollStrategy,
-} from '@angular/cdk/overlay';
-import { ComponentPortal, PortalInjector, TemplatePortal } from '@angular/cdk/portal';
-import { DialogContainerComponent } from './dialog-container.component';
-import { fromEvent } from 'rxjs';
-import { filter, takeUntil } from 'rxjs/operators';
-
-@Injectable({ providedIn: 'root' })
-export class DialogService {
-  public dialogRef: DialogRef<any> | undefined;
-
-  constructor(
-    @Inject(DOCUMENT) protected document: Document,
-    @Inject(DIALOG_CONFIG) protected globalConfig: DialogConfig,
-    protected overlay: Overlay,
-    protected injector: Injector,
-    protected cfr: ComponentFactoryResolver,
-  ) {}
-
-  public open<T, R = any>(
-    content: Type<T> | TemplateRef<T>,
-    userConfig: Partial<DialogConfig<Partial<R> | string>> = {},
-  ): DialogRef<T> {
-    const config = new DialogConfig({ ...this.globalConfig, ...userConfig });
-    const overlayRef = this.createOverlay(config);
-    const dialogRef = new DialogRef<T>(overlayRef);
-    this.dialogRef = dialogRef;
-    const container = this.createContainer(config, overlayRef);
-    this.createContent(config, content, container, dialogRef);
-
-    this.registerCloseListeners(config, overlayRef, dialogRef);
-
-    return dialogRef;
-  }
-
-  protected createOverlay(config: DialogConfig): OverlayRef {
-    const positionStrategy = this.createPositionStrategy();
-    const scrollStrategy = this.createScrollStrategy(config.hasScroll);
-
-    return this.overlay.create({
-      positionStrategy,
-      scrollStrategy,
-      hasBackdrop: config.hasBackdrop,
-      backdropClass: config.backdropClass,
-      panelClass: config.dialogClass,
-    });
-  }
-
-  protected createPositionStrategy(): PositionStrategy {
-    return new GlobalPositionStrategy().centerVertically().centerHorizontally();
-  }
-
-  protected createScrollStrategy(hasScroll: boolean): ScrollStrategy {
-    if (hasScroll) {
-      return this.overlay.scrollStrategies.noop();
-    } else {
-      return this.overlay.scrollStrategies.block();
-    }
-  }
-
-  protected createContainer(config: DialogConfig, overlayRef: OverlayRef): DialogContainerComponent {
-    const injector = new PortalInjector(this.createInjector(config), new WeakMap([[DialogConfig, config]]));
-    const containerPortal = new ComponentPortal(DialogContainerComponent, null, injector, this.cfr);
-    const containerRef = overlayRef.attach(containerPortal);
-    return containerRef.instance;
-  }
-
-  protected createInjector(config: DialogConfig): Injector {
-    return (config.viewContainerRef && config.viewContainerRef.injector) || this.injector;
-  }
-
-  protected createContent<T>(
-    config: DialogConfig,
-    content: Type<T> | TemplateRef<T>,
-    container: DialogContainerComponent,
-    dialogRef: DialogRef<T>,
-  ) {
-    if (content instanceof TemplateRef) {
-      const portal = this.createTemplatePortal(config, content, dialogRef);
-      container.attachTemplatePortal(portal);
-    } else {
-      const portal = this.createComponentPortal(config, content, dialogRef);
-      dialogRef.componentRef = container.attachComponentPortal(portal);
-
-      if (config.context) {
-        Object.assign(dialogRef.componentRef.instance as any, { ...config.context });
-      }
-    }
-  }
-
-  protected createTemplatePortal<T>(
-    config: DialogConfig,
-    content: TemplateRef<T>,
-    dialogRef: DialogRef<T>,
-  ): TemplatePortal {
-    return new TemplatePortal(
-      content,
-      {} as ViewContainerRef,
-      { $implicit: config.context, dialogRef } as any,
-    );
-  }
-
-  protected createComponentPortal<T>(
-    config: DialogConfig,
-    content: Type<T>,
-    dialogRef: DialogRef<T>,
-  ): ComponentPortal<T> {
-    const injector = this.createInjector(config);
-    const portalInjector = new PortalInjector(injector, new WeakMap([[DialogRef, dialogRef]]));
-    return new ComponentPortal(content, config.viewContainerRef, portalInjector);
-  }
-
-  protected registerCloseListeners<T>(config: DialogConfig, overlayRef: OverlayRef, dialogRef: DialogRef<T>) {
-    if (config.closeOnBackdropClick) {
-      overlayRef.backdropClick().subscribe(() => dialogRef.close());
-    }
-
-    if (config.closeOnEsc) {
-      fromEvent<KeyboardEvent>(this.document, 'keyup')
-        .pipe(
-          filter((event: KeyboardEvent) => event.keyCode === 27),
-          takeUntil(dialogRef.onClose),
-        )
-        .subscribe(() => dialogRef.close());
-    }
-  }
-}

package/src/lib/core/directives/auto-height.directive.ts

@@ -1,29 +0,0 @@
-import { Directive, ElementRef, Input, OnInit, Renderer2 } from '@angular/core';
-
-@Directive({
-  selector: '[ddAutoHeight]',
-  standalone: true,
-})
-export class AutoHeightDirective implements OnInit {
-  // уровень до родителя
-  @Input() public ddAutoHeight: number | undefined;
-
-  constructor(private el: ElementRef, private rdr: Renderer2) {}
-
-  public ngOnInit(): void {
-    setTimeout(() => {
-      if (this.ddAutoHeight) {
-        let i = 1;
-        let parent: any;
-        while (i <= this.ddAutoHeight) {
-          parent = parent ? parent.parentNode : this.el.nativeElement.parentNode;
-          i++;
-        }
-        const height = parent.clientHeight;
-        if (height) {
-          this.rdr.setStyle(this.el.nativeElement, 'height', height + 'px');
-        }
-      }
-    }, 0);
-  }
-}

package/src/lib/core/directives/click-outside.directive.ts

@@ -1,33 +0,0 @@
-import { Directive, ElementRef, EventEmitter, HostListener, Input, Output } from '@angular/core';
-
-@Directive({
-  standalone: true,
-  selector: '[ddClickOutside]',
-})
-export class ClickOutsideDirective {
-  @Input() public elements!: string[] | undefined;
-  @Output() public ddClickOutside = new EventEmitter();
-
-  constructor(private el: ElementRef) {}
-
-  @HostListener('document:click', ['$event'])
-  public onClick(targetElement: Event) {
-    let clickedElemInside = false;
-    if (this.elements?.length) {
-      this.elements.forEach(el => {
-        if (el) {
-          const elem = document.getElementById(el) as any;
-          if (elem && !clickedElemInside) {
-            clickedElemInside = elem.contains(targetElement.target);
-          }
-        }
-      });
-    }
-
-    const clickedInside = this.el.nativeElement.contains(targetElement.target);
-
-    if (!clickedElemInside) {
-      this.ddClickOutside.emit(clickedInside);
-    }
-  }
-}

package/src/lib/core/directives/counter.directive.ts

@@ -1,54 +0,0 @@
-import { Directive, ElementRef, Input, OnChanges, SimpleChanges } from '@angular/core';
-import { DecimalPipe } from '@angular/common';
-
-@Directive({
-  selector: '[ddCounter]',
-  standalone: true,
-})
-export class CounterDirective implements OnChanges {
-  @Input() public ddCounter: number | undefined;
-  @Input() public needPositive = false;
-
-  constructor(private el: ElementRef) {}
-
-  public ngOnChanges(change: SimpleChanges): void {
-    this.el.nativeElement.innerHTML = 0;
-    let interval: any;
-    if (change['ddCounter']?.currentValue) {
-      /** получаем шаг для инкремента делением конечного числа на 20*/
-      let step = Math.floor(change['ddCounter'].currentValue / 20);
-      /** бывают маленькие и отрицательные числа*/
-      step = step >= 1 || step <= -1 ? step : 1;
-      let x = 0;
-      if (change['ddCounter'].currentValue > 0) {
-        interval = setInterval(() => {
-          if (x + step >= change['ddCounter'].currentValue) {
-            /** Если шаг увеличивает значение больше чем исходные число, приравниваем к исходнику и заканчиваем*/
-            const transformNumberFirst = new DecimalPipe('ru').transform(change['ddCounter'].currentValue);
-            this.el.nativeElement.innerHTML = this.needPositive
-              ? '+' + transformNumberFirst
-              : transformNumberFirst;
-            clearInterval(interval);
-            return;
-          }
-          x += step;
-          const transformNumber = new DecimalPipe('ru').transform(x);
-          this.el.nativeElement.innerHTML = this.needPositive ? '+' + transformNumber : transformNumber;
-        }, 1);
-      } else if (change['ddCounter'].currentValue < 0) {
-        interval = setInterval(() => {
-          if (x - step <= change['ddCounter'].currentValue) {
-            this.el.nativeElement.innerHTML = new DecimalPipe('ru').transform(change['ddCounter'].currentValue);
-            clearInterval(interval);
-            return;
-          }
-          x += step;
-          this.el.nativeElement.innerHTML = new DecimalPipe('ru').transform(x);
-        }, 10);
-      }
-    }
-    setTimeout(() => {
-      clearInterval(interval);
-    }, 4000);
-  }
-}

package/src/lib/core/directives/declension.directive.ts

@@ -1,29 +0,0 @@
-import { Directive, ElementRef, Input, OnInit } from '@angular/core';
-
-@Directive({
-  selector: '[ddDeclension]',
-  standalone: true,
-})
-export class DeclensionDirective implements OnInit {
-  @Input() public ddDeclension!: string[];
-  @Input() public count = 0;
-  @Input() public whitespace = true;
-  @Input() public needCount = true;
-
-  constructor(private el: ElementRef) {}
-
-  public ngOnInit(): void {
-    const declension = { 1: this.ddDeclension[0], 2: this.ddDeclension[1], 5: this.ddDeclension[2] };
-    let x = this.count >= 10 && this.count <= 20 ? 5 : this.count % 10;
-    if (this.count > 999) {
-      x = this.count % 100;
-    }
-    const keys: [1, 2, 5] = (Object.keys(declension).map(Number) as [1, 2, 5]).sort();
-    const text = !x
-      ? `${declension[keys.pop() || 1]}`
-      : keys.reduce((result, key) => (x >= +key ? declension[key] : result), '');
-    this.el.nativeElement.innerHTML = `${this.whitespace ? '&nbsp;' : ''}${
-      this.needCount ? this.count : ''
-    } ${text}`;
-  }
-}

package/src/lib/core/directives/resize-textarea.directive.ts

@@ -1,16 +0,0 @@
-import { Directive, ElementRef, HostListener, Renderer2 } from '@angular/core';
-
-@Directive({
-  selector: '[ddResizeTextarea]',
-  standalone: true,
-})
-export class ResizeTextareaDirective {
-  constructor(private el: ElementRef, private rdr: Renderer2) {}
-
-  @HostListener('input', ['$event'])
-  public onKeyup(): void {
-    const h = this.el.nativeElement.scrollHeight;
-    this.rdr.setStyle(this.el.nativeElement, 'max-height', h + 'px');
-    this.rdr.setStyle(this.el.nativeElement, 'height', h + 'px');
-  }
-}