@acorex/components 6.0.1 → 6.0.2

package/switch/src/switch.module.ts

@@ -1,13 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { AXLoadingModule } from '@acorex/components/loading';
-import { AXSwitchComponent } from './switch.component';
-
-@NgModule({
-  declarations: [AXSwitchComponent],
-  imports: [CommonModule, FormsModule, AXLoadingModule],
-  exports: [AXSwitchComponent],
-  providers: [],
-})
-export class AXSwitchModule {}

package/tabs/index.ts

@@ -1 +0,0 @@
-export * from './public-api'

package/tabs/ng-package.json

@@ -1,6 +0,0 @@
-{
-  "$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-  "lib": {
-    "entryFile": "public-api.ts"
-  }
-}

package/tabs/src/tab-content.directive.ts

@@ -1,23 +0,0 @@
-import { Directive, TemplateRef, ViewContainerRef } from '@angular/core';
-
-@Directive({
-  selector: '[axTabContent]',
-  exportAs: 'axTabContent',
-  inputs: ['portal: axTabContent'],
-})
-export class AXTabContentDirective {
-  constructor(private _viewContainerRef: ViewContainerRef) {}
-
-  private _portal: TemplateRef<any>;
-  public get portal(): TemplateRef<any> {
-    return this._portal;
-  }
-  public set portal(v: TemplateRef<any>) {
-    //;
-    if (v) {
-      this._portal = v;
-      this._viewContainerRef.clear();
-      const viewRef = this._viewContainerRef.createEmbeddedView(v, null, 0);
-    }
-  }
-}

package/tabs/src/tab-item.component.ts

@@ -1,125 +0,0 @@
-
-import { AXBaseComponent, AXComponentOptionChanged, _ClickableComponenetMixin } from '@acorex/components/mixin';
-import {
-  Component,
-  ViewEncapsulation,
-  ChangeDetectionStrategy,
-  ElementRef,
-  ChangeDetectorRef,
-  Input,
-  ViewChild,
-  TemplateRef,
-  Output,
-  EventEmitter,
-  HostListener,
-  ContentChild,
-} from '@angular/core';
-
-export const AXBaseTabItemMixin = _ClickableComponenetMixin(AXBaseComponent);
-
-@Component({
-  selector: 'ax-tab-item',
-  template: `
-    <ng-container *ngIf="headerTemplate; else header">
-      <ng-container
-        [ngTemplateOutlet]="headerTemplate"
-        [ngTemplateOutletContext]="{
-          $implicit: {
-            text: this.text,
-            key: this.key,
-            active: this.active,
-            disabled: this.disabled
-          }
-        }"
-      ></ng-container>
-    </ng-container>
-    <!-- <ng-container *ngIf="headerTemplate;else header">
-            <ng-content select="ax-header">
-            </ng-content>
-        </ng-container> -->
-    <ng-template #header>
-      <ng-content select="ax-prefix"></ng-content>
-      <span>{{ text }}</span>
-      <ng-content select="ax-suffix"></ng-content>
-    </ng-template>
-    <ng-template #content>
-      <ng-content select="ax-content"> </ng-content>
-    </ng-template>
-  `,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  encapsulation: ViewEncapsulation.None,
-})
-export class AXTabItemComponent extends AXBaseTabItemMixin {
-  constructor(_elementRef: ElementRef, _cdr: ChangeDetectorRef) {
-    super(_elementRef, _cdr);
-  }
-
-  @Input()
-  text: string;
-
-  @Input()
-  key: string;
-
-  @ViewChild('content')
-  template: TemplateRef<any>;
-
-  @ContentChild('header', { static: true })
-  headerTemplate: TemplateRef<any>;
-
-  @Output()
-  activeChange: EventEmitter<boolean> = new EventEmitter<boolean>();
-
-  private _active: boolean = false;
-  @Input()
-  public get active(): boolean {
-    return this._active;
-  }
-  public set active(value: boolean) {
-    this._setOption({
-      name: 'active',
-      value,
-      afterCallback: () => {
-        this._cdr.markForCheck();
-      },
-    });
-  }
-
-  @Output()
-  disabledChange: EventEmitter<boolean> = new EventEmitter<boolean>();
-  private _disabled: boolean = false;
-  @Input()
-  public get disabled(): boolean {
-    return this._disabled;
-  }
-  public set disabled(value: boolean) {
-    this._setOption({
-      name: 'disabled',
-      value,
-    });
-  }
-
-  @HostListener('click', ['$event'])
-  private __hostClick(e: MouseEvent) {
-    if (!this.disabled) {
-      this.onClick.emit({
-        component: this,
-        htmlElement: this._getHostElement(),
-        nativeEvent: e,
-      });
-    }
-  }
-
-  _onOptionChanged(option: AXComponentOptionChanged): void {
-    const classListRef = this._getHostElement().classList;
-    if (option.name == 'disabled') {
-      option.newValue
-        ? classListRef.add('ax-state-disabled')
-        : classListRef.remove('ax-state-disabled');
-    }
-    if (option.name == 'active') {
-      option.newValue
-        ? classListRef.add('ax-state-active')
-        : classListRef.remove('ax-state-active');
-    }
-  }
-}

