@inspark/inspark-components 19.0.51 → 19.0.53

package/src/components/pie/pie.service.ts

@@ -1,67 +0,0 @@
-import {Injectable} from '@angular/core';
-
-
-export interface PieStatuses {
-  '-1': number;
-  0: number;
-  1: number;
-  2: number;
-  3: number;
-}
-
-@Injectable()
-export class PieService {
-
-
-  private colorArray = ['-1', 0, 1, 2, 3, 4]; // Цвета и последовательность в которой они будут отображены
-
-  private colors = {
-    1: '#31ac51',
-    2: '#EE9946',
-    3: '#F95C5D',
-    4: '#a20000',
-    0: '#7E8087',
-    '-1': '#85B3CB'
-  };
-
-  create(statuses: PieStatuses, size): { path: string, color: string }[] {
-    const data = [];
-    let allCount = 0;
-    this.colorArray.forEach((color: any) => {
-      allCount += statuses[color] || 0;
-    });
-    let cumulativePercent = 0;
-    this.colorArray.forEach((color: any) => {
-      const count = statuses[color];
-      if (!count) {
-        return;
-      }
-      const percent = count / allCount;
-      const [startX, startY] = this.getCoordinatesForPercent(size, cumulativePercent);
-      cumulativePercent += percent;
-      const [endX, endY] = this.getCoordinatesForPercent(size, cumulativePercent);
-
-      const largeArcFlag = percent > .5 ? 1 : 0;
-
-      const pathData = [
-        `M ${startX} ${startY}`, // Move
-        `A 20 20 0 ${largeArcFlag} 1 ${endX} ${endY}`, // Arc
-        `L 0 0`, // Line
-      ].join(' ');
-
-      data.push({
-        path: pathData,
-        color: this.colors[color + '']
-      });
-    });
-    return data;
-  }
-
-  private getCoordinatesForPercent(size, percent) {
-    const x = size / 2 * Math.cos(2 * Math.PI * percent);
-    const y = size / 2 * Math.sin(2 * Math.PI * percent);
-    return [x, y];
-  }
-
-}
-

package/src/components/preloader/preloader.component.html

@@ -1,17 +0,0 @@
-<div [ngClass]="{float:!inline, small: size==='small'}" class="preloader-container">
-  <div class="lds-spinner">
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-  </div>
-</div>
-<div *ngIf="overlay" class="overlay"></div>

package/src/components/preloader/preloader.component.scss

@@ -1,144 +0,0 @@
-@use "@inspark/components-web/src/inspark" as *;
-
-.preloader-container {
-  display: inline-flex;
-  width: 100%;
-  height: 64px;
-  position: relative;
-  align-items: center;
-  justify-content: center;
-  z-index: 101;
-
-  &.float {
-    position: absolute;
-    height: auto;
-    width: auto;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-  }
-
-  &.small {
-    width: 32px;
-    height: 32px;
-
-    .lds-spinner {
-      color: var(--ids-theme-btn-primary-background);
-      width: 32px;
-      height: 32px;
-    }
-  }
-}
-
-.lds-spinner {
-  color: var(--ids-theme-btn-primary-background);
-  width: 64px;
-  height: 64px;
-}
-
-.lds-spinner div {
-  transform-origin: 32px 32px;
-  animation: lds-spinner 1.2s linear infinite;
-
-  .small & {
-    transform-origin: 16px 16px;
-  }
-}
-
-.lds-spinner div:after {
-  content: " ";
-  display: block;
-  position: absolute;
-  top: 3px;
-  left: 29px;
-  width: 5px;
-  height: 14px;
-  border-radius: 20%;
-  background: var(--ids-theme-btn-primary-background, $ids-theme-primary);
-
-  .small & {
-    width: 3px;
-    height: 6px;
-    left: 15px;
-  }
-}
-
-.lds-spinner div:nth-child(1) {
-  transform: rotate(0deg);
-  animation-delay: -1.1s;
-}
-
-.lds-spinner div:nth-child(2) {
-  transform: rotate(30deg);
-  animation-delay: -1s;
-}
-
-.lds-spinner div:nth-child(3) {
-  transform: rotate(60deg);
-  animation-delay: -0.9s;
-}
-
-.lds-spinner div:nth-child(4) {
-  transform: rotate(90deg);
-  animation-delay: -0.8s;
-}
-
-.lds-spinner div:nth-child(5) {
-  transform: rotate(120deg);
-  animation-delay: -0.7s;
-}
-
-.lds-spinner div:nth-child(6) {
-  transform: rotate(150deg);
-  animation-delay: -0.6s;
-}
-
-.lds-spinner div:nth-child(7) {
-  transform: rotate(180deg);
-  animation-delay: -0.5s;
-}
-
-.lds-spinner div:nth-child(8) {
-  transform: rotate(210deg);
-  animation-delay: -0.4s;
-}
-
-.lds-spinner div:nth-child(9) {
-  transform: rotate(240deg);
-  animation-delay: -0.3s;
-}
-
-.lds-spinner div:nth-child(10) {
-  transform: rotate(270deg);
-  animation-delay: -0.2s;
-}
-
-.lds-spinner div:nth-child(11) {
-  transform: rotate(300deg);
-  animation-delay: -0.1s;
-}
-
-.lds-spinner div:nth-child(12) {
-  transform: rotate(330deg);
-  animation-delay: 0s;
-}
-
-@keyframes lds-spinner {
-  0% {
-    opacity: 1;
-  }
-  100% {
-    opacity: 0;
-  }
-}
-
-
-.overlay {
-  position: fixed;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  background: rgba(0, 0, 0, .7);
-  z-index: 100;
-}

