@acorex/components 5.0.5 → 5.0.9

package/src/lib/alert/alert-button.component.ts

@@ -1,45 +0,0 @@
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, ChangeDetectorRef, Input, Attribute, HostListener } from '@angular/core';
-import { AXBaseClickableMixin } from '../base';
-import { BUTTON_OUTPUT } from '../base/mixin/button-mixin.class';
-
-@Component({
-    selector: 'ax-alert-button',
-    template: `
-       {{title}}
-       <i *ngIf="icon" class="{{icon}}"></i>
-    `,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    outputs: [...BUTTON_OUTPUT],
-    host: { class: 'ax-alert-button' }
-})
-export class AXAlertButtonComponent extends AXBaseClickableMixin {
-
-    @Input()
-    title: string;
-
-    @Input()
-    icon: string;
-
-
-    constructor(elementRef: ElementRef, cdr: ChangeDetectorRef) {
-        super(elementRef, cdr)
-    }
-
-    @HostListener('click', ['$event'])
-    _handleOnClick(e) {
-        this._emitOnClickEvent(e);
-    }
-
-    @HostListener('focus', ['$event'])
-    _handleOnFocus(e) {
-        this._emitOnFocusEvent(e);
-    }
-
-    @HostListener('blur', ['$event'])
-    _handleOnBlur(e) {
-        this._emitOnBlurEvent(e);
-    }
-
-
-}

package/src/lib/alert/alert-contnet.component.ts

@@ -1,14 +0,0 @@
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, ChangeDetectorRef, Input, Attribute } from '@angular/core';
-
-@Component({
-    selector: 'ax-alert-content',
-    template:
-        `<ng-content>
-        </ng-content>
-    `,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    host: { class: 'ax-alert-content' }
-})
-export class AXAlertContentComponent {
-}

package/src/lib/alert/alert-footer.component.ts

@@ -1,16 +0,0 @@
-import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';
-
-@Component({
-    selector: 'ax-alert-footer',
-    template: `
-        <div class="ax-alert-buttons">
-            <ng-content select="ax-alert-button">
-            </ng-content>
-        </div>
-    `,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    host: { class: 'ax-alert-footer' }
-})
-export class AXAlertFooterComponent  {
-}

package/src/lib/alert/alert-suffix.component.ts

@@ -1,16 +0,0 @@
-import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';
-
-@Component({
-    selector: 'ax-alert-suffix',
-    template: `
-        <div class="ax-alert-buttons">
-            <ng-content select="ax-alert-button">
-            </ng-content>
-        </div>
-    `,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    host: { class: 'ax-alert-suffix' }
-})
-export class AXAlertSuffixComponent {
-}

package/src/lib/alert/alert-title.component.ts

@@ -1,14 +0,0 @@
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, ChangeDetectorRef, Input, Attribute } from '@angular/core';
-
-@Component({
-    selector: 'ax-alert-title',
-    template: `
-        <ng-content>
-        </ng-content>
-    `,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    host: { class: 'ax-alert-title' }
-})
-export class AXAlertTitleComponent  {
-}

package/src/lib/alert/alert.component.html

@@ -1,13 +0,0 @@
-<div class="ax-alert-icon" *ngIf="icon">
-    <i class="{{icon}} fa-lg"></i>
-</div>
-<div class="ax-alert-body">
-    <ng-content select="ax-alert-title">
-    </ng-content>
-    <ng-content select="ax-alert-content">
-    </ng-content>
-    <ng-content select="ax-alert-footer">
-    </ng-content>
-</div>
-<ng-content select="ax-alert-suffix">
-</ng-content>

package/src/lib/alert/alert.component.ts

@@ -1,139 +0,0 @@
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, ChangeDetectorRef, Input, ViewChildren, QueryList, EventEmitter, Output, HostBinding } from '@angular/core';
-import { AXBaseComponentMixin, AXStyleColorType } from '../base';
-
-
-/**
- * Regular description
- *
- * @category Components
- */
-@Component({
-    selector: 'ax-alert',
-    templateUrl: './alert.component.html',
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    host: { class: 'ax-alert ax-none' }
-})
-export class AXAlertComponent extends AXBaseComponentMixin {
-
-    @Input()
-    icon: string;
-
-    @Output()
-    typeChange: EventEmitter<AXStyleColorType> = new EventEmitter<AXStyleColorType>();
-
-    private _color: AXStyleColorType;
-
-    /**
-    *  The Alert allows you to set different types of alerts
-    */
-    @Input()
-    public get color(): AXStyleColorType {
-        return this._color;
-    }
-    public set color(v: AXStyleColorType) {
-        this._color = v;
-        this.typeChange.emit(v);
-        switch (this.color) {
-            case 'success':
-                this.icon = 'ax-ic ax-ic-check-filled';
-                break;
-            case 'warning':
-                this.icon = 'ax-ic-warning-filled';
-                break;
-            case 'danger':
-                this.icon = 'ax-ic-error-filled';
-                break;
-            default:
-                this.icon = 'ax-ic ax-ic-info-filled';
-                break;
-        }
-    }
-
-    @HostBinding('class')
-    get hostClass(): string {
-        return `ax-${this.color}`;
-    }
-
-
-
-
-    @Input()
-    timeOut: number;
-
-    #visible: boolean;
-
-    /**
-    *  set the visibility of the Alert
-    */
-    @Input()
-    public get visible(): boolean {
-        return this.#visible;
-    }
-    public set visible(v: boolean) {
-        if (this.#visible != v) {
-            this.#visible = v;
-            const host = this._getHostElement();
-            if (v) {
-                host.classList.remove('ax-state-hidden');
-                host.classList.add('ax-state-visible');
-            }
-            else {
-                host.classList.add('ax-state-hidden');
-                host.classList.toggle('ax-state-visible');
-            }
-        }
-    }
-
-
-    /**
-    *  @ignore
-    */
-    constructor(
-        elementRef: ElementRef,
-        cdr: ChangeDetectorRef
-    ) {
-        super(elementRef, cdr);
-    }
-
-    onInit() {
-        if (this.timeOut) {
-            setTimeout(() => {
-                this.dismiss()
-            }, this.timeOut);
-        }
-    }
-
-    onViewInit() {
-        if (this.visible == undefined) {
-            this.visible = true;
-        }
-    }
-
-    /**
-    *  Remove the alert from the container
-    */
-    dismiss(): void {
-        const host = this._getHostElement();
-        this.visible = false;
-        const func = () => {
-            host.parentElement.removeChild(host);
-        }
-        host.addEventListener('transitionend', func);
-    }
-
-
-    /**
-    *  Hide the alert
-    */
-    hide(): void {
-        this.visible = false;
-    }
-
-    /**
-    *  Show the alert
-    */
-    show() {
-        this.visible = true;
-    }
-}

package/src/lib/alert/alert.module.ts

@@ -1,26 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXAlertComponent } from './alert.component';
-import { AXAlertContentComponent } from './alert-contnet.component';
-import { AXAlertTitleComponent } from './alert-title.component';
-import { AXAlertButtonComponent } from './alert-button.component';
-import { AXAlertFooterComponent } from './alert-footer.component';
-import { AXAlertSuffixComponent } from './alert-suffix.component';
-
-const COMPONENT = [
-    AXAlertComponent,
-    AXAlertContentComponent,
-    AXAlertTitleComponent,
-    AXAlertButtonComponent,
-    AXAlertFooterComponent,
-    AXAlertSuffixComponent
-];
-const MODULES = [CommonModule];
-
-@NgModule({
-    declarations: [...COMPONENT],
-    imports: [...MODULES],
-    exports: [...COMPONENT],
-    providers: [],
-})
-export class AXAlertModule { }

package/src/lib/avatar/avatar.component.html

@@ -1,2 +0,0 @@
-
-<div>Hi ax-avatar</div>

package/src/lib/avatar/avatar.component.ts

@@ -1,64 +0,0 @@
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, ChangeDetectorRef, Input } from '@angular/core';
-import { AXSizableComponentMixin, BASE_INPUTS } from '../base';
-import { SIZABLE_INPUTS } from '../base/mixin/sizable-mixin.class';
-
-@Component({
-    selector: 'ax-avatar',
-    templateUrl: './avatar.component.html',
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    inputs: [...BASE_INPUTS, ...SIZABLE_INPUTS],
-    host: { class: 'ax-avatar' }
-})
-export class AXAvatarComponent extends AXSizableComponentMixin {
-
-    constructor(
-        elementRef: ElementRef,
-        cdr: ChangeDetectorRef
-    ) {
-        super(elementRef, cdr);
-    }
-
-
-
-    private _image: string;
-    @Input()
-    public get image(): string {
-        return this._image;
-    }
-    public set image(v: string) {
-        this._image = v;
-    }
-
-
-    private _title: string;
-    @Input()
-    public get title(): string {
-        return this._title;
-    }
-    public set title(v: string) {
-        this._title = v;
-    }
-
-
-    private _icon: string;
-    @Input()
-    public get icon(): string {
-        return this._icon;
-    }
-    public set icon(v: string) {
-        this._icon = v;
-    }
-
-
-    private _abbr: string;
-    @Input()
-    public get abbr(): string {
-        return this._abbr;
-    }
-    public set abbr(v: string) {
-        this._abbr = v;
-    }
-
-
-}

package/src/lib/avatar/avatar.module.ts

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

package/src/lib/base/common.module.ts

@@ -1,13 +0,0 @@
-import { NgModule } from '@angular/core';
-import { AXResponsiveDirective } from './responsive.directive';
-
-
-
-
-@NgModule({
-    imports: [],
-    exports: [AXResponsiveDirective],
-    declarations: [AXResponsiveDirective],
-    providers: [],
-})
-export class AXCommonModule { }

package/src/lib/base/custom-cdk-overlay.service.ts

@@ -1,83 +0,0 @@
-import {
-    Overlay,
-    OverlayKeyboardDispatcher,
-    OverlayPositionBuilder,
-    ScrollStrategyOptions,
-    OverlayContainer,
-    OverlayRef,
-    OverlayConfig,
-    OverlayOutsideClickDispatcher
-} from '@angular/cdk/overlay';
-import {
-    ComponentFactoryResolver,
-    Inject,
-    Injector,
-    NgZone,
-    Renderer2,
-    RendererFactory2,
-    Injectable,
-} from '@angular/core';
-
-import { Directionality } from '@angular/cdk/bidi';
-import { DOCUMENT, Location } from '@angular/common';
-
-@Injectable({
-    providedIn: 'root'
-})
-export class DynamicOverlayContainer extends OverlayContainer {
-    public setContainerElement(containerElement: HTMLElement): void {
-        this._containerElement = containerElement;
-    }
-}
-
-
-
-@Injectable({
-    providedIn: 'root'
-})
-export class DynamicOverlay extends Overlay {
-    private readonly _dynamicOverlayContainer: DynamicOverlayContainer;
-    private renderer: Renderer2;
-
-    constructor(
-        scrollStrategies: ScrollStrategyOptions,
-        _overlayContainer: DynamicOverlayContainer,
-        _componentFactoryResolver: ComponentFactoryResolver,
-        _positionBuilder: OverlayPositionBuilder,
-        _keyboardDispatcher: OverlayKeyboardDispatcher,
-        _injector: Injector,
-        _ngZone: NgZone,
-        @Inject(DOCUMENT) _document: any,
-        _directionality: Directionality,
-        rendererFactory: RendererFactory2,
-        _location: Location,
-        _outsideClickDispatcher: OverlayOutsideClickDispatcher,
-    ) {
-        super(
-            scrollStrategies,
-            _overlayContainer,
-            _componentFactoryResolver,
-            _positionBuilder,
-            _keyboardDispatcher,
-            _injector,
-            _ngZone,
-            _document,
-            _directionality,
-            _location,
-            _outsideClickDispatcher,
-        );
-        this.renderer = rendererFactory.createRenderer(null, null);
-
-        this._dynamicOverlayContainer = _overlayContainer;
-    }
-
-    private setContainerElement(containerElement: HTMLElement): void {
-        this.renderer.setStyle(containerElement, 'transform', 'translateZ(0)');
-        this._dynamicOverlayContainer.setContainerElement(containerElement);
-    }
-
-    public createOn(containerElement: HTMLElement, config?: OverlayConfig): OverlayRef {
-        this.setContainerElement(containerElement);
-        return super.create(config);
-    }
-}

package/src/lib/base/mixin/base-components.class.ts

@@ -1,112 +0,0 @@
-import { ChangeDetectorRef, Inject, Injectable } from "@angular/core";
-import { ElementRef } from "@angular/core";
-import { Constructor } from "./constratctor";
-
-
-/**
-* A token that specifies the size of component.
-*/
-export type AXElementSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-
-@Injectable()
-export class AXBaseComponent {
-    id: string = `ax-${new Date().getTime().toString()}`;
-
-    /**
-    * A token that specifies the layout direction of component.
-    */
-    rtl: boolean;
-
-    cssClass: string;
-    cssStyle: string;
-
-
-    #elementRef: ElementRef;
-    _cdr: ChangeDetectorRef;
-
-    _isInited: boolean;
-    _isRendered: boolean;
-
-    /**
-    *  @ignore
-    */
-    constructor(@Inject(Array) ...args: any[]) {
-        this.#elementRef = args[0];
-        this._cdr = args[1];
-    }
-
-    ngOnInit() {
-        this._isInited = true;
-        this._onInternalInit();
-    }
-
-    ngAfterViewInit() {
-        this._isRendered = true;
-        this._onInternalViewInit();
-    }
-
-    ngOnDestroy() {
-        this._onInternalDestroy();
-    }
-
-    _getHostElement<T = HTMLElement>(): T {
-        return this.#elementRef.nativeElement as T;
-    }
-
-    _getInnerElement<T = HTMLElement>(): T {
-        return this._getHostElement().firstElementChild as unknown as T;
-    }
-
-
-    _onInternalInit() {
-        (this._getHostElement() as any).__axContext__ = this;
-        this._getHostElement().setAttribute('data-id', this.id);
-        if (this.rtl == null) {
-            this.rtl = window.getComputedStyle(this._getHostElement(), null).getPropertyValue('direction') === 'rtl';
-        }
-        this._getHostElement().classList.add(this.rtl ? 'ax-rtl' : 'ax-ltr');
-        this._getInnerElement()?.classList.add(this.rtl ? 'ax-rtl' : 'ax-ltr');
-        this.onInit();
-    }
-
-    _onInternalViewInit() {
-        this.onViewInit();
-    }
-
-    _onInternalDestroy() {
-        this.onDestroy();
-    }
-
-    onInit() {
-    }
-
-    onViewInit() {
-    }
-
-    onDestroy() {
-    }
-
-    onOptionChanging(option: { name: string, value?: any }) {
-        return option?.value;
-    }
-    onOptionChanged(option: { name: string, oldValue?: any, newValue?: any }): void {
-
-    }
-}
-
-
-export function _BaseComponenetMixin<TBase extends Constructor<AXBaseComponent>>(Base: TBase) {
-    return class extends Base {
-        constructor(...args: any[]) {
-            super(...args);
-        }
-    }
-}
-
-
-export const BASE_INPUTS = [
-    'rtl',
-    'cssClass',
-    'cssStyle'
-];
-export const BASE_OUTPUT = [];