@acorex/components 6.5.27 → 6.5.29

package/src/lib/tab-strip/tab-strip.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXTabStripComponent } from './tab-strip.component';
-
-@NgModule({
-  declarations: [AXTabStripComponent],
-  imports: [CommonModule],
-  exports: [AXTabStripComponent],
-  providers: []
-})
-export class AXTabStripModule {}

package/src/lib/tab-view/dynamic-tabs.directive.ts

@@ -1,17 +0,0 @@
-/**
- * This directive is used as an anchor to get access
- * to the ViewContainerRef which here is exposed via
- * the public member `viewContainer`
- *
- * Theres an ALTERNATIVE to explicitly using the anchor directive.
- * Read in the blog post
- */
-
-import { Directive, ViewContainerRef } from '@angular/core';
-
-@Directive({
-  selector: '[dynamic-tabs]'
-})
-export class DynamicTabsDirective {
-  constructor(public viewContainer: ViewContainerRef) {}
-}

package/src/lib/tab-view/tab-view.component.html

@@ -1,33 +0,0 @@
-<ul class="ax nav-tabs">
-  <li
-    *ngFor="let tab of tabs"
-    (click)="selectTab(tab)"
-    [class.active]="tab.active"
-    [class.flex-sm-fill]="fullWidth"
-  >
-    <i class="{{ tab.icon }}"></i>
-    <span>{{ tab.caption }}</span>
-  </li>
-  <!-- dynamic tabs -->
-  <li
-    *ngFor="let tab of dynamicTabs"
-    (click)="selectTab(tab)"
-    [class.active]="tab.active"
-    [class.flex-sm-fill]="fullWidth"
-  >
-    <i class="{{ tab.icon }}"></i>
-    <span>
-      {{ tab.caption }}
-      <i
-        *ngIf="tab.isCloseable"
-        (click)="closeTab(tab)"
-        class="far fa-times"
-      >
-      </i>
-    </span>
-  </li>
-</ul>
-<div class="ax-tab-container">
-  <ng-content></ng-content>
-<ng-template dynamic-tabs #container></ng-template>
-</div>

package/src/lib/tab-view/tab-view.component.ts

@@ -1,129 +0,0 @@
-/**
- * The main component that renders single TabComponent
- * instances.
- */
-
-import {
-  Component,
-  ContentChildren,
-  QueryList,
-  AfterContentInit,
-  ViewChild,
-  ComponentFactoryResolver,
-  ViewEncapsulation,
-  Attribute,
-  Output,
-  EventEmitter,
-  ElementRef
-} from '@angular/core';
-
-import { AXTabComponent } from './tab.component';
-import { DynamicTabsDirective } from './dynamic-tabs.directive';
-import { AXDataEvent } from '../base/events.class';
-
-@Component({
-  selector: 'ax-tab-view',
-  templateUrl: './tab-view.component.html',
-  styleUrls: ['./tab-view.component.scss'],
-  encapsulation: ViewEncapsulation.None
-})
-export class AXTabViewComponent implements AfterContentInit {
-  dynamicTabs: AXTabComponent[] = [];
-
-  @ContentChildren(AXTabComponent) tabs: QueryList<AXTabComponent>;
-
-  @ViewChild(DynamicTabsDirective) dynamicTabPlaceholder: DynamicTabsDirective;
-
-  @Output()
-  onActiveTab: EventEmitter<AXDataEvent<any>> = new EventEmitter<AXDataEvent<any>>();
-  /*
-    Alternative approach of using an anchor directive
-    would be to simply get hold of a template variable
-    as follows
-  */
-  // @ViewChild('container', {read: ViewContainerRef}) dynamicTabPlaceholder;
-
-  constructor(
-    private ref: ElementRef,
-    private _componentFactoryResolver: ComponentFactoryResolver,
-    @Attribute('fullWidth') public fullWidth: boolean = false
-  ) {}
-
-  // contentChildren are set
-  ngAfterContentInit() {
-    // get all active tabs
-    const activeTabs = this.tabs.filter((tab) => tab.active);
-
-    // if there is no active tab set, activate the first
-    if (activeTabs.length === 0 && this.tabs.first) {
-      this.selectTab(this.tabs.first);
-    }
-  }
-
-  openTab(title: string, template, isCloseable = false, icon = null, data = null) {
-    // get a component factory for our AXTabComponent
-    const componentFactory = this._componentFactoryResolver.resolveComponentFactory(AXTabComponent);
-
-    // fetch the view container reference from our anchor directive
-    const viewContainerRef = this.dynamicTabPlaceholder.viewContainer;
-
-    // alternatively...
-    // let viewContainerRef = this.dynamicTabPlaceholder;
-
-    // create a component instance
-    const componentRef = viewContainerRef.createComponent(componentFactory);
-
-    // set the according properties on our component instance
-    const instance: AXTabComponent = componentRef.instance as AXTabComponent;
-    instance.caption = title;
-    instance.template = template;
-    instance.dataContext = data;
-    instance.isCloseable = isCloseable;
-    instance.icon = icon;
-
-    // remember the dynamic component for rendering the
-    // tab navigation headers
-    this.dynamicTabs.push(componentRef.instance as AXTabComponent);
-
-    //componentRef.changeDetectorRef.detectChanges();
-
-    // set it active
-    this.selectTab(this.dynamicTabs[this.dynamicTabs.length - 1]);
-  }
-
-  selectTab(tab: AXTabComponent) {
-    // deactivate all tabs
-    this.tabs.toArray().forEach((tab) => (tab.active = false));
-    this.dynamicTabs.forEach((tab) => (tab.active = false));
-
-    // activate the tab the user has clicked on.
-    tab.active = true;
-    this.onActiveTab.emit({ component: this, data: tab, htmlElement: this.ref.nativeElement });
-  }
-
-  closeTab(tab: AXTabComponent) {
-    for (let i = 0; i < this.dynamicTabs.length; i++) {
-      if (this.dynamicTabs[i] === tab) {
-        // remove the tab from our array
-        this.dynamicTabs.splice(i, 1);
-
-        // destroy our dynamically created component again
-        const viewContainerRef = this.dynamicTabPlaceholder.viewContainer;
-        // let viewContainerRef = this.dynamicTabPlaceholder;
-        viewContainerRef.remove(i);
-
-        // set tab index to 1st one
-        this.selectTab(this.tabs.first);
-        break;
-      }
-    }
-  }
-
-  closeActiveTab() {
-    const activeTabs = this.dynamicTabs.filter((tab) => tab.active);
-    if (activeTabs.length > 0) {
-      // close the 1st active tab (should only be one at a time)
-      this.closeTab(activeTabs[0]);
-    }
-  }
-}