package/src/components/preloader/preloader.component.ts

@@ -1,25 +0,0 @@
-import {Component, Input, OnInit, ViewEncapsulation} from '@angular/core';
-
-
-type PreloaderSize = 'small' | 'normal';
-
-@Component({
-  standalone: false,
-  selector: 'in-preloader',
-  templateUrl: './preloader.component.html',
-  styleUrls: ['./preloader.component.scss'],
-  encapsulation: ViewEncapsulation.Emulated
-})
-export class PreloaderComponent implements OnInit {
-
-  @Input() inline = false;
-  @Input() overlay = false;
-  @Input() size: PreloaderSize = 'normal';
-
-  constructor() {
-  }
-
-  ngOnInit() {
-  }
-
-}

package/src/components/preloader/preloader.module.ts

@@ -1,16 +0,0 @@
-import { NgModule } from '@angular/core';
-import { PreloaderComponent } from './preloader.component';
-import {SharedComponentsModule} from '../shared/shared-components.module';
-
-@NgModule({
-  declarations: [
-    PreloaderComponent
-  ],
-  imports: [
-    SharedComponentsModule,
-  ],
-  exports: [
-    PreloaderComponent
-  ]
-})
-export class PreloaderComponentModule {}

package/src/components/primeng.module.ts

@@ -1,28 +0,0 @@
-import {NgModule} from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-
-import { RadioButtonModule } from 'primeng/radiobutton';
-import { ButtonModule } from 'primeng/button';
-import { DropdownModule } from 'primeng/dropdown';
-
-
-@NgModule({
-  imports: [
-    DropdownModule,
-    CommonModule,
-    FormsModule,
-    RadioButtonModule,
-    ButtonModule
-  ],
-  declarations: [],
-  exports: [
-    DropdownModule,
-    CommonModule,
-    FormsModule,
-    RadioButtonModule,
-    ButtonModule
-  ]
-})
-export class PrimengComponentsModule {
-}

package/src/components/radiobutton/radiobutton.component.html

@@ -1,24 +0,0 @@
-<ng-container *ngFor="let element of values">
-  <label class="in-radiobutton-option u-margin-left-tiny u-vertical-align-middle field_{{name}}">
-    <span
-      class="p-radiobutton p-component"
-      [class.p-radiobutton-checked]="isSelected(element)"
-      [class.p-disabled]="disabled">
-      <input
-        class="p-radiobutton-input"
-        type="radio"
-        [attr.id]="name + '-' + element.id"
-        [attr.name]="name"
-        [value]="element.id"
-        [checked]="isSelected(element)"
-        [disabled]="disabled"
-        (change)="selectElement(element)">
-      <span class="p-radiobutton-box">
-        <span class="p-radiobutton-icon"></span>
-      </span>
-    </span>
-    <span class="p-radiobutton-label u-vertical-align-middle">
-      {{ element[keyLabel] }}
-    </span>
-  </label>
-</ng-container>

package/src/components/radiobutton/radiobutton.component.scss

@@ -1,9 +0,0 @@
-.in-radiobutton-option {
-  display: inline-flex;
-  align-items: center;
-  cursor: pointer;
-}
-
-.in-radiobutton-option .p-disabled {
-  cursor: default;
-}

package/src/components/radiobutton/radiobutton.component.ts

