@gerandon/ngx-widgets 18.0.0 → 18.0.2

package/src/lib/core/component-unsubscribe.ts

@@ -1,58 +0,0 @@
-import { isDevMode } from '@angular/core';
-
-import { Observable, Subject, takeUntil } from 'rxjs';
-import { SafeSubscriber } from 'rxjs/internal/Subscriber';
-
-/**
- * Automatically unsubscribe from an Observable when the view is destroyed
- * Tested with checking the "complete" event of a subscribe method
- * @description
- * An Annotation that should be used with an Observable typed variable to handle its subscriptions
- * @author gergo.asztalos
- */
-export function UnsubscribeOnDestroy<ObservableType>(): PropertyDecorator {
-  return function (target: any, propertyKey: string | symbol) {
-    const ngOnDestroy = target.ngOnDestroy;
-
-    const secretKey = `_${<string>propertyKey}$`;
-    // Probably with function we could use own context
-    const destroyKey = (_this: any) =>
-      _this.hasOwnProperty('destroy$') ? 'destroy$' : `${_this.constructor.name}_destroy$`;
-    Object.defineProperty(target, secretKey, { enumerable: false, writable: true });
-    Object.defineProperty(target, propertyKey, {
-      configurable: true,
-      enumerable: true,
-      get: function() {
-        return this[secretKey];
-      },
-      set: function(newValue: Observable<ObservableType> | SafeSubscriber<ObservableType>) {
-        if (!this[destroyKey(this)]) {
-          this[destroyKey(this)] =  new Subject();
-        }
-        if (newValue instanceof Observable) {
-          this[secretKey] = newValue.pipe(
-            takeUntil(this[destroyKey(this)]),
-          );
-        } else {
-          this[secretKey] = newValue;
-        }
-      },
-    });
-
-    target.ngOnDestroy = function () {
-      if (this[propertyKey] instanceof SafeSubscriber) {
-        this[propertyKey].unsubscribe();
-        this[secretKey].unsubscribe();
-      } else if (this.hasOwnProperty(destroyKey(this))) {
-        this[destroyKey(this)].next();
-        this[destroyKey(this)].complete();
-      }
-      delete this[secretKey];
-      if (isDevMode()) {
-        // eslint-disable-next-line no-console,max-len
-        console.debug(`<UnsubscribeOnDestroy> - Observable/Subscription <${<string>propertyKey}> completed in class: ${this.constructor.name}`);
-      }
-      ngOnDestroy && ngOnDestroy.call(this);
-    };
-  };
-}

package/src/lib/select/select.component.html

@@ -1,36 +0,0 @@
-<mat-form-field appearance="outline" [subscriptSizing]="subscriptSizing" [floatLabel]="floatLabel">
-  @if (label) {
-    <mat-label>{{ label }}</mat-label>
-  }
-  <mat-select #inputElement
-              #input="ngForm"
-              [multiple]="multiple"
-              [placeholder]="!floatLabel ? label : placeholder"
-              [formControl]="control"
-              [id]="id"
-              [class.input-disabled]="isDisabled || control.disabled"
-              [compareWith]="_isEqual"
-              [attr.disabled]="isDisabled || control.disabled ? '' : null">
-    @if (emptyOptionLabel) {
-      <mat-option (click)="control.reset()">
-        {{ emptyOptionLabel }}
-      </mat-option>
-    }
-    @for(option of options; track option) {
-      <mat-option [value]="option.value">
-        {{ option.label }}
-      </mat-option>
-    }
-  </mat-select>
-  @if (suffix) {
-    <span matSuffix>{{suffix}}</span>
-  }
-  @if (control.errors?.['server']) {
-    <mat-error>{{ control.errors?.['server'] }}</mat-error>
-  } @else if (control.errors?.['required']) {
-    <mat-error>{{ validationTranslations.required }}</mat-error>
-    @for (error of validatorMessagesArray; track error) {
-      <mat-error>{{ error.value }}</mat-error>
-    }
-  }
-</mat-form-field>

package/src/lib/select/select.component.scss

@@ -1,7 +0,0 @@
-gerandon-select {
-  mat-form-field {
-    width: 100%;
-    .mat-mdc-text-field-wrapper {
-    }
-  }
-}

package/src/lib/select/select.component.ts