package/tabs/src/tabs.class.ts

@@ -1,7 +0,0 @@
-import { AXEvent } from '@acorex/components/common';
-import { AXTabItemComponent } from './tab-item.component';
-
-export class AXTabStripChangedEvent extends AXEvent {
-  tab: AXTabItemComponent;
-  index: number;
-}

package/tabs/src/tabs.component.ts

@@ -1,108 +0,0 @@
-import {
-  Component,
-  ViewEncapsulation,
-  ChangeDetectionStrategy,
-  ElementRef,
-  ChangeDetectorRef,
-  ContentChildren,
-  QueryList,
-  Input,
-  Output,
-  EventEmitter,
-} from '@angular/core';
-import { AXTabStripChangedEvent } from './tabs.class';
-import { AXTabItemComponent } from './tab-item.component';
-import { AXTabContentDirective } from './tab-content.directive';
-import { AXBaseComponent } from '@acorex/components/mixin';
-
-@Component({
-  selector: 'ax-tabs',
-  template: `
-    <div class="ax-items-wrapper">
-      <ng-content select="ax-tab-item"> </ng-content>
-    </div>
-  `,
-  host: { class: 'ax-tabs' },
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  encapsulation: ViewEncapsulation.None,
-})
-export class AXTabsComponent extends AXBaseComponent {
-  @ContentChildren(AXTabItemComponent)
-  private _contentTabs: QueryList<AXTabItemComponent>;
-
-  @Input()
-  fitParent: boolean = false;
-
-  @Input()
-  minWidth: boolean = false;
-
-  @Input()
-  content: AXTabContentDirective;
-
-  constructor(elementRef: ElementRef, cdr: ChangeDetectorRef) {
-    super(elementRef, cdr);
-  }
-
-  private _isUserInteraction: boolean = false;
-
-  get items(): AXTabItemComponent[] {
-    return this._contentTabs.toArray();
-  }
-
-  private _selectedItem: AXTabItemComponent;
-
-  get selectedIndex(): number {
-    return this.items.indexOf(this._selectedItem);
-  }
-
-  get selectedItem(): AXTabItemComponent {
-    return this._selectedItem;
-  }
-
-  @Output()
-  onActiveTabChanged: EventEmitter<AXTabStripChangedEvent> = new EventEmitter<AXTabStripChangedEvent>();
-
-  onRenderCssClass() {
-    const classList = Array.from(this._getHostElement().classList);
-    if (!classList.some((c) => ['ax-vertical', 'ax-horizontal'].includes(c))) {
-      this._getHostElement().classList.add('ax-horizontal');
-    }
-    if (!classList.some((c) => c.startsWith('ax-look-'))) {
-      this._getHostElement().classList.add('ax-look-default');
-    }
-  }
-
-  onViewInit() {
-    const selected = this.items.find((c) => c.active) || this.items[0];
-
-    this.select(selected);
-    this.items.forEach((c) => {
-      c.onClick.subscribe((t) => {
-        this._isUserInteraction = t.nativeEvent?.isTrusted;
-        this.select(c);
-      });
-    });
-  }
-
-  select(tab: number | AXTabItemComponent) {
-    let tabItem: AXTabItemComponent =
-      typeof tab == 'number' ? this.items[tab] : tab;
-    //
-    if (!tab || this.selectedItem == tabItem) return;
-    this._selectedItem = tabItem;
-    //
-    this.items.forEach((c) => (c.active = false));
-    tabItem.active = true;
-    if (this.content) {
-      this.content.portal = tabItem.template;
-    }
-    this._cdr.markForCheck();
-    this.onActiveTabChanged.emit({
-      component: this,
-      isUserInteraction: this._isUserInteraction,
-      tab: tabItem,
-      index: this.selectedIndex,
-    });
-    this._isUserInteraction = false;
-  }
-}