@@ -1,47 +0,0 @@
-import {ChangeDetectionStrategy, Component, EventEmitter, Input, Output} from '@angular/core';
-
-@Component({
-  standalone: false,
-  selector: 'in-radiobutton',
-  templateUrl: './radiobutton.component.html',
-  styleUrls: ['./radiobutton.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class RadiobuttonComponent {
-  @Input() name = null;
-  @Input() label = null;
-  @Input() required = false;
-  @Input() error = null;
-  @Input() placeholder = '';
-  @Input() id = null;
-  @Input() disabled: boolean;
-  @Input() value;
-  @Input() values;
-  @Input() keyLabel;
-  @Input() item;
-  @Output() change = new EventEmitter();
-
-
-  constructor() {
-  }
-
-  get selectedId() {
-    return this.item && typeof this.item === 'object' ? this.item.id : this.item;
-  }
-
-  isSelected(value) {
-    return value && String(this.selectedId) === String(value.id);
-  }
-
-  selectElement(value) {
-    if (!value || this.disabled) {
-      return;
-    }
-    this.item = value.id;
-    this.onChangeEvent(value);
-  }
-
-  onChangeEvent(value) {
-    this.change.next({name: this.name, value});
-  }
-}

package/src/components/select-button/select-button.component.html

@@ -1,23 +0,0 @@
-<span *ngIf="label" class="c-label__content">
-  {{ label }}
-  <span *ngIf="required" class="c-label__req">*</span>
-  <span *ngIf="error" class="c-label__sub_is-error">{{ error }}</span>
-</span>
-
-<div class="container">
-  <!-- фиктивная кнопка если нужна разметка -->
-  <in-button class="button-none"></in-button>
-
-  <in-button
-    *ngFor="let option of options; trackBy: trackByValue"
-    (click)="clickButton(option)"
-    [color]="selected.includes(option.value) ? 'primary' : 'normal'"
-    [icon]="option.icon"
-    [label]="option.label | translate"
-    [testId]="'filter-buttons-' + option.value"
-    [title]="option.title ? (option.title | translate) : ''"
-    [name]="option.label"
-    [disabled]="option.readonly || disabled"
-  >
-  </in-button>
-</div>

package/src/components/select-button/select-button.component.scss

@@ -1,28 +0,0 @@
-.container {
-  white-space: nowrap;
-}
-
-in-button ::ng-deep button {
-  outline: none;
-}
-
-
-in-button:first-child ::ng-deep button {
-  border-bottom-right-radius: 0;
-  border-top-right-radius: 0;
-  border-right: 1px solid #000;
-}
-
-in-button:not(:first-child):not(:last-child) ::ng-deep button {
-  border-radius: 0;
-  border-right: 1px solid #000;
-}
-
-in-button:last-child ::ng-deep button {
-  border-bottom-left-radius: 0;
-  border-top-left-radius: 0;
-}
-
-.button-none {
-  display: none;
-}

package/src/components/select-button/select-button.component.ts

@@ -1,190 +0,0 @@
-import {
-  ChangeDetectorRef,
-  Component,
-  EventEmitter,
-  forwardRef,
-  Input,
-  OnChanges,
-  OnInit,
-  Output,
-  SimpleChanges,
-} from '@angular/core';
-import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms';
-
-type IconPos = 'left' | 'right';
-
-export interface SelectOption {
-  label: string;
-  title?: string;
-  value: string | number | boolean; // важно: примитив
-  icon?: string;
-  readonly?: boolean;
-}
-
-@Component({
-  standalone: false,
-  selector: 'in-select-button',
-  templateUrl: './select-button.component.html',
-  styleUrls: ['./select-button.component.scss'],
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => SelectButtonComponent),
-      multi: true,
-    },
-  ],
-})
-export class SelectButtonComponent
-  implements ControlValueAccessor, OnInit, OnChanges {
-
-  @Input() name = '';
-  @Input() testId = '';
-  @Input() label = '';
-  @Input() icon = '';
-  @Input() error = '';
-  @Input() iconPos: IconPos = 'left';
-  @Input() options: SelectOption[] = [];
-  @Input() disabled = false;
-  @Input() required = false;
-  @Input() multiple = false;
-  @Input() initial?: Array<string | number | boolean>;
-
-  @Output() focus = new EventEmitter<any>();
-  @Output() blur = new EventEmitter<any>();
-  @Output() click = new EventEmitter<any>();
-  @Output() change = new EventEmitter<any>();
-
-  // хранит выбранные ЗНАЧЕНИЯ, а не объекты
-  selected: Array<string | number | boolean> = [];
-
-  // то, что отдаем наружу в форму
-  value: string | number | boolean | Array<string | number | boolean> | null = null;
-
-  private propagateChange: (val: any) => void = () => {};
-  private propagateTouched: () => void = () => {};
-
-  constructor(private cdRef: ChangeDetectorRef) {}
-
-  ngOnInit(): void {}
-
-  ngOnChanges(changes: SimpleChanges): void {
-    // применяем initial только когда он реально поменялся
-    if (changes['initial'] && this.initial) {
-      this.selected = [...this.initial];
-      this.value = this.multiple ? [...this.initial] : this.initial[0] ?? null;
-      this.cdRef.detectChanges();
-    }
-
-    // если меняется список опций, надо попытаться восстановить выделение
-    if (changes['options'] && this.options && this.options.length > 0) {
-      this.syncSelectedWithOptions();
-    }
-  }
-
-  clickButton(option: SelectOption): void {
-    if (option.readonly || this.disabled) {
-      return;
-    }
-
-    this.click.emit(option);
-
-    if (this.multiple) {
-      if (this.selected.includes(option.value)) {
-        // убираем
-        this.selected = this.selected.filter(v => v !== option.value);
-      } else {
-        // добавляем
-        this.selected = [...this.selected, option.value];
-      }
-      this.value = [...this.selected];
-    } else {
-      this.selected = [option.value];
-      this.value = option.value;
-    }
-
-    this.cdRef.detectChanges();
-    this.onChange();
-  }
-
-  // ControlValueAccessor: model -> view
-  writeValue(value: any): void {
-    this.value = value;
-
-    if (value === null || value === undefined) {
-      this.selected = [];
-    } else if (Array.isArray(value)) {
-      // multiple
-      this.selected = [...value];
-    } else {
-      // single
-      this.selected = [value];
-    }
-
-    // когда значение пришло извне, надо убедиться что такие опции есть
-    this.syncSelectedWithOptions();
-    this.cdRef.detectChanges();
-  }
-
-  // ControlValueAccessor
-  registerOnChange(fn: any): void {
-    this.propagateChange = fn;
-  }
-
-  // ControlValueAccessor
-  registerOnTouched(fn: any): void {
-    this.propagateTouched = fn;
-  }
-
-  // ControlValueAccessor: disabled
-  setDisabledState(isDisabled: boolean): void {
-    this.disabled = isDisabled;
-    this.cdRef.detectChanges();
-  }
-
-  // пробросить наружу
-  private onChange(): void {
-    this.propagateChange(this.value);
-    this.change.emit(this.value);
-  }
-
-  onBlur(): void {
-    this.propagateTouched();
-    this.blur.emit();
-  }
-
-  onFocus(): void {
-    this.focus.emit();
-  }
-
-  // синхронизируем текущее выбранное со свежими options
-  private syncSelectedWithOptions(): void {
-    if (!this.options || this.options.length === 0) {
-      return;
-    }
-
-    if (this.multiple) {
-      // оставляем только те выбранные, которые реально есть в новых options
-      const optionValues = this.options.map(o => o.value);
-      this.selected = this.selected.filter(v => optionValues.includes(v));
-      this.value = [...this.selected];
-    } else {
-      if (this.selected.length > 0) {
-        const current = this.selected[0];
-        const found = this.options.find(o => o.value === current);
-        if (!found) {
-          // выбранного больше нет в списке
-          this.selected = [];
-          this.value = null;
-        } else {
-          this.selected = [found.value];
-          this.value = found.value;
-        }
-      }
-    }
-  }
-
-  // для *ngFor trackBy
-  trackByValue(index: number, item: SelectOption): string | number | boolean {
-    return item.value;
-  }
-}