@@ -1,70 +0,0 @@
-import {
-  Component,
-  ElementRef,
-  forwardRef,
-  Input,
-  OnInit,
-  QueryList,
-  ViewChildren,
-  ViewEncapsulation,
-} from '@angular/core';
-import { NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms';
-import { MatInputModule } from '@angular/material/input';
-import { MatSelectModule } from '@angular/material/select';
-import { MatTooltipModule } from '@angular/material/tooltip';
-
-import {BaseInput} from '../core/base-input';
-import { isEqual } from 'lodash-es';
-import { Observable } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
-
-export interface SelectOptionType {
-  label: string;
-  value: string | number | null | unknown;
-}
-
-@Component({
-  selector: 'gerandon-select',
-  templateUrl: './select.component.html',
-  styleUrls: ['./select.component.scss'],
-  encapsulation: ViewEncapsulation.None,
-  standalone: true,
-  providers: [
-    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SelectComponent), multi: true }
-  ],
-  imports: [
-    MatInputModule,
-    MatSelectModule,
-    ReactiveFormsModule,
-    MatTooltipModule,
-  ],
-})
-export class SelectComponent extends BaseInput<unknown> implements OnInit {
-
-  /**
-   * In this case, an empty option appears that resets the control, to an empty value state
-   */
-  @Input() public emptyOptionLabel?: string;
-  @Input() public multiple?: boolean;
-  @Input() public options!: SelectOptionType[];
-  @Input() public asyncOptions!: Observable<SelectOptionType[]>;
-  @ViewChildren('optionElements') public optionElements!: QueryList<ElementRef>;
-
-  /**
-   * Angular Material - Select component comparsion is only '===', does not work with Array values
-   * https://github.com/angular/components/blob/a07c0758a5ec2eb4de1bb822354be08178c66aa4/src/lib/select/select.ts#L242C48-L242C58
-   */
-  public readonly _isEqual = isEqual;
-
-  override ngOnInit() {
-    this.placeholder = !this.placeholder ? (this.validationTranslations.selectGlobalPlaceholder || this.label) : this.placeholder;
-    super.ngOnInit();
-    this.id = this.id || this.formControlName || this.name;
-    if (this.asyncOptions) {
-      this.asyncOptions.pipe(takeUntil(this.destroy$)).subscribe((resp) => {
-        this.options = resp;
-        this.cdr.detectChanges();
-      });
-    }
-  }
-}

package/src/lib/textarea-input/textarea-input.component.html

@@ -1,45 +0,0 @@
-<div class="textarea-input cva-input">
-  <mat-form-field appearance="outline" [subscriptSizing]="subscriptSizing" [floatLabel]="floatLabel">
-    @if (label) {
-      <mat-label [class.disabled]="isDisabled">{{ label }}</mat-label>
-    }
-    <textarea
-      [id]="id"
-      #inputElement
-      #input="ngForm"
-      #autosize="cdkTextareaAutosize"
-      matInput
-      cdkTextareaAutosize
-      [cdkAutosizeMinRows]="rows"
-      class="w-100 cva-control"
-      [attr.disabled]="isDisabled || control.disabled ? '' : null"
-      [readonly]="isDisabled"
-      [placeholder]="placeholder"
-      [formControl]="control"
-      [maxLength]="maxLength"
-      [name]="name">
-    </textarea>
-    <span class="counter">{{control?.value?.length || 0}} / {{ maxLength }}</span>
-    @if (prefixIcon) {
-      <mat-icon matPrefix color="accent">
-        {{prefixIcon}}
-      </mat-icon>
-    }
-    @if (suffixIcon) {
-      <mat-icon matSuffix color="accent">
-        {{suffixIcon}}
-      </mat-icon>
-    }
-    @if (suffix) {
-      <span matSuffix>{{suffix}}</span>
-    }
-    @if (control.errors?.['server']) {
-      <mat-error>{{ control.errors?.['server'] }}</mat-error>
-    } @else if (control.errors?.['required']) {
-      <mat-error>{{ validationTranslations.required }}</mat-error>
-      @for (error of validatorMessagesArray; track error) {
-        <mat-error>{{ error.value }}</mat-error>
-      }
-    }
-  </mat-form-field>
-</div>

package/src/lib/textarea-input/textarea-input.component.scss

@@ -1,27 +0,0 @@
-gerandon-textarea-input {
-  display: block;
-  .counter {
-    right: 20px;
-    bottom: 0;
-    position: absolute;
-    font-size: 10px;
-  }
-  .textarea-input {
-    .disabled {
-      color: #CED4DAFF;
-    }
-    mat-form-field {
-      width: 100%;
-      textarea {
-        padding-top: 10px;
-        &::placeholder {
-          color: #ADB5BDFF;
-          font-style: italic;
-        }
-        &:disabled {
-          cursor: not-allowed;
-        }
-      }
-    }
-  }
-}

package/src/lib/textarea-input/textarea-input.component.ts

@@ -1,30 +0,0 @@
-import { Component, forwardRef, Input, ViewEncapsulation } from '@angular/core';
-import { FormsModule, NG_ASYNC_VALIDATORS, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatIconModule } from '@angular/material/icon';
-import { MatInputModule } from '@angular/material/input';
-import {BaseTextInput} from "../core/base-text-input";
-
-@Component({
-  selector: 'gerandon-textarea-input',
-  templateUrl: 'textarea-input.component.html',
-  styleUrls: ['textarea-input.component.scss'],
-  standalone: true,
-  encapsulation: ViewEncapsulation.None,
-  imports: [
-    FormsModule,
-    MatFormFieldModule,
-    MatIconModule,
-    MatInputModule,
-    ReactiveFormsModule,
-  ],
-  providers: [
-    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TextareaInputComponent), multi: true },
-    { provide: NG_ASYNC_VALIDATORS, useExisting: forwardRef(() => TextareaInputComponent), multi: true },
-  ],
-})
-export class TextareaInputComponent extends BaseTextInput<string> {
-
-  @Input() public rows = 10;
-
-}

package/tsconfig.lib.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/lib",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": []
-  },
-  "exclude": [
-    "**/*.spec.ts"
-  ]
-}

package/tsconfig.lib.prod.json

@@ -1,10 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "./tsconfig.lib.json",
-  "compilerOptions": {
-    "declarationMap": false
-  },
-  "angularCompilerOptions": {
-    "compilationMode": "partial"
-  }
-}

package/tsconfig.spec.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine"
-    ]
-  },
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
-}