@acorex/components 6.1.12 → 7.0.1

package/fesm2020/acorex-components-collapse.mjs

@@ -26,11 +26,11 @@ class AXCollapseComponent extends AXBaseComponent {
         this.isCollapsed = !this.isCollapsed;
     }
 }
-AXCollapseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCollapseComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXCollapseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXCollapseComponent, selector: "ax-collapse", inputs: { isCollapsed: "isCollapsed", caption: "caption" }, outputs: { isCollapsedChange: "isCollapsedChange" }, host: { classAttribute: "ax-collapse" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\">\r\n    <ng-container *ngIf=\"headerTemplate;else header\">\r\n        <div class=\"ax-collapse-custom-header-container\" (click)=\"handleHeaderClick()\">\r\n            <ng-container [ngTemplateOutlet]=\"headerTemplate\"\r\n                [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"></ng-container>\r\n        </div>\r\n    </ng-container>\r\n    <ng-template #header>\r\n        <div class=\"ax-collapse-header-container\" (click)=\"handleHeaderClick()\">\r\n            <div>\r\n                <span class=\"ax-ic ax-ic-chevron ax-collapse-arrow ax-transition-all\"\r\n                    [class.ax-rotate-90]=\"isCollapsed\"></span>\r\n                <ng-content select=\"ax-prefix\"></ng-content>\r\n                <span>{{caption}}</span>\r\n            </div>\r\n            <div>\r\n                <ng-content select=\"ax-suffix\"></ng-content>\r\n            </div>\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"ax-collapse-body ax-transition-all\" *ngIf=\"!isCollapsed\">\r\n    <ng-content></ng-content>\r\n</div>", 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: "14.2.2", ngImport: i0, type: AXCollapseComponent, decorators: [{
+AXCollapseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXCollapseComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+AXCollapseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXCollapseComponent, selector: "ax-collapse", inputs: { isCollapsed: "isCollapsed", caption: "caption" }, outputs: { isCollapsedChange: "isCollapsedChange" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick()\">\r\n    <ng-container *ngIf=\"headerTemplate;else header\">\r\n        <div class=\"ax-collapse-custom-header-container\">\r\n            <ng-container [ngTemplateOutlet]=\"headerTemplate\"\r\n                [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"></ng-container>\r\n        </div>\r\n    </ng-container>\r\n    <ng-template #header>\r\n        <div class=\"ax-collapse-header-container\">\r\n            <span>{{caption}}</span>\r\n            <!-- <span class=\"ax-icon ax-icon-chevron-down ax-collapse-arrow\"\r\n                [ngClass]=\"{'ax-icon-chevron-up': !isCollapsed,'ax-icon-chevrop-down': isCollapsed}\"></span> -->\r\n\r\n                <span class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow ax-transition-all\" [ngClass]=\"{'-ax-rotate-90': isCollapsed, 'ax-rotate-90':!isCollapsed}\"></span>\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"ax-collapse-body\" *ngIf=\"!isCollapsed\">\r\n    <ng-content></ng-content>\r\n</div>", styles: ["ax-collapse,ax-collapse-group{display:block;border:1px solid;border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);overflow:hidden;font-size:1rem}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{color:rgb(var(--ax-color-text-default));padding:.75rem}ax-collapse .ax-collapse-header{background-color:rgba(var(--ax-color-ghost),.08);cursor:pointer;-webkit-user-select:none;user-select:none}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-arrow{font-size:1.5rem}ax-collapse-group ax-collapse{border:0!important;border-radius:0!important}ax-collapse-group ax-collapse:not(ax-collapse-group ax-collapse:last-child){border-bottom:1px solid!important;border-color:rgb(var(--ax-color-border-default))!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "15.0.4", ngImport: i0, type: AXCollapseComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-collapse', host: { class: 'ax-collapse' }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\">\r\n    <ng-container *ngIf=\"headerTemplate;else header\">\r\n        <div class=\"ax-collapse-custom-header-container\" (click)=\"handleHeaderClick()\">\r\n            <ng-container [ngTemplateOutlet]=\"headerTemplate\"\r\n                [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"></ng-container>\r\n        </div>\r\n    </ng-container>\r\n    <ng-template #header>\r\n        <div class=\"ax-collapse-header-container\" (click)=\"handleHeaderClick()\">\r\n            <div>\r\n                <span class=\"ax-ic ax-ic-chevron ax-collapse-arrow ax-transition-all\"\r\n                    [class.ax-rotate-90]=\"isCollapsed\"></span>\r\n                <ng-content select=\"ax-prefix\"></ng-content>\r\n                <span>{{caption}}</span>\r\n            </div>\r\n            <div>\r\n                <ng-content select=\"ax-suffix\"></ng-content>\r\n            </div>\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"ax-collapse-body ax-transition-all\" *ngIf=\"!isCollapsed\">\r\n    <ng-content></ng-content>\r\n</div>" }]
+            args: [{ selector: 'ax-collapse', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick()\">\r\n    <ng-container *ngIf=\"headerTemplate;else header\">\r\n        <div class=\"ax-collapse-custom-header-container\">\r\n            <ng-container [ngTemplateOutlet]=\"headerTemplate\"\r\n                [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"></ng-container>\r\n        </div>\r\n    </ng-container>\r\n    <ng-template #header>\r\n        <div class=\"ax-collapse-header-container\">\r\n            <span>{{caption}}</span>\r\n            <!-- <span class=\"ax-icon ax-icon-chevron-down ax-collapse-arrow\"\r\n                [ngClass]=\"{'ax-icon-chevron-up': !isCollapsed,'ax-icon-chevrop-down': isCollapsed}\"></span> -->\r\n\r\n                <span class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow ax-transition-all\" [ngClass]=\"{'-ax-rotate-90': isCollapsed, 'ax-rotate-90':!isCollapsed}\"></span>\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"ax-collapse-body\" *ngIf=\"!isCollapsed\">\r\n    <ng-content></ng-content>\r\n</div>", styles: ["ax-collapse,ax-collapse-group{display:block;border:1px solid;border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);overflow:hidden;font-size:1rem}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{color:rgb(var(--ax-color-text-default));padding:.75rem}ax-collapse .ax-collapse-header{background-color:rgba(var(--ax-color-ghost),.08);cursor:pointer;-webkit-user-select:none;user-select:none}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-arrow{font-size:1.5rem}ax-collapse-group ax-collapse{border:0!important;border-radius:0!important}ax-collapse-group ax-collapse:not(ax-collapse-group ax-collapse:last-child){border-bottom:1px solid!important;border-color:rgb(var(--ax-color-border-default))!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { isCollapsedChange: [{
                 type: Output
             }], isCollapsed: [{
@@ -70,9 +70,9 @@ class AXCollapseGroupComponent extends AXBaseComponent {
         this._subs = [];
     }
 }
-AXCollapseGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCollapseGroupComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXCollapseGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXCollapseGroupComponent, selector: "ax-collapse-group", inputs: { accordion: "accordion", nonCollapsedIndex: "nonCollapsedIndex" }, host: { classAttribute: "ax-collapse-group" }, queries: [{ propertyName: "_items", predicate: AXCollapseComponent }], usesInheritance: true, ngImport: i0, template: `<ng-content select="ax-collapse"></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCollapseGroupComponent, decorators: [{
+AXCollapseGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXCollapseGroupComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+AXCollapseGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXCollapseGroupComponent, selector: "ax-collapse-group", inputs: { accordion: "accordion", nonCollapsedIndex: "nonCollapsedIndex" }, host: { classAttribute: "ax-collapse-group" }, queries: [{ propertyName: "_items", predicate: AXCollapseComponent }], usesInheritance: true, ngImport: i0, template: `<ng-content select="ax-collapse"></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXCollapseGroupComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-collapse-group',
@@ -92,10 +92,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImpor
 
 class AXCollapseModule {
 }
-AXCollapseModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AXCollapseModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.2", ngImport: i0, type: AXCollapseModule, declarations: [AXCollapseComponent, AXCollapseGroupComponent], imports: [CommonModule], exports: [AXCollapseComponent, AXCollapseGroupComponent] });
-AXCollapseModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCollapseModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCollapseModule, decorators: [{
+AXCollapseModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AXCollapseModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: AXCollapseModule, declarations: [AXCollapseComponent, AXCollapseGroupComponent], imports: [CommonModule], exports: [AXCollapseComponent, AXCollapseGroupComponent] });
+AXCollapseModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXCollapseModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXCollapseModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [AXCollapseComponent, AXCollapseGroupComponent],

package/fesm2020/acorex-components-collapse.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-collapse.mjs","sources":["../../../../projects/acorex/components/collapse/src/collapse.component.ts","../../../../projects/acorex/components/collapse/src/collapse.component.html","../../../../projects/acorex/components/collapse/src/collapse-group.component.ts","../../../../projects/acorex/components/collapse/src/collapse.module.ts","../../../../projects/acorex/components/collapse/acorex-components-collapse.ts"],"sourcesContent":["import { AXBaseComponent } from '@acorex/components/mixin';\r\nimport {\r\n  ChangeDetectionStrategy,\r\n  ChangeDetectorRef,\r\n  Component,\r\n  ContentChild,\r\n  ElementRef,\r\n  EventEmitter,\r\n  Input,\r\n  Output,\r\n  TemplateRef,\r\n  ViewEncapsulation,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'ax-collapse',\r\n  templateUrl: './collapse.component.html',\r\n  host: { class: 'ax-collapse' },\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class AXCollapseComponent extends AXBaseComponent {\r\n  constructor(elementRef: ElementRef, private cdr: ChangeDetectorRef) {\r\n    super(elementRef, cdr);\r\n  }\r\n\r\n  @Output()\r\n  isCollapsedChange: EventEmitter<any> = new EventEmitter<any>();\r\n\r\n  private _isCollapsed: boolean = false;\r\n  @Input()\r\n  public get isCollapsed(): boolean {\r\n    return this._isCollapsed;\r\n  }\r\n  public set isCollapsed(v: boolean) {\r\n    if (v != this._isCollapsed) {\r\n      this._isCollapsed = v;\r\n      this.isCollapsedChange.emit(v);\r\n      this._cdr.detectChanges();\r\n    }\r\n  }\r\n\r\n  @Input()\r\n  caption: string = '';\r\n\r\n  @ContentChild('header', { static: true })\r\n  headerTemplate: TemplateRef<any>;\r\n\r\n  handleHeaderClick() {\r\n    this.isCollapsed = !this.isCollapsed;\r\n  }\r\n}\r\n","<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\">\r\n    <ng-container *ngIf=\"headerTemplate;else header\">\r\n        <div class=\"ax-collapse-custom-header-container\" (click)=\"handleHeaderClick()\">\r\n            <ng-container [ngTemplateOutlet]=\"headerTemplate\"\r\n                [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"></ng-container>\r\n        </div>\r\n    </ng-container>\r\n    <ng-template #header>\r\n        <div class=\"ax-collapse-header-container\" (click)=\"handleHeaderClick()\">\r\n            <div>\r\n                <span class=\"ax-ic ax-ic-chevron ax-collapse-arrow ax-transition-all\"\r\n                    [class.ax-rotate-90]=\"isCollapsed\"></span>\r\n                <ng-content select=\"ax-prefix\"></ng-content>\r\n                <span>{{caption}}</span>\r\n            </div>\r\n            <div>\r\n                <ng-content select=\"ax-suffix\"></ng-content>\r\n            </div>\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"ax-collapse-body ax-transition-all\" *ngIf=\"!isCollapsed\">\r\n    <ng-content></ng-content>\r\n</div>","import { AXBaseComponent } from '@acorex/components/mixin';\r\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, Input, QueryList, ViewEncapsulation } from '@angular/core';\r\nimport { Subscription } from 'rxjs';\r\nimport { AXCollapseComponent } from './collapse.component';\r\n\r\n@Component({\r\n    selector: 'ax-collapse-group',\r\n    template: `<ng-content select=\"ax-collapse\"></ng-content>`,\r\n    host: { class: 'ax-collapse-group' },\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class AXCollapseGroupComponent extends AXBaseComponent {\r\n\r\n    @Input() accordion = false;\r\n\r\n    @Input() nonCollapsedIndex = 0;\r\n\r\n    @ContentChildren(AXCollapseComponent)\r\n    private _items: QueryList<AXCollapseComponent>;\r\n\r\n\r\n    private _subs: Subscription[] = [];\r\n\r\n    constructor(elementRef: ElementRef, private cdr: ChangeDetectorRef) {\r\n        super(elementRef, cdr);\r\n    }\r\n\r\n\r\n    onViewInit(): void {\r\n        if (this.accordion) {\r\n            this._items.forEach(c => c.isCollapsed = true);\r\n            // TODO:Check ts error\r\n            //@ts-ignore\r\n            this._items.get(this.nonCollapsedIndex).isCollapsed = false;\r\n            console.log(this._items[this.nonCollapsedIndex]);\r\n\r\n            this._items.forEach((c1: AXCollapseComponent) => {\r\n                this._subs.push(c1.isCollapsedChange.subscribe(e => {\r\n                    if (!e)\r\n                        this._items.toArray().filter(c2 => c2 != c1).forEach(c => c.isCollapsed = true);\r\n                }));\r\n            })\r\n        }\r\n    }\r\n\r\n    onDestroy(): void {\r\n        this._subs.forEach(s => s.unsubscribe());\r\n        this._subs = [];\r\n    }\r\n\r\n\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { AXCollapseComponent } from './collapse.component';\r\nimport { AXCollapseGroupComponent } from './collapse-group.component';\r\n\r\n@NgModule({\r\n    declarations: [AXCollapseComponent,AXCollapseGroupComponent],\r\n    imports: [ CommonModule ],\r\n    exports: [AXCollapseComponent,AXCollapseGroupComponent],\r\n    providers: [],\r\n})\r\nexport class AXCollapseModule {}","/**\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-collapse.mjs","sources":["../../../../projects/acorex/components/collapse/src/collapse.component.ts","../../../../projects/acorex/components/collapse/src/collapse.component.html","../../../../projects/acorex/components/collapse/src/collapse-group.component.ts","../../../../projects/acorex/components/collapse/src/collapse.module.ts","../../../../projects/acorex/components/collapse/acorex-components-collapse.ts"],"sourcesContent":["import { AXBaseComponent } from '@acorex/components/mixin';\r\nimport {\r\n  ChangeDetectionStrategy,\r\n  ChangeDetectorRef,\r\n  Component,\r\n  ContentChild,\r\n  ElementRef,\r\n  EventEmitter,\r\n  Input,\r\n  Output,\r\n  TemplateRef,\r\n  ViewEncapsulation,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'ax-collapse',\r\n  templateUrl: './collapse.component.html',\r\n  styleUrls: ['./collapse.component.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class AXCollapseComponent extends AXBaseComponent {\r\n  constructor(elementRef: ElementRef, private cdr: ChangeDetectorRef) {\r\n    super(elementRef, cdr);\r\n  }\r\n\r\n  @Output()\r\n  isCollapsedChange: EventEmitter<any> = new EventEmitter<any>();\r\n\r\n  private _isCollapsed: boolean = false;\r\n  @Input()\r\n  public get isCollapsed(): boolean {\r\n    return this._isCollapsed;\r\n  }\r\n  public set isCollapsed(v: boolean) {\r\n    if (v != this._isCollapsed) {\r\n      this._isCollapsed = v;\r\n      this.isCollapsedChange.emit(v);\r\n      this._cdr.detectChanges();\r\n    }\r\n  }\r\n\r\n  @Input()\r\n  caption: string = '';\r\n\r\n  @ContentChild('header', { static: true })\r\n  headerTemplate: TemplateRef<any>;\r\n\r\n  handleHeaderClick() {\r\n    this.isCollapsed = !this.isCollapsed;\r\n  }\r\n}\r\n","<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick()\">\r\n    <ng-container *ngIf=\"headerTemplate;else header\">\r\n        <div class=\"ax-collapse-custom-header-container\">\r\n            <ng-container [ngTemplateOutlet]=\"headerTemplate\"\r\n                [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"></ng-container>\r\n        </div>\r\n    </ng-container>\r\n    <ng-template #header>\r\n        <div class=\"ax-collapse-header-container\">\r\n            <span>{{caption}}</span>\r\n            <!-- <span class=\"ax-icon ax-icon-chevron-down ax-collapse-arrow\"\r\n                [ngClass]=\"{'ax-icon-chevron-up': !isCollapsed,'ax-icon-chevrop-down': isCollapsed}\"></span> -->\r\n\r\n                <span class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow ax-transition-all\" [ngClass]=\"{'-ax-rotate-90': isCollapsed, 'ax-rotate-90':!isCollapsed}\"></span>\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"ax-collapse-body\" *ngIf=\"!isCollapsed\">\r\n    <ng-content></ng-content>\r\n</div>","import { AXBaseComponent } from '@acorex/components/mixin';\r\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, Input, QueryList, ViewEncapsulation } from '@angular/core';\r\nimport { Subscription } from 'rxjs';\r\nimport { AXCollapseComponent } from './collapse.component';\r\n\r\n@Component({\r\n    selector: 'ax-collapse-group',\r\n    template: `<ng-content select=\"ax-collapse\"></ng-content>`,\r\n    host: { class: 'ax-collapse-group' },\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class AXCollapseGroupComponent extends AXBaseComponent {\r\n\r\n    @Input() accordion = false;\r\n\r\n    @Input() nonCollapsedIndex = 0;\r\n\r\n    @ContentChildren(AXCollapseComponent)\r\n    private _items: QueryList<AXCollapseComponent>;\r\n\r\n\r\n    private _subs: Subscription[] = [];\r\n\r\n    constructor(elementRef: ElementRef, private cdr: ChangeDetectorRef) {\r\n        super(elementRef, cdr);\r\n    }\r\n\r\n\r\n    onViewInit(): void {\r\n        if (this.accordion) {\r\n            this._items.forEach(c => c.isCollapsed = true);\r\n            // TODO:Check ts error\r\n            //@ts-ignore\r\n            this._items.get(this.nonCollapsedIndex).isCollapsed = false;\r\n            console.log(this._items[this.nonCollapsedIndex]);\r\n\r\n            this._items.forEach((c1: AXCollapseComponent) => {\r\n                this._subs.push(c1.isCollapsedChange.subscribe(e => {\r\n                    if (!e)\r\n                        this._items.toArray().filter(c2 => c2 != c1).forEach(c => c.isCollapsed = true);\r\n                }));\r\n            })\r\n        }\r\n    }\r\n\r\n    onDestroy(): void {\r\n        this._subs.forEach(s => s.unsubscribe());\r\n        this._subs = [];\r\n    }\r\n\r\n\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { AXCollapseComponent } from './collapse.component';\r\nimport { AXCollapseGroupComponent } from './collapse-group.component';\r\n\r\n@NgModule({\r\n    declarations: [AXCollapseComponent,AXCollapseGroupComponent],\r\n    imports: [ CommonModule ],\r\n    exports: [AXCollapseComponent,AXCollapseGroupComponent],\r\n    providers: [],\r\n})\r\nexport class AXCollapseModule {}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/acorex-components-color-palette.mjs

@@ -7,29 +7,27 @@ import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i2 from '@acorex/components/textbox';
 import { AXTextBoxModule } from '@acorex/components/textbox';
-import * as i3 from '@acorex/components/button';
-import { AXButtonModule } from '@acorex/components/button';
-import * as i4 from '@acorex/components/decorators';
-import { AXDecoratorModule } from '@acorex/components/decorators';
-import * as i5 from '@acorex/components/number-box';
+import * as i3 from '@acorex/components/number-box';
 import { AXNumberBoxModule } from '@acorex/components/number-box';
 import * as i1$1 from '@acorex/components/range-slider';
 import { AXRangeSliderModule } from '@acorex/components/range-slider';
 import { Subject } from 'rxjs';
 import { AXLabelModule } from '@acorex/components/label';
+import { AXButtonModule } from '@acorex/components/button';
+import { AXDecoratorModule } from '@acorex/components/decorators';
 
 class AXColorComponent {
 }
-AXColorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-AXColorComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorComponent });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorComponent, decorators: [{
+AXColorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+AXColorComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorComponent });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorComponent, decorators: [{
             type: Injectable
         }] });
 class AXColorPaletteChildComponent {
 }
-AXColorPaletteChildComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteChildComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-AXColorPaletteChildComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteChildComponent });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteChildComponent, decorators: [{
+AXColorPaletteChildComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteChildComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+AXColorPaletteChildComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteChildComponent });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteChildComponent, decorators: [{
             type: Injectable
         }] });
 
@@ -65,7 +63,7 @@ class AXColorPaletteInputComponent extends AXBaseComponent {
             _cdr.detectChanges();
         });
     }
-    _handleChangeInputMode(e) {
+    _handleChangeInputMode() {
         switch (this._parent.colorMode) {
             case 'rgba':
                 this._parent.colorMode = 'hex';
@@ -96,21 +94,21 @@ class AXColorPaletteInputComponent extends AXBaseComponent {
         }
     }
 }
-AXColorPaletteInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-AXColorPaletteInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXColorPaletteInputComponent, selector: "ax-color-palette-input", host: { classAttribute: "ax-color-palette-input" }, providers: [
+AXColorPaletteInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+AXColorPaletteInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXColorPaletteInputComponent, selector: "ax-color-palette-input", host: { classAttribute: "ax-color-palette-input" }, providers: [
         {
             provide: AXColorPaletteChildComponent,
             useExisting: AXColorPaletteInputComponent,
         },
-    ], usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"_parent.colorMode\">\r\n    <div class=\"palette-inputs\">\r\n        <ng-container *ngSwitchCase=\"'hex'\">\r\n            <div>\r\n                <ax-text-box class=\"ax-w-full\" [value]=\"_hex\"  [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"  (onValueChanged)=\"_handleHEXAValueChanged($event)\">\r\n                </ax-text-box>\r\n                <label>HEX</label>\r\n            </div>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'rgba'\">\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.r\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>R</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.g\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>G</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.b\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>B</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"1\" [(value)]=\"_rgba.a\" [decimals]=\"2\" [step]=\"0.1\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    [showSpinButtons]=\"false\" (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>A</label>\r\n            </div>\r\n        </ng-container>\r\n    </div>\r\n    <ax-button color=\"light\" class=\"ax-w-base\" (onClick)=\"_handleChangeInputMode($event)\" [disabled]=\"_parent.disabled\">\r\n        <ax-icon class=\"ax-ic ax-ic-unfold\"></ax-icon>\r\n    </ax-button>\r\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "name", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "mask-options"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "component", type: i3.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange"] }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i5.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "size", "value", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "name", "checked", "thousandsSeparator", "padDecimalZeros", "step", "decimals", "decimalStep", "showSpinButtons", "minValue", "maxValue"], outputs: ["valueChange", "onValueChanged", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteInputComponent, decorators: [{
+    ], usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"_parent.colorMode\">\r\n    <div class=\"palette-inputs\">\r\n        <ng-container *ngSwitchCase=\"'hex'\">\r\n            <div>\r\n                <ax-text-box [value]=\"_hex\"  [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"  (onValueChanged)=\"_handleHEXAValueChanged($event)\">\r\n                </ax-text-box>\r\n                <label>HEX</label>\r\n            </div>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'rgba'\">\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.r\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>R</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.g\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>G</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.b\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>B</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"1\" [(value)]=\"_rgba.a\" [decimals]=\"2\" [step]=\"0.1\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    [showSpinButtons]=\"false\" (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>A</label>\r\n            </div>\r\n        </ng-container>\r\n    </div>\r\n    <button class=\"ax-general-button ax-button-icon\" (click)=\"_handleChangeInputMode()\" [disabled]=\"_parent.disabled\">\r\n        <span class=\"ax-icon ax-icon-unfold-more\"></span>\r\n    </button>\r\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "name", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "mask-options"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "component", type: i3.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "size", "value", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "name", "checked", "thousandsSeparator", "padDecimalZeros", "step", "decimals", "decimalStep", "showSpinButtons", "minValue", "maxValue"], outputs: ["valueChange", "onValueChanged", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-color-palette-input', host: { class: 'ax-color-palette-input' }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
                             provide: AXColorPaletteChildComponent,
                             useExisting: AXColorPaletteInputComponent,
                         },
-                    ], template: "<ng-container [ngSwitch]=\"_parent.colorMode\">\r\n    <div class=\"palette-inputs\">\r\n        <ng-container *ngSwitchCase=\"'hex'\">\r\n            <div>\r\n                <ax-text-box class=\"ax-w-full\" [value]=\"_hex\"  [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"  (onValueChanged)=\"_handleHEXAValueChanged($event)\">\r\n                </ax-text-box>\r\n                <label>HEX</label>\r\n            </div>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'rgba'\">\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.r\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>R</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.g\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>G</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.b\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>B</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"1\" [(value)]=\"_rgba.a\" [decimals]=\"2\" [step]=\"0.1\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    [showSpinButtons]=\"false\" (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>A</label>\r\n            </div>\r\n        </ng-container>\r\n    </div>\r\n    <ax-button color=\"light\" class=\"ax-w-base\" (onClick)=\"_handleChangeInputMode($event)\" [disabled]=\"_parent.disabled\">\r\n        <ax-icon class=\"ax-ic ax-ic-unfold\"></ax-icon>\r\n    </ax-button>\r\n</ng-container>" }]
+                    ], template: "<ng-container [ngSwitch]=\"_parent.colorMode\">\r\n    <div class=\"palette-inputs\">\r\n        <ng-container *ngSwitchCase=\"'hex'\">\r\n            <div>\r\n                <ax-text-box [value]=\"_hex\"  [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"  (onValueChanged)=\"_handleHEXAValueChanged($event)\">\r\n                </ax-text-box>\r\n                <label>HEX</label>\r\n            </div>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'rgba'\">\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.r\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>R</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.g\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>G</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"255\" [(value)]=\"_rgba.b\" [showSpinButtons]=\"false\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>B</label>\r\n            </div>\r\n            <div>\r\n                <ax-number-box [minValue]=\"0\" [maxValue]=\"1\" [(value)]=\"_rgba.a\" [decimals]=\"2\" [step]=\"0.1\" [disabled]=\"_parent.disabled\" [readonly]=\"_parent.readonly\"\r\n                    [showSpinButtons]=\"false\" (onValueChanged)=\"_handleRGBAValueChanged($event)\">\r\n                </ax-number-box>\r\n                <label>A</label>\r\n            </div>\r\n        </ng-container>\r\n    </div>\r\n    <button class=\"ax-general-button ax-button-icon\" (click)=\"_handleChangeInputMode()\" [disabled]=\"_parent.disabled\">\r\n        <span class=\"ax-icon ax-icon-unfold-more\"></span>\r\n    </button>\r\n</ng-container>" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: AXColorComponent, decorators: [{
                     type: Optional
                 }, {
@@ -184,14 +182,14 @@ class AXColorPalettePickerComponent extends AXBaseComponent {
         }
     }
 }
-AXColorPalettePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPalettePickerComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-AXColorPalettePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXColorPalettePickerComponent, selector: "ax-color-palette-picker", host: { classAttribute: "ax-color-palette-picker" }, providers: [
+AXColorPalettePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPalettePickerComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+AXColorPalettePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXColorPalettePickerComponent, selector: "ax-color-palette-picker", host: { classAttribute: "ax-color-palette-picker" }, providers: [
         {
             provide: AXColorPaletteChildComponent,
             useExisting: AXColorPalettePickerComponent,
         },
     ], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-color-picker-overlay\" [style.background-color]=\"_bgColor\">\r\n    <div class=\"ax-color-picker-overlay-color\"></div>\r\n    <div class=\"ax-color-picker-overlay-gradient\"></div>\r\n    <div class=\"ax-color-picker-pointer\"></div>\r\n</div>\r\n<ax-range-slider class=\"ax-color-picker-gradient\" [minValue]=\"0\" [maxValue]=\"99\" [step]=\"1\" [value]=\"_gradient\" \r\n    (onValueChanged)=\"_handleGradientChanged($event)\">\r\n</ax-range-slider>\r\n<ax-range-slider class=\"ax-color-picker-transparent\" [minValue]=\"0\" [maxValue]=\"1\" [step]=\"0.01\" [value]=\"_rgba.a\"\r\n    (onValueChanged)=\"_handleAlphaChanged($event)\">\r\n</ax-range-slider>", dependencies: [{ kind: "component", type: i1$1.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["readonly", "allowNull", "value", "name", "checked", "minValue", "maxValue", "step", "color", "oriantaion"], outputs: ["valueChange", "onValueChanged", "colorChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPalettePickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPalettePickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-color-palette-picker', host: { class: 'ax-color-palette-picker' }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -226,8 +224,8 @@ class AXColorPalettePreviewComponent extends AXBaseComponent {
         });
     }
 }
-AXColorPalettePreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPalettePreviewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-AXColorPalettePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXColorPalettePreviewComponent, selector: "ax-color-palette-preview", host: { classAttribute: "ax-color-palette-preview" }, providers: [
+AXColorPalettePreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPalettePreviewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+AXColorPalettePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXColorPalettePreviewComponent, selector: "ax-color-palette-preview", host: { classAttribute: "ax-color-palette-preview" }, providers: [
         {
             provide: AXColorPaletteChildComponent,
             useExisting: AXColorPalettePreviewComponent,
@@ -236,7 +234,7 @@ AXColorPalettePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
     class="palette-preview-overlay"
     [class.ax-state-disabled]="_parent.disabled"
   ></div>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPalettePreviewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPalettePreviewComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-color-palette-preview',
@@ -505,8 +503,8 @@ class AXColorPaletteSwatchesComponent extends AXBaseComponent {
         };
     }
 }
-AXColorPaletteSwatchesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteSwatchesComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-AXColorPaletteSwatchesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: { colors: "colors" }, providers: [
+AXColorPaletteSwatchesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteSwatchesComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXColorComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+AXColorPaletteSwatchesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: { colors: "colors" }, providers: [
         {
             provide: AXColorPaletteChildComponent,
             useExisting: AXColorPaletteSwatchesComponent,
@@ -518,7 +516,7 @@ AXColorPaletteSwatchesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
     [class.ax-state-selected]="color.code == _selected"
     (click)="_handleClick($event, color)"
   ></div>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteSwatchesComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteSwatchesComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-color-palette-swatches, ax-color-palette-favorite',
@@ -600,15 +598,15 @@ class AXColorPalleteComponent extends AXBaseValueComponentMixin {
         return this.disabled;
     }
 }
-AXColorPalleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPalleteComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXColorPalleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXColorPalleteComponent, selector: "ax-color-palette", inputs: { disabled: "disabled", tabIndex: "tabIndex", readonly: "readonly", allowNull: "allowNull", value: "value", name: "name", checked: "checked", colorMode: "colorMode" }, outputs: { onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged", colorModeChange: "colorModeChange" }, host: { properties: { "class.ax-state-disabled": "this.__hostDisabled" }, classAttribute: "ax-color-palette" }, providers: [
+AXColorPalleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPalleteComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+AXColorPalleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXColorPalleteComponent, selector: "ax-color-palette", inputs: { disabled: "disabled", tabIndex: "tabIndex", readonly: "readonly", allowNull: "allowNull", value: "value", name: "name", checked: "checked", colorMode: "colorMode" }, outputs: { onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged", colorModeChange: "colorModeChange" }, host: { properties: { "class.ax-state-disabled": "this.__hostDisabled" } }, providers: [
         { provide: AXColorComponent, useExisting: AXColorPalleteComponent },
-    ], queries: [{ propertyName: "_children", predicate: AXColorPaletteChildComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select='ax-header'></ng-content>\r\n\r\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\r\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\r\n\r\n<ng-template #custom>\r\n    <ng-content select='ax-color-palette-preview'></ng-content>\r\n    <ng-content select='ax-color-palette-picker'></ng-content>\r\n    <ng-content select='ax-color-palette-swatches'></ng-content>\r\n    <ng-content select='ax-color-palette-favorite'></ng-content>\r\n    <ng-content select='ax-color-palette-input'></ng-content>\r\n</ng-template>\r\n<ng-template #default>\r\n    <ax-color-palette-preview></ax-color-palette-preview>\r\n    <ax-color-palette-swatches></ax-color-palette-swatches>\r\n    <ax-color-palette-input></ax-color-palette-input>\r\n</ng-template>\r\n\r\n<ng-content select='ax-footer'></ng-content>\r\n\r\n\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXColorPalettePreviewComponent, selector: "ax-color-palette-preview" }, { kind: "component", type: AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: AXColorPaletteInputComponent, selector: "ax-color-palette-input" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPalleteComponent, decorators: [{
+    ], queries: [{ propertyName: "_children", predicate: AXColorPaletteChildComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select='ax-header'></ng-content>\r\n\r\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\r\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\r\n\r\n<ng-template #custom>\r\n    <ng-content select='ax-color-palette-preview'></ng-content>\r\n    <ng-content select='ax-color-palette-picker'></ng-content>\r\n    <ng-content select='ax-color-palette-swatches'></ng-content>\r\n    <ng-content select='ax-color-palette-favorite'></ng-content>\r\n    <ng-content select='ax-color-palette-input'></ng-content>\r\n</ng-template>\r\n<ng-template #default>\r\n    <ax-color-palette-preview></ax-color-palette-preview>\r\n    <ax-color-palette-swatches></ax-color-palette-swatches>\r\n    <ax-color-palette-input></ax-color-palette-input>\r\n</ng-template>\r\n\r\n<ng-content select='ax-footer'></ng-content>\r\n\r\n\r\n", styles: ["ax-color-palette{width:20rem;display:flex;flex-direction:column;border:1px solid;background-color:rgb(var(--ax-color-surface));border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);gap:.5rem}ax-color-palette.ax-state-disabled{opacity:.5;cursor:not-allowed}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{opacity:.5;cursor:not-allowed}ax-color-palette ax-header,ax-color-palette ax-footer{padding:.75rem;border-top-width:1px;display:flex}ax-color-palette ax-color-palette-preview{position:relative;width:100%;height:5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default);background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center}ax-color-palette ax-color-palette-favorite{display:block;border-top:1px solid;border-color:rgb(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;gap:.125rem;padding:.5rem;grid-template-columns:repeat(8,minmax(0,1fr));max-height:9rem;overflow-x:hidden}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;margin:.125rem;border-radius:var(--ax-rounded-border-default);border:1px solid rgb(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{content:\"\";padding-top:100%;float:left}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{content:\"\";display:block;clear:both}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{outline-offset:2px;outline-width:2px;outline-style:solid;outline-color:rgba(var(--ax-color-ghost),.08)}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.875rem;line-height:1.25rem}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay{display:block;width:100%;height:8rem;position:relative}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-pointer{width:.75rem;height:.75rem;border-radius:999rem;background-color:transparent;border:1px solid rgb(var(--ax-color-background-default))}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-color,ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-gradient{height:100%;width:100%;position:absolute;inset:0}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-color{background:linear-gradient(to right,rgb(255,255,255),rgba(255,255,255,0))}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-gradient{background:linear-gradient(to top,rgb(0,0,0),rgba(0,0,0,0))}ax-color-palette ax-color-palette-picker .ax-range-slider.ax-color-picker-gradient input{background:linear-gradient(to right,rgb(255,0,0) 0%,rgb(255,255,0) 17%,rgb(0,255,0) 33%,rgb(0,255,255) 50%,rgb(0,0,255) 67%,rgb(255,0,255) 83%,rgb(255,0,0) 100%)}ax-color-palette ax-color-palette-picker .ax-range-slider.ax-color-picker-transparent input{background-image:linear-gradient(to right,rgba(245,246,252,0),rgb(0,0,0)),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXColorPalettePreviewComponent, selector: "ax-color-palette-preview" }, { kind: "component", type: AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: AXColorPaletteInputComponent, selector: "ax-color-palette-input" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPalleteComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-color-palette', inputs: ['disabled', 'tabIndex', 'readonly', 'allowNull', 'value', 'name', 'checked'], outputs: ['onBlur', 'onFocus', 'valueChange', 'onValueChanged'], host: { class: 'ax-color-palette' }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+            args: [{ selector: 'ax-color-palette', inputs: ['disabled', 'tabIndex', 'readonly', 'allowNull', 'value', 'name', 'checked'], outputs: ['onBlur', 'onFocus', 'valueChange', 'onValueChanged'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: AXColorComponent, useExisting: AXColorPalleteComponent },
-                    ], template: "<ng-content select='ax-header'></ng-content>\r\n\r\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\r\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\r\n\r\n<ng-template #custom>\r\n    <ng-content select='ax-color-palette-preview'></ng-content>\r\n    <ng-content select='ax-color-palette-picker'></ng-content>\r\n    <ng-content select='ax-color-palette-swatches'></ng-content>\r\n    <ng-content select='ax-color-palette-favorite'></ng-content>\r\n    <ng-content select='ax-color-palette-input'></ng-content>\r\n</ng-template>\r\n<ng-template #default>\r\n    <ax-color-palette-preview></ax-color-palette-preview>\r\n    <ax-color-palette-swatches></ax-color-palette-swatches>\r\n    <ax-color-palette-input></ax-color-palette-input>\r\n</ng-template>\r\n\r\n<ng-content select='ax-footer'></ng-content>\r\n\r\n\r\n" }]
+                    ], template: "<ng-content select='ax-header'></ng-content>\r\n\r\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children.length\"></ng-container>\r\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children.length\"></ng-container>\r\n\r\n<ng-template #custom>\r\n    <ng-content select='ax-color-palette-preview'></ng-content>\r\n    <ng-content select='ax-color-palette-picker'></ng-content>\r\n    <ng-content select='ax-color-palette-swatches'></ng-content>\r\n    <ng-content select='ax-color-palette-favorite'></ng-content>\r\n    <ng-content select='ax-color-palette-input'></ng-content>\r\n</ng-template>\r\n<ng-template #default>\r\n    <ax-color-palette-preview></ax-color-palette-preview>\r\n    <ax-color-palette-swatches></ax-color-palette-swatches>\r\n    <ax-color-palette-input></ax-color-palette-input>\r\n</ng-template>\r\n\r\n<ng-content select='ax-footer'></ng-content>\r\n\r\n\r\n", styles: ["ax-color-palette{width:20rem;display:flex;flex-direction:column;border:1px solid;background-color:rgb(var(--ax-color-surface));border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);gap:.5rem}ax-color-palette.ax-state-disabled{opacity:.5;cursor:not-allowed}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{opacity:.5;cursor:not-allowed}ax-color-palette ax-header,ax-color-palette ax-footer{padding:.75rem;border-top-width:1px;display:flex}ax-color-palette ax-color-palette-preview{position:relative;width:100%;height:5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default);background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center}ax-color-palette ax-color-palette-favorite{display:block;border-top:1px solid;border-color:rgb(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;gap:.125rem;padding:.5rem;grid-template-columns:repeat(8,minmax(0,1fr));max-height:9rem;overflow-x:hidden}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;margin:.125rem;border-radius:var(--ax-rounded-border-default);border:1px solid rgb(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{content:\"\";padding-top:100%;float:left}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{content:\"\";display:block;clear:both}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{outline-offset:2px;outline-width:2px;outline-style:solid;outline-color:rgba(var(--ax-color-ghost),.08)}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.875rem;line-height:1.25rem}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay{display:block;width:100%;height:8rem;position:relative}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-pointer{width:.75rem;height:.75rem;border-radius:999rem;background-color:transparent;border:1px solid rgb(var(--ax-color-background-default))}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-color,ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-gradient{height:100%;width:100%;position:absolute;inset:0}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-color{background:linear-gradient(to right,rgb(255,255,255),rgba(255,255,255,0))}ax-color-palette ax-color-palette-picker .ax-color-picker-overlay .ax-color-picker-overlay-gradient{background:linear-gradient(to top,rgb(0,0,0),rgba(0,0,0,0))}ax-color-palette ax-color-palette-picker .ax-range-slider.ax-color-picker-gradient input{background:linear-gradient(to right,rgb(255,0,0) 0%,rgb(255,255,0) 17%,rgb(0,255,0) 33%,rgb(0,255,255) 50%,rgb(0,0,255) 67%,rgb(255,0,255) 83%,rgb(255,0,0) 100%)}ax-color-palette ax-color-palette-picker .ax-range-slider.ax-color-picker-transparent input{background-image:linear-gradient(to right,rgba(245,246,252,0),rgb(0,0,0)),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { _children: [{
                 type: ContentChildren,
                 args: [AXColorPaletteChildComponent]
@@ -638,8 +636,8 @@ const CONPONENTS = [
 ];
 class AXColorPaletteModule {
 }
-AXColorPaletteModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AXColorPaletteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteModule, declarations: [AXColorPalleteComponent,
+AXColorPaletteModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AXColorPaletteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteModule, declarations: [AXColorPalleteComponent,
         AXColorPalettePreviewComponent,
         AXColorPaletteSwatchesComponent,
         AXColorPaletteInputComponent,
@@ -653,8 +651,8 @@ AXColorPaletteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ve
         AXColorPaletteSwatchesComponent,
         AXColorPaletteInputComponent,
         AXColorPalettePickerComponent] });
-AXColorPaletteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteModule, imports: [CommonModule, MODULES] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXColorPaletteModule, decorators: [{
+AXColorPaletteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteModule, imports: [CommonModule, MODULES] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXColorPaletteModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...CONPONENTS],