@acorex/components 6.0.1 → 6.0.7

package/action-sheet/src/action-sheet.module.ts

@@ -1,13 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXButtonModule } from '@acorex/components/button';
-import { AXActionSheetComponent } from './action-sheet.component';
-import { AXActionSheetItemComponent } from './action-sheet-item.component';
-
-@NgModule({
-  declarations: [AXActionSheetComponent, AXActionSheetItemComponent],
-  imports: [CommonModule, AXButtonModule],
-  exports: [AXActionSheetComponent, AXActionSheetItemComponent],
-  providers: [],
-})
-export class AXActionSheetModule {}

package/alert/index.ts

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

package/alert/ng-package.json

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

package/alert/public-api.ts

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

package/alert/src/alert.component.html

@@ -1,21 +0,0 @@
-<ng-content select="ax-header">
-</ng-content>
-<div class="ax-alert-body">
-    <div class="ax-flex ax-items-center ax-justify-between">
-        <div class="ax-flex">
-            <ng-content select="ax-icon">
-            </ng-content>
-            <div class="ax-flex ax-flex-col ax-justify-center">
-                <ng-content select="ax-content">
-                </ng-content>
-                <ng-content select="ax-footer">
-                </ng-content>
-            </div>
-        </div>
-        <ng-content select="ax-suffix">
-        </ng-content>
-    </div>
-</div>
-
-<div class="ax-alert-progress" [style.animation-duration.ms]="timeOut" *ngIf="timeOut">
-</div>

package/alert/src/alert.component.ts

@@ -1,179 +0,0 @@
-import { AXButtonComponent } from '@acorex/components/button';
-import { AXDecoratorIconComponent } from '@acorex/components/decorators';
-import {
-  Component,
-  ViewEncapsulation,
-  ChangeDetectionStrategy,
-  ElementRef,
-  ChangeDetectorRef,
-  Input,
-  HostBinding,
-  ContentChild,
-  EventEmitter,
-  Output,
-  QueryList,
-  ContentChildren,
-} from '@angular/core';
-import { startWith } from 'rxjs/operators';
-import { AXEvent } from '@acorex/components/common';
-import {
-  AXBaseComponent,
-  AXComponentOptionChanged,
-  _ColorLookComponentMixin,
-} from '@acorex/components/mixin';
-
-export const AXBaseAlertMixin = _ColorLookComponentMixin(AXBaseComponent);
-
-/**
- * Regular description
- *
- * @category Components
- */
-@Component({
-  selector: 'ax-alert',
-  templateUrl: './alert.component.html',
-  inputs: ['color', 'look'],
-  host: { class: 'ax-alert' },
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  encapsulation: ViewEncapsulation.None,
-})
-export class AXAlertComponent extends AXBaseAlertMixin {
-  @ContentChild(AXDecoratorIconComponent, { static: true })
-  private _icon!: AXDecoratorIconComponent;
-
-  @ContentChildren(AXButtonComponent, { descendants: true })
-  private _buttons!: QueryList<AXButtonComponent>;
-
-  @Output()
-  onDismissed: EventEmitter<AXEvent> = new EventEmitter<AXEvent>();
-
-  override _onOptionChanged(option: AXComponentOptionChanged) {
-    if (option.name == 'color') {
-      this._setIcon();
-    }
-  }
-
-  ngDoCheck() {
-    this._setIcon();
-  }
-
-  private _setIcon() {
-    if (!this._icon || this._icon.icon) return;
-    switch (this.color) {
-      case 'success':
-        this._icon.icon = 'ax-ic ax-ic-check-filled';
-        break;
-      case 'warning':
-        this._icon.icon = 'ax-ic-warning-filled';
-        break;
-      case 'danger':
-        this._icon.icon = 'ax-ic-error-filled';
-        break;
-      default:
-        this._icon.icon = 'ax-ic ax-ic-info-filled';
-        break;
-    }
-  }
-
-  /**
-   *  @ignore
-   */
-  @HostBinding('class')
-  get __hostClass(): string {
-    const _class = this.look
-      ? `ax-${this.color}-${this.look}`
-      : `ax-${this.color}-default`;
-    return `ax-alert ax-none ${_class}`;
-  }
-
-  @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;
-    }
-  }
-
-  ngAfterContentInit() {
-    this._buttons.changes
-      .pipe(startWith(0))
-      .subscribe((change) => this._applyButtonStyle());
-    this._applyButtonStyle();
-  }
-
-  private _applyButtonStyle() {
-    this._buttons?.forEach((c: any) => {
-      c.color = this.color;
-      c.look = this.look === 'outline' ? 'blank' : this.look;
-    });
-  }
-
-  /**
-   *  Remove the alert from the container
-   */
-  dismiss(): void {
-    const host = this._getHostElement();
-    this.visible = false;
-    const func = () => {
-      host.parentElement?.removeChild(host);
-      this.onDismissed.emit({
-        component: this,
-      });
-      host.removeEventListener('transitionend', func);
-    };
-    host.addEventListener('transitionend', func);
-  }
-
-  /**
-   *  Hide the alert
-   */
-  hide(): void {
-    this.visible = false;
-  }
-
-  /**
-   *  Show the alert
-   */
-  show() {
-    this.visible = true;
-  }
-}

