@acorex/components 7.1.3 → 7.1.5

package/fesm2022/acorex-components-alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-alert.mjs","sources":["../../../../projects/acorex/components/alert/src/alert.component.ts","../../../../projects/acorex/components/alert/src/alert.component.html","../../../../projects/acorex/components/alert/src/alert.module.ts","../../../../projects/acorex/components/alert/acorex-components-alert.ts"],"sourcesContent":["import { AXButtonComponent } from '@acorex/components/button';\nimport {\n  AXDecoratorContentComponent,\n  AXDecoratorFooterComponent,\n  AXDecoratorIconComponent,\n  AXDecoratorTitleComponent,\n} from '@acorex/components/decorators';\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  ElementRef,\n  ChangeDetectorRef,\n  Input,\n  HostBinding,\n  ContentChild,\n  EventEmitter,\n  Output,\n  QueryList,\n  ContentChildren,\n  ViewChild,\n} from '@angular/core';\nimport { startWith } from 'rxjs/operators';\nimport { AXClosbaleComponent, AXEvent } from '@acorex/components/common';\nimport { AXBaseComponent, AXComponentOptionChanged, _ColorLookComponentMixin } from '@acorex/components/mixin';\n\nexport const AXBaseAlertMixin = _ColorLookComponentMixin(AXBaseComponent);\n\n/**\n * Regular description\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-alert',\n  templateUrl: './alert.component.html',\n  styleUrls: ['./alert.component.scss'],\n  inputs: ['color'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }],\n})\nexport class AXAlertComponent extends AXBaseAlertMixin {\n  @ContentChild(AXDecoratorIconComponent)\n  private _icon!: AXDecoratorIconComponent;\n\n  @ContentChildren(AXButtonComponent, { descendants: true })\n  private _buttons!: QueryList<AXButtonComponent>;\n\n  @ContentChild(AXDecoratorTitleComponent)\n  protected _title!: AXButtonComponent;\n  @ContentChild(AXDecoratorContentComponent)\n  protected _content!: AXButtonComponent;\n\n  @ContentChild(AXDecoratorFooterComponent)\n  protected _footer!: AXButtonComponent;\n\n  protected _showInline: boolean = false;\n\n  @Output()\n  onClosed: EventEmitter<AXEvent> = new EventEmitter<AXEvent>();\n\n  private _customIcon: string;\n  private _timeOutRef: number;\n\n  /**\n   *  @ignore\n   */\n  @HostBinding('class')\n  get __hostClass(): string {\n    const _class = this.look ? `ax-${this.color}-${this.look}` : `ax-${this.color}-default`;\n    return `ax-alert ax-none ${_class}`;\n  }\n\n  private _timeOut: number;\n  @Input()\n  public get timeOut(): number {\n    return this._timeOut;\n  }\n  public set timeOut(v: number) {\n    if (v != this._timeOut) {\n      clearTimeout(this._timeOutRef);\n      this._timeOut = v;\n      if (v) {\n        this._timeOutRef = window.setTimeout(() => {\n          this.close();\n        }, this.timeOut);\n      }\n    }\n  }\n\n  private _observer: MutationObserver;\n\n  protected _visible: boolean;\n  /**\n   *  set the visibility of the Alert\n   */\n  @Input()\n  public get visible(): boolean {\n    return this._visible;\n  }\n  public set visible(v: boolean) {\n    if (this._visible != v) {\n      this._visible = v;\n      const host = this._getHostElement();\n      if (v) {\n        host.classList.remove('ax-state-hidden');\n        host.classList.add('ax-state-visible');\n      } else {\n        host.classList.add('ax-state-hidden');\n        host.classList.toggle('ax-state-visible');\n      }\n    }\n  }\n\n  /**\n   *  @ignore\n   */\n  constructor(elementRef: ElementRef, cdr: ChangeDetectorRef) {\n    super(elementRef, cdr);\n    //\n    const config = { attributes: false, childList: true, subtree: true };\n\n    const callback = (mutationList, observer) => {\n      for (const mutation of mutationList) {\n        if (mutation.type === 'childList') {\n          this._setIcon();\n          this._applyButtonStyle();\n          this._showInline = this._content != null || this._footer != null;\n          this._cdr.markForCheck();\n        }\n      }\n    };\n\n    // Create an observer instance linked to the callback function\n    this._observer = new MutationObserver(callback);\n\n    // Start observing the target node for configured mutations\n    this._observer.observe(this._getHostElement(), config);\n  }\n\n  onViewInit() {\n    if (this.visible == undefined) {\n      this.visible = true;\n    }\n    //\n    this._customIcon = this._icon?.icon;\n    this._showInline = this._content != null || this._footer != null;\n  }\n\n  override _onOptionChanged(option: AXComponentOptionChanged) {\n    this._setIcon();\n    this._applyButtonStyle();\n  }\n\n  private _setIcon() {\n    if (!this._icon || this._icon._getInnerElement()) return;\n\n    switch (this.color) {\n      case 'success':\n        this._icon.icon = 'ax-icon ax-icon-check-circle-fill';\n        break;\n      case 'danger':\n        this._icon.icon = 'ax-icon ax-icon-error-fill';\n        break;\n      case 'warning':\n        this._icon.icon = 'ax-icon ax-icon-warning-fill';\n        break;\n      default:\n        this._icon.icon = this._customIcon || 'ax-icon ax-icon-check-circle-fill';\n        break;\n    }\n  }\n\n  private _applyButtonStyle() {\n    this._buttons?.forEach((c: any) => {\n      c.color = this.color;\n      c.getHostElement().classList.add('ax-sm');\n      c.look = !c.look || c.look == 'default' ? 'default' : 'blank';\n    });\n  }\n\n  /**\n   *  Remove the alert from the container\n   */\n  close(): void {\n    const host = this._getHostElement();\n    this.visible = false;\n    const func = () => {\n      host.parentElement?.removeChild(host);\n      this.onClosed.emit({\n        component: this,\n      });\n      host.removeEventListener('transitionend', func);\n    };\n    host.addEventListener('transitionend', func);\n  }\n\n  /**\n   *  Hide the alert\n   */\n  hide(): void {\n    this.visible = false;\n  }\n\n  /**\n   *  Show the alert\n   */\n  show() {\n    this.visible = true;\n  }\n\n  onDestroy(): void {\n    this._observer?.disconnect();\n  }\n}\n","<div class=\"ax-alert-inline-start\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-icon\"></ng-content>\n</div>\n<div class=\"ax-alert-inline-middle\">\n  <div class=\"ax-alert-middle-block-start\">\n    <div class=\"ax-alert-title\">\n      <ng-content select=\"ax-title\"></ng-content>\n    </div>\n  </div>\n  <div\n    class=\"ax-alert-middle-block-end\"\n    [class.ax-hidden]=\"!_showInline\"\n    [class.ax-title-gap]=\"_title\">\n    <ng-content select=\"ax-content\"> </ng-content>\n    <ng-content select=\"ax-footer\"> </ng-content>\n  </div>\n</div>\n<div class=\"ax-alert-inline-end\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-button\"></ng-content>\n  <ng-content select=\"ax-close-button\"></ng-content>\n</div>\n<div\n  class=\"ax-alert-progress\"\n  [style.animation-duration.ms]=\"timeOut\"\n  *ngIf=\"timeOut\"></div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXAlertComponent } from './alert.component';\n\nconst COMPONENT = [AXAlertComponent];\nconst MODULES = [CommonModule, AXDecoratorModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXAlertModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-alert.mjs","sources":["../../../../projects/acorex/components/alert/src/alert.component.ts","../../../../projects/acorex/components/alert/src/alert.component.html","../../../../projects/acorex/components/alert/src/alert.module.ts","../../../../projects/acorex/components/alert/acorex-components-alert.ts"],"sourcesContent":["import { AXButtonComponent } from '@acorex/components/button';\nimport {\n  AXDecoratorContentComponent,\n  AXDecoratorFooterComponent,\n  AXDecoratorIconComponent,\n  AXDecoratorTitleComponent,\n} from '@acorex/components/decorators';\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  Input,\n  HostBinding,\n  ContentChild,\n  EventEmitter,\n  Output,\n  QueryList,\n  ContentChildren,\n} from '@angular/core';\nimport {\n  AXClosbaleComponent,\n  AXEvent,\n  AXOptionChangedEvent,\n  MXColorComponent\n} from '@acorex/components/common';\nimport { classes } from 'polytype';\n\n\n/**\n * Regular description\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-alert',\n  templateUrl: './alert.component.html',\n  styleUrls: ['./alert.component.scss'],\n  inputs: ['color'],\n  outputs: ['colorChange'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }],\n})\nexport class AXAlertComponent extends classes(MXColorComponent) {\n\n  @ContentChild(AXDecoratorIconComponent)\n  private _iconComp!: AXDecoratorIconComponent;\n\n  @ContentChildren(AXButtonComponent, { descendants: true })\n  private _buttonComps!: QueryList<AXButtonComponent>;\n\n  @ContentChild(AXDecoratorTitleComponent)\n  protected _titleComp!: AXButtonComponent;\n  \n  @ContentChild(AXDecoratorContentComponent)\n  protected _contentComp!: AXButtonComponent;\n\n  @ContentChild(AXDecoratorFooterComponent)\n  protected _footerComp!: AXButtonComponent;\n\n  protected _showInline: boolean = false;\n\n  @Output()\n  onClosed: EventEmitter<AXEvent> = new EventEmitter<AXEvent>();\n\n  private _customIcon: string;\n  private _timeOutRef: number;\n\n  /**\n   *  @ignore\n   */\n  @HostBinding('class')\n  get __hostClass(): string {\n    const _class = `ax-${this.color}-default`;\n    return `ax-alert ax-none ${_class}`;\n  }\n\n  private _timeOut: number;\n  @Input()\n  public get timeOut(): number {\n    return this._timeOut;\n  }\n  public set timeOut(v: number) {\n    this.setOption({\n      name: \"timeOut\",\n      value: v,\n      beforeCallback: (oldValue, newValue) => {\n        clearTimeout(this._timeOutRef);\n      },\n      afterCallback: (oldValue, newValue) => {\n        if (newValue) {\n          this._timeOutRef = window.setTimeout(() => {\n            this.close();\n          }, this.timeOut);\n        }\n      }\n    });\n  }\n\n  private _observer: MutationObserver;\n\n  protected _visible: boolean;\n  /**\n   *  set the visibility of the Alert\n   */\n  @Input()\n  public get visible(): boolean {\n    return this._visible;\n  }\n  public set visible(v: boolean) {\n    if (this._visible != v) {\n      this._visible = v;\n      const host = this.getHostElement();\n      if (v) {\n        host.classList.remove('ax-state-hidden');\n        host.classList.add('ax-state-visible');\n      } else {\n        host.classList.add('ax-state-hidden');\n        host.classList.toggle('ax-state-visible');\n      }\n    }\n  }\n\n  protected ngOnInit() {\n    const config = { attributes: false, childList: true, subtree: true };\n    const callback = (mutationList, observer) => {\n      for (const mutation of mutationList) {\n        if (mutation.type === 'childList') {\n          this._setIcon();\n          this._applyButtonStyle();\n          this._showInline = this._contentComp != null || this._footerComp != null;\n          this.cdr.markForCheck();\n        }\n      }\n    };\n\n    // Create an observer instance linked to the callback function\n    this._observer = new MutationObserver(callback);\n\n    // Start observing the target node for configured mutations\n    this._observer.observe(this.getHostElement(), config);\n    //\n    this.onOptionChanged.subscribe(this._handleOnOptionChanged.bind(this));\n  }\n\n  protected ngAfterViewInit() {\n    if (this.visible == undefined) {\n      this.visible = true;\n    }\n    //\n    this._customIcon = this._iconComp?.icon;\n    this._showInline = this._contentComp != null || this._footerComp != null;\n  }\n\n\n\n  protected _handleOnOptionChanged(e: AXOptionChangedEvent) {\n    this._setIcon();\n    this._applyButtonStyle();\n  }\n\n  private _setIcon() {\n    if (!this._iconComp || this._iconComp._getInnerElement()) return;\n\n    switch (this.color) {\n      case 'success':\n        this._iconComp.icon = 'ax-icon ax-icon-check-circle-fill';\n        break;\n      case 'danger':\n        this._iconComp.icon = 'ax-icon ax-icon-error-fill';\n        break;\n      case 'warning':\n        this._iconComp.icon = 'ax-icon ax-icon-warning-fill';\n        break;\n      default:\n        this._iconComp.icon = this._customIcon || 'ax-icon ax-icon-check-circle-fill';\n        break;\n    }\n  }\n\n  private _applyButtonStyle() {\n    this._buttonComps?.forEach((c: any) => {\n      c.color = this.color;\n      c.getHostElement().classList.add('ax-sm');\n      c.look = !c.look || c.look == 'default' ? 'default' : 'blank';\n    });\n  }\n\n  /**\n   *  Remove the alert from the container\n   */\n  close(): void {\n    const host = this.getHostElement();\n    this.visible = false;\n    const func = () => {\n      host.parentElement?.removeChild(host);\n      this.onClosed.emit({\n        component: this,\n      });\n      host.removeEventListener('transitionend', func);\n    };\n    host.addEventListener('transitionend', func);\n  }\n\n  /**\n   *  Hide the alert\n   */\n  hide(): void {\n    this.visible = false;\n  }\n\n  /**\n   *  Show the alert\n   */\n  show() {\n    this.visible = true;\n  }\n\n  ngOnDestroy(): void {\n    this._observer?.disconnect();\n    this.onOptionChanged?.unsubscribe();\n  }\n}\n","<div class=\"ax-alert-inline-start\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-icon\"></ng-content>\n</div>\n<div class=\"ax-alert-inline-middle\">\n  <div class=\"ax-alert-middle-block-start\">\n    <div class=\"ax-alert-title\">\n      <ng-content select=\"ax-title\"></ng-content>\n    </div>\n  </div>\n  <div class=\"ax-alert-middle-block-end\" [class.ax-hidden]=\"!_showInline\" [class.ax-title-gap]=\"_titleComp\">\n    <ng-content select=\"ax-content\"> </ng-content>\n    <ng-content select=\"ax-footer\"> </ng-content>\n  </div>\n</div>\n<div class=\"ax-alert-inline-end\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-button\"></ng-content>\n  <ng-content select=\"ax-close-button\"></ng-content>\n</div>\n<div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut\" *ngIf=\"timeOut\"></div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXAlertComponent } from './alert.component';\n\nconst COMPONENT = [AXAlertComponent];\nconst MODULES = [CommonModule, AXDecoratorModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXAlertModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-avatar.mjs

@@ -1,16 +1,17 @@
 import * as i0 from '@angular/core';
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, Input, ContentChildren, HostBinding, NgModule } from '@angular/core';
-import { AXAvatarMixin } from '@acorex/components/mixin';
+import { Component, ViewEncapsulation, ChangeDetectionStrategy, ContentChildren, HostBinding, NgModule } from '@angular/core';
+import { MXColorComponent } from '@acorex/components/common';
+import { classes } from 'polytype';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
 class AXAvatarGroup {
     constructor() { }
     ngOnInit() { }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: AXAvatarGroup, selector: "ax-avatar-group", ngImport: i0, template: `<ng-content select="ax-avatar"></ng-content>`, isInline: true });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AXAvatarGroup, selector: "ax-avatar-group", ngImport: i0, template: `<ng-content select="ax-avatar"></ng-content>`, isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-avatar-group',