package/src/lib/tab-view/tab-view.module.ts

@@ -1,12 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXTabComponent } from './tab.component';
-import { AXTabViewComponent } from './tab-view.component';
-import { DynamicTabsDirective } from './dynamic-tabs.directive';
-@NgModule({
-  declarations: [AXTabComponent, AXTabViewComponent, DynamicTabsDirective],
-  imports: [CommonModule],
-  exports: [AXTabComponent, AXTabViewComponent, DynamicTabsDirective],
-  providers: []
-})
-export class AXTabViewModule {}

package/src/lib/tab-view/tab.component.html

@@ -1,8 +0,0 @@
-<div [hidden]="!active" class="ax tab-pane">
-    <ng-content></ng-content>
-    <ng-container *ngIf="template"
-      [ngTemplateOutlet]="template"
-      [ngTemplateOutletContext]="dataContext"
-    >
-    </ng-container>
-</div>

package/src/lib/tab-view/tab.component.ts

@@ -1,15 +0,0 @@
-import { Component, Input, ViewEncapsulation } from '@angular/core';
-@Component({
-  selector: 'ax-tab',
-  templateUrl: './tab.component.html',
-  encapsulation: ViewEncapsulation.None
-})
-export class AXTabComponent {
-  @Input() caption: string;
-  @Input() name: string;
-  @Input() active = false;
-  @Input() isCloseable = false;
-  @Input() template: any;
-  @Input() dataContext: any;
-  @Input() icon: string;
-}

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

@@ -1,13 +0,0 @@
-<div class="ax form-item {{size}}" [class.disabled]="disabled" [attr.id]="uid">
-    <div class="content">
-        <div class="ax input {{size}}" [class.disabled]="disabled" [class.readonly]="readonly">
-            <textarea [name]="name" [attr.maxlength]="maxLength" rows="{{rows}}" cols="{{cols}}" #input type="text"
-                class="ax icon {{size}}" [ngClass]="setTextAlign()" placeholder="{{placeholder}}" [readonly]="readonly"
-                [disabled]="disabled" value="{{value}}"></textarea>
-        </div>
-    </div>
-    <div class="ax buttons">
-        <ng-content select="ax-button">
-        </ng-content>
-    </div>
-</div>

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

@@ -1,24 +0,0 @@
-import { Component, ChangeDetectionStrategy, ViewEncapsulation, ChangeDetectorRef, ViewChild, ElementRef, Input } from '@angular/core';
-import { AXBaseTextComponent, AXValidatableComponent } from '../base/element.class';
-
-@Component({
-  selector: 'ax-text-area',
-  templateUrl: './textarea.component.html',
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  host: { style:'width: 100%' },
-  providers: [{ provide: AXValidatableComponent, useExisting: AXTextAreaComponent }]
-})
-export class AXTextAreaComponent extends AXBaseTextComponent {
-  constructor(protected cdr: ChangeDetectorRef, ref: ElementRef) {
-    super(cdr, ref);
-  }
-
-  @Input()
-  rows: number = 0;
-  @Input()
-  cols: number = 0;
-
-  @Input()
-  maxLength: number = null;
-}

package/src/lib/textarea/textarea.module.ts

@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXTextAreaComponent } from './textarea.component';
-
-const COMPONENT = [AXTextAreaComponent];
-const MODULES = [CommonModule];
-
-@NgModule({
-    declarations: [...COMPONENT],
-    imports: [...MODULES],
-    exports: [...COMPONENT],
-    providers: [],
-})
-export class AXTextAreaModule { }