package/tabs/src/tabs.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PortalModule } from '@angular/cdk/portal';
-import { AXDecoratorModule } from '@acorex/components/decorators';
-import { AXTabContentDirective } from './tab-content.directive';
-import { AXTabsComponent } from './tabs.component';
-import { AXTabItemComponent } from './tab-item.component';
-
-const COMPONENT = [AXTabsComponent, AXTabItemComponent, AXTabContentDirective];
-const MODULES = [CommonModule, PortalModule, AXDecoratorModule];
-
-@NgModule({
-    declarations: [...COMPONENT],
-    imports: [...MODULES],
-    exports: [...COMPONENT],
-    providers: [],
-})
-export class AXTabsModule { }

package/test.ts

@@ -1,27 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js';
-import 'zone.js/testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: {
-  context(path: string, deep?: boolean, filter?: RegExp): {
-    <T>(id: string): T;
-    keys(): string[];
-  };
-};
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting(),
-);
-
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().forEach(context);

package/textarea/index.ts

@@ -1 +0,0 @@
-export * from './public-api'

package/textarea/ng-package.json

@@ -1,6 +0,0 @@
-{
-  "$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-  "lib": {
-    "entryFile": "public-api.ts"
-  }
-}

package/textarea/src/textarea.component.html

@@ -1,6 +0,0 @@
-<ng-content select="ax-prefix"></ng-content>
-<textarea [attr.name]="name" type="text" [rows]="rows" [attr.placeholder]="placeholder" [attr.maxlength]="maxLength"
-    [class.ax-state-disabled]="disabled" [class.ax-state-readonly]="readonly" [disabled]="disabled"
-    [readonly]="readonly" [tabindex]="tabIndex" [(ngModel)]="value" (focus)="_emitOnFocusEvent($event)"
-    (blur)="_emitOnBlurEvent($event)" [attr.autocomplete]="autoComplete"></textarea>
-<ng-content select="ax-suffix"></ng-content>

package/textarea/src/textarea.component.ts

@@ -1,32 +0,0 @@
-
-import { AXBaseTextBoxMixin } from '@acorex/components/mixin';
-import {
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  Input,
-  ViewEncapsulation,
-} from '@angular/core';
-
-
-@Component({
-  selector: 'ax-textarea',
-  templateUrl: './textarea.component.html',
-  inputs: ['disabled', 'tabIndex', 'readonly','allowNull','value','name', 'checked', 'placeholder', 'maxLength', 'allowNull', 'debounceTime', 'type', 'autoComplete', 'readonly','allowNull','value','name', 'checked'],
-  outputs: ['onBlur', 'onFocus', 'valueChange', 'onValueChanged'],
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  host: { class: 'ax-textarea-container ax-textarea' },
-})
-export class AXTextareaComponent extends AXBaseTextBoxMixin {
-  @Input()
-  rows: number = 0;
-
-  /**
-   *  @ignore
-   */
-  constructor(elementRef: ElementRef, cdr: ChangeDetectorRef) {
-    super(elementRef, cdr);
-  }
-}

package/textarea/src/textarea.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { AXTextareaComponent } from './textarea.component';
-
-@NgModule({
-  declarations: [AXTextareaComponent],
-  imports: [CommonModule, FormsModule],
-  exports: [AXTextareaComponent],
-})
-export class AXTextareaModule {}

package/textbox/index.ts

@@ -1 +0,0 @@
-export * from './public-api'

package/textbox/ng-package.json

@@ -1,6 +0,0 @@
-{
-  "$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-  "lib": {
-    "entryFile": "public-api.ts"
-  }
-}

package/textbox/public-api.ts

@@ -1,2 +0,0 @@
-export * from './src/textbox.component';
-export * from './src/textbox.module';

package/textbox/src/textbox.component.html

