@natec/mef-dev-ui-kit 20.0.0-beta.1 → 20.0.1

package/src/lib/pg-components/select/option.component.ts

@@ -1,105 +0,0 @@
-import {
-	Component,
-	ContentChild,
-	Input,
-	OnDestroy,
-	OnInit,
-	ViewEncapsulation
-} from "@angular/core";
-
-//import { toBoolean } from "@shared/utils/convert";
-import { MefDevSelectComponent } from "./select.component";
-import { toBoolean } from "./../util/convert";
-
-
-/**
- * @skipTemplateDoc true
- * Component for representing an option in a dropdown list.
- *
- *```
- * <mefdev-select>
- * <mefdev-option Value="1" Label="Option 1"></mefdev-option>
- * <mefdev-option Value="2" Label="Option 2"></mefdev-option>
- * <mefdev-option Value="3" Label="Option 3"></mefdev-option>
- * </mefdev-select>
- *```
- *
- */
-@Component({
-    selector: "mefdev-option",
-    encapsulation: ViewEncapsulation.None,
-    templateUrl: "./option.component.html",
-    styleUrls: [],
-    standalone: false
-})
-export class MefDevOptionComponent implements OnDestroy, OnInit {
-	private _disabled = false;
-
-	_value: string;
-	_label: string;
-
-	/**
-   	* Template for the content of the option.
-   	*/
-	@ContentChild("OptionTemplate") OptionTemplate: any;
-
-	  /**
-   * The value of the option.
-   */
-	@Input()
-	set Value(value: string) {
-		if (this._value === value) {
-			return;
-		}
-		this._value = value;
-	}
-
-	get Value(): string {
-		return this._value;
-	}
-
-	/**
-   * The label of the option.
-   */
-	@Input()
-	set Label(value: string) {
-		if (this._label === value) {
-			return;
-		}
-		this._label = value;
-	}
-
-	get Label(): string {
-		return this._label;
-	}
-
-	/**
-   * Indicates whether the option is disabled.
-   */
-	@Input()
-	set Disabled(value: boolean) {
-		this._disabled = toBoolean(value);
-	}
-
-	get Disabled(): boolean {
-		return this._disabled;
-	}
-
-	constructor(private _Select: MefDevSelectComponent) {}
-
-	/**
-   * Initialization lifecycle hook.
-   * Adds the option to the dropdown list.
-   */
-	ngOnInit(): void {
-		this._Select.addOption(this);
-	}
-
-	/**
-   * Destruction lifecycle hook.
-   * Removes the option from the dropdown list.
-   */
-	ngOnDestroy(): void {
-		this._Select.removeOption(this);
-	}
-}

package/src/lib/pg-components/select/option.pipe.ts

@@ -1,44 +0,0 @@
-/* tslint:disable:no-any */
-import { Pipe, PipeTransform } from "@angular/core";
-import { MefDevOptionComponent } from "./option.component";
-
-@Pipe({
-    name: "OptionPipe",
-    standalone: false
-})
-export class OptionPipe implements PipeTransform {
-  // TODO: enable type checking for this method
-  transform(options: MefDevOptionComponent[], value: any): any {
-    if (value.searchText) {
-      let _options = options.filter(
-        option =>
-          option.Label &&
-          option.Label.toLowerCase().indexOf(value.searchText.toLowerCase()) !==
-            -1
-      );
-      if (value.tags) {
-        _options = options.filter(
-          option =>
-            option.Label &&
-            option.Label.toLowerCase() === value.searchText.toLowerCase()
-        );
-      }
-      if (_options.length) {
-        return _options;
-      } else {
-        return [
-          ({
-            Value: value.value,
-            _value: value.value,
-            Disabled: value.disabled,
-            _disabled: value.disabled,
-            Label: value.notFoundContent,
-            _label: value.notFoundContent
-          } as any) as MefDevOptionComponent
-        ];
-      }
-    } else {
-      return options;
-    }
-  }
-}

package/src/lib/pg-components/select/select.component.html

