@acorex/components 16.0.2 → 17.0.1

package/fesm2022/acorex-components-check-box.mjs

@@ -0,0 +1,124 @@
+import { MXValueComponent, AXValuableComponent } from '@acorex/components/common';
+import { AXLabelComponent } from '@acorex/components/label';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i0 from '@angular/core';
+import { forwardRef, Component, ViewEncapsulation, ChangeDetectionStrategy, ContentChildren, Input, HostListener, NgModule } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
+import { AXDecoratorModule } from '@acorex/components/decorators';
+import { CommonModule } from '@angular/common';
+
+class AXCheckBoxComponent extends MXValueComponent {
+    constructor() {
+        super(...arguments);
+        this.indeterminate = false;
+        this._stateIndeterminate = false;
+    }
+    internalGetValue(value) {
+        if (!this.indeterminate && value == null) {
+            return false;
+        }
+        if (this.indeterminate && value == null) {
+            return null;
+        }
+        return coerceBooleanProperty(value);
+    }
+    internalSetValue(value) {
+        if (this.indeterminate && value == null) {
+            this._stateIndeterminate = true;
+            return null;
+        }
+        else if (!this.indeterminate && value == null) {
+            this._stateIndeterminate = false;
+            return false;
+        }
+        else {
+            this._stateIndeterminate = false;
+            return value == true ? true : false;
+        }
+    }
+    ngOnInit() {
+        super.ngOnInit();
+        //
+        this.registerValidation();
+    }
+    ngAfterViewInit() {
+        this._labels?.forEach((c) => {
+            //TODO: remove listener
+            c.getHostElement().addEventListener('click', () => {
+                if (!this.readonly && !this.disabled) {
+                    this.value = !this.value;
+                }
+            });
+        });
+    }
+    _handleClick(e) {
+        e.stopPropagation();
+        if (this.readonly || this.disabled) {
+            e.preventDefault();
+            return false;
+        }
+        return true;
+    }
+    _handleModelChange(value) {
+        this.commitValue(value, true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCheckBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: AXCheckBoxComponent, selector: "ax-check-box", inputs: { disabled: "disabled", tabIndex: "tabIndex", readonly: "readonly", value: "value", name: "name", id: "id", checked: "checked", indeterminate: "indeterminate" }, outputs: { onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged" }, host: { listeners: { "click": "_handleClick($event)" } }, providers: [
+            { provide: AXValuableComponent, useExisting: AXCheckBoxComponent },
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => AXCheckBoxComponent),
+                multi: true,
+            },
+        ], queries: [{ propertyName: "_labels", predicate: AXLabelComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-checkbox-label\" [class.ax-state-readonly]=\"readonly\" [class.ax-state-disabled]=\"disabled\">\n  <div class=\"ax-checkbox-start-side\">\n    <input\n      [id]=\"id\"\n      class=\"ax-checkbox\"\n      type=\"checkbox\"\n      [indeterminate]=\"_stateIndeterminate\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"_handleModelChange($event)\"\n      [checked]=\"value\"\n      [disabled]=\"disabled\"\n      [readonly]=\"readonly\"\n      [tabindex]=\"tabIndex\"\n      (focus)=\"emitOnFocusEvent($event)\"\n      (blur)=\"emitOnBlurEvent($event)\"\n    />\n  </div>\n  <div class=\"ax-checkbox-end-side\">\n    <ng-content select=\"ax-label\"></ng-content>\n    <ng-content select=\"ax-form-hint\"></ng-content>\n    <span class=\"ax-error-container\"></span>\n  </div>\n</div>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: [".ax-checkbox-label{display:flex;width:fit-content;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;font-size:.875rem;line-height:1.25rem}.ax-checkbox-label.ax-state-readonly{opacity:.75}.ax-checkbox-label.ax-state-disabled{cursor:not-allowed;opacity:.5}.ax-checkbox-label.ax-state-disabled .ax-checkbox:disabled{opacity:1}.ax-checkbox-label .ax-checkbox-start-side{display:flex;height:1.25rem;align-items:center}.ax-checkbox-label .ax-checkbox-end-side{margin-inline-start:.75rem}.ax-checkbox-label .ax-checkbox-end-side ax-label label{margin-bottom:0}.ax-checkbox-label .ax-checkbox-end-side ax-form-hint{margin-top:.25rem;cursor:text;-webkit-user-select:text;user-select:text}\n"], dependencies: [{ kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCheckBoxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-check-box', inputs: [
+                        'disabled',
+                        'tabIndex',
+                        'readonly',
+                        'value',
+                        'name',
+                        'id',
+                        'checked',
+                    ], outputs: ['onBlur', 'onFocus', 'valueChange', 'onValueChanged'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        { provide: AXValuableComponent, useExisting: AXCheckBoxComponent },
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => AXCheckBoxComponent),
+                            multi: true,
+                        },
+                    ], template: "<div class=\"ax-checkbox-label\" [class.ax-state-readonly]=\"readonly\" [class.ax-state-disabled]=\"disabled\">\n  <div class=\"ax-checkbox-start-side\">\n    <input\n      [id]=\"id\"\n      class=\"ax-checkbox\"\n      type=\"checkbox\"\n      [indeterminate]=\"_stateIndeterminate\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"_handleModelChange($event)\"\n      [checked]=\"value\"\n      [disabled]=\"disabled\"\n      [readonly]=\"readonly\"\n      [tabindex]=\"tabIndex\"\n      (focus)=\"emitOnFocusEvent($event)\"\n      (blur)=\"emitOnBlurEvent($event)\"\n    />\n  </div>\n  <div class=\"ax-checkbox-end-side\">\n    <ng-content select=\"ax-label\"></ng-content>\n    <ng-content select=\"ax-form-hint\"></ng-content>\n    <span class=\"ax-error-container\"></span>\n  </div>\n</div>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: [".ax-checkbox-label{display:flex;width:fit-content;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;font-size:.875rem;line-height:1.25rem}.ax-checkbox-label.ax-state-readonly{opacity:.75}.ax-checkbox-label.ax-state-disabled{cursor:not-allowed;opacity:.5}.ax-checkbox-label.ax-state-disabled .ax-checkbox:disabled{opacity:1}.ax-checkbox-label .ax-checkbox-start-side{display:flex;height:1.25rem;align-items:center}.ax-checkbox-label .ax-checkbox-end-side{margin-inline-start:.75rem}.ax-checkbox-label .ax-checkbox-end-side ax-label label{margin-bottom:0}.ax-checkbox-label .ax-checkbox-end-side ax-form-hint{margin-top:.25rem;cursor:text;-webkit-user-select:text;user-select:text}\n"] }]
+        }], propDecorators: { _labels: [{
+                type: ContentChildren,
+                args: [AXLabelComponent]
+            }], indeterminate: [{
+                type: Input
+            }], _handleClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });
+
+class AXCheckBoxModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCheckBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: AXCheckBoxModule, declarations: [AXCheckBoxComponent], imports: [CommonModule, FormsModule, AXDecoratorModule], exports: [AXCheckBoxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCheckBoxModule, imports: [CommonModule, FormsModule, AXDecoratorModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCheckBoxModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AXCheckBoxComponent],
+                    imports: [CommonModule, FormsModule, AXDecoratorModule],
+                    exports: [AXCheckBoxComponent],
+                    providers: [],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AXCheckBoxComponent, AXCheckBoxModule };
+//# sourceMappingURL=acorex-components-check-box.mjs.map