package/src/lib/textbox/textbox.component.html

@@ -1,22 +0,0 @@
-<div class="ax form-item" [class.disabled]="disabled" [attr.id]="uid" #fc>
-    <div class="ax items-wrapper">
-        <ng-content select="[start]">
-        </ng-content>
-    </div>
-    <div class="content" #content>
-        <div class="ax form-control input {{size}}" [class.disabled]="disabled" [class.readonly]="readonly"
-            [class.icon]="icon">
-            <input #input [autocomplete]="autocomplete" [name]="name" class="ax {{size}}" [attr.type]="type" [attr.maxlength]="maxLength"
-                [textMask]="{mask: mask || false, showMask : showMask, keepCharPositions:maskKeepCharPositions,guide:maskGuid,placeholderChar:maskPlaceholder}"
-                [(ngModel)]="value" placeholder="{{placeholder}}" [readonly]="readonly" [disabled]="disabled"
-                [ngClass]="setTextAlign()" [class.clear]="value && allowClear" (focus)="handleInputFocus($event)"
-                (blur)="handleInputBlur($event)">
-            <i class="{{icon}}" *ngIf="icon"></i>
-        </div>
-    </div>
-    <div class="ax items-wrapper">
-        <ax-button *ngIf="value && allowClear" icon="far fa-times" type="danger blank" (click)="clear()"></ax-button>
-        <ng-content select="[end]">
-        </ng-content>
-    </div>
-</div>

package/src/lib/textbox/textbox.component.ts

@@ -1,38 +0,0 @@
-import { Component, ChangeDetectionStrategy, ViewEncapsulation, ChangeDetectorRef, ViewChild, ElementRef, Input } from '@angular/core';
-import { AXBaseTextComponent, AXValidatableComponent } from '../base/element.class';
-
-@Component({
-  selector: 'ax-text-box',
-  templateUrl: './textbox.component.html',
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  host: { style:'width: 100%' },
-  providers: [{ provide: AXValidatableComponent, useExisting: AXTextBoxComponent }]
-})
-export class AXTextBoxComponent extends AXBaseTextComponent {
-
-  @Input()
-  mask: any;
-
-  @Input()
-  type: 'text' | 'number' | 'tel' | 'url' | 'password' | 'search' = 'text';
-
-  @Input()
-  showMask: boolean = true;
-
-  @Input()
-  maxLength: number;
-
-  @Input()
-  maskGuid: boolean = false;
-
-  @Input()
-  maskPlaceholder: string = '_';
-
-  @Input()
-  maskKeepCharPositions: boolean = false;
-
-  constructor(protected cdr: ChangeDetectorRef, ref: ElementRef) {
-    super(cdr, ref);
-  }
-}

package/src/lib/textbox/textbox.module.ts

@@ -1,16 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXTextBoxComponent } from './textbox.component';
-import { AXButtonModule } from '../button/button.module';
-import { TextMaskModule } from 'angular2-text-mask';
-import { FormsModule } from '@angular/forms';
-const COMPONENT = [AXTextBoxComponent];
-const MODULES = [CommonModule, AXButtonModule, TextMaskModule, FormsModule];
-
-@NgModule({
-  declarations: [...COMPONENT],
-  imports: [...MODULES],
-  exports: [...COMPONENT],
-  providers: []
-})
-export class AXTextBoxModule { }

package/src/lib/time-picker/time-picker.component.html

@@ -1,21 +0,0 @@
-<div class="ax form-item" [class.disabled]="disabled" [attr.id]="uid" #fc>
-    <div class="ax items-wrapper">
-        <ng-content select="[start]">
-        </ng-content>
-    </div>
-    <div class="content" #content>
-        <div class="ax form-control input {{size}}" [class.disabled]="disabled" [class.readonly]="readonly" [class.icon]="icon">
-            <input #input type="text" class="ax {{size}}" [textMask]="timeType" [(ngModel)]="textValue" placeholder="{{placeholder}}" [readonly]="readonly" [disabled]="disabled" [ngClass]="setTextAlign()" [class.clear]="value && allowClear" (focus)="handleInputFocus()"
-                (blur)="handleInputBlur($event)" (keypress)='handleKeyPress($event)' (keyup)="handleKeyUp($event)" (keydown)="handleKeyDown($event)" (click)="handleClick($event)">
-            <i class="{{icon}}" *ngIf="icon"></i>
-        </div>
-    </div>
-    <div class="ax items-wrapper">
-        <ax-button *ngIf="value && allowClear" icon="far fa-times" type="danger blank" (click)="clear()" [disabled]="disabled" [tabIndex]="-1"></ax-button>
-        <ng-content select="[end]">
-        </ng-content>
-    </div>
-</div>
-<!-- [textMask]="{mask: mask , showMask:showMask , guid: maskGuid , keepCharPositions: maskKeepCharPositions}" -->
-<!-- <input #input id="timePickerValue" [textMask]="timeType" type="text" [(ngModel)]="value" (keypress)='handleKeyPress($event)'
-    (keyup)="handleKeyUp($event)" (keydown)="handleKeyDown($event)" (click)="handleClick($event)"> -->