@acorex/components 18.5.17 → 18.7.1

package/fesm2022/acorex-components-paint.mjs

@@ -0,0 +1,336 @@
+import * as i0 from '@angular/core';
+import { forwardRef, Component, ViewEncapsulation, signal, Injectable, inject, HostBinding, input, viewChild, afterNextRender, effect, NgModule } from '@angular/core';
+import * as i2 from '@acorex/components/button';
+import { AXButtonModule } from '@acorex/components/button';
+import * as i3 from '@acorex/components/color-palette';
+import { AXColorPaletteModule } from '@acorex/components/color-palette';
+import * as i5 from '@acorex/components/decorators';
+import { AXDecoratorModule } from '@acorex/components/decorators';
+import * as i4 from '@acorex/components/popover';
+import { AXPopoverModule } from '@acorex/components/popover';
+import * as i2$1 from '@acorex/components/select-box';
+import { AXSelectBoxModule } from '@acorex/components/select-box';
+import * as i2$2 from '@acorex/components/slider';
+import { AXSliderModule } from '@acorex/components/slider';
+import * as i1 from '@angular/forms';
+import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
+import { MXInputBaseValueComponent, MXLookComponent, AXComponent, AXFocusableComponent, AXClearableComponent, AXValuableComponent } from '@acorex/components/common';
+import { classes } from 'polytype';
+
+/**
+ * paint container.
+ * @category Components
+ */
+class AXPaintContainerComponent extends classes((MXInputBaseValueComponent), MXLookComponent) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPaintContainerComponent, selector: "ax-paint-container", inputs: { look: "look" }, providers: [
+            { provide: AXComponent, useExisting: AXPaintContainerComponent },
+            { provide: AXFocusableComponent, useExisting: AXPaintContainerComponent },
+            { provide: AXClearableComponent, useExisting: AXPaintContainerComponent },
+            { provide: AXValuableComponent, useExisting: AXPaintContainerComponent },
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => AXPaintContainerComponent),
+                multi: true,
+            },
+        ], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-editor-container ax-look-{{ look }}\">\n  <ng-content></ng-content>\n  <ng-content select=\"ax-validation-rule\"> </ng-content>\n</div>\n<div class=\"ax-error-container\"></div>\n", styles: ["ax-paint-container{width:100%}ax-paint-container>.ax-editor-container{display:block;height:auto!important}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-paint-container', encapsulation: ViewEncapsulation.None, inputs: ['look'], providers: [
+                        { provide: AXComponent, useExisting: AXPaintContainerComponent },
+                        { provide: AXFocusableComponent, useExisting: AXPaintContainerComponent },
+                        { provide: AXClearableComponent, useExisting: AXPaintContainerComponent },
+                        { provide: AXValuableComponent, useExisting: AXPaintContainerComponent },
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => AXPaintContainerComponent),
+                            multi: true,
+                        },
+                    ], template: "<div class=\"ax-editor-container ax-look-{{ look }}\">\n  <ng-content></ng-content>\n  <ng-content select=\"ax-validation-rule\"> </ng-content>\n</div>\n<div class=\"ax-error-container\"></div>\n", styles: ["ax-paint-container{width:100%}ax-paint-container>.ax-editor-container{display:block;height:auto!important}\n"] }]
+        }] });
+
+/**
+ *paint toolbar
+ * @category Components
+ */
+class AXPaintToolbarComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPaintToolbarComponent, selector: "ax-paint-toolbar", ngImport: i0, template: "<div class=\"ax-paint-toolbar-container\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <ng-content></ng-content>\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: [".ax-paint-toolbar-container{padding:.3rem;width:100%;display:flex;align-items:center;flex-wrap:wrap}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintToolbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-paint-toolbar', encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-paint-toolbar-container\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <ng-content></ng-content>\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: [".ax-paint-toolbar-container{padding:.3rem;width:100%;display:flex;align-items:center;flex-wrap:wrap}\n"] }]
+        }] });
+
+class AXPaintService {
+    constructor() {
+        this.penColor = signal('');
+        this.lineCap = signal('round');
+        this.lineWidth = signal(10);
+        this.penType = signal('pen');
+        this.toggleClear = signal(false);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintService, decorators: [{
+            type: Injectable
+        }] });
+
+/**
+ * paint color picker.
+ * @category Components
+ */
+class AXPaintColorPickerComponent {
+    constructor() {
+        /** @ignore */
+        this.service = inject(AXPaintService);
+        /** @ignore */
+        this.selectedColor = signal('rgb(12, 12, 12)');
+        /** @ignore */
+        this.popoverOption = {
+            openOn: 'click',
+            closeOn: 'clickOut',
+            placement: 'top',
+            offsetX: 0,
+            offsetY: 0,
+        };
+    }
+    /** @ignore */
+    changeColorHandler(e) {
+        this.service.penColor.set(e);
+        this.selectedColor.set(e);
+    }
+    get __hostClass() {
+        return `.5rem`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPaintColorPickerComponent, selector: "ax-paint-color-picker", host: { properties: { "style.marginInline": "this.__hostClass" } }, ngImport: i0, template: "<ax-button #colorBtn look=\"blank\">\n  <ax-icon class=\"ax-icon ax-icon-color-palette\"></ax-icon>\n</ax-button>\n<ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"colorBtn\" [placement]=\"popoverOption.placement\">\n  <div class=\"ax-overlay-pane\">\n    <ax-color-palette (ngModelChange)=\"changeColorHandler($event)\" [ngModel]=\"selectedColor()\">\n      <ax-color-palette-preview></ax-color-palette-preview>\n      <ax-color-palette-picker></ax-color-palette-picker>\n      <ax-color-palette-input></ax-color-palette-input>\n    </ax-color-palette>\n  </div>\n</ax-popover>\n", styles: [""], dependencies: [{ 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"] }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i3.AXColorPalleteComponent, selector: "ax-color-palette", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "checked"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: i3.AXColorPalettePreviewComponent, selector: "ax-color-palette-preview" }, { kind: "component", type: i3.AXColorPaletteInputComponent, selector: "ax-color-palette-input" }, { kind: "component", type: i3.AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintColorPickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-paint-color-picker', encapsulation: ViewEncapsulation.None, template: "<ax-button #colorBtn look=\"blank\">\n  <ax-icon class=\"ax-icon ax-icon-color-palette\"></ax-icon>\n</ax-button>\n<ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"colorBtn\" [placement]=\"popoverOption.placement\">\n  <div class=\"ax-overlay-pane\">\n    <ax-color-palette (ngModelChange)=\"changeColorHandler($event)\" [ngModel]=\"selectedColor()\">\n      <ax-color-palette-preview></ax-color-palette-preview>\n      <ax-color-palette-picker></ax-color-palette-picker>\n      <ax-color-palette-input></ax-color-palette-input>\n    </ax-color-palette>\n  </div>\n</ax-popover>\n" }]
+        }], propDecorators: { __hostClass: [{
+                type: HostBinding,
+                args: ['style.marginInline']
+            }] } });
+
+/**
+ * paint pen cap.
+ * @category Components
+ */
+class AXPaintPenCapComponent {
+    constructor() {
+        /** @ignore */
+        this.parent = inject(AXPaintContainerComponent);
+        /** @ignore */
+        this.service = inject(AXPaintService);
+        /** @ignore */
+        this.selectedLineCap = signal('round');
+    }
+    /** @ignore */
+    lineCapHandler(e) {
+        this.service.lineCap.set(e);
+    }
+    get __hostClass() {
+        return `.5rem`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintPenCapComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPaintPenCapComponent, selector: "ax-paint-pen-cap", host: { properties: { "style.marginInline": "this.__hostClass" } }, ngImport: i0, template: "<ax-select-box\n  [look]=\"this.parent.look\"\n  (ngModelChange)=\"lineCapHandler($event)\"\n  [ngModel]=\"selectedLineCap()\"\n  [dataSource]=\"['round', 'butt', 'square']\"\n  placeholder=\"Choose...\"\n>\n</ax-select-box>\n", styles: [""], dependencies: [{ 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"] }, { kind: "component", type: i2$1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "textTemplate", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintPenCapComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-paint-pen-cap', encapsulation: ViewEncapsulation.None, template: "<ax-select-box\n  [look]=\"this.parent.look\"\n  (ngModelChange)=\"lineCapHandler($event)\"\n  [ngModel]=\"selectedLineCap()\"\n  [dataSource]=\"['round', 'butt', 'square']\"\n  placeholder=\"Choose...\"\n>\n</ax-select-box>\n" }]
+        }], propDecorators: { __hostClass: [{
+                type: HostBinding,
+                args: ['style.marginInline']
+            }] } });
+
+/**
+ * paint mode.
+ * @category Components
+ */
+class AXPaintPenModeChangerComponent {
+    constructor() {
+        /** @ignore */
+        this.service = inject(AXPaintService);
+        /** @ignore */
+        this.value = 10;
+        /** @ignore */
+        this.popoverOption = {
+            openOn: 'click',
+            closeOn: 'clickOut',
+            placement: 'top',
+            offsetX: 0,
+            offsetY: 0,
+        };
+        /** @ignore */
+        this.selectedPenType = signal('pen');
+    }
+    /** @ignore */
+    penTypeHandler(e) {
+        this.service.penType.set(e);
+    }
+    /** @ignore */
+    clear() {
+        this.service.toggleClear.update((prev) => !prev);
+    }
+    get __hostClass() {
+        return `.5rem`;
+    }
+    /** @ignore */
+    valueHandler(e) {
+        this.service.lineWidth.set(e);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintPenModeChangerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPaintPenModeChangerComponent, selector: "ax-paint-pen-mode-changer", host: { properties: { "style.marginInline": "this.__hostClass" } }, ngImport: i0, template: "<div class=\"ax-paint-pen-mode-changer-container\">\n  <div class=\"ax-pen-type-container\">\n    <ax-button look=\"blank\" #alignPop>\n      <ax-icon class=\"ax-icon ax-icon-pen-ruler\"></ax-icon>\n    </ax-button>\n  </div>\n\n  <ax-button (click)=\"clear()\" look=\"blank\">\n    <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n  </ax-button>\n\n  <ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"alignPop\" [placement]=\"popoverOption.placement\">\n    <div class=\"ax-overlay-pane\">\n      <ax-button (click)=\"penTypeHandler('pen')\" look=\"blank\" [selected]=\"this.service.penType() === 'pen' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-pen\"></ax-icon>\n      </ax-button>\n\n      <ax-button (click)=\"penTypeHandler('highlight')\" look=\"blank\" [selected]=\"this.service.penType() === 'highlight' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n      </ax-button>\n\n      <ax-button (click)=\"penTypeHandler('eraser')\" look=\"blank\" [selected]=\"this.service.penType() === 'eraser' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-eraser\"></ax-icon>\n      </ax-button>\n\n      <div class=\"ax-paint-width-slider\">\n        <ax-slider [minValue]=\"2\" [maxValue]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-slider>\n      </div>\n    </div>\n  </ax-popover>\n</div>\n", styles: [".ax-paint-pen-mode-changer-container{display:flex;align-items:center}.ax-paint-pen-mode-changer-container .ax-pen-type-container{margin-inline-end:.5rem}.ax-overlay-pane{padding:.5rem!important}\n"], dependencies: [{ 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"] }, { kind: "component", type: i2$2.AXSliderComponent, selector: "ax-slider", inputs: ["readonly", "disabled", "value", "name", "color", "minValue", "maxValue", "step", "direction"], outputs: ["valueChange", "onValueChanged", "readonlyChange", "disabledChange", "onChange", "onClick"] }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintPenModeChangerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-paint-pen-mode-changer', template: "<div class=\"ax-paint-pen-mode-changer-container\">\n  <div class=\"ax-pen-type-container\">\n    <ax-button look=\"blank\" #alignPop>\n      <ax-icon class=\"ax-icon ax-icon-pen-ruler\"></ax-icon>\n    </ax-button>\n  </div>\n\n  <ax-button (click)=\"clear()\" look=\"blank\">\n    <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n  </ax-button>\n\n  <ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"alignPop\" [placement]=\"popoverOption.placement\">\n    <div class=\"ax-overlay-pane\">\n      <ax-button (click)=\"penTypeHandler('pen')\" look=\"blank\" [selected]=\"this.service.penType() === 'pen' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-pen\"></ax-icon>\n      </ax-button>\n\n      <ax-button (click)=\"penTypeHandler('highlight')\" look=\"blank\" [selected]=\"this.service.penType() === 'highlight' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n      </ax-button>\n\n      <ax-button (click)=\"penTypeHandler('eraser')\" look=\"blank\" [selected]=\"this.service.penType() === 'eraser' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-eraser\"></ax-icon>\n      </ax-button>\n\n      <div class=\"ax-paint-width-slider\">\n        <ax-slider [minValue]=\"2\" [maxValue]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-slider>\n      </div>\n    </div>\n  </ax-popover>\n</div>\n", styles: [".ax-paint-pen-mode-changer-container{display:flex;align-items:center}.ax-paint-pen-mode-changer-container .ax-pen-type-container{margin-inline-end:.5rem}.ax-overlay-pane{padding:.5rem!important}\n"] }]
+        }], propDecorators: { __hostClass: [{
+                type: HostBinding,
+                args: ['style.marginInline']
+            }] } });
+
+/**
+ * @category Components
+ * paint view
+ */
+class AXPaintViewComponent {
+    /** @ignore */
+    constructor() {
+        /** @ignore */
+        this.parent = inject(AXPaintContainerComponent);
+        /** @ignore */
+        this.service = inject(AXPaintService);
+        /**
+         * Specifies the class that pass to component.
+         *
+         */
+        this.customClass = input('', { alias: 'class' });
+        /** @ignore */
+        this.canvasElem = viewChild('c');
+        /** @ignore */
+        this.ctx = signal(null);
+        /** @ignore */
+        this.isPainting = signal(false);
+        /** @ignore */
+        this.isUserInteract = signal(false);
+        afterNextRender(() => {
+            this.ctx.set(this.canvasElem().nativeElement.getContext('2d'));
+            this.ctx().canvas.width = this.canvasElem().nativeElement.getBoundingClientRect().width;
+            this.ctx().canvas.height = this.canvasElem().nativeElement.getBoundingClientRect().height;
+            this.ctx().lineJoin = 'round';
+            this.ctx().lineCap = this.service.lineCap();
+            this.ctx().strokeStyle = this.service.penColor();
+            this.ctx().lineWidth = this.service.lineWidth();
+        });
+        effect(() => {
+            this.service.toggleClear();
+            this.ctx()?.clearRect(0, 0, this.canvasElem()?.nativeElement?.getBoundingClientRect().width, this.canvasElem()?.nativeElement?.getBoundingClientRect().height);
+        }, { allowSignalWrites: true });
+    }
+    /** @ignore */
+    mouseDownHandler(e) {
+        this.isPainting.set(true);
+        this.isUserInteract.set(true);
+        switch (this.service.penType()) {
+            case 'pen':
+                this.ctx().globalAlpha = 1;
+                this.ctx().globalCompositeOperation = 'source-over';
+                break;
+            case 'eraser':
+                this.ctx().globalAlpha = 1;
+                this.ctx().globalCompositeOperation = 'destination-out';
+                break;
+            case 'highlight':
+                this.ctx().globalAlpha = 0.008;
+                this.ctx().globalCompositeOperation = 'source-over';
+                break;
+        }
+        this.ctx().strokeStyle = this.service.penColor();
+        this.ctx().lineCap = this.service.lineCap();
+        this.ctx().lineWidth = this.service.lineWidth();
+        this.ctx().beginPath();
+        this.ctx().moveTo(e.offsetX, e.offsetY);
+    }
+    /** @ignore */
+    mouseMoveHandler(e) {
+        if (this.isPainting()) {
+            this.ctx().lineTo(e.offsetX, e.offsetY);
+            this.ctx().stroke();
+        }
+    }
+    /** @ignore */
+    mouseUpHandler() {
+        this.ctx().closePath();
+        this.isPainting.set(false);
+    }
+    /**
+     * @param e - output file type
+     */
+    getOutPut(e) {
+        const base64 = this.canvasElem().nativeElement.toDataURL(e, 0.1);
+        if (this.isUserInteract()) {
+            this.parent.commitValue(base64);
+        }
+        else {
+            this.parent.commitValue(null);
+        }
+    }
+    get __hostClass() {
+        return `${this.customClass()}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.0", type: AXPaintViewComponent, selector: "ax-paint-view", inputs: { customClass: { classPropertyName: "customClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "canvasElem", first: true, predicate: ["c"], descendants: true, isSignal: true }], ngImport: i0, template: "<canvas\n  #c\n  (mousedown)=\"mouseDownHandler($event)\"\n  (mouseup)=\"mouseUpHandler()\"\n  (mousemove)=\"mouseMoveHandler($event)\"\n  class=\"ax-canvas-element\"\n>\n</canvas>\n", styles: ["ax-paint-view{display:block}ax-paint-view .ax-canvas-element{height:100%;border-bottom:1px solid rgb(var(--ax-color-border-default));width:100%;cursor:crosshair}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-paint-view', encapsulation: ViewEncapsulation.None, template: "<canvas\n  #c\n  (mousedown)=\"mouseDownHandler($event)\"\n  (mouseup)=\"mouseUpHandler()\"\n  (mousemove)=\"mouseMoveHandler($event)\"\n  class=\"ax-canvas-element\"\n>\n</canvas>\n", styles: ["ax-paint-view{display:block}ax-paint-view .ax-canvas-element{height:100%;border-bottom:1px solid rgb(var(--ax-color-border-default));width:100%;cursor:crosshair}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { __hostClass: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+const COMPONENT = [
+    AXPaintContainerComponent,
+    AXPaintToolbarComponent,
+    AXPaintViewComponent,
+    AXPaintColorPickerComponent,
+    AXPaintPenCapComponent,
+    AXPaintPenModeChangerComponent,
+];
+const MODULES = [FormsModule, AXSliderModule, AXSelectBoxModule, AXButtonModule, AXColorPaletteModule, AXPopoverModule, AXDecoratorModule];
+class AXPaintModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.0", ngImport: i0, type: AXPaintModule, declarations: [AXPaintContainerComponent,
+            AXPaintToolbarComponent,
+            AXPaintViewComponent,
+            AXPaintColorPickerComponent,
+            AXPaintPenCapComponent,
+            AXPaintPenModeChangerComponent], imports: [FormsModule, AXSliderModule, AXSelectBoxModule, AXButtonModule, AXColorPaletteModule, AXPopoverModule, AXDecoratorModule], exports: [AXPaintContainerComponent,
+            AXPaintToolbarComponent,
+            AXPaintViewComponent,
+            AXPaintColorPickerComponent,
+            AXPaintPenCapComponent,
+            AXPaintPenModeChangerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintModule, providers: [AXPaintService], imports: [MODULES] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPaintModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [...COMPONENT],
+                    imports: [...MODULES],
+                    exports: [...COMPONENT],
+                    providers: [AXPaintService],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AXPaintColorPickerComponent, AXPaintContainerComponent, AXPaintModule, AXPaintPenCapComponent, AXPaintPenModeChangerComponent, AXPaintToolbarComponent, AXPaintViewComponent };
+//# sourceMappingURL=acorex-components-paint.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-components-paint.mjs","sources":["../../../../libs/components/paint/src/lib/paint/paint-container/paint-container.component.ts","../../../../libs/components/paint/src/lib/paint/paint-container/paint-container.component.html","../../../../libs/components/paint/src/lib/paint/paint-toolbar/paint-toolbar.component.ts","../../../../libs/components/paint/src/lib/paint/paint-toolbar/paint-toolbar.component.html","../../../../libs/components/paint/src/lib/paint/paint.service.ts","../../../../libs/components/paint/src/lib/paint/paint-tools/paint-color-picker/paint-color-picker.component.ts","../../../../libs/components/paint/src/lib/paint/paint-tools/paint-color-picker/paint-color-picker.component.html","../../../../libs/components/paint/src/lib/paint/paint-tools/paint-pen-cap/paint-pen-cap.component.ts","../../../../libs/components/paint/src/lib/paint/paint-tools/paint-pen-cap/paint-pen-cap.component.html","../../../../libs/components/paint/src/lib/paint/paint-tools/paint-pen-mode-changer/paint-pen-mode-changer.component.ts","../../../../libs/components/paint/src/lib/paint/paint-tools/paint-pen-mode-changer/paint-pen-mode-changer.component.html","../../../../libs/components/paint/src/lib/paint/paint-view/paint-view.component.ts","../../../../libs/components/paint/src/lib/paint/paint-view/paint-view.component.html","../../../../libs/components/paint/src/lib/paint.module.ts","../../../../libs/components/paint/src/acorex-components-paint.ts"],"sourcesContent":["import {\n  AXClearableComponent,\n  AXComponent,\n  AXFocusableComponent,\n  AXValuableComponent,\n  MXInputBaseValueComponent,\n  MXLookComponent,\n} from '@acorex/components/common';\nimport { Component, ViewEncapsulation, forwardRef } from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { classes } from 'polytype';\n\n/**\n * paint container.\n * @category Components\n */\n@Component({\n  selector: 'ax-paint-container',\n  templateUrl: './paint-container.component.html',\n  styleUrl: './paint-container.component.scss',\n  encapsulation: ViewEncapsulation.None,\n  inputs: ['look'],\n  providers: [\n    { provide: AXComponent, useExisting: AXPaintContainerComponent },\n    { provide: AXFocusableComponent, useExisting: AXPaintContainerComponent },\n    { provide: AXClearableComponent, useExisting: AXPaintContainerComponent },\n    { provide: AXValuableComponent, useExisting: AXPaintContainerComponent },\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => AXPaintContainerComponent),\n      multi: true,\n    },\n  ],\n})\nexport class AXPaintContainerComponent extends classes(MXInputBaseValueComponent<string>, MXLookComponent) {}\n","<div class=\"ax-editor-container ax-look-{{ look }}\">\n  <ng-content></ng-content>\n  <ng-content select=\"ax-validation-rule\"> </ng-content>\n</div>\n<div class=\"ax-error-container\"></div>\n","import { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n *paint toolbar\n * @category Components\n */\n@Component({\n  selector: 'ax-paint-toolbar',\n  templateUrl: './paint-toolbar.component.html',\n  styleUrl: './paint-toolbar.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXPaintToolbarComponent {}\n","<div class=\"ax-paint-toolbar-container\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <ng-content></ng-content>\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n","import { Injectable, signal } from '@angular/core';\n\n@Injectable()\nexport class AXPaintService {\n  penColor = signal<string | CanvasGradient | CanvasPattern>('');\n  lineCap = signal<CanvasLineCap>('round');\n  lineWidth = signal<number>(10);\n  penType = signal<'pen' | 'highlight' | 'eraser'>('pen');\n  toggleClear = signal(false);\n}\n","import { AXPlacement } from '@acorex/components/common';\nimport { AXPopoverCloseTrigger, AXPopoverOpenTrigger } from '@acorex/components/popover';\nimport { Component, HostBinding, ViewEncapsulation, inject, signal } from '@angular/core';\nimport { AXPaintService } from '../../paint.service';\n\n/**\n * paint color picker.\n * @category Components\n */\n@Component({\n  selector: 'ax-paint-color-picker',\n  templateUrl: './paint-color-picker.component.html',\n  styleUrl: './paint-color-picker.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXPaintColorPickerComponent {\n  /** @ignore */\n  protected service = inject(AXPaintService);\n\n  /** @ignore */\n  protected selectedColor = signal('rgb(12, 12, 12)');\n\n  /** @ignore */\n  protected popoverOption: {\n    openOn: AXPopoverOpenTrigger;\n    closeOn: AXPopoverCloseTrigger;\n    placement: AXPlacement;\n    offsetX: number;\n    offsetY: number;\n  } = {\n    openOn: 'click',\n    closeOn: 'clickOut',\n    placement: 'top',\n    offsetX: 0,\n    offsetY: 0,\n  };\n\n  /** @ignore */\n  protected changeColorHandler(e: string) {\n    this.service.penColor.set(e);\n    this.selectedColor.set(e);\n  }\n\n  @HostBinding('style.marginInline')\n  get __hostClass(): string {\n    return `.5rem`;\n  }\n}\n","<ax-button #colorBtn look=\"blank\">\n  <ax-icon class=\"ax-icon ax-icon-color-palette\"></ax-icon>\n</ax-button>\n<ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"colorBtn\" [placement]=\"popoverOption.placement\">\n  <div class=\"ax-overlay-pane\">\n    <ax-color-palette (ngModelChange)=\"changeColorHandler($event)\" [ngModel]=\"selectedColor()\">\n      <ax-color-palette-preview></ax-color-palette-preview>\n      <ax-color-palette-picker></ax-color-palette-picker>\n      <ax-color-palette-input></ax-color-palette-input>\n    </ax-color-palette>\n  </div>\n</ax-popover>\n","import { Component, HostBinding, inject, signal, ViewEncapsulation } from '@angular/core';\nimport { AXPaintContainerComponent } from '../../paint-container/paint-container.component';\nimport { AXPaintService } from '../../paint.service';\n\n/**\n * paint pen cap.\n * @category Components\n */\n@Component({\n  selector: 'ax-paint-pen-cap',\n  templateUrl: './paint-pen-cap.component.html',\n  styleUrl: './paint-pen-cap.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXPaintPenCapComponent {\n  /** @ignore */\n  protected parent = inject(AXPaintContainerComponent);\n\n  /** @ignore */\n  protected service = inject(AXPaintService);\n\n  /** @ignore */\n  protected selectedLineCap = signal<CanvasLineCap>('round');\n\n  /** @ignore */\n  protected lineCapHandler(e: CanvasLineCap) {\n    this.service.lineCap.set(e);\n  }\n\n  @HostBinding('style.marginInline')\n  get __hostClass(): string {\n    return `.5rem`;\n  }\n}\n","<ax-select-box\n  [look]=\"this.parent.look\"\n  (ngModelChange)=\"lineCapHandler($event)\"\n  [ngModel]=\"selectedLineCap()\"\n  [dataSource]=\"['round', 'butt', 'square']\"\n  placeholder=\"Choose...\"\n>\n</ax-select-box>\n","import { AXPlacement } from '@acorex/components/common';\nimport { AXPopoverCloseTrigger, AXPopoverOpenTrigger } from '@acorex/components/popover';\nimport { Component, HostBinding, inject, signal } from '@angular/core';\nimport { AXPaintService } from '../../paint.service';\n\n/**\n * paint mode.\n * @category Components\n */\n@Component({\n  selector: 'ax-paint-pen-mode-changer',\n  templateUrl: './paint-pen-mode-changer.component.html',\n  styleUrl: './paint-pen-mode-changer.component.scss',\n})\nexport class AXPaintPenModeChangerComponent {\n  /** @ignore */\n  protected service = inject(AXPaintService);\n\n  /** @ignore */\n  protected value = 10;\n\n  /** @ignore */\n  protected popoverOption: {\n    openOn: AXPopoverOpenTrigger;\n    closeOn: AXPopoverCloseTrigger;\n    placement: AXPlacement;\n    offsetX: number;\n    offsetY: number;\n  } = {\n    openOn: 'click',\n    closeOn: 'clickOut',\n    placement: 'top',\n    offsetX: 0,\n    offsetY: 0,\n  };\n\n  /** @ignore */\n  protected selectedPenType = signal<'pen' | 'highlight' | 'eraser'>('pen');\n\n  /** @ignore */\n  protected penTypeHandler(e: 'pen' | 'highlight' | 'eraser') {\n    this.service.penType.set(e);\n  }\n\n  /** @ignore */\n  protected clear() {\n    this.service.toggleClear.update((prev) => !prev);\n  }\n\n  @HostBinding('style.marginInline')\n  get __hostClass(): string {\n    return `.5rem`;\n  }\n\n  /** @ignore */\n  protected valueHandler(e: number) {\n    this.service.lineWidth.set(e);\n  }\n}\n","<div class=\"ax-paint-pen-mode-changer-container\">\n  <div class=\"ax-pen-type-container\">\n    <ax-button look=\"blank\" #alignPop>\n      <ax-icon class=\"ax-icon ax-icon-pen-ruler\"></ax-icon>\n    </ax-button>\n  </div>\n\n  <ax-button (click)=\"clear()\" look=\"blank\">\n    <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n  </ax-button>\n\n  <ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"alignPop\" [placement]=\"popoverOption.placement\">\n    <div class=\"ax-overlay-pane\">\n      <ax-button (click)=\"penTypeHandler('pen')\" look=\"blank\" [selected]=\"this.service.penType() === 'pen' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-pen\"></ax-icon>\n      </ax-button>\n\n      <ax-button (click)=\"penTypeHandler('highlight')\" look=\"blank\" [selected]=\"this.service.penType() === 'highlight' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n      </ax-button>\n\n      <ax-button (click)=\"penTypeHandler('eraser')\" look=\"blank\" [selected]=\"this.service.penType() === 'eraser' ? true : false\">\n        <ax-icon class=\"ax-icon ax-icon-eraser\"></ax-icon>\n      </ax-button>\n\n      <div class=\"ax-paint-width-slider\">\n        <ax-slider [minValue]=\"2\" [maxValue]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-slider>\n      </div>\n    </div>\n  </ax-popover>\n</div>\n","import {\n  afterNextRender,\n  Component,\n  effect,\n  ElementRef,\n  HostBinding,\n  inject,\n  input,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { AXPaintContainerComponent } from '../paint-container/paint-container.component';\nimport { AXPaintService } from '../paint.service';\n\n/**\n * @category Components\n * paint view\n */\n@Component({\n  selector: 'ax-paint-view',\n  templateUrl: './paint-view.component.html',\n  styleUrl: './paint-view.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXPaintViewComponent {\n  /** @ignore */\n  parent = inject(AXPaintContainerComponent);\n\n  /** @ignore */\n  protected service = inject(AXPaintService);\n\n  /**\n   * Specifies the class that pass to component.\n   *\n   */\n  customClass = input<string>('', { alias: 'class' });\n\n  /** @ignore */\n  protected canvasElem = viewChild<ElementRef<HTMLCanvasElement>>('c');\n\n  /** @ignore */\n  protected ctx = signal<CanvasRenderingContext2D>(null);\n\n  /** @ignore */\n  protected isPainting = signal(false);\n\n  /** @ignore */\n  protected isUserInteract = signal(false);\n\n  /** @ignore */\n  constructor() {\n    afterNextRender(() => {\n      this.ctx.set(this.canvasElem().nativeElement.getContext('2d'));\n      this.ctx().canvas.width = this.canvasElem().nativeElement.getBoundingClientRect().width;\n      this.ctx().canvas.height = this.canvasElem().nativeElement.getBoundingClientRect().height;\n      this.ctx().lineJoin = 'round';\n      this.ctx().lineCap = this.service.lineCap();\n      this.ctx().strokeStyle = this.service.penColor();\n      this.ctx().lineWidth = this.service.lineWidth();\n    });\n\n    effect(\n      () => {\n        this.service.toggleClear();\n        this.ctx()?.clearRect(\n          0,\n          0,\n          this.canvasElem()?.nativeElement?.getBoundingClientRect().width,\n          this.canvasElem()?.nativeElement?.getBoundingClientRect().height,\n        );\n      },\n      { allowSignalWrites: true },\n    );\n  }\n\n  /** @ignore */\n  protected mouseDownHandler(e: MouseEvent) {\n    this.isPainting.set(true);\n    this.isUserInteract.set(true);\n\n    switch (this.service.penType()) {\n      case 'pen':\n        this.ctx().globalAlpha = 1;\n        this.ctx().globalCompositeOperation = 'source-over';\n        break;\n      case 'eraser':\n        this.ctx().globalAlpha = 1;\n        this.ctx().globalCompositeOperation = 'destination-out';\n        break;\n      case 'highlight':\n        this.ctx().globalAlpha = 0.008;\n        this.ctx().globalCompositeOperation = 'source-over';\n        break;\n    }\n\n    this.ctx().strokeStyle = this.service.penColor();\n    this.ctx().lineCap = this.service.lineCap();\n    this.ctx().lineWidth = this.service.lineWidth();\n\n    this.ctx().beginPath();\n    this.ctx().moveTo(e.offsetX, e.offsetY);\n  }\n\n  /** @ignore */\n  protected mouseMoveHandler(e: MouseEvent) {\n    if (this.isPainting()) {\n      this.ctx().lineTo(e.offsetX, e.offsetY);\n      this.ctx().stroke();\n    }\n  }\n\n  /** @ignore */\n  protected mouseUpHandler() {\n    this.ctx().closePath();\n    this.isPainting.set(false);\n  }\n\n  /**\n   * @param e - output file type\n   */\n  getOutPut(e: 'image/webp' | 'image/png' | 'image/jpeg') {\n    const base64 = this.canvasElem().nativeElement.toDataURL(e, 0.1);\n    if (this.isUserInteract()) {\n      this.parent.commitValue(base64);\n    } else {\n      this.parent.commitValue(null);\n    }\n  }\n\n  @HostBinding('class')\n  get __hostClass(): string {\n    return `${this.customClass()}`;\n  }\n}\n","<canvas\n  #c\n  (mousedown)=\"mouseDownHandler($event)\"\n  (mouseup)=\"mouseUpHandler()\"\n  (mousemove)=\"mouseMoveHandler($event)\"\n  class=\"ax-canvas-element\"\n>\n</canvas>\n","import { NgModule } from '@angular/core';\n\nimport { AXButtonModule } from '@acorex/components/button';\nimport { AXColorPaletteModule } from '@acorex/components/color-palette';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXPopoverModule } from '@acorex/components/popover';\nimport { AXSelectBoxModule } from '@acorex/components/select-box';\nimport { AXSliderModule } from '@acorex/components/slider';\nimport { FormsModule } from '@angular/forms';\nimport { AXPaintContainerComponent } from './paint/paint-container/paint-container.component';\nimport { AXPaintToolbarComponent } from './paint/paint-toolbar/paint-toolbar.component';\nimport { AXPaintColorPickerComponent } from './paint/paint-tools/paint-color-picker/paint-color-picker.component';\nimport { AXPaintPenCapComponent } from './paint/paint-tools/paint-pen-cap/paint-pen-cap.component';\nimport { AXPaintPenModeChangerComponent } from './paint/paint-tools/paint-pen-mode-changer/paint-pen-mode-changer.component';\nimport { AXPaintViewComponent } from './paint/paint-view/paint-view.component';\nimport { AXPaintService } from './paint/paint.service';\n\nconst COMPONENT = [\n  AXPaintContainerComponent,\n  AXPaintToolbarComponent,\n  AXPaintViewComponent,\n  AXPaintColorPickerComponent,\n  AXPaintPenCapComponent,\n  AXPaintPenModeChangerComponent,\n];\n\nconst MODULES = [FormsModule, AXSliderModule, AXSelectBoxModule, AXButtonModule, AXColorPaletteModule, AXPopoverModule, AXDecoratorModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [AXPaintService],\n})\nexport class AXPaintModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i2","i3"],"mappings":"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"}

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

@@ -16,17 +16,26 @@ import { CommonModule } from '@angular/common';
 class AXPasswordBoxComponent extends classes((MXInputBaseValueComponent), MXLookComponent) {
     constructor() {
         super(...arguments);
+        /** @ignore */
         this._type = 'password';
+        /** @ignore */
         this._icon = 'ax-icon-visibility';
+        /**
+       * Sets the autocomplete behavior for the input field.
+       */
         this.autoComplete = 'one-time-code';
         /**
          *  A flag for showing or hiding password button.
          */
         this.showToggleButton = true;
     }
+    /** @ignore */
     _handleModelChange(value) {
         this.commitValue(value, true);
     }
+    /**
+   * Toggles the input type between 'password' and 'text' to show or hide the password.
+   */
     toggleType() {
         if (this._type === 'password') {
             this._type = 'text';
@@ -37,8 +46,8 @@ class AXPasswordBoxComponent extends classes((MXInputBaseValueComponent), MXLook
             this._icon = 'ax-icon-visibility';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPasswordBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPasswordBoxComponent, selector: "ax-password-box", inputs: { readonly: "readonly", disabled: "disabled", tabIndex: "tabIndex", placeholder: "placeholder", value: "value", state: "state", name: "name", id: "id", look: "look", autoComplete: "autoComplete", showToggleButton: "showToggleButton", classNames: ["class", "classNames"] }, outputs: { valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", readonlyChange: "readonlyChange", disabledChange: "disabledChange", onKeyDown: "onKeyDown", onKeyUp: "onKeyUp", onKeyPress: "onKeyPress" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPasswordBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXPasswordBoxComponent, selector: "ax-password-box", inputs: { readonly: "readonly", disabled: "disabled", tabIndex: "tabIndex", placeholder: "placeholder", value: "value", state: "state", name: "name", id: "id", look: "look", autoComplete: "autoComplete", showToggleButton: "showToggleButton", classNames: ["class", "classNames"] }, outputs: { valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", readonlyChange: "readonlyChange", disabledChange: "disabledChange", onKeyDown: "onKeyDown", onKeyUp: "onKeyUp", onKeyPress: "onKeyPress" }, providers: [
             { provide: AXComponent, useExisting: AXPasswordBoxComponent },
             { provide: AXFocusableComponent, useExisting: AXPasswordBoxComponent },
             { provide: AXClearableComponent, useExisting: AXPasswordBoxComponent },
@@ -50,7 +59,7 @@ class AXPasswordBoxComponent extends classes((MXInputBaseValueComponent), MXLook
             },
         ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-editor-container ax-look-{{look}} {{classNames}}\" [class.ax-state-disabled]=\"disabled\">\n    <ng-content select=\"ax-prefix\">\n    </ng-content>\n    <input #input class=\"ax-input\" [name]=\"name\" [type]=\"_type\" [id]=\"id\" [attr.placeholder]=\"placeholder\"\n        [class.ax-state-disabled]=\"disabled\" [class.ax-state-readonly]=\"readonly\" [disabled]=\"disabled\"\n        [readonly]=\"readonly\" [tabindex]=\"tabIndex\" [ngModel]=\"value\" [attr.autocomplete]=\"autoComplete\"\n        (ngModelChange)=\"_handleModelChange($event)\" (keydown)=\"emitOnKeydownEvent($event)\"\n        (keyup)=\"emitOnKeyupEvent($event)\" (keypress)=\"emitOnKeypressEvent($event)\" (focus)=\"emitOnFocusEvent($event)\"\n        (blur)=\"emitOnBlurEvent($event)\">\n    @if(value && !disabled && !readonly){\n    <ng-content select=\"ax-clear-button\"></ng-content>\n    }\n    @if(showToggleButton){\n    <button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"toggleType()\" [tabIndex]=\"-1\">\n        <span class=\"ax-icon {{_icon}}\"></span>\n    </button>\n    }\n    <ng-content select=\"ax-suffix\">\n    </ng-content>\n    <ng-content select=\"ax-validation-rule\">\n    </ng-content>\n</div>\n<div class=\"ax-error-container\"></div>", dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { 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: "18.0.2", ngImport: i0, type: AXPasswordBoxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPasswordBoxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-password-box', inputs: ['readonly', 'disabled', 'tabIndex', 'placeholder', 'value', 'state', 'name', 'id', 'look'], outputs: [
                         'valueChange',
@@ -89,11 +98,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
 const COMPONENT = [AXPasswordBoxComponent];
 const MODULES = [CommonModule, FormsModule, AXButtonModule, AXDecoratorModule];
 class AXPasswordBoxModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPasswordBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXPasswordBoxModule, declarations: [AXPasswordBoxComponent], imports: [CommonModule, FormsModule, AXButtonModule, AXDecoratorModule], exports: [AXPasswordBoxComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPasswordBoxModule, imports: [MODULES] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPasswordBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.0", ngImport: i0, type: AXPasswordBoxModule, declarations: [AXPasswordBoxComponent], imports: [CommonModule, FormsModule, AXButtonModule, AXDecoratorModule], exports: [AXPasswordBoxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPasswordBoxModule, imports: [MODULES] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPasswordBoxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPasswordBoxModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],

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

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-password-box.mjs","sources":["../../../../libs/components/password-box/src/lib/password-box.component.ts","../../../../libs/components/password-box/src/lib/password-box.component.html","../../../../libs/components/password-box/src/lib/password-box.module.ts","../../../../libs/components/password-box/src/acorex-components-password-box.ts"],"sourcesContent":["import {\n  AXClearableComponent,\n  AXComponent,\n  AXFocusableComponent,\n  AXValuableComponent,\n  MXInputBaseValueComponent,\n  MXLookComponent,\n} from '@acorex/components/common';\nimport { ChangeDetectionStrategy, Component, ElementRef, Input, ViewChild, ViewEncapsulation, forwardRef } from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { classes } from 'polytype';\n\n/**\n * The Textbox is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-password-box',\n  templateUrl: 'password-box.component.html',\n  inputs: ['readonly', 'disabled', 'tabIndex', 'placeholder', 'value', 'state', 'name', 'id', 'look'],\n  outputs: [\n    'valueChange',\n    'stateChange',\n    'onValueChanged',\n    'onBlur',\n    'onFocus',\n    'readonlyChange',\n    'disabledChange',\n    'onKeyDown',\n    'onKeyUp',\n    'onKeyPress',\n  ],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n\n  providers: [\n    { provide: AXComponent, useExisting: AXPasswordBoxComponent },\n    { provide: AXFocusableComponent, useExisting: AXPasswordBoxComponent },\n    { provide: AXClearableComponent, useExisting: AXPasswordBoxComponent },\n    { provide: AXValuableComponent, useExisting: AXPasswordBoxComponent },\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => AXPasswordBoxComponent),\n      multi: true,\n    },\n  ],\n})\nexport class AXPasswordBoxComponent extends classes(MXInputBaseValueComponent<string>, MXLookComponent) {\n  @ViewChild('input') input: ElementRef<HTMLInputElement>;\n\n  protected _type: 'password' | 'text' = 'password';\n  protected _icon: 'ax-icon-visibility' | 'ax-icon-visibility-off' = 'ax-icon-visibility';\n\n  @Input()\n  autoComplete: 'current-password' | 'new-password' | 'one-time-code' | 'off' = 'one-time-code';\n\n  /**\n   *  A flag for showing or hiding password button.\n   */\n  @Input()\n  showToggleButton = true;\n\n  @Input('class')\n  classNames: string;\n\n  _handleModelChange(value: string) {\n    this.commitValue(value, true);\n  }\n\n  toggleType() {\n    if (this._type === 'password') {\n      this._type = 'text';\n      this._icon = 'ax-icon-visibility-off';\n    } else {\n      this._type = 'password';\n      this._icon = 'ax-icon-visibility';\n    }\n  }\n\n  // @HostBinding('class')\n  // get __hostClass(): string[] {\n  //   return ['ax-editor-container', `ax-look-${this.look}`, `${this.disabled ? 'ax-state-disabled' : ''}`];\n  // }\n}\n","<div class=\"ax-editor-container ax-look-{{look}} {{classNames}}\" [class.ax-state-disabled]=\"disabled\">\n    <ng-content select=\"ax-prefix\">\n    </ng-content>\n    <input #input class=\"ax-input\" [name]=\"name\" [type]=\"_type\" [id]=\"id\" [attr.placeholder]=\"placeholder\"\n        [class.ax-state-disabled]=\"disabled\" [class.ax-state-readonly]=\"readonly\" [disabled]=\"disabled\"\n        [readonly]=\"readonly\" [tabindex]=\"tabIndex\" [ngModel]=\"value\" [attr.autocomplete]=\"autoComplete\"\n        (ngModelChange)=\"_handleModelChange($event)\" (keydown)=\"emitOnKeydownEvent($event)\"\n        (keyup)=\"emitOnKeyupEvent($event)\" (keypress)=\"emitOnKeypressEvent($event)\" (focus)=\"emitOnFocusEvent($event)\"\n        (blur)=\"emitOnBlurEvent($event)\">\n    @if(value && !disabled && !readonly){\n    <ng-content select=\"ax-clear-button\"></ng-content>\n    }\n    @if(showToggleButton){\n    <button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"toggleType()\" [tabIndex]=\"-1\">\n        <span class=\"ax-icon {{_icon}}\"></span>\n    </button>\n    }\n    <ng-content select=\"ax-suffix\">\n    </ng-content>\n    <ng-content select=\"ax-validation-rule\">\n    </ng-content>\n</div>\n<div class=\"ax-error-container\"></div>","import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { AXPasswordBoxComponent } from './password-box.component';\n\nconst COMPONENT = [AXPasswordBoxComponent];\nconst MODULES = [CommonModule, FormsModule, AXButtonModule, AXDecoratorModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXPasswordBoxModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-password-box.mjs","sources":["../../../../libs/components/password-box/src/lib/password-box.component.ts","../../../../libs/components/password-box/src/lib/password-box.component.html","../../../../libs/components/password-box/src/lib/password-box.module.ts","../../../../libs/components/password-box/src/acorex-components-password-box.ts"],"sourcesContent":["import {\n  AXClearableComponent,\n  AXComponent,\n  AXFocusableComponent,\n  AXValuableComponent,\n  MXInputBaseValueComponent,\n  MXLookComponent,\n} from '@acorex/components/common';\nimport { ChangeDetectionStrategy, Component, ElementRef, Input, ViewChild, ViewEncapsulation, forwardRef } from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { classes } from 'polytype';\n\n/**\n * The Textbox is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-password-box',\n  templateUrl: 'password-box.component.html',\n  inputs: ['readonly', 'disabled', 'tabIndex', 'placeholder', 'value', 'state', 'name', 'id', 'look'],\n  outputs: [\n    'valueChange',\n    'stateChange',\n    'onValueChanged',\n    'onBlur',\n    'onFocus',\n    'readonlyChange',\n    'disabledChange',\n    'onKeyDown',\n    'onKeyUp',\n    'onKeyPress',\n  ],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n\n  providers: [\n    { provide: AXComponent, useExisting: AXPasswordBoxComponent },\n    { provide: AXFocusableComponent, useExisting: AXPasswordBoxComponent },\n    { provide: AXClearableComponent, useExisting: AXPasswordBoxComponent },\n    { provide: AXValuableComponent, useExisting: AXPasswordBoxComponent },\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => AXPasswordBoxComponent),\n      multi: true,\n    },\n  ],\n})\nexport class AXPasswordBoxComponent extends classes(MXInputBaseValueComponent<string>, MXLookComponent) {\n\n  /** @ignore */\n  @ViewChild('input') input: ElementRef<HTMLInputElement>;\n\n  /** @ignore */\n  protected _type: 'password' | 'text' = 'password';\n\n  /** @ignore */\n  protected _icon: 'ax-icon-visibility' | 'ax-icon-visibility-off' = 'ax-icon-visibility';\n\n  /**\n * Sets the autocomplete behavior for the input field.\n */\n  @Input()\n  autoComplete: 'current-password' | 'new-password' | 'one-time-code' | 'off' = 'one-time-code';\n\n  /**\n   *  A flag for showing or hiding password button.\n   */\n  @Input()\n  showToggleButton = true;\n\n  /**\n * Defines custom CSS classes to apply to the component.\n */\n  @Input('class')\n  classNames: string;\n\n  /** @ignore */\n  _handleModelChange(value: string) {\n    this.commitValue(value, true);\n  }\n\n  /**\n * Toggles the input type between 'password' and 'text' to show or hide the password.\n */\n  toggleType() {\n    if (this._type === 'password') {\n      this._type = 'text';\n      this._icon = 'ax-icon-visibility-off';\n    } else {\n      this._type = 'password';\n      this._icon = 'ax-icon-visibility';\n    }\n  }\n\n  // @HostBinding('class')\n  // get __hostClass(): string[] {\n  //   return ['ax-editor-container', `ax-look-${this.look}`, `${this.disabled ? 'ax-state-disabled' : ''}`];\n  // }\n}\n","<div class=\"ax-editor-container ax-look-{{look}} {{classNames}}\" [class.ax-state-disabled]=\"disabled\">\n    <ng-content select=\"ax-prefix\">\n    </ng-content>\n    <input #input class=\"ax-input\" [name]=\"name\" [type]=\"_type\" [id]=\"id\" [attr.placeholder]=\"placeholder\"\n        [class.ax-state-disabled]=\"disabled\" [class.ax-state-readonly]=\"readonly\" [disabled]=\"disabled\"\n        [readonly]=\"readonly\" [tabindex]=\"tabIndex\" [ngModel]=\"value\" [attr.autocomplete]=\"autoComplete\"\n        (ngModelChange)=\"_handleModelChange($event)\" (keydown)=\"emitOnKeydownEvent($event)\"\n        (keyup)=\"emitOnKeyupEvent($event)\" (keypress)=\"emitOnKeypressEvent($event)\" (focus)=\"emitOnFocusEvent($event)\"\n        (blur)=\"emitOnBlurEvent($event)\">\n    @if(value && !disabled && !readonly){\n    <ng-content select=\"ax-clear-button\"></ng-content>\n    }\n    @if(showToggleButton){\n    <button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"toggleType()\" [tabIndex]=\"-1\">\n        <span class=\"ax-icon {{_icon}}\"></span>\n    </button>\n    }\n    <ng-content select=\"ax-suffix\">\n    </ng-content>\n    <ng-content select=\"ax-validation-rule\">\n    </ng-content>\n</div>\n<div class=\"ax-error-container\"></div>","import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { AXPasswordBoxComponent } from './password-box.component';\n\nconst COMPONENT = [AXPasswordBoxComponent];\nconst MODULES = [CommonModule, FormsModule, AXButtonModule, AXDecoratorModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXPasswordBoxModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}