@@ -23,33 +24,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
  *
  * @category Components
  */
-class AXAvatarComponent extends AXAvatarMixin {
-    class;
+class AXAvatarComponent extends classes(MXColorComponent) {
     _children;
-    /**
-     *  @ignore
-     */
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-    }
     ngAfterViewInit() {
         this._children.changes.subscribe(() => {
-            this._cdr.markForCheck();
+            this.cdr.markForCheck();
         });
     }
     get __hostClass() {
         return `ax-${this.color}-default`;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: AXAvatarComponent, selector: "ax-avatar", inputs: { color: "color", look: "look", class: "class" }, host: { properties: { "class": "this.__hostClass" } }, queries: [{ propertyName: "_children", predicate: ["ax-text, ax-icon, ax-image"] }], usesInheritance: true, ngImport: i0, template: "<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content></ng-content>\n</ng-template>\n<ng-template #default>\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-default {{class}}\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n        viewBox=\"0 0 512 512\">\n        <g style=\"isolation:isolate\">\n            <g id=\"Layer_2\" data-name=\"Layer 2\">\n                <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n                    <rect width=\"512\" height=\"512\" />\n                    <path\n                        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\"\n                        style=\"fill:#fff;opacity:0.7\" />\n                    <path\n                        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\"\n                        style=\"opacity:0.05\" />\n                    <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill:#fff\" />\n                </g>\n            </g>\n        </g>\n    </svg>\n</ng-template>", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{border-width:2px;border-color:rgba(var(--ax-color-surface));margin:-.25rem;overflow:hidden}ax-avatar{position:relative;display:flex;justify-content:center;width:4rem;height:4rem}ax-avatar *{border-radius:inherit}ax-avatar ax-image{overflow:hidden}ax-avatar ax-text{font-size:1.25rem;line-height:1.75rem}ax-avatar ax-icon,ax-avatar ax-text{@apply ax-w-full ax-h-full ax-flex ax-items-center ax-justify-center;width:100%;height:100%;display:flex;align-items:center;justify-content:center}ax-avatar.ax-primary-default .ax-default{fill:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-text{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-icon{background-color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-secondary-default .ax-default{fill:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-text{background-color:rgba(var(--ax-color-secondary-100));color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-icon{background-color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-success-default .ax-default{fill:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-text{background-color:rgba(var(--ax-color-success-100));color:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-icon{background-color:rgba(var(--ax-color-success-500))}ax-avatar.ax-warning-default .ax-default{fill:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-text{background-color:rgba(var(--ax-color-warning-100));color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-icon{background-color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-danger-default .ax-default{fill:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-text{background-color:rgba(var(--ax-color-danger-100));color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-icon{background-color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-info-default .ax-default{fill:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-text{background-color:rgba(var(--ax-color-info-100));color:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-icon{background-color:rgba(var(--ax-color-info-500))}ax-avatar.ax-ghost-default .ax-default{fill:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-text,ax-avatar.ax-ghost-default ax-icon{background-color:rgba(var(--ax-color-on-surface));color:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-icon svg{fill:rgba(var(--ax-color-on-surface))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AXAvatarComponent, selector: "ax-avatar", inputs: { color: "color" }, host: { properties: { "class": "this.__hostClass" } }, queries: [{ propertyName: "_children", predicate: ["ax-text, ax-icon, ax-image"] }], usesInheritance: true, ngImport: i0, template: "<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content></ng-content>\n</ng-template>\n<ng-template #default>\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-default\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n        viewBox=\"0 0 512 512\">\n        <g style=\"isolation:isolate\">\n            <g id=\"Layer_2\" data-name=\"Layer 2\">\n                <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n                    <rect width=\"512\" height=\"512\" />\n                    <path\n                        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\"\n                        style=\"fill:#fff;opacity:0.7\" />\n                    <path\n                        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\"\n                        style=\"opacity:0.05\" />\n                    <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill:#fff\" />\n                </g>\n            </g>\n        </g>\n    </svg>\n</ng-template>", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{border-width:2px;border-color:rgba(var(--ax-color-surface));margin:-.25rem;overflow:hidden}ax-avatar{position:relative;display:flex;justify-content:center;width:4rem;height:4rem}ax-avatar *{border-radius:inherit}ax-avatar ax-image{overflow:hidden}ax-avatar ax-text{font-size:1.25rem;line-height:1.75rem}ax-avatar ax-icon,ax-avatar ax-text{@apply ax-w-full ax-h-full ax-flex ax-items-center ax-justify-center;width:100%;height:100%;display:flex;align-items:center;justify-content:center}ax-avatar.ax-primary-default .ax-default{fill:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-text{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-icon{background-color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-secondary-default .ax-default{fill:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-text{background-color:rgba(var(--ax-color-secondary-100));color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-icon{background-color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-success-default .ax-default{fill:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-text{background-color:rgba(var(--ax-color-success-100));color:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-icon{background-color:rgba(var(--ax-color-success-500))}ax-avatar.ax-warning-default .ax-default{fill:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-text{background-color:rgba(var(--ax-color-warning-100));color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-icon{background-color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-danger-default .ax-default{fill:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-text{background-color:rgba(var(--ax-color-danger-100));color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-icon{background-color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-info-default .ax-default{fill:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-text{background-color:rgba(var(--ax-color-info-100));color:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-icon{background-color:rgba(var(--ax-color-info-500))}ax-avatar.ax-ghost-default .ax-default{fill:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-text,ax-avatar.ax-ghost-default ax-icon{background-color:rgba(var(--ax-color-on-surface));color:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-icon svg{fill:rgba(var(--ax-color-on-surface))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-avatar', inputs: ['color', 'look'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content></ng-content>\n</ng-template>\n<ng-template #default>\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-default {{class}}\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n        viewBox=\"0 0 512 512\">\n        <g style=\"isolation:isolate\">\n            <g id=\"Layer_2\" data-name=\"Layer 2\">\n                <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n                    <rect width=\"512\" height=\"512\" />\n                    <path\n                        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\"\n                        style=\"fill:#fff;opacity:0.7\" />\n                    <path\n                        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\"\n                        style=\"opacity:0.05\" />\n                    <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill:#fff\" />\n                </g>\n            </g>\n        </g>\n    </svg>\n</ng-template>", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{border-width:2px;border-color:rgba(var(--ax-color-surface));margin:-.25rem;overflow:hidden}ax-avatar{position:relative;display:flex;justify-content:center;width:4rem;height:4rem}ax-avatar *{border-radius:inherit}ax-avatar ax-image{overflow:hidden}ax-avatar ax-text{font-size:1.25rem;line-height:1.75rem}ax-avatar ax-icon,ax-avatar ax-text{@apply ax-w-full ax-h-full ax-flex ax-items-center ax-justify-center;width:100%;height:100%;display:flex;align-items:center;justify-content:center}ax-avatar.ax-primary-default .ax-default{fill:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-text{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-icon{background-color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-secondary-default .ax-default{fill:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-text{background-color:rgba(var(--ax-color-secondary-100));color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-icon{background-color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-success-default .ax-default{fill:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-text{background-color:rgba(var(--ax-color-success-100));color:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-icon{background-color:rgba(var(--ax-color-success-500))}ax-avatar.ax-warning-default .ax-default{fill:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-text{background-color:rgba(var(--ax-color-warning-100));color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-icon{background-color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-danger-default .ax-default{fill:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-text{background-color:rgba(var(--ax-color-danger-100));color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-icon{background-color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-info-default .ax-default{fill:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-text{background-color:rgba(var(--ax-color-info-100));color:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-icon{background-color:rgba(var(--ax-color-info-500))}ax-avatar.ax-ghost-default .ax-default{fill:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-text,ax-avatar.ax-ghost-default ax-icon{background-color:rgba(var(--ax-color-on-surface));color:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-icon svg{fill:rgba(var(--ax-color-on-surface))}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { class: [{
-                type: Input,
-                args: ['class']
-            }], _children: [{
+            args: [{ selector: 'ax-avatar', inputs: ['color'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content></ng-content>\n</ng-template>\n<ng-template #default>\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-default\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n        viewBox=\"0 0 512 512\">\n        <g style=\"isolation:isolate\">\n            <g id=\"Layer_2\" data-name=\"Layer 2\">\n                <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n                    <rect width=\"512\" height=\"512\" />\n                    <path\n                        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\"\n                        style=\"fill:#fff;opacity:0.7\" />\n                    <path\n                        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\"\n                        style=\"opacity:0.05\" />\n                    <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill:#fff\" />\n                </g>\n            </g>\n        </g>\n    </svg>\n</ng-template>", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{border-width:2px;border-color:rgba(var(--ax-color-surface));margin:-.25rem;overflow:hidden}ax-avatar{position:relative;display:flex;justify-content:center;width:4rem;height:4rem}ax-avatar *{border-radius:inherit}ax-avatar ax-image{overflow:hidden}ax-avatar ax-text{font-size:1.25rem;line-height:1.75rem}ax-avatar ax-icon,ax-avatar ax-text{@apply ax-w-full ax-h-full ax-flex ax-items-center ax-justify-center;width:100%;height:100%;display:flex;align-items:center;justify-content:center}ax-avatar.ax-primary-default .ax-default{fill:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-text{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-primary-default ax-icon{background-color:rgba(var(--ax-color-primary-500))}ax-avatar.ax-secondary-default .ax-default{fill:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-text{background-color:rgba(var(--ax-color-secondary-100));color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-secondary-default ax-icon{background-color:rgba(var(--ax-color-secondary-500))}ax-avatar.ax-success-default .ax-default{fill:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-text{background-color:rgba(var(--ax-color-success-100));color:rgba(var(--ax-color-success-500))}ax-avatar.ax-success-default ax-icon{background-color:rgba(var(--ax-color-success-500))}ax-avatar.ax-warning-default .ax-default{fill:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-text{background-color:rgba(var(--ax-color-warning-100));color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-warning-default ax-icon{background-color:rgba(var(--ax-color-warning-500))}ax-avatar.ax-danger-default .ax-default{fill:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-text{background-color:rgba(var(--ax-color-danger-100));color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-danger-default ax-icon{background-color:rgba(var(--ax-color-danger-500))}ax-avatar.ax-info-default .ax-default{fill:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-text{background-color:rgba(var(--ax-color-info-100));color:rgba(var(--ax-color-info-500))}ax-avatar.ax-info-default ax-icon{background-color:rgba(var(--ax-color-info-500))}ax-avatar.ax-ghost-default .ax-default{fill:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-text,ax-avatar.ax-ghost-default ax-icon{background-color:rgba(var(--ax-color-on-surface));color:rgba(var(--ax-color-on-surface))}ax-avatar.ax-ghost-default ax-icon svg{fill:rgba(var(--ax-color-on-surface))}\n"] }]
+        }], propDecorators: { _children: [{
                 type: ContentChildren,
                 args: ['ax-text, ax-icon, ax-image']
             }], __hostClass: [{
@@ -60,11 +51,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
 const COMPONENT = [AXAvatarComponent, AXAvatarGroup];
 const MODULES = [CommonModule];
 class AXAvatarModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarModule, declarations: [AXAvatarComponent, AXAvatarGroup], imports: [CommonModule], exports: [AXAvatarComponent, AXAvatarGroup] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarModule, imports: [MODULES] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarModule, declarations: [AXAvatarComponent, AXAvatarGroup], imports: [CommonModule], exports: [AXAvatarComponent, AXAvatarGroup] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarModule, imports: [MODULES] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAvatarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAvatarModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],

package/fesm2022/acorex-components-avatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-avatar.mjs","sources":["../../../../projects/acorex/components/avatar/src/avatar-group.component.ts","../../../../projects/acorex/components/avatar/src/avatar.component.ts","../../../../projects/acorex/components/avatar/src/avatar.component.html","../../../../projects/acorex/components/avatar/src/avatar.module.ts","../../../../projects/acorex/components/avatar/acorex-components-avatar.ts"],"sourcesContent":["import { Component, OnInit } from '@angular/core';\n\n@Component({\n  selector: 'ax-avatar-group',\n  template: `<ng-content select=\"ax-avatar\"></ng-content>`,\n})\nexport class AXAvatarGroup implements OnInit {\n  constructor() {}\n\n  ngOnInit(): void {}\n}\n","import { AXAvatarMixin } from '@acorex/components/mixin';\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  ElementRef,\n  ChangeDetectorRef,\n  HostBinding,\n  ContentChildren,\n  QueryList,\n  Input,\n} from '@angular/core';\n\n/**\n * The Button is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-avatar',\n  templateUrl: './avatar.component.html',\n  styleUrls: ['./avatar.component.scss'],\n  inputs: ['color', 'look'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AXAvatarComponent extends AXAvatarMixin {\n  @Input('class') class: string;\n\n  @ContentChildren('ax-text, ax-icon, ax-image')\n  readonly _children: QueryList<any>;\n\n  /**\n   *  @ignore\n   */\n  constructor(elementRef: ElementRef, cdr: ChangeDetectorRef) {\n    super(elementRef, cdr);\n  }\n\n  ngAfterViewInit(): void {\n    this._children.changes.subscribe(() => {\n      this._cdr.markForCheck();\n    });\n  }\n\n  @HostBinding('class')\n  get __hostClass(): string {\n    return `ax-${this.color}-default`;\n  }\n}\n","<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content></ng-content>\n</ng-template>\n<ng-template #default>\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-default {{class}}\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n        viewBox=\"0 0 512 512\">\n        <g style=\"isolation:isolate\">\n            <g id=\"Layer_2\" data-name=\"Layer 2\">\n                <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n                    <rect width=\"512\" height=\"512\" />\n                    <path\n                        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\"\n                        style=\"fill:#fff;opacity:0.7\" />\n                    <path\n                        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\"\n                        style=\"opacity:0.05\" />\n                    <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill:#fff\" />\n                </g>\n            </g>\n        </g>\n    </svg>\n</ng-template>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXAvatarComponent } from './avatar.component';\nimport { AXAvatarGroup } from './avatar-group.component';\n\nconst COMPONENT = [AXAvatarComponent, AXAvatarGroup];\nconst MODULES = [CommonModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXAvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-avatar.mjs","sources":["../../../../projects/acorex/components/avatar/src/avatar-group.component.ts","../../../../projects/acorex/components/avatar/src/avatar.component.ts","../../../../projects/acorex/components/avatar/src/avatar.component.html","../../../../projects/acorex/components/avatar/src/avatar.module.ts","../../../../projects/acorex/components/avatar/acorex-components-avatar.ts"],"sourcesContent":["import { Component, OnInit } from '@angular/core';\n\n@Component({\n  selector: 'ax-avatar-group',\n  template: `<ng-content select=\"ax-avatar\"></ng-content>`,\n})\nexport class AXAvatarGroup implements OnInit {\n  constructor() {}\n\n  ngOnInit(): void {}\n}\n","import { MXColorComponent } from '@acorex/components/common';\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  HostBinding,\n  ContentChildren,\n  QueryList,\n} from '@angular/core';\nimport { classes } from 'polytype';\n\n/**\n * The Button is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-avatar',\n  templateUrl: './avatar.component.html',\n  styleUrls: ['./avatar.component.scss'],\n  inputs: ['color'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AXAvatarComponent extends classes(MXColorComponent) {\n\n  @ContentChildren('ax-text, ax-icon, ax-image')\n  protected readonly _children: QueryList<any>;\n\n\n  ngAfterViewInit(): void {\n    this._children.changes.subscribe(() => {\n      this.cdr.markForCheck();\n    });\n  }\n\n  @HostBinding('class')\n  private get __hostClass(): string {\n    return `ax-${this.color}-default`;\n  }\n}\n","<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content></ng-content>\n</ng-template>\n<ng-template #default>\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-default\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n        viewBox=\"0 0 512 512\">\n        <g style=\"isolation:isolate\">\n            <g id=\"Layer_2\" data-name=\"Layer 2\">\n                <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n                    <rect width=\"512\" height=\"512\" />\n                    <path\n                        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\"\n                        style=\"fill:#fff;opacity:0.7\" />\n                    <path\n                        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\"\n                        style=\"opacity:0.05\" />\n                    <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill:#fff\" />\n                </g>\n            </g>\n        </g>\n    </svg>\n</ng-template>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXAvatarComponent } from './avatar.component';\nimport { AXAvatarGroup } from './avatar-group.component';\n\nconst COMPONENT = [AXAvatarComponent, AXAvatarGroup];\nconst MODULES = [CommonModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXAvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-badge.mjs

@@ -1,27 +1,22 @@
-import { _ColorLookComponentMixin, AXBaseComponent } from '@acorex/components/mixin';
+import { MXColorComponent } from '@acorex/components/common';
 import * as i0 from '@angular/core';
 import { Component, ViewEncapsulation, ChangeDetectionStrategy, Input, HostBinding, NgModule } from '@angular/core';
+import { classes } from 'polytype';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
-const AXBaseBadgeMixin = _ColorLookComponentMixin(AXBaseComponent);
-class AXBadgeComponent extends AXBaseBadgeMixin {
-    elementRef;
+class AXBadgeComponent extends classes(MXColorComponent) {
     text = '';
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-        this.elementRef = elementRef;
-    }
     get __hostClass() {
         return `ax-${this.color}-default ${!this.text ? 'ax-mini-badge' : ''} ${this.text.length == 1 ? 'ax-single-badge' : ''}`;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBadgeComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: AXBadgeComponent, selector: "ax-badge", inputs: { color: "color", text: "text" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<span *ngIf=\"text\" class=\"ax-badge-text\">{{text}}</span>\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-badge{display:inline-block;font-size:.75rem;border-radius:99rem;text-align:center}ax-badge.ax-mini-badge{width:.5rem;height:.5rem}ax-badge.ax-mini-badge .ax-badge-text{display:none}ax-badge.ax-single-badge{width:1.125rem;height:1.125rem;display:flex;align-items:center;justify-content:center}ax-badge.ax-single-badge .ax-badge-text{padding:0}ax-badge .ax-badge-text{padding:.25rem .375rem;height:auto;word-break:break-all}ax-badge.ax-primary-default{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-badge.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-500));color:rgba(var(--ax-color-secondary-fore))}ax-badge.ax-success-default{background-color:rgba(var(--ax-color-success-500));color:rgba(var(--ax-color-success-fore))}ax-badge.ax-warning-default{background-color:rgba(var(--ax-color-warning-500));color:rgba(var(--ax-color-warning-fore))}ax-badge.ax-danger-default{background-color:rgba(var(--ax-color-danger-500));color:rgba(var(--ax-color-danger-fore))}ax-badge.ax-info-default{background-color:rgba(var(--ax-color-info-500));color:rgba(var(--ax-color-info-fore))}ax-badge.ax-ghost-default{background-color:rgba(var(--ax-color-ghost-200));color:rgba(var(--ax-color-ghost-fore))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBadgeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AXBadgeComponent, selector: "ax-badge", inputs: { color: "color", text: "text" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<span *ngIf=\"text\" class=\"ax-badge-text\">{{text}}</span>\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-badge{display:inline-block;font-size:.75rem;border-radius:99rem;text-align:center}ax-badge.ax-mini-badge{width:.5rem;height:.5rem}ax-badge.ax-mini-badge .ax-badge-text{display:none}ax-badge.ax-single-badge{width:1.125rem;height:1.125rem;display:flex;align-items:center;justify-content:center}ax-badge.ax-single-badge .ax-badge-text{padding:0}ax-badge .ax-badge-text{padding:.25rem .375rem;height:auto;word-break:break-all}ax-badge.ax-primary-default{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-badge.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-500));color:rgba(var(--ax-color-secondary-fore))}ax-badge.ax-success-default{background-color:rgba(var(--ax-color-success-500));color:rgba(var(--ax-color-success-fore))}ax-badge.ax-warning-default{background-color:rgba(var(--ax-color-warning-500));color:rgba(var(--ax-color-warning-fore))}ax-badge.ax-danger-default{background-color:rgba(var(--ax-color-danger-500));color:rgba(var(--ax-color-danger-fore))}ax-badge.ax-info-default{background-color:rgba(var(--ax-color-info-500));color:rgba(var(--ax-color-info-fore))}ax-badge.ax-ghost-default{background-color:rgba(var(--ax-color-ghost-200));color:rgba(var(--ax-color-ghost-fore))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBadgeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBadgeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-badge', inputs: ['color'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<span *ngIf=\"text\" class=\"ax-badge-text\">{{text}}</span>\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-badge{display:inline-block;font-size:.75rem;border-radius:99rem;text-align:center}ax-badge.ax-mini-badge{width:.5rem;height:.5rem}ax-badge.ax-mini-badge .ax-badge-text{display:none}ax-badge.ax-single-badge{width:1.125rem;height:1.125rem;display:flex;align-items:center;justify-content:center}ax-badge.ax-single-badge .ax-badge-text{padding:0}ax-badge .ax-badge-text{padding:.25rem .375rem;height:auto;word-break:break-all}ax-badge.ax-primary-default{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-badge.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-500));color:rgba(var(--ax-color-secondary-fore))}ax-badge.ax-success-default{background-color:rgba(var(--ax-color-success-500));color:rgba(var(--ax-color-success-fore))}ax-badge.ax-warning-default{background-color:rgba(var(--ax-color-warning-500));color:rgba(var(--ax-color-warning-fore))}ax-badge.ax-danger-default{background-color:rgba(var(--ax-color-danger-500));color:rgba(var(--ax-color-danger-fore))}ax-badge.ax-info-default{background-color:rgba(var(--ax-color-info-500));color:rgba(var(--ax-color-info-fore))}ax-badge.ax-ghost-default{background-color:rgba(var(--ax-color-ghost-200));color:rgba(var(--ax-color-ghost-fore))}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { text: [{
+        }], propDecorators: { text: [{
                 type: Input
             }], __hostClass: [{
                 type: HostBinding,
@@ -31,11 +26,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
 const COMPONENT = [AXBadgeComponent];
 const MODULES = [CommonModule];
 class AXBadgeModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.0", ngImport: i0, type: AXBadgeModule, declarations: [AXBadgeComponent], imports: [CommonModule], exports: [AXBadgeComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBadgeModule, imports: [MODULES] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: AXBadgeModule, declarations: [AXBadgeComponent], imports: [CommonModule], exports: [AXBadgeComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBadgeModule, imports: [MODULES] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBadgeModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBadgeModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],
@@ -49,5 +44,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AXBadgeComponent, AXBadgeModule, AXBaseBadgeMixin };
+export { AXBadgeComponent, AXBadgeModule };
 //# sourceMappingURL=acorex-components-badge.mjs.map

package/fesm2022/acorex-components-badge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-badge.mjs","sources":["../../../../projects/acorex/components/badge/src/badge.component.ts","../../../../projects/acorex/components/badge/src/badge.component.html","../../../../projects/acorex/components/badge/src/badge.module.ts","../../../../projects/acorex/components/badge/acorex-components-badge.ts"],"sourcesContent":["import { _ColorLookComponentMixin, AXBaseComponent, COLOR_LOOK_INPUTS } from '@acorex/components/mixin';\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  ElementRef,\n  ChangeDetectorRef,\n  Input,\n  HostBinding,\n} from '@angular/core';\n\n\nexport const AXBaseBadgeMixin = _ColorLookComponentMixin(AXBaseComponent);\n@Component({\n  selector: 'ax-badge',\n  templateUrl: './badge.component.html',\n  styleUrls: ['./badge.component.scss'],\n  inputs: ['color'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AXBadgeComponent extends AXBaseBadgeMixin {\n  @Input() text: string = '';\n\n  constructor(private elementRef: ElementRef, cdr: ChangeDetectorRef) {\n    super(elementRef, cdr);\n  }\n\n  @HostBinding('class')\n  private get __hostClass(): string {\n    return `ax-${this.color}-default ${!this.text ? 'ax-mini-badge' : ''} ${this.text.length == 1 ? 'ax-single-badge' : ''}`\n  }\n}\n","<ng-content select=\"ax-prefix\"></ng-content>\n<span *ngIf=\"text\" class=\"ax-badge-text\">{{text}}</span>\n<ng-content select=\"ax-suffix\"></ng-content>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXBadgeComponent } from './badge.component';\n\nconst COMPONENT = [AXBadgeComponent];\nconst MODULES = [CommonModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXBadgeModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-badge.mjs","sources":["../../../../projects/acorex/components/badge/src/badge.component.ts","../../../../projects/acorex/components/badge/src/badge.component.html","../../../../projects/acorex/components/badge/src/badge.module.ts","../../../../projects/acorex/components/badge/acorex-components-badge.ts"],"sourcesContent":["import { MXColorComponent } from '@acorex/components/common';\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  Input,\n  HostBinding,\n} from '@angular/core';\nimport { classes } from 'polytype';\n\n@Component({\n  selector: 'ax-badge',\n  templateUrl: './badge.component.html',\n  styleUrls: ['./badge.component.scss'],\n  inputs: ['color'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AXBadgeComponent extends classes(MXColorComponent) {\n\n  @Input() text: string = '';\n\n  @HostBinding('class')\n  private get __hostClass(): string {\n    return `ax-${this.color}-default ${!this.text ? 'ax-mini-badge' : ''} ${this.text.length == 1 ? 'ax-single-badge' : ''}`\n  }\n}\n","<ng-content select=\"ax-prefix\"></ng-content>\n<span *ngIf=\"text\" class=\"ax-badge-text\">{{text}}</span>\n<ng-content select=\"ax-suffix\"></ng-content>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXBadgeComponent } from './badge.component';\n\nconst COMPONENT = [AXBadgeComponent];\nconst MODULES = [CommonModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXBadgeModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;AAUA,MAQa,gBAAiB,SAAQ,OAAO,CAAC,gBAAgB,CAAC,CAAA;IAEpD,IAAI,GAAW,EAAE,CAAC;AAE3B,IAAA,IACY,WAAW,GAAA;AACrB,QAAA,OAAO,CAAM,GAAA,EAAA,IAAI,CAAC,KAAK,YAAY,CAAC,IAAI,CAAC,IAAI,GAAG,eAAe,GAAG,EAAE,CAAI,CAAA,EAAA,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,iBAAiB,GAAG,EAAE,EAAE,CAAA;KACzH;uGAPU,gBAAgB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,wKClB7B,8JAE4C,EAAA,MAAA,EAAA,CAAA,yuCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDgB/B,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAR5B,SAAS;+BACE,UAAU,EAAA,MAAA,EAGZ,CAAC,OAAO,CAAC,EAAA,aAAA,EACF,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,8JAAA,EAAA,MAAA,EAAA,CAAA,yuCAAA,CAAA,EAAA,CAAA;8BAItC,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBAGM,WAAW,EAAA,CAAA;sBADtB,WAAW;uBAAC,OAAO,CAAA;;;AElBtB,MAAM,SAAS,GAAG,CAAC,gBAAgB,CAAC,CAAC;AACrC,MAAM,OAAO,GAAG,CAAC,YAAY,CAAC,CAAC;AAE/B,MAMa,aAAa,CAAA;uGAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAb,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,EATP,YAAA,EAAA,CAAA,gBAAgB,CAClB,EAAA,OAAA,EAAA,CAAA,YAAY,aADV,gBAAgB,CAAA,EAAA,CAAA,CAAA;AAStB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,YAJX,OAAO,CAAA,EAAA,CAAA,CAAA;;2FAIT,aAAa,EAAA,UAAA,EAAA,CAAA;kBANzB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE,CAAC,GAAG,SAAS,CAAC;AAC5B,oBAAA,OAAO,EAAE,CAAC,GAAG,OAAO,CAAC;AACrB,oBAAA,OAAO,EAAE,CAAC,GAAG,SAAS,CAAC;AACvB,oBAAA,SAAS,EAAE,EAAE;AACd,iBAAA,CAAA;;;ACZD;;AAEG;;;;"}

package/fesm2022/acorex-components-breadcrumbs.mjs

@@ -1,25 +1,20 @@
-import { AXBaseComponent, _InteractiveComponenetMixin, _ClickableComponenetMixin } from '@acorex/components/mixin';
+import { _InteractiveComponenetMixin, _ClickableComponenetMixin, AXBaseComponent } from '@acorex/components/mixin';
 import * as i0 from '@angular/core';
 import { Component, ViewEncapsulation, ChangeDetectionStrategy, ContentChild, ViewChild, Optional, Inject, Input, HostListener, HostBinding, NgModule } from '@angular/core';
+import { MXBaseComponent } from '@acorex/components/common';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
-class AXBreadCrumbsComponent extends AXBaseComponent {
+class AXBreadCrumbsComponent extends MXBaseComponent {
     _divider;
     dividerTemplate;
-    /**
-     *  @ignore
-     */
-    constructor(_elementRef, _cdr) {
-        super(_elementRef, _cdr);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBreadCrumbsComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: AXBreadCrumbsComponent, selector: "ax-breadcrumbs", queries: [{ propertyName: "_divider", first: true, predicate: ["divider"], descendants: true }], viewQueries: [{ propertyName: "dividerTemplate", first: true, predicate: ["dividerTpl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-breadcrumbs-item\"></ng-content>\n<ng-template #dividerTpl>\n    <ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_divider\"></ng-container>\n    <ng-container [ngTemplateOutlet]=\"_divider\" *ngIf=\"_divider\"></ng-container>\n    <ng-template #default>\n        <div class=\"ax-breadcrumb-divider\">/</div>\n    </ng-template>\n</ng-template>", styles: ["ax-breadcrumbs{display:inline-flex;align-items:center;width:100%;overflow:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity}ax-breadcrumbs ax-breadcrumbs-item{display:inline-flex;align-items:center;font-size:.875rem;line-height:1.25rem;font-weight:500;cursor:pointer;-webkit-user-select:none;user-select:none}ax-breadcrumbs ax-breadcrumbs-item.ax-state-active .ax-breadcrumbs-item-text{color:rgba(var(--ax-color-primary-500))!important}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text{padding:0 .25rem;color:rgba(var(--ax-color-text-default))}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text:visited{color:rgba(var(--ax-color-text-default))}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text:hover{color:rgba(var(--ax-color-primary-500))}ax-breadcrumbs ax-breadcrumbs-item>.ax-breadcrumb-divider{padding:0 .25rem}ax-breadcrumbs ax-breadcrumbs-item:last-child{scroll-snap-align:end}ax-breadcrumbs ax-breadcrumbs-item:last-child .ax-breadcrumb-divider{display:none}ax-breadcrumbs ax-breadcrumbs-item:not(ax-breadcrumbs ax-breadcrumbs-item:first-child) .ax-breadcrumbs-item-text{padding-inline-start:.25rem}ax-breadcrumbs ax-breadcrumbs-item:not(ax-breadcrumbs ax-breadcrumbs-item:first-child) ax-prefix{padding-inline-start:.25rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBreadCrumbsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AXBreadCrumbsComponent, selector: "ax-breadcrumbs", queries: [{ propertyName: "_divider", first: true, predicate: ["divider"], descendants: true }], viewQueries: [{ propertyName: "dividerTemplate", first: true, predicate: ["dividerTpl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-breadcrumbs-item\"></ng-content>\n<ng-template #dividerTpl>\n    <ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_divider\"></ng-container>\n    <ng-container [ngTemplateOutlet]=\"_divider\" *ngIf=\"_divider\"></ng-container>\n    <ng-template #default>\n        <div class=\"ax-breadcrumb-divider\">/</div>\n    </ng-template>\n</ng-template>", styles: ["ax-breadcrumbs{display:inline-flex;align-items:center;width:100%;overflow:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity}ax-breadcrumbs ax-breadcrumbs-item{display:inline-flex;align-items:center;font-size:.875rem;line-height:1.25rem;font-weight:500;cursor:pointer;-webkit-user-select:none;user-select:none}ax-breadcrumbs ax-breadcrumbs-item.ax-state-active .ax-breadcrumbs-item-text{color:rgba(var(--ax-color-primary-500))!important}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text{padding:0 .25rem;color:rgba(var(--ax-color-text-default))}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text:visited{color:rgba(var(--ax-color-text-default))}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text:hover{color:rgba(var(--ax-color-primary-500))}ax-breadcrumbs ax-breadcrumbs-item>.ax-breadcrumb-divider{padding:0 .25rem}ax-breadcrumbs ax-breadcrumbs-item:last-child{scroll-snap-align:end}ax-breadcrumbs ax-breadcrumbs-item:last-child .ax-breadcrumb-divider{display:none}ax-breadcrumbs ax-breadcrumbs-item:not(ax-breadcrumbs ax-breadcrumbs-item:first-child) .ax-breadcrumbs-item-text{padding-inline-start:.25rem}ax-breadcrumbs ax-breadcrumbs-item:not(ax-breadcrumbs ax-breadcrumbs-item:first-child) ax-prefix{padding-inline-start:.25rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBreadCrumbsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBreadCrumbsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-breadcrumbs', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"ax-breadcrumbs-item\"></ng-content>\n<ng-template #dividerTpl>\n    <ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_divider\"></ng-container>\n    <ng-container [ngTemplateOutlet]=\"_divider\" *ngIf=\"_divider\"></ng-container>\n    <ng-template #default>\n        <div class=\"ax-breadcrumb-divider\">/</div>\n    </ng-template>\n</ng-template>", styles: ["ax-breadcrumbs{display:inline-flex;align-items:center;width:100%;overflow:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity}ax-breadcrumbs ax-breadcrumbs-item{display:inline-flex;align-items:center;font-size:.875rem;line-height:1.25rem;font-weight:500;cursor:pointer;-webkit-user-select:none;user-select:none}ax-breadcrumbs ax-breadcrumbs-item.ax-state-active .ax-breadcrumbs-item-text{color:rgba(var(--ax-color-primary-500))!important}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text{padding:0 .25rem;color:rgba(var(--ax-color-text-default))}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text:visited{color:rgba(var(--ax-color-text-default))}ax-breadcrumbs ax-breadcrumbs-item .ax-breadcrumbs-item-text:hover{color:rgba(var(--ax-color-primary-500))}ax-breadcrumbs ax-breadcrumbs-item>.ax-breadcrumb-divider{padding:0 .25rem}ax-breadcrumbs ax-breadcrumbs-item:last-child{scroll-snap-align:end}ax-breadcrumbs ax-breadcrumbs-item:last-child .ax-breadcrumb-divider{display:none}ax-breadcrumbs ax-breadcrumbs-item:not(ax-breadcrumbs ax-breadcrumbs-item:first-child) .ax-breadcrumbs-item-text{padding-inline-start:.25rem}ax-breadcrumbs ax-breadcrumbs-item:not(ax-breadcrumbs ax-breadcrumbs-item:first-child) ax-prefix{padding-inline-start:.25rem}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { _divider: [{
+        }], propDecorators: { _divider: [{
                 type: ContentChild,
                 args: ['divider']
             }], dividerTemplate: [{
@@ -46,10 +41,10 @@ class AXBreadCrumbsItemComponent extends AXBaseItemBreadCrumbMixin {
     get __hostClass() {
         return `${this.active ? 'ax-state-active' : ''}`;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBreadCrumbsItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXBreadCrumbsComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: AXBreadCrumbsItemComponent, selector: "ax-breadcrumbs-item", inputs: { text: "text", href: "href", active: "active" }, host: { listeners: { "click": "__hostClick($event)" }, properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix, ax-loading, ax-icon\"> </ng-content>\n<a class=\"ax-breadcrumbs-item-text\" [href]=\"href\">{{ text }}</a>\n<ng-content select=\"ax-suffix, ax-loading, ax-icon\"> </ng-content>\n<div class=\"ax-breadcrumb-divider\">\n  <ng-container *ngTemplateOutlet=\"_parent.dividerTemplate\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBreadCrumbsItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXBreadCrumbsComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AXBreadCrumbsItemComponent, selector: "ax-breadcrumbs-item", inputs: { text: "text", href: "href", active: "active" }, host: { listeners: { "click": "__hostClick($event)" }, properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix, ax-loading, ax-icon\"> </ng-content>\n<a class=\"ax-breadcrumbs-item-text\" [href]=\"href\">{{ text }}</a>\n<ng-content select=\"ax-suffix, ax-loading, ax-icon\"> </ng-content>\n<div class=\"ax-breadcrumb-divider\">\n  <ng-container *ngTemplateOutlet=\"_parent.dividerTemplate\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBreadCrumbsItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBreadCrumbsItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-breadcrumbs-item', template: "<ng-content select=\"ax-prefix, ax-loading, ax-icon\"> </ng-content>\n<a class=\"ax-breadcrumbs-item-text\" [href]=\"href\">{{ text }}</a>\n<ng-content select=\"ax-suffix, ax-loading, ax-icon\"> </ng-content>\n<div class=\"ax-breadcrumb-divider\">\n  <ng-container *ngTemplateOutlet=\"_parent.dividerTemplate\"></ng-container>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: AXBreadCrumbsComponent, decorators: [{
@@ -72,11 +67,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
             }] } });
 
 class AXBreadcrumbsModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.0", ngImport: i0, type: AXBreadcrumbsModule, declarations: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent], imports: [CommonModule], exports: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBreadcrumbsModule, imports: [CommonModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: AXBreadcrumbsModule, declarations: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent], imports: [CommonModule], exports: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBreadcrumbsModule, imports: [CommonModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXBreadcrumbsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXBreadcrumbsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent],

package/fesm2022/acorex-components-breadcrumbs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-breadcrumbs.mjs","sources":["../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs.component.ts","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs.component.html","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs-item.component.ts","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs-item.component.html","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs.module.ts","../../../../projects/acorex/components/breadcrumbs/acorex-components-breadcrumbs.ts"],"sourcesContent":["import { AXBaseComponent } from '@acorex/components/mixin';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ContentChild,\n  ElementRef,\n  TemplateRef,\n  ViewChild,\n  ViewEncapsulation,\n} from '@angular/core';\n\n@Component({\n  selector: 'ax-breadcrumbs',\n  templateUrl: './breadcrumbs.component.html',\n  styleUrls:['./breadcrumbs.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AXBreadCrumbsComponent extends AXBaseComponent {\n  @ContentChild('divider')\n  _divider: TemplateRef<any>;\n\n  @ViewChild('dividerTpl')\n  dividerTemplate: TemplateRef<any>;\n  /**\n   *  @ignore\n   */\n  constructor(_elementRef: ElementRef, _cdr: ChangeDetectorRef) {\n    super(_elementRef, _cdr);\n  }\n}\n","<ng-content select=\"ax-breadcrumbs-item\"></ng-content>\n<ng-template #dividerTpl>\n    <ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_divider\"></ng-container>\n    <ng-container [ngTemplateOutlet]=\"_divider\" *ngIf=\"_divider\"></ng-container>\n    <ng-template #default>\n        <div class=\"ax-breadcrumb-divider\">/</div>\n    </ng-template>\n</ng-template>","import { _InteractiveComponenetMixin, _ClickableComponenetMixin, AXBaseComponent } from '@acorex/components/mixin';\nimport { ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Inject, Input, Optional } from '@angular/core';\n\nimport { AXBreadCrumbsComponent } from './breadcrumbs.component';\n\nexport const AXBaseItemBreadCrumbMixin = _InteractiveComponenetMixin(_ClickableComponenetMixin(AXBaseComponent));\n@Component({\n  selector: 'ax-breadcrumbs-item',\n  templateUrl: './breadcrumbs-item.component.html',\n})\nexport class AXBreadCrumbsItemComponent extends AXBaseItemBreadCrumbMixin {\n  @Input() text: string;\n\n  @Input() href: string;\n  @Input() active: boolean;\n\n  /**\n   *  @ignore\n   */\n  constructor(\n    _elementRef: ElementRef,\n    _cdr: ChangeDetectorRef,\n    @Optional()\n    @Inject(AXBreadCrumbsComponent)\n    public _parent: AXBreadCrumbsComponent\n  ) {\n    super(_elementRef, _cdr);\n  }\n\n  @HostListener('click', ['$event'])\n  private __hostClick(e: MouseEvent) {\n    this._emitOnClickEvent(e);\n  }\n\n  @HostBinding('class')\n  private get __hostClass(): string {\n    return `${this.active ? 'ax-state-active' : ''}`;\n  }\n}\n","<ng-content select=\"ax-prefix, ax-loading, ax-icon\"> </ng-content>\n<a class=\"ax-breadcrumbs-item-text\" [href]=\"href\">{{ text }}</a>\n<ng-content select=\"ax-suffix, ax-loading, ax-icon\"> </ng-content>\n<div class=\"ax-breadcrumb-divider\">\n  <ng-container *ngTemplateOutlet=\"_parent.dividerTemplate\"></ng-container>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXBreadCrumbsComponent } from './breadcrumbs.component';\nimport { AXBreadCrumbsItemComponent } from './breadcrumbs-item.component';\n\n@NgModule({\n  declarations: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent],\n  imports: [CommonModule],\n  exports: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent],\n  providers: [],\n})\nexport class AXBreadcrumbsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-breadcrumbs.mjs","sources":["../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs.component.ts","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs.component.html","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs-item.component.ts","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs-item.component.html","../../../../projects/acorex/components/breadcrumbs/src/breadcrumbs.module.ts","../../../../projects/acorex/components/breadcrumbs/acorex-components-breadcrumbs.ts"],"sourcesContent":["import { MXBaseComponent } from '@acorex/components/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  ContentChild,\n  TemplateRef,\n  ViewChild,\n  ViewEncapsulation,\n} from '@angular/core';\n\n@Component({\n  selector: 'ax-breadcrumbs',\n  templateUrl: './breadcrumbs.component.html',\n  styleUrls:['./breadcrumbs.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AXBreadCrumbsComponent extends MXBaseComponent {\n\n  @ContentChild('divider')\n  protected _divider: TemplateRef<any>;\n\n  @ViewChild('dividerTpl')\n  dividerTemplate: TemplateRef<any>;\n\n}\n","<ng-content select=\"ax-breadcrumbs-item\"></ng-content>\n<ng-template #dividerTpl>\n    <ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_divider\"></ng-container>\n    <ng-container [ngTemplateOutlet]=\"_divider\" *ngIf=\"_divider\"></ng-container>\n    <ng-template #default>\n        <div class=\"ax-breadcrumb-divider\">/</div>\n    </ng-template>\n</ng-template>","import { _InteractiveComponenetMixin, _ClickableComponenetMixin, AXBaseComponent } from '@acorex/components/mixin';\nimport { ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Inject, Input, Optional } from '@angular/core';\n\nimport { AXBreadCrumbsComponent } from './breadcrumbs.component';\n\nexport const AXBaseItemBreadCrumbMixin = _InteractiveComponenetMixin(_ClickableComponenetMixin(AXBaseComponent));\n@Component({\n  selector: 'ax-breadcrumbs-item',\n  templateUrl: './breadcrumbs-item.component.html',\n})\nexport class AXBreadCrumbsItemComponent extends AXBaseItemBreadCrumbMixin {\n  @Input() text: string;\n\n  @Input() href: string;\n  @Input() active: boolean;\n\n  /**\n   *  @ignore\n   */\n  constructor(\n    _elementRef: ElementRef,\n    _cdr: ChangeDetectorRef,\n    @Optional()\n    @Inject(AXBreadCrumbsComponent)\n    public _parent: AXBreadCrumbsComponent\n  ) {\n    super(_elementRef, _cdr);\n  }\n\n  @HostListener('click', ['$event'])\n  private __hostClick(e: MouseEvent) {\n    this._emitOnClickEvent(e);\n  }\n\n  @HostBinding('class')\n  private get __hostClass(): string {\n    return `${this.active ? 'ax-state-active' : ''}`;\n  }\n}\n","<ng-content select=\"ax-prefix, ax-loading, ax-icon\"> </ng-content>\n<a class=\"ax-breadcrumbs-item-text\" [href]=\"href\">{{ text }}</a>\n<ng-content select=\"ax-suffix, ax-loading, ax-icon\"> </ng-content>\n<div class=\"ax-breadcrumb-divider\">\n  <ng-container *ngTemplateOutlet=\"_parent.dividerTemplate\"></ng-container>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AXBreadCrumbsComponent } from './breadcrumbs.component';\nimport { AXBreadCrumbsItemComponent } from './breadcrumbs-item.component';\n\n@NgModule({\n  declarations: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent],\n  imports: [CommonModule],\n  exports: [AXBreadCrumbsComponent, AXBreadCrumbsItemComponent],\n  providers: [],\n})\nexport class AXBreadcrumbsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}