package/alert/src/alert.module.ts

@@ -1,15 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXDecoratorModule } from '@acorex/components/decorators';
-import { AXAlertComponent } from './alert.component';
-
-const COMPONENT = [AXAlertComponent];
-const MODULES = [CommonModule, AXDecoratorModule];
-
-@NgModule({
-  declarations: [...COMPONENT],
-  imports: [...MODULES],
-  exports: [...COMPONENT],
-  providers: [],
-})
-export class AXAlertModule {}

package/avatar/index.ts

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

package/avatar/ng-package.json

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

package/avatar/src/avatar-group.component.ts

@@ -1,12 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'ax-avatar-group',
-  template: `<ng-content select="ax-avatar"></ng-content>`,
-  host: { class: 'ax-avatar-group' },
-})
-export class AXAvatarGroup implements OnInit {
-  constructor() {}
-
-  ngOnInit(): void {}
-}

package/avatar/src/avatar.component.html

@@ -1,30 +0,0 @@
-<div class="ax-avatar-container" [ngSwitch]="type">
-    <ng-content select="ax-badge"></ng-content>
-    <div class="ax-text-avatar {{class}}" *ngSwitchCase="'text'">
-        {{text}}
-    </div>
-    <div class="ax-icon-avatar {{class}}" *ngSwitchCase="'icon'">
-        <ng-content select="ax-icon"></ng-content>
-    </div>
-    <div class="ax-image-avatar {{class}}" *ngSwitchCase="'image'">
-        <ng-content select="img"></ng-content>
-    </div>
-    <div class="ax-default-avatar {{class}}" *ngSwitchCase="'default'">
-        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
-            <g style="isolation:isolate">
-                <g id="Layer_2" data-name="Layer 2">
-                    <g id="Layer_1-2" data-name="Layer 1">
-                        <rect width="512" height="512" />
-                        <path
-                            d="M419.16,511.94s-2.85-154-142.28-176.19a139.93,139.93,0,0,0-22-1.67h0a55.8,55.8,0,0,0-5.93.29C99.25,350.35,96.26,511.94,96.26,511.94"
-                            style="fill:#fff;opacity:0.7" />
-                        <path
-                            d="M256,355.18c-17.29,0-32.22-4.63-46.38-12.41-3.86,1.31-8.15,2.93-11.75,4.46A96.48,96.48,0,0,0,256,366.62a100.29,100.29,0,0,0,60.07-20c-3.6-1.49-6.41-2.55-10.27-3.83C291.48,350.79,273.58,355.18,256,355.18Z"
-                            style="opacity:0.05" />
-                        <circle cx="257.71" cy="255.94" r="99.24" style="fill:#fff" />
-                    </g>
-                </g>
-            </g>
-        </svg>
-    </div>
-</div>

package/avatar/src/avatar.component.ts