package/fesm2022/acorex-components-check-box.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-components-check-box.mjs","sources":["../../../../libs/components/check-box/src/lib/check-box.component.ts","../../../../libs/components/check-box/src/lib/check-box.component.html","../../../../libs/components/check-box/src/lib/check-box.module.ts","../../../../libs/components/check-box/src/acorex-components-check-box.ts"],"sourcesContent":["import {\n  AXValuableComponent,\n  MXValueComponent,\n} from '@acorex/components/common';\n\nimport { AXLabelComponent } from '@acorex/components/label';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  ContentChildren,\n  HostListener,\n  Input,\n  QueryList,\n  ViewEncapsulation,\n  forwardRef,\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n  selector: 'ax-check-box',\n  templateUrl: './check-box.component.html',\n  styleUrls: ['./check-box.component.scss'],\n  inputs: [\n    'disabled',\n    'tabIndex',\n    'readonly',\n    'value',\n    'name',\n    'id',\n    'checked',\n  ],\n  outputs: ['onBlur', 'onFocus', 'valueChange', 'onValueChanged'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    { provide: AXValuableComponent, useExisting: AXCheckBoxComponent },\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => AXCheckBoxComponent),\n      multi: true,\n    },\n  ],\n})\nexport class AXCheckBoxComponent\n  extends MXValueComponent<boolean | null>\n  implements AfterViewInit\n{\n  @ContentChildren(AXLabelComponent)\n  private _labels: QueryList<AXLabelComponent>;\n\n  @Input()\n  public indeterminate = false;\n\n  protected _stateIndeterminate = false;\n\n  protected override internalGetValue(value: unknown): boolean | null {\n    if (!this.indeterminate && value == null) {\n      return false;\n    }\n    if (this.indeterminate && value == null) {\n      return null;\n    }\n    return coerceBooleanProperty(value);\n  }\n\n  override internalSetValue(value: boolean | null) {\n    if (this.indeterminate && value == null) {\n      this._stateIndeterminate = true;\n      return null;\n    } else if (!this.indeterminate && value == null) {\n      this._stateIndeterminate = false;\n      return false;\n    } else {\n      this._stateIndeterminate = false;\n      return value == true ? true : false;\n    }\n  }\n\n  protected override ngOnInit(): void {\n    super.ngOnInit();\n    //\n    this.registerValidation();\n  }\n\n  ngAfterViewInit() {\n    this._labels?.forEach((c) => {\n      //TODO: remove listener\n      c.getHostElement().addEventListener('click', () => {\n        if (!this.readonly && !this.disabled) {\n          this.value = !this.value;\n        }\n      });\n    });\n  }\n\n  @HostListener('click', ['$event'])\n  private _handleClick(e: UIEvent) {\n    e.stopPropagation();\n    if (this.readonly || this.disabled) {\n      e.preventDefault();\n      return false;\n    }\n    return true;\n  }\n\n  protected _handleModelChange(value: boolean | null) {\n    this.commitValue(value, true);\n  }\n}\n","<div class=\"ax-checkbox-label\" [class.ax-state-readonly]=\"readonly\" [class.ax-state-disabled]=\"disabled\">\n  <div class=\"ax-checkbox-start-side\">\n    <input\n      [id]=\"id\"\n      class=\"ax-checkbox\"\n      type=\"checkbox\"\n      [indeterminate]=\"_stateIndeterminate\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"_handleModelChange($event)\"\n      [checked]=\"value\"\n      [disabled]=\"disabled\"\n      [readonly]=\"readonly\"\n      [tabindex]=\"tabIndex\"\n      (focus)=\"emitOnFocusEvent($event)\"\n      (blur)=\"emitOnBlurEvent($event)\"\n    />\n  </div>\n  <div class=\"ax-checkbox-end-side\">\n    <ng-content select=\"ax-label\"></ng-content>\n    <ng-content select=\"ax-form-hint\"></ng-content>\n    <span class=\"ax-error-container\"></span>\n  </div>\n</div>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n","import { AXDecoratorModule } from '@acorex/components/decorators';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { AXCheckBoxComponent } from './check-box.component';\n@NgModule({\n  declarations: [AXCheckBoxComponent],\n  imports: [CommonModule, FormsModule, AXDecoratorModule],\n  exports: [AXCheckBoxComponent],\n  providers: [],\n})\nexport class AXCheckBoxModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-chips.mjs

@@ -0,0 +1,51 @@
+import * as i1 from '@acorex/components/common';
+import { MXColorComponent, AXRippleDirective } from '@acorex/components/common';
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input, HostBinding, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+class AXChipsComponent extends MXColorComponent {
+    constructor() {
+        super();
+        this.look = 'solid';
+        this.text = '';
+    }
+    get __hostClass() {
+        return `ax-el-${this.color}-${this.look} ax-el-interactive`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXChipsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.2", type: AXChipsComponent, selector: "ax-chips", inputs: { tabIndex: "tabIndex", color: "color", look: "look", text: "text" }, outputs: { colorChange: "colorChange" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, hostDirectives: [{ directive: i1.AXRippleDirective }], ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@if(text){\n<div class=\"ax-chips-text\">{{text }}</div>\n}\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-chips{position:relative;display:flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center;border-radius:9999px;padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-chips:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#00000080}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:.5rem;padding-right:.5rem}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center;font-size:1.125rem;line-height:1.75rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXChipsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-chips', inputs: ['tabIndex', 'color'], outputs: ['colorChange'], hostDirectives: [AXRippleDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@if(text){\n<div class=\"ax-chips-text\">{{text }}</div>\n}\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-chips{position:relative;display:flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center;border-radius:9999px;padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-chips:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#00000080}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:.5rem;padding-right:.5rem}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center;font-size:1.125rem;line-height:1.75rem}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { look: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], __hostClass: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+class AXChipsModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: AXChipsModule, declarations: [AXChipsComponent], imports: [CommonModule], exports: [AXChipsComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXChipsModule, imports: [CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXChipsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AXChipsComponent],
+                    imports: [CommonModule],
+                    exports: [AXChipsComponent],
+                    providers: [],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AXChipsComponent, AXChipsModule };
+//# sourceMappingURL=acorex-components-chips.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-components-chips.mjs","sources":["../../../../libs/components/chips/src/lib/chips.component.ts","../../../../libs/components/chips/src/lib/chips.component.html","../../../../libs/components/chips/src/lib/chips.module.ts","../../../../libs/components/chips/src/acorex-components-chips.ts"],"sourcesContent":["import { AXRippleDirective, MXColorComponent } from '@acorex/components/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  HostBinding,\n  Input,\n  ViewEncapsulation,\n} from '@angular/core';\n\n@Component({\n  selector: 'ax-chips',\n  templateUrl: './chips.component.html',\n  styleUrls: ['./chips.component.scss'],\n  inputs: ['tabIndex', 'color'],\n  outputs: ['colorChange'],\n  hostDirectives: [AXRippleDirective],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXChipsComponent extends MXColorComponent {\n  @Input()\n  look: 'solid' | 'outline' | 'twotone' = 'solid';\n\n  @Input()\n  text = '';\n\n  constructor() {\n    super();\n  }\n\n  @HostBinding('class')\n  private get __hostClass(): string {\n    return `ax-el-${this.color}-${this.look} ax-el-interactive`;\n  }\n}\n","<ng-content select=\"ax-prefix\"></ng-content>\n@if(text){\n<div class=\"ax-chips-text\">{{text }}</div>\n}\n<ng-content select=\"ax-suffix\"></ng-content>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXChipsComponent } from './chips.component';\n\n@NgModule({\n  declarations: [AXChipsComponent],\n  imports: [CommonModule],\n  exports: [AXChipsComponent],\n  providers: [],\n})\nexport class AXChipsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAmBM,MAAO,gBAAiB,SAAQ,gBAAgB,CAAA;AAOpD,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE,CAAC;QANV,IAAI,CAAA,IAAA,GAAoC,OAAO,CAAC;QAGhD,IAAI,CAAA,IAAA,GAAG,EAAE,CAAC;KAIT;AAED,IAAA,IACY,WAAW,GAAA;QACrB,OAAO,CAAA,MAAA,EAAS,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,IAAI,CAAA,kBAAA,CAAoB,CAAC;KAC7D;8GAdU,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,4SCnB7B,6JAI4C,EAAA,MAAA,EAAA,CAAA,itBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FDe/B,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAV5B,SAAS;+BACE,UAAU,EAAA,MAAA,EAGZ,CAAC,UAAU,EAAE,OAAO,CAAC,EAAA,OAAA,EACpB,CAAC,aAAa,CAAC,kBACR,CAAC,iBAAiB,CAAC,EAClB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,6JAAA,EAAA,MAAA,EAAA,CAAA,itBAAA,CAAA,EAAA,CAAA;wDAIrC,IAAI,EAAA,CAAA;sBADH,KAAK;gBAIN,IAAI,EAAA,CAAA;sBADH,KAAK;gBAQM,WAAW,EAAA,CAAA;sBADtB,WAAW;uBAAC,OAAO,CAAA;;;MEpBT,aAAa,CAAA;8GAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,EALT,YAAA,EAAA,CAAA,gBAAgB,CACrB,EAAA,OAAA,EAAA,CAAA,YAAY,aACZ,gBAAgB,CAAA,EAAA,CAAA,CAAA,EAAA;AAGf,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,YAJd,YAAY,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAIX,aAAa,EAAA,UAAA,EAAA,CAAA;kBANzB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,gBAAgB,CAAC;oBAChC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,gBAAgB,CAAC;AAC3B,oBAAA,SAAS,EAAE,EAAE;AACd,iBAAA,CAAA;;;ACTD;;AAEG;;;;"}

package/fesm2022/acorex-components-circular-progress.mjs

@@ -0,0 +1,117 @@
+import { MXColorComponent } from '@acorex/components/common';
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, ViewChild, Output, Input, HostBinding, NgModule } from '@angular/core';
+
+class AXCircularProgressComponent extends MXColorComponent {
+    constructor() {
+        super(...arguments);
+        this.strokeDashoffset = 0;
+        this.circumference = 0;
+        this.normalizedRadius = 0;
+        this.ValueChange = new EventEmitter();
+        this._progress = 0;
+        this.strokeChange = new EventEmitter();
+        this._stroke = 4;
+        this.sizeChange = new EventEmitter();
+        this._size = 48;
+    }
+    ngAfterViewInit() {
+        this.setCircularSize();
+        this.updateProgress();
+    }
+    get progress() {
+        return this._progress;
+    }
+    set progress(v) {
+        this.setOption({
+            name: 'progress',
+            value: v,
+            afterCallback: () => {
+                this.updateProgress();
+            },
+        });
+    }
+    get stroke() {
+        return this._stroke;
+    }
+    set stroke(v) {
+        this.setOption({
+            name: 'stroke',
+            value: v,
+            afterCallback: () => {
+                this.setCircularSize();
+            },
+        });
+    }
+    get size() {
+        return this._size;
+    }
+    set size(v) {
+        this.setOption({
+            name: 'size',
+            value: v,
+            afterCallback: () => {
+                this.setCircularSize();
+            },
+        });
+    }
+    get __hostClass() {
+        return `ax-${this['color']}-circular`;
+    }
+    setCircularSize() {
+        if (this.circle) {
+            this.circle.nativeElement.style.setProperty('--ax-stroke-size', `${this.size - this.stroke}px`);
+            this.circle.nativeElement.style.setProperty('--ax-circle-size', `${this.size}px`);
+        }
+    }
+    updateProgress() {
+        if (this.circle) {
+            this.circle.nativeElement.style.background = `conic-gradient(var(--ax-progress-color) ${this.progress * 3.6}deg, var(--ax-progress-line-color) 0deg)`;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCircularProgressComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: AXCircularProgressComponent, selector: "ax-circular-progress", inputs: { color: "color", progress: "progress", stroke: "stroke", size: "size" }, outputs: { ValueChange: "ValueChange", strokeChange: "strokeChange", sizeChange: "sizeChange" }, host: { properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "circle", first: true, predicate: ["circle"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-progress-circular\" #circle>\n  <span class=\"ax-progress-content\">\n    <ng-content></ng-content>\n  </span>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: [".ax-dark ax-circular-progress.ax-primary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-primary-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-secondary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-secondary-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-success-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-success-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-warning-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-warning-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-danger-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-danger-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-info-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-info-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress .ax-progress-circular{--ax-progress-line-color: rgba(var(--ax-color-white), .25)}ax-circular-progress .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-primary-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25);--ax-circle-size: 48px;--ax-stroke-size: 44px;height:var(--ax-circle-size);width:var(--ax-circle-size);background:conic-gradient(var(--ax-progress-color) 0deg,var(--ax-progress-line-color) 0deg);position:relative;display:flex;align-items:center;justify-content:center;border-radius:9999px}ax-circular-progress .ax-progress-circular:before{content:\"\";height:var(--ax-stroke-size);width:var(--ax-stroke-size);position:absolute;border-radius:9999px;background-color:rgba(var(--ax-color-surface))}ax-circular-progress .ax-progress-circular .ax-progress-content{position:relative;display:flex;align-items:center;justify-content:center}ax-circular-progress.ax-ghost-circular .ax-circular-progress-svg{--ax-progress-color: rgba(var(--ax-color-ghost-fore));--ax-progress-line-color: rgba(var(--ax-color-on-surface))}ax-circular-progress.ax-primary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-primary-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-secondary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-secondary-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-success-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-success-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-warning-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-warning-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-danger-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-danger-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-info-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-info-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCircularProgressComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-circular-progress', inputs: ['color'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-progress-circular\" #circle>\n  <span class=\"ax-progress-content\">\n    <ng-content></ng-content>\n  </span>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: [".ax-dark ax-circular-progress.ax-primary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-primary-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-secondary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-secondary-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-success-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-success-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-warning-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-warning-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-danger-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-danger-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress.ax-info-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-info-500), 70%);--ax-progress-line-color: rgba(var(--ax-color-white), .25)}.ax-dark ax-circular-progress .ax-progress-circular{--ax-progress-line-color: rgba(var(--ax-color-white), .25)}ax-circular-progress .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-primary-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25);--ax-circle-size: 48px;--ax-stroke-size: 44px;height:var(--ax-circle-size);width:var(--ax-circle-size);background:conic-gradient(var(--ax-progress-color) 0deg,var(--ax-progress-line-color) 0deg);position:relative;display:flex;align-items:center;justify-content:center;border-radius:9999px}ax-circular-progress .ax-progress-circular:before{content:\"\";height:var(--ax-stroke-size);width:var(--ax-stroke-size);position:absolute;border-radius:9999px;background-color:rgba(var(--ax-color-surface))}ax-circular-progress .ax-progress-circular .ax-progress-content{position:relative;display:flex;align-items:center;justify-content:center}ax-circular-progress.ax-ghost-circular .ax-circular-progress-svg{--ax-progress-color: rgba(var(--ax-color-ghost-fore));--ax-progress-line-color: rgba(var(--ax-color-on-surface))}ax-circular-progress.ax-primary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-primary-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-secondary-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-secondary-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-success-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-success-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-warning-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-warning-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-danger-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-danger-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}ax-circular-progress.ax-info-circular .ax-progress-circular{--ax-progress-color: rgba(var(--ax-color-info-500));--ax-progress-line-color: rgba(var(--ax-color-black), .25)}\n"] }]
+        }], propDecorators: { circle: [{
+                type: ViewChild,
+                args: ['circle']
+            }], ValueChange: [{
+                type: Output
+            }], progress: [{
+                type: Input
+            }], strokeChange: [{
+                type: Output
+            }], stroke: [{
+                type: Input
+            }], sizeChange: [{
+                type: Output
+            }], size: [{
+                type: Input
+            }], __hostClass: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+class AXCircularProgressModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCircularProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: AXCircularProgressModule, declarations: [AXCircularProgressComponent], exports: [AXCircularProgressComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCircularProgressModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXCircularProgressModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AXCircularProgressComponent],
+                    imports: [],
+                    exports: [AXCircularProgressComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AXCircularProgressComponent, AXCircularProgressModule };
+//# sourceMappingURL=acorex-components-circular-progress.mjs.map

package/fesm2022/acorex-components-circular-progress.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-components-circular-progress.mjs","sources":["../../../../libs/components/circular-progress/src/lib/circular-progress.component.ts","../../../../libs/components/circular-progress/src/lib/circular-progress.component.html","../../../../libs/components/circular-progress/src/lib/circular-progress.module.ts","../../../../libs/components/circular-progress/src/acorex-components-circular-progress.ts"],"sourcesContent":["import { MXColorComponent } from '@acorex/components/common';\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  EventEmitter,\n  HostBinding,\n  Input,\n  Output,\n  ViewChild,\n  ViewEncapsulation,\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\nexport type AXProgressLook = 'linear' | 'circular';\n\n@Component({\n  selector: 'ax-circular-progress',\n  templateUrl: './circular-progress.component.html',\n  styleUrls: ['./circular-progress.component.scss'],\n  inputs: ['color'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXCircularProgressComponent\n  extends MXColorComponent\n  implements AfterViewInit\n{\n  @ViewChild('circle') circle: ElementRef;\n\n  strokeDashoffset = 0;\n  circumference = 0;\n  normalizedRadius = 0;\n\n  ngAfterViewInit(): void {\n    this.setCircularSize();\n    this.updateProgress();\n  }\n\n  @Output()\n  ValueChange: EventEmitter<number> = new EventEmitter();\n\n  private _progress = 0;\n\n  @Input()\n  public get progress(): number {\n    return this._progress;\n  }\n  public set progress(v: number) {\n    this.setOption({\n      name: 'progress',\n      value: v,\n      afterCallback: () => {\n        this.updateProgress();\n      },\n    });\n  }\n\n  @Output()\n  strokeChange: EventEmitter<number> = new EventEmitter();\n\n  private _stroke = 4;\n\n  @Input()\n  public get stroke(): number {\n    return this._stroke;\n  }\n  public set stroke(v: number) {\n    this.setOption({\n      name: 'stroke',\n      value: v,\n      afterCallback: () => {\n        this.setCircularSize();\n      },\n    });\n  }\n\n  @Output()\n  sizeChange: EventEmitter<number> = new EventEmitter();\n\n  private _size = 48;\n\n  @Input()\n  public get size(): number {\n    return this._size;\n  }\n\n  public set size(v: number) {\n    this.setOption({\n      name: 'size',\n      value: v,\n      afterCallback: () => {\n        this.setCircularSize();\n      },\n    });\n  }\n\n  @HostBinding('class')\n  private get __hostClass(): string {\n    return `ax-${this['color']}-circular`;\n  }\n\n  setCircularSize() {\n    if (this.circle) {\n      this.circle.nativeElement.style.setProperty(\n        '--ax-stroke-size',\n        `${this.size - this.stroke}px`\n      );\n      this.circle.nativeElement.style.setProperty(\n        '--ax-circle-size',\n        `${this.size}px`\n      );\n    }\n  }\n\n  updateProgress() {\n    if (this.circle) {\n      this.circle.nativeElement.style.background = `conic-gradient(var(--ax-progress-color) ${\n        this.progress * 3.6\n      }deg, var(--ax-progress-line-color) 0deg)`;\n    }\n  }\n}\n","<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-progress-circular\" #circle>\n  <span class=\"ax-progress-content\">\n    <ng-content></ng-content>\n  </span>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n","import { NgModule } from '@angular/core';\nimport { AXCircularProgressComponent } from './circular-progress.component';\n\n@NgModule({\n  declarations: [AXCircularProgressComponent],\n  imports: [],\n  exports: [AXCircularProgressComponent],\n})\nexport class AXCircularProgressModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}