package/src/components/select-button/select-button.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-
-import { SharedUiModule } from '../shared/shared-ui.module';
-
-import { SelectButtonComponent } from './select-button.component';
-
-@NgModule({
-  declarations: [
-    SelectButtonComponent
-  ],
-  imports: [
-    SharedUiModule
-  ],
-  exports: [
-    SelectButtonComponent
-  ]
-})
-export class SelectButtonComponentModule {}

package/src/components/select-list/select-list.component.html

@@ -1,27 +0,0 @@
-<div class="c-panel__heading-title h4">
-    {{'Select objects for which to execute the command' | translate}}
-</div>
-<span *ngIf="isShowSpinner"><ng-container *ngTemplateOutlet="spinner"></ng-container></span>
-<div class="container">
-    <div class="c-form-group type_treeblock">
-      <div style="overflow: hidden; width: 100%; white-space: nowrap; display: inline-flex;" *ngFor="let item of options; let i = index">
-          <span class="c-label c-label__content" style="width: 100px; min-height: 30px;">{{item.value}}</span>
-          <input class="c-checkbox__input" type="checkbox" [checked]="options[i].checked" >
-          <i class="p-chkbox-box c-checkbox__icon" (click)="select(i)"></i>
-      </div>
-
-    </div>
-    <div class="buttons">
-        <in-component-container>
-            <in-button id="close" (click)="closeModal()"
-                       label="{{'Cancel' | translate}}"></in-button>
-            <in-button id="edit" (click)="applySelection()" type="submit"
-                       label="{{'Apply' | translate}}"
-                       color="primary" [disabled]="" [title]="'Select an action' | translate"></in-button>
-        </in-component-container>
-    </div>
-</div>
-
-<ng-template #spinner><span class="c-spinner">
-            <i class="in in-spinner fa-spin "></i>
-</span></ng-template>