@@ -1,83 +0,0 @@
-<div tabindex="0" #trigger cdkOverlayOrigin #origin="cdkOverlayOrigin" [ngClass]="_selectionClassMap"
-  (keydown.Enter)="handleKeyEnterEvent($event)" (keydown.Backspace)="handleKeyBackspaceEvent($event)"
-  (keydown.ArrowUp)="handleKeyUpEvent($event)" (keydown.ArrowDown)="handleKeyDownEvent($event)">
-
-    <!-- Увесь селект-->
-  <div class="pg-select-selection__rendered" *ngIf="!ShowSearch">
-    <div class="pg-select-selection__placeholder">
-      <ng-template [ngIf]="!_selectedOption">
-        {{ PlaceHolder }}
-      </ng-template>
-    </div>
-    <div class="pg-select-selection-selected-value">
-      {{ _selectedOption?.Label }}
-    </div>
-  </div>
-  <!--Cписок options-->
-  <div class="pg-select-selection__rendered" *ngIf="ShowSearch">
-    <div [hidden]="_searchText||(!Open&&_selectedOption)||_selectedOptions.size"
-      class="pg-select-selection__placeholder">
-      <ng-template [ngIf]="(!_composing)&&_selectedOption">
-        {{ _selectedOption.Label }}
-      </ng-template>
-      <ng-template [ngIf]="(!_composing)&&(!_selectedOption)">
-        {{ PlaceHolder }}
-      </ng-template>
-    </div>
-
-
-    <!--Мультиселект-->
-    <ul *ngIf="Multiple"> 
-      <li *ngFor="let option of _selectedOptions" [@tagAnimation] [attr.title]="option?.Label || option?.Value"
-        class="pg-select-selection__choice" style="-webkit-user-select: none;">
-        <span class="pg-select-selection__choice__remove" (click)="unSelectMultipleOption(option,$event)"></span>
-        <div class="pg-select-selection__choice__content">{{ option?.Label }}</div>
-      </li>
-      <li class="pg-select-search pg-select-search--inline">
-        <div class="pg-select-search__field__wrap">
-          <input class="pg-select-search__field" (compositionstart)="compositionStart()"
-            (compositionend)="compositionEnd();updateWidth(searchInput,_searchText);" [(ngModel)]="_searchText"
-            (ngModelChange)="updateFilterOption();onSearchChange($event);"
-            (keydown)="updateWidth(searchInput,_searchText)" (input)="updateWidth(searchInput,_searchText)"
-            (blur)="onTouched()" #searchInput>
-          <span class="pg-select-search__field__mirror"></span></div>
-      </li>
-    </ul>
-    <div *ngIf="!Multiple" class="pg-select-selection-selected-value" [hidden]="!(_selectedOption?.Label)||Open">
-      {{ _selectedOption?.Label }}
-    </div>
-    <div *ngIf="!Multiple" [hidden]="!Open" class="pg-select-search pg-select-search--inline">
-      <div class="pg-select-search__field__wrap">
-        <input class="pg-select-search__field" (blur)="onTouched()" (compositionstart)="compositionStart()"
-          (compositionend)="compositionEnd()" [(ngModel)]="_searchText"
-          (ngModelChange)="updateFilterOption();onSearchChange($event);" #searchInput>
-        <span class="pg-select-search__field__mirror"></span>
-      </div>
-    </div>
-  </div>
-  <span (click)="onTouched();clearSelect($event)" class="pg-select-selection__clear" style="-webkit-user-select: none;"
-    *ngIf="_selectedOption?.Label&&AllowClear&&!Multiple">
-  </span>
-  <span class="pg-select-arrow"><b></b></span>
-</div>
-<ng-template cdkConnectedOverlay cdkConnectedOverlayHasBackdrop [cdkConnectedOverlayOrigin]="origin" cdkConnectedOverlayBackdropClass="backdrop"
-  (backdropClick)="closeDropDown()" (detach)="closeDropDown();" (positionChange)="onPositionChange($event)"
-  [cdkConnectedOverlayWidth]="_triggerWidth" [cdkConnectedOverlayOpen]="_isOpen">
-  <div [ngClass]="_dropDownClassMap" [@dropDownAnimation]="_dropDownPosition">
-    <div style="overflow: auto;">
-      <ul class="pg-select-dropdown-menu pg-select-dropdown-menu-vertical pg-select-dropdown-menu-root" #dropdownUl
-        (scroll)="dropDownScroll(dropdownUl)">
-        <li *ngFor="let option of _filterOptions" [class.pg-select-dropdown-menu-item-disabled]="option.Disabled"
-          [class.pg-select-dropdown-menu-item-active]="option.Value == _activeFilterOption?.Value"
-          [class.pg-select-dropdown-menu-item-selected]="(option.Value==(_selectedOption?.Value))||(isInSet(_selectedOptions,option))"
-          class="pg-select-dropdown-menu-item" (click)="clickOption(option,$event)">
-          <ng-template *ngIf="option.OptionTemplate" [ngTemplateOutlet]="option.OptionTemplate">
-          </ng-template>
-          <ng-template [ngIf]="!option.OptionTemplate">
-            {{ option.Label }}
-          </ng-template>
-        </li>
-      </ul>
-    </div>
-  </div>
-</ng-template>