@@ -1,17 +0,0 @@
-<ng-content select="ax-prefix">
-</ng-content>
-<input class="ax-input" [attr.name]="name" [attr.autocomplete]="autoComplete" [attr.type]="type" [attr.placeholder]="placeholder" [attr.maxlength]="maxLength"
-    [class.ax-state-disabled]="disabled" [class.ax-state-readonly]="readonly" [disabled]="disabled" 
-    [readonly]="readonly" [tabindex]="tabIndex"
-    [ngModel]="value" (ngModelChange)="_handleModleChange($event)"
-    (keydown)="_emitOnKeydownEvent($event)" 
-    (keyup)="_emitOnKeyupEvent($event)"
-    (keypress)="_emitOnKeypressEvent($event)"
-    (focus)="_emitOnFocusEvent($event)"
-    (blur)="_emitOnBlurEvent($event)">
-<ng-content select="ax-suffix">
-</ng-content>
-<ng-content select="ax-validation-rule">
-</ng-content>
-<ng-content select="ax-input-mask">
-</ng-content>

package/textbox/src/textbox.component.ts

@@ -1,37 +0,0 @@
-
-import {
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  ViewEncapsulation,
-} from '@angular/core';
-import { AXComponent, AXFocusableComponent } from '@acorex/components/common';
-import { AXBaseTextBoxMixin } from '@acorex/components/mixin';
-
-/**
- * The Textbox is a component which detects user interaction and triggers a corresponding event
- *
- * @category Components
- */
-@Component({
-  selector: 'ax-text-box',
-  templateUrl: 'textbox.component.html',
-  inputs: ['disabled', 'tabIndex', 'readonly','allowNull','value','name', 'checked', 'placeholder', 'maxLength', 'allowNull', 'debounceTime', 'type', 'autoComplete', 'readonly','allowNull','value','name', 'checked'],
-  outputs: ['onBlur', 'onFocus', 'valueChange', 'onValueChanged'],
-  host: { class: 'ax-editor-container' },
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    { provide: AXComponent, useExisting: AXTextBoxComponent },
-    { provide: AXFocusableComponent, useExisting: AXTextBoxComponent },
-  ],
-})
-export class AXTextBoxComponent extends AXBaseTextBoxMixin {
-  /**
-   *  @ignore
-   */
-  constructor(elementRef: ElementRef, cdr: ChangeDetectorRef) {
-    super(elementRef, cdr);
-  }
-}

package/textbox/src/textbox.module.ts

@@ -1,22 +0,0 @@
-import { AXButtonModule } from '@acorex/components/button';
-import { AXDecoratorModule } from '@acorex/components/decorators';
-import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
-import { FormsModule } from '@angular/forms';
-import { NgxMaskModule } from 'ngx-mask';
-import { AXTextBoxComponent } from './textbox.component';
-
-
-@NgModule({
-    imports: [
-        CommonModule,
-        FormsModule,
-        AXButtonModule,
-        AXDecoratorModule,
-        NgxMaskModule.forChild()
-    ],
-    exports: [AXTextBoxComponent],
-    declarations: [AXTextBoxComponent],
-    providers: [],
-})
-export class AXTextBoxModule { }

package/time-box/index.ts

@@ -1 +0,0 @@
-export * from './public-api'

package/time-box/ng-package.json

@@ -1,6 +0,0 @@
-{
-  "$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-  "lib": {
-    "entryFile": "public-api.ts"
-  }
-}

package/time-box/src/time-box.component.html

@@ -1,16 +0,0 @@
-<ng-content select="ax-prefix">
-</ng-content>
-<input class="ax-input" [imask]="_maskObj" [unmask]="false"  type="text" [attr.placeholder]="placeholder"
-    [class.ax-state-disabled]="disabled" [class.ax-state-readonly]="readonly" [disabled]="disabled"
-    [readonly]="readonly" [tabindex]="tabIndex" [ngModel]="displayText" 
-    (mouseup)="_handleOnInputClickEvent($event)"
-    (focus)="_emitOnFocusEvent($event)"
-    (blur)="_emitOnBlurEvent($event)"
-    (keyup)="_handleKeyUpEvent($event)" 
-    (keydown)="_handleOnKeydownEvent($event)" 
-    autocomplete="off">
-
-<ng-content select="ax-suffix">
-</ng-content>
-<ng-content select="ax-validation-rule">
-</ng-content>