@@ -1,41 +0,0 @@
-import { COLOR_LOOK_INPUTS, AXAvatarMixin } from '@acorex/components/mixin';
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, ChangeDetectorRef, Input, HostBinding } from '@angular/core';
-
-/**
- * The Button is a component which detects user interaction and triggers a corresponding event
- *
- * @category Components
- */
-@Component({
-    selector: 'ax-avatar',
-    templateUrl: './avatar.component.html',
-    inputs: ['color', 'look',],
-    host: { class: 'ax-avatar' },
-    encapsulation: ViewEncapsulation.None,
-    changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class AXAvatarComponent extends AXAvatarMixin {
-
-    @Input() text = '';
-    @Input() icon = '';
-    @Input() src = '';
-
-    @Input() class = '';
-
-    @Input() type : "default" | 'text' | 'icon' | 'image' = 'default';
-    /**
-    *  @ignore
-    */
-    constructor(
-        elementRef: ElementRef,
-        cdr: ChangeDetectorRef
-    ) {
-        super(elementRef, cdr);
-    }
-
-    @HostBinding('class')
-    get __hostClass(): string {
-        return `ax-${this.color}-default`;
-    }
-
-}

package/avatar/src/avatar.module.ts

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

package/avatar/src/index.ts

@@ -1,3 +0,0 @@
-export * from './avatar-group.component';
-export * from './avatar.component';
-export * from './avatar.module';

package/badge/index.ts

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

package/badge/ng-package.json

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

package/badge/public-api.ts

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

package/badge/src/badge.component.html

@@ -1,3 +0,0 @@
-<ng-content select="ax-prefix"></ng-content>
-<span class="ax-font-medium ax-truncate">{{text}}</span>
-<ng-content select="ax-suffix"></ng-content>

package/badge/src/badge.component.ts

@@ -1,37 +0,0 @@
-import { _ColorLookComponentMixin, AXBaseComponent, COLOR_LOOK_INPUTS } from '@acorex/components/mixin';
-import {
-  Component,
-  ViewEncapsulation,
-  ChangeDetectionStrategy,
-  ElementRef,
-  ChangeDetectorRef,
-  Input,
-  HostBinding,
-} from '@angular/core';
-
-
-export const AXBaseBadgeMixin = _ColorLookComponentMixin(AXBaseComponent);
-@Component({
-  selector: 'ax-badge',
-  templateUrl: './badge.component.html',
-  inputs: ['color', 'look',],
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class AXBadgeComponent extends AXBaseBadgeMixin {
-  @Input() text: string = '';
-
-  constructor(private elementRef: ElementRef, cdr: ChangeDetectorRef) {
-    super(elementRef, cdr);
-    //TODO: ax-badge
-  }
-
-  @HostBinding('class')
-  private get __hostClass(): string {
-    const _class = this.look
-      ? `ax-${this.color}-${this.look}`
-      : `ax-${this.color}-default`;
-
-    return ['ax-badge', _class, !this.text ? 'ax-badge-icon' : ''].join(' ');
-  }
-}

package/badge/src/badge.module.ts

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

package/breadcrumbs/index.ts

@@ -1,4 +0,0 @@
-export * from './src/breadcrumbs-item.class';
-export * from './src/breadcrumbs.component';
-export * from './src/breadcrumbs-item.component';
-export * from './src/breadcrumbs.module';

package/breadcrumbs/ng-package.json

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

package/breadcrumbs/public-api.ts

@@ -1,4 +0,0 @@
-export * from './src/breadcrumbs-item.class';
-export * from './src/breadcrumbs-item.component';
-export * from './src/breadcrumbs.component';
-export * from './src/breadcrumbs.module';

package/breadcrumbs/src/breadcrumbs-item.class.ts

@@ -1,9 +0,0 @@
-export interface AXBreadcrumbsItems {
-    name?: string;
-    icon?: string;
-    text: string;
-    tooltip?: string;
-    iconClass?: string;
-    disabled?: boolean;
-    onClick?: (...args) => void;
-}

package/breadcrumbs/src/breadcrumbs-item.component.html

@@ -1,11 +0,0 @@
-<ng-content select="ax-prefix,ax-loading,ax-icon">
-</ng-content>
-<span class="ax-breadcrumbs-item-text">{{text}}</span>
-<ng-content select="ax-suffix,ax-loading,ax-icon">
-</ng-content>
-<div class="ax-breadcrumb-divider">
-    <ng-container *ngTemplateOutlet="_parent.dividerTemplate"></ng-container>
-</div>
-
-
-

package/breadcrumbs/src/breadcrumbs-item.component.ts

@@ -1,42 +0,0 @@
-import { _InteractiveComponenetMixin, _ClickableComponenetMixin, AXBaseComponent } from '@acorex/components/mixin';
-import {
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  HostListener,
-  Inject,
-  Input,
-  Optional,
-} from '@angular/core';
-
-import { AXBreadCrumbsComponent } from './breadcrumbs.component';
-
-export const AXBaseItemBreadCrumbMixin = _InteractiveComponenetMixin(
-  _ClickableComponenetMixin(AXBaseComponent)
-);
-@Component({
-  selector: 'ax-breadcrumbs-item',
-  templateUrl: './breadcrumbs-item.component.html',
-  host: { class: 'ax-breadcrumbs-item' },
-})
-export class AXBreadCrumbsItemComponent extends AXBaseItemBreadCrumbMixin {
-  @Input() text: string;
-
-  /**
-   *  @ignore
-   */
-  constructor(
-    _elementRef: ElementRef,
-    _cdr: ChangeDetectorRef,
-    @Optional()
-    @Inject(AXBreadCrumbsComponent)
-    public _parent: AXBreadCrumbsComponent
-  ) {
-    super(_elementRef, _cdr);
-  }
-
-  @HostListener('click', ['$event'])
-  private __hostClick(e: MouseEvent) {
-    this._emitOnClickEvent(e);
-  }
-}

package/breadcrumbs/src/breadcrumbs.component.html

@@ -1,8 +0,0 @@
-<ng-content select="ax-breadcrumbs-item"></ng-content>
-<ng-template #dividerTpl>
-    <ng-container [ngTemplateOutlet]="default" *ngIf="!_divider"></ng-container>
-    <ng-container [ngTemplateOutlet]="_divider" *ngIf="_divider"></ng-container>
-    <ng-template #default>
-        <div class="ax-breadcrumb-divider">/</div>
-    </ng-template>
-</ng-template>

package/breadcrumbs/src/breadcrumbs.component.ts

@@ -1,28 +0,0 @@
-import { AXBaseComponent } from '@acorex/components/mixin';
-import {
-  ChangeDetectorRef,
-  Component,
-  ContentChild,
-  ElementRef,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-
-@Component({
-  selector: 'ax-breadcrumbs',
-  templateUrl: './breadcrumbs.component.html',
-  host: { class: 'ax-breadcrumbs' },
-})
-export class AXBreadCrumbsComponent extends AXBaseComponent {
-  @ContentChild('divider')
-  _divider: TemplateRef<any>;
-
-  @ViewChild('dividerTpl')
-  dividerTemplate: TemplateRef<any>;
-  /**
-   *  @ignore
-   */
-  constructor(_elementRef: ElementRef, _cdr: ChangeDetectorRef) {
-    super(_elementRef, _cdr);
-  }
-}

package/breadcrumbs/src/breadcrumbs.module.ts

@@ -1,12 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { AXBreadCrumbsComponent } from './breadcrumbs.component';
-import { AXBreadCrumbsItemComponent } from './breadcrumbs-item.component';
-
-@NgModule({
-  declarations: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent],
-  imports: [CommonModule],
-  exports: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent],
-  providers: [],
-})
-export class AXBreadcrumbsModule {}

package/button/index.ts

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

package/button/ng-package.json

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

package/button/public-api.ts

@@ -1,5 +0,0 @@
-export * from './src/button.component';
-export * from './src/button-group.component';
-export * from './src/button-item.component';
-export * from './src/button.module';
-export * from './src/button-item.class';

package/button/src/button-group.component.html

@@ -1,2 +0,0 @@
-<ng-content select="ax-button">
-</ng-content>