@acorex/components 18.5.2 → 18.5.4

package/fesm2022/acorex-components-wysiwyg.mjs

@@ -10,6 +10,12 @@ import * as i4 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { AXWysiwyg } from '@acorex/cdk/wysiwyg';
 import { MXBaseComponent, AXDataSource } from '@acorex/components/common';
+import * as i5 from '@acorex/components/color-palette';
+import { AXColorPaletteModule } from '@acorex/components/color-palette';
+import * as i6 from '@acorex/components/popover';
+import { AXPopoverModule } from '@acorex/components/popover';
+import * as i7 from '@acorex/components/text-box';
+import { AXTextBoxModule } from '@acorex/components/text-box';
 
 class AXWysiwygService {
     constructor() {
@@ -45,6 +51,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }], ctorParameters: () => [] });
 
 class AXWysiwygToolbarComponent {
+    submitLink() {
+        this.wysiwyg().addImage(this.textBoxOptions.text);
+    }
     constructor() {
         this.outputHTML = output();
         this.service = inject(AXWysiwygService);
@@ -52,9 +61,14 @@ class AXWysiwygToolbarComponent {
         this.boldState = signal(false);
         this.italicState = signal(false);
         this.underLineState = signal(false);
+        this.strikeLineState = signal(false);
         this.orderListState = signal('');
         this.unOrderListState = signal('');
         this.alignState = signal('');
+        this.selectedFont = 'medium';
+        this.selectedColor = '';
+        this.selectedHighlightColor = '';
+        this.linkAddress = '';
         this.fontSize = new AXDataSource({
             pageSize: 10,
             key: 'id',
@@ -72,11 +86,30 @@ class AXWysiwygToolbarComponent {
                 });
             },
         });
-        this.selectedFont = 'medium';
+        this.popoverOption = {
+            openOn: 'click',
+            closeOn: 'clickOut',
+            placement: 'top',
+            offsetX: 0,
+            offsetY: 0,
+        };
+        this.textBoxOptions = {
+            text: '',
+            placeholder: 'Enter yor url ...',
+            size: 'ax-sm',
+        };
         afterNextRender(() => {
             this.wysiwyg.set(this.service.wysiwyg());
         });
     }
+    changeColorHandler(e) {
+        this.selectedColor = e;
+        this.wysiwyg().color(e);
+    }
+    changeHighlightColorHandler(e) {
+        this.selectedHighlightColor = e;
+        this.wysiwyg().background(e);
+    }
     fontHandler(e) {
         this.wysiwyg().fontSize(e);
     }
@@ -141,12 +174,31 @@ class AXWysiwygToolbarComponent {
         this.alignState.set(e);
         this.wysiwyg().align(e);
     }
+    undo() {
+        this.wysiwyg().undo();
+    }
+    redo() {
+        this.wysiwyg().redo();
+    }
+    strike() {
+        if (this.strikeLineState()) {
+            this.wysiwyg().strike(false);
+            this.strikeLineState.set(false);
+        }
+        else {
+            this.wysiwyg().strike(true);
+            this.strikeLineState.set(true);
+        }
+    }
+    background() {
+        this.wysiwyg().background('red');
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXWysiwygToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXWysiwygToolbarComponent, selector: "ax-wysiwyg-toolbar", outputs: { outputHTML: "outputHTML" }, ngImport: i0, template: "<div class=\"ax-wysiwyg-toolbar-container ax-sm\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  <div class=\"ax-wysiwyg-tool-container\">\n    <ax-button class=\"\" (click)=\"bold()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-bold\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"italic()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-italic\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"underLine()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-under-line\"></ax-icon>\n    </ax-button>\n\n    <ax-select-box (ngModelChange)=\"fontHandler($event)\" [ngModel]=\"selectedFont\" [dataSource]=\"fontSize\" placeholder=\"Choose...\">\n    </ax-select-box>\n\n    <ax-button (click)=\"orderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"unOrderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-un-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('left')\"\n      [look]=\"alignState() !== 'left' && 'blank'\"\n      [color]=\"alignState() === 'left' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-left\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('center')\"\n      [look]=\"alignState() !== 'center' && 'blank'\"\n      [color]=\"alignState() === 'center' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-center\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('right')\"\n      [look]=\"alignState() !== 'right' && 'blank'\"\n      [color]=\"alignState() === 'right' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-right\"></ax-icon>\n    </ax-button>\n  </div>\n\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: [".ax-wysiwyg-toolbar-container{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem}.ax-wysiwyg-toolbar-container .ax-icon{font-weight:900;font-size:1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container{display:flex}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-button{margin-inline:.1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-select-box{margin-inline:1rem}\n"], dependencies: [{ kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXWysiwygToolbarComponent, selector: "ax-wysiwyg-toolbar", outputs: { outputHTML: "outputHTML" }, ngImport: i0, template: "<div class=\"ax-wysiwyg-toolbar-container ax-sm\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  <div class=\"ax-wysiwyg-tool-container\">\n    <ax-button class=\"\" (click)=\"undo()\" look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n    </ax-button>\n\n    <ax-button class=\"\" (click)=\"redo()\" look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-redo\"></ax-icon>\n    </ax-button>\n\n    <ax-button class=\"\" (click)=\"bold()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-bold\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"italic()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-italic\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"underLine()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-under-line\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"strike()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-strike\"></ax-icon>\n    </ax-button>\n\n    <ax-button #colorBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-color-palette\"></ax-icon>\n    </ax-button>\n\n    <ax-button #highlightBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n    </ax-button>\n\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\n    <ax-popover\n      [openOn]=\"popoverOption.openOn\"\n      [closeOn]=\"popoverOption.closeOn\"\n      [target]=\"highlightBtn\"\n      [placement]=\"popoverOption.placement\"\n    >\n      <div class=\"ax-overlay-pane\">\n        <ax-color-palette (ngModelChange)=\"changeHighlightColorHandler($event)\" [ngModel]=\"selectedHighlightColor\">\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\n    <ax-select-box (ngModelChange)=\"fontHandler($event)\" [ngModel]=\"selectedFont\" [dataSource]=\"fontSize\" placeholder=\"Choose...\">\n    </ax-select-box>\n\n    <ax-button (click)=\"orderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"unOrderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-un-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button look=\"blank\" #alignPop>\n      <ax-icon class=\"ax-icon ax-icon-align-left\"></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\n          (click)=\"alignStateHandler('left')\"\n          [look]=\"alignState() !== 'left' && 'blank'\"\n          [color]=\"alignState() === 'left' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-left\"></ax-icon>\n        </ax-button>\n\n        <ax-button\n          (click)=\"alignStateHandler('center')\"\n          [look]=\"alignState() !== 'center' && 'blank'\"\n          [color]=\"alignState() === 'center' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-center\"></ax-icon>\n        </ax-button>\n\n        <ax-button\n          (click)=\"alignStateHandler('right')\"\n          [look]=\"alignState() !== 'right' && 'blank'\"\n          [color]=\"alignState() === 'right' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-right\"></ax-icon>\n        </ax-button>\n      </div>\n    </ax-popover>\n\n    <ax-button #linkBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-image\"></ax-icon>\n    </ax-button>\n\n    <ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"linkBtn\" [placement]=\"popoverOption.placement\">\n      <ax-text-box class=\"{{ textBoxOptions.size }}\" [(ngModel)]=\"textBoxOptions.text\" [placeholder]=\"textBoxOptions.placeholder\">\n      </ax-text-box>\n      <ax-suffix>\n        <ax-button (click)=\"submitLink()\" class=\"ax-sm\" color=\"secondary\" text=\"Add\"> </ax-button>\n      </ax-suffix>\n    </ax-popover>\n  </div>\n\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: [".ax-wysiwyg-toolbar-container{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem}.ax-wysiwyg-toolbar-container .ax-icon{font-weight:900;font-size:1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container{display:flex}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-button{margin-inline:.1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-select-box{margin-inline:1rem}\n"], dependencies: [{ kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i3.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.AXColorPalleteComponent, selector: "ax-color-palette", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "checked"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: i5.AXColorPalettePreviewComponent, selector: "ax-color-palette-preview" }, { kind: "component", type: i5.AXColorPaletteInputComponent, selector: "ax-color-palette-input" }, { kind: "component", type: i5.AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i7.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXWysiwygToolbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-wysiwyg-toolbar', template: "<div class=\"ax-wysiwyg-toolbar-container ax-sm\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  <div class=\"ax-wysiwyg-tool-container\">\n    <ax-button class=\"\" (click)=\"bold()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-bold\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"italic()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-italic\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"underLine()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-under-line\"></ax-icon>\n    </ax-button>\n\n    <ax-select-box (ngModelChange)=\"fontHandler($event)\" [ngModel]=\"selectedFont\" [dataSource]=\"fontSize\" placeholder=\"Choose...\">\n    </ax-select-box>\n\n    <ax-button (click)=\"orderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"unOrderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-un-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('left')\"\n      [look]=\"alignState() !== 'left' && 'blank'\"\n      [color]=\"alignState() === 'left' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-left\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('center')\"\n      [look]=\"alignState() !== 'center' && 'blank'\"\n      [color]=\"alignState() === 'center' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-center\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('right')\"\n      [look]=\"alignState() !== 'right' && 'blank'\"\n      [color]=\"alignState() === 'right' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-right\"></ax-icon>\n    </ax-button>\n  </div>\n\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: [".ax-wysiwyg-toolbar-container{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem}.ax-wysiwyg-toolbar-container .ax-icon{font-weight:900;font-size:1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container{display:flex}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-button{margin-inline:.1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-select-box{margin-inline:1rem}\n"] }]
+            args: [{ selector: 'ax-wysiwyg-toolbar', encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-wysiwyg-toolbar-container ax-sm\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  <div class=\"ax-wysiwyg-tool-container\">\n    <ax-button class=\"\" (click)=\"undo()\" look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n    </ax-button>\n\n    <ax-button class=\"\" (click)=\"redo()\" look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-redo\"></ax-icon>\n    </ax-button>\n\n    <ax-button class=\"\" (click)=\"bold()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-bold\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"italic()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-italic\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"underLine()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-under-line\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"strike()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-strike\"></ax-icon>\n    </ax-button>\n\n    <ax-button #colorBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-color-palette\"></ax-icon>\n    </ax-button>\n\n    <ax-button #highlightBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n    </ax-button>\n\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\n    <ax-popover\n      [openOn]=\"popoverOption.openOn\"\n      [closeOn]=\"popoverOption.closeOn\"\n      [target]=\"highlightBtn\"\n      [placement]=\"popoverOption.placement\"\n    >\n      <div class=\"ax-overlay-pane\">\n        <ax-color-palette (ngModelChange)=\"changeHighlightColorHandler($event)\" [ngModel]=\"selectedHighlightColor\">\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\n    <ax-select-box (ngModelChange)=\"fontHandler($event)\" [ngModel]=\"selectedFont\" [dataSource]=\"fontSize\" placeholder=\"Choose...\">\n    </ax-select-box>\n\n    <ax-button (click)=\"orderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"unOrderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-un-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button look=\"blank\" #alignPop>\n      <ax-icon class=\"ax-icon ax-icon-align-left\"></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\n          (click)=\"alignStateHandler('left')\"\n          [look]=\"alignState() !== 'left' && 'blank'\"\n          [color]=\"alignState() === 'left' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-left\"></ax-icon>\n        </ax-button>\n\n        <ax-button\n          (click)=\"alignStateHandler('center')\"\n          [look]=\"alignState() !== 'center' && 'blank'\"\n          [color]=\"alignState() === 'center' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-center\"></ax-icon>\n        </ax-button>\n\n        <ax-button\n          (click)=\"alignStateHandler('right')\"\n          [look]=\"alignState() !== 'right' && 'blank'\"\n          [color]=\"alignState() === 'right' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-right\"></ax-icon>\n        </ax-button>\n      </div>\n    </ax-popover>\n\n    <ax-button #linkBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-image\"></ax-icon>\n    </ax-button>\n\n    <ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"linkBtn\" [placement]=\"popoverOption.placement\">\n      <ax-text-box class=\"{{ textBoxOptions.size }}\" [(ngModel)]=\"textBoxOptions.text\" [placeholder]=\"textBoxOptions.placeholder\">\n      </ax-text-box>\n      <ax-suffix>\n        <ax-button (click)=\"submitLink()\" class=\"ax-sm\" color=\"secondary\" text=\"Add\"> </ax-button>\n      </ax-suffix>\n    </ax-popover>\n  </div>\n\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: [".ax-wysiwyg-toolbar-container{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem}.ax-wysiwyg-toolbar-container .ax-icon{font-weight:900;font-size:1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container{display:flex}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-button{margin-inline:.1rem}.ax-wysiwyg-toolbar-container .ax-wysiwyg-tool-container ax-select-box{margin-inline:1rem}\n"] }]
         }], ctorParameters: () => [] });
 
 class AXWysiwygViewComponent {
@@ -159,10 +211,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 const COMPONENT = [AXWysiwygContainerComponent, AXWysiwygViewComponent, AXWysiwygToolbarComponent];
-const MODULES = [AXButtonModule, AXDecoratorModule, AXSelectBoxModule, FormsModule];
+const MODULES = [AXButtonModule, AXDecoratorModule, AXSelectBoxModule, FormsModule, AXColorPaletteModule, AXPopoverModule, AXTextBoxModule];
 class AXWysiwygModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXWysiwygModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXWysiwygModule, declarations: [AXWysiwygContainerComponent, AXWysiwygViewComponent, AXWysiwygToolbarComponent], imports: [AXButtonModule, AXDecoratorModule, AXSelectBoxModule, FormsModule], exports: [AXWysiwygContainerComponent, AXWysiwygViewComponent, AXWysiwygToolbarComponent] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXWysiwygModule, declarations: [AXWysiwygContainerComponent, AXWysiwygViewComponent, AXWysiwygToolbarComponent], imports: [AXButtonModule, AXDecoratorModule, AXSelectBoxModule, FormsModule, AXColorPaletteModule, AXPopoverModule, AXTextBoxModule], exports: [AXWysiwygContainerComponent, AXWysiwygViewComponent, AXWysiwygToolbarComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXWysiwygModule, providers: [AXWysiwygService], imports: [MODULES] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXWysiwygModule, decorators: [{

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

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-wysiwyg.mjs","sources":["../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg.service.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-container/wysiwyg-container.component.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-container/wysiwyg-container.component.html","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.html","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.html","../../../../libs/components/wysiwyg/src/lib/wysiwyg.module.ts","../../../../libs/components/wysiwyg/src/acorex-components-wysiwyg.ts"],"sourcesContent":["import { AXWysiwyg } from '@acorex/cdk/wysiwyg';\nimport { Injectable, signal } from '@angular/core';\n\n@Injectable()\nexport class AXWysiwygService {\n  wysiwyg = signal<AXWysiwyg | null>(null);\n}\n","import { AXWysiwyg } from '@acorex/cdk/wysiwyg';\nimport { MXBaseComponent } from '@acorex/components/common';\nimport { Component, ViewEncapsulation, afterNextRender, inject, signal } from '@angular/core';\nimport { AXWysiwygService } from '../wysiwyg.service';\n\n@Component({\n  selector: 'ax-wysiwyg-container',\n  templateUrl: './wysiwyg-container.component.html',\n  styleUrl: './wysiwyg-container.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXWysiwygContainerComponent extends MXBaseComponent {\n  wysiwyg = signal<AXWysiwyg>(null);\n  view = signal<HTMLElement | null>(null);\n  service = inject(AXWysiwygService);\n\n  constructor() {\n    super();\n    afterNextRender(() => {\n      this.view.set(this.getHostElement().querySelector('ax-wysiwyg-view') as HTMLElement);\n\n      this.wysiwyg.set(\n        new AXWysiwyg(this.view(), {\n          placeholder: 'Write Your Message ...',\n        }),\n      );\n\n      this.service.wysiwyg.set(this.wysiwyg());\n    });\n  }\n}\n","<ng-content></ng-content>\n","import { AXWysiwyg } from '@acorex/cdk/wysiwyg';\nimport { AXClickEvent, AXDataSource } from '@acorex/components/common';\nimport { Component, afterNextRender, inject, output, signal } from '@angular/core';\nimport { AXWysiwygService } from '../wysiwyg.service';\n\n@Component({\n  selector: 'ax-wysiwyg-toolbar',\n  templateUrl: './wysiwyg-toolbar.component.html',\n  styleUrl: './wysiwyg-toolbar.component.scss',\n})\nexport class AXWysiwygToolbarComponent {\n  outputHTML = output<AXClickEvent>();\n  service = inject(AXWysiwygService);\n\n  wysiwyg = signal<AXWysiwyg | null>(null);\n  boldState = signal(false);\n  italicState = signal(false);\n  underLineState = signal(false);\n  orderListState = signal('');\n  unOrderListState = signal('');\n  alignState = signal('');\n\n  protected fontSize = new AXDataSource<string>({\n    pageSize: 10,\n    key: 'id',\n    load: (e) => {\n      return new Promise((resolve) => {\n        resolve({\n          items: ['small', 'medium', 'large', 'huge'],\n          total: 4,\n        });\n      });\n    },\n    byKey: (key) => {\n      return new Promise((resolve) => {\n        resolve('medium');\n      });\n    },\n  });\n  protected selectedFont = 'medium';\n\n  constructor() {\n    afterNextRender(() => {\n      this.wysiwyg.set(this.service.wysiwyg());\n    });\n  }\n\n  fontHandler(e: any) {\n    this.wysiwyg().fontSize(e);\n  }\n\n  bold() {\n    if (this.boldState()) {\n      this.wysiwyg().bold(false);\n      this.boldState.set(false);\n    } else {\n      this.wysiwyg().bold(true);\n      this.boldState.set(true);\n    }\n  }\n\n  out() {\n    this.outputHTML.emit({\n      component: this,\n      data: { value: this.wysiwyg().HTMLoutput },\n      isUserInteraction: true,\n    });\n  }\n\n  italic() {\n    if (this.italicState()) {\n      this.wysiwyg().italic(false);\n      this.italicState.set(false);\n    } else {\n      this.wysiwyg().italic(true);\n      this.italicState.set(true);\n    }\n  }\n\n  underLine() {\n    if (this.underLineState()) {\n      this.wysiwyg().underLine(false);\n      this.underLineState.set(false);\n    } else {\n      this.wysiwyg().underLine(true);\n      this.underLineState.set(true);\n    }\n  }\n\n  orderList() {\n    if (this.orderListState()) {\n      this.wysiwyg().list('');\n      this.orderListState.set('');\n    } else {\n      this.wysiwyg().list('ordered');\n      this.orderListState.set('ordered');\n    }\n  }\n\n  unOrderList() {\n    if (this.unOrderListState()) {\n      this.wysiwyg().list('');\n      this.unOrderListState.set('');\n    } else {\n      this.wysiwyg().list('bullet');\n      this.unOrderListState.set('bullet');\n    }\n  }\n\n  alignStateHandler(e: any) {\n    this.alignState.set(e);\n    this.wysiwyg().align(e);\n  }\n}\n","<div class=\"ax-wysiwyg-toolbar-container ax-sm\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  <div class=\"ax-wysiwyg-tool-container\">\n    <ax-button class=\"\" (click)=\"bold()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-bold\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"italic()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-italic\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"underLine()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-under-line\"></ax-icon>\n    </ax-button>\n\n    <ax-select-box (ngModelChange)=\"fontHandler($event)\" [ngModel]=\"selectedFont\" [dataSource]=\"fontSize\" placeholder=\"Choose...\">\n    </ax-select-box>\n\n    <ax-button (click)=\"orderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"unOrderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-un-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('left')\"\n      [look]=\"alignState() !== 'left' && 'blank'\"\n      [color]=\"alignState() === 'left' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-left\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('center')\"\n      [look]=\"alignState() !== 'center' && 'blank'\"\n      [color]=\"alignState() === 'center' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-center\"></ax-icon>\n    </ax-button>\n\n    <ax-button\n      (click)=\"alignStateHandler('right')\"\n      [look]=\"alignState() !== 'right' && 'blank'\"\n      [color]=\"alignState() === 'right' && 'primary'\"\n    >\n      <ax-icon class=\"ax-icon ax-icon-align-right\"></ax-icon>\n    </ax-button>\n  </div>\n\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n","import { Component, ViewEncapsulation } from '@angular/core';\n\n@Component({\n  selector: 'ax-wysiwyg-view',\n  templateUrl: './wysiwyg-view.component.html',\n  styleUrl: './wysiwyg-view.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXWysiwygViewComponent {}\n","<!-- wysiwyg editor render here -->\n","import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXSelectBoxModule } from '@acorex/components/select-box';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { AXWysiwygContainerComponent } from './wysiwyg/wysiwyg-container/wysiwyg-container.component';\n\nimport { AXWysiwygToolbarComponent } from './wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component';\nimport { AXWysiwygViewComponent } from './wysiwyg/wysiwyg-view/wysiwyg-view.component';\nimport { AXWysiwygService } from './wysiwyg/wysiwyg.service';\n\nconst COMPONENT = [AXWysiwygContainerComponent, AXWysiwygViewComponent, AXWysiwygToolbarComponent];\nconst MODULES = [AXButtonModule, AXDecoratorModule, AXSelectBoxModule, FormsModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [AXWysiwygService],\n})\nexport class AXWysiwygModule {}\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-wysiwyg.mjs","sources":["../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg.service.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-container/wysiwyg-container.component.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-container/wysiwyg-container.component.html","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.html","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.ts","../../../../libs/components/wysiwyg/src/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.html","../../../../libs/components/wysiwyg/src/lib/wysiwyg.module.ts","../../../../libs/components/wysiwyg/src/acorex-components-wysiwyg.ts"],"sourcesContent":["import { AXWysiwyg } from '@acorex/cdk/wysiwyg';\nimport { Injectable, signal } from '@angular/core';\n\n@Injectable()\nexport class AXWysiwygService {\n  wysiwyg = signal<AXWysiwyg | null>(null);\n}\n","import { AXWysiwyg } from '@acorex/cdk/wysiwyg';\nimport { MXBaseComponent } from '@acorex/components/common';\nimport { Component, ViewEncapsulation, afterNextRender, inject, signal } from '@angular/core';\nimport { AXWysiwygService } from '../wysiwyg.service';\n\n@Component({\n  selector: 'ax-wysiwyg-container',\n  templateUrl: './wysiwyg-container.component.html',\n  styleUrl: './wysiwyg-container.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXWysiwygContainerComponent extends MXBaseComponent {\n  wysiwyg = signal<AXWysiwyg>(null);\n  view = signal<HTMLElement | null>(null);\n  service = inject(AXWysiwygService);\n\n  constructor() {\n    super();\n    afterNextRender(() => {\n      this.view.set(this.getHostElement().querySelector('ax-wysiwyg-view') as HTMLElement);\n\n      this.wysiwyg.set(\n        new AXWysiwyg(this.view(), {\n          placeholder: 'Write Your Message ...',\n        }),\n      );\n\n      this.service.wysiwyg.set(this.wysiwyg());\n    });\n  }\n}\n","<ng-content></ng-content>\n","import { AXWysiwyg } from '@acorex/cdk/wysiwyg';\nimport { AXClickEvent, AXDataSource, AXPlacement } from '@acorex/components/common';\nimport { AXPopoverCloseTrigger, AXPopoverOpenTrigger } from '@acorex/components/popover';\nimport { Component, ViewEncapsulation, afterNextRender, inject, output, signal } from '@angular/core';\nimport { AXWysiwygService } from '../wysiwyg.service';\n\n@Component({\n  selector: 'ax-wysiwyg-toolbar',\n  templateUrl: './wysiwyg-toolbar.component.html',\n  styleUrl: './wysiwyg-toolbar.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXWysiwygToolbarComponent {\n  outputHTML = output<AXClickEvent>();\n  service = inject(AXWysiwygService);\n\n  protected wysiwyg = signal<AXWysiwyg | null>(null);\n  protected boldState = signal(false);\n  protected italicState = signal(false);\n  protected underLineState = signal(false);\n  protected strikeLineState = signal(false);\n  protected orderListState = signal('');\n  protected unOrderListState = signal('');\n  protected alignState = signal('');\n  protected selectedFont = 'medium';\n  protected selectedColor = '';\n  protected selectedHighlightColor = '';\n  protected linkAddress = '';\n\n  protected fontSize = new AXDataSource<string>({\n    pageSize: 10,\n    key: 'id',\n    load: (e) => {\n      return new Promise((resolve) => {\n        resolve({\n          items: ['small', 'medium', 'large', 'huge'],\n          total: 4,\n        });\n      });\n    },\n    byKey: (key) => {\n      return new Promise((resolve) => {\n        resolve('medium');\n      });\n    },\n  });\n\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  textBoxOptions = {\n    text: '',\n    placeholder: 'Enter yor url ...',\n    size: 'ax-sm',\n  };\n\n  submitLink() {\n    this.wysiwyg().addImage(this.textBoxOptions.text);\n  }\n\n  constructor() {\n    afterNextRender(() => {\n      this.wysiwyg.set(this.service.wysiwyg());\n    });\n  }\n\n  changeColorHandler(e: string) {\n    this.selectedColor = e;\n    this.wysiwyg().color(e);\n  }\n\n  changeHighlightColorHandler(e: string) {\n    this.selectedHighlightColor = e;\n    this.wysiwyg().background(e);\n  }\n\n  fontHandler(e: any) {\n    this.wysiwyg().fontSize(e);\n  }\n\n  bold() {\n    if (this.boldState()) {\n      this.wysiwyg().bold(false);\n      this.boldState.set(false);\n    } else {\n      this.wysiwyg().bold(true);\n      this.boldState.set(true);\n    }\n  }\n\n  out() {\n    this.outputHTML.emit({\n      component: this,\n      data: { value: this.wysiwyg().HTMLoutput },\n      isUserInteraction: true,\n    });\n  }\n\n  italic() {\n    if (this.italicState()) {\n      this.wysiwyg().italic(false);\n      this.italicState.set(false);\n    } else {\n      this.wysiwyg().italic(true);\n      this.italicState.set(true);\n    }\n  }\n\n  underLine() {\n    if (this.underLineState()) {\n      this.wysiwyg().underLine(false);\n      this.underLineState.set(false);\n    } else {\n      this.wysiwyg().underLine(true);\n      this.underLineState.set(true);\n    }\n  }\n\n  orderList() {\n    if (this.orderListState()) {\n      this.wysiwyg().list('');\n      this.orderListState.set('');\n    } else {\n      this.wysiwyg().list('ordered');\n      this.orderListState.set('ordered');\n    }\n  }\n\n  unOrderList() {\n    if (this.unOrderListState()) {\n      this.wysiwyg().list('');\n      this.unOrderListState.set('');\n    } else {\n      this.wysiwyg().list('bullet');\n      this.unOrderListState.set('bullet');\n    }\n  }\n\n  alignStateHandler(e: any) {\n    this.alignState.set(e);\n    this.wysiwyg().align(e);\n  }\n\n  undo() {\n    this.wysiwyg().undo();\n  }\n\n  redo() {\n    this.wysiwyg().redo();\n  }\n\n  strike() {\n    if (this.strikeLineState()) {\n      this.wysiwyg().strike(false);\n      this.strikeLineState.set(false);\n    } else {\n      this.wysiwyg().strike(true);\n      this.strikeLineState.set(true);\n    }\n  }\n\n  background() {\n    this.wysiwyg().background('red');\n  }\n}\n","<div class=\"ax-wysiwyg-toolbar-container ax-sm\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  <div class=\"ax-wysiwyg-tool-container\">\n    <ax-button class=\"\" (click)=\"undo()\" look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n    </ax-button>\n\n    <ax-button class=\"\" (click)=\"redo()\" look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-redo\"></ax-icon>\n    </ax-button>\n\n    <ax-button class=\"\" (click)=\"bold()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-bold\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"italic()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-italic\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"underLine()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-under-line\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"strike()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-strike\"></ax-icon>\n    </ax-button>\n\n    <ax-button #colorBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-color-palette\"></ax-icon>\n    </ax-button>\n\n    <ax-button #highlightBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n    </ax-button>\n\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\n    <ax-popover\n      [openOn]=\"popoverOption.openOn\"\n      [closeOn]=\"popoverOption.closeOn\"\n      [target]=\"highlightBtn\"\n      [placement]=\"popoverOption.placement\"\n    >\n      <div class=\"ax-overlay-pane\">\n        <ax-color-palette (ngModelChange)=\"changeHighlightColorHandler($event)\" [ngModel]=\"selectedHighlightColor\">\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\n    <ax-select-box (ngModelChange)=\"fontHandler($event)\" [ngModel]=\"selectedFont\" [dataSource]=\"fontSize\" placeholder=\"Choose...\">\n    </ax-select-box>\n\n    <ax-button (click)=\"orderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button (click)=\"unOrderList()\" look=\"blank\" [toggleable]=\"true\">\n      <ax-icon class=\"ax-icon ax-icon-un-order-list\"></ax-icon>\n    </ax-button>\n\n    <ax-button look=\"blank\" #alignPop>\n      <ax-icon class=\"ax-icon ax-icon-align-left\"></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\n          (click)=\"alignStateHandler('left')\"\n          [look]=\"alignState() !== 'left' && 'blank'\"\n          [color]=\"alignState() === 'left' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-left\"></ax-icon>\n        </ax-button>\n\n        <ax-button\n          (click)=\"alignStateHandler('center')\"\n          [look]=\"alignState() !== 'center' && 'blank'\"\n          [color]=\"alignState() === 'center' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-center\"></ax-icon>\n        </ax-button>\n\n        <ax-button\n          (click)=\"alignStateHandler('right')\"\n          [look]=\"alignState() !== 'right' && 'blank'\"\n          [color]=\"alignState() === 'right' && 'primary'\"\n        >\n          <ax-icon class=\"ax-icon ax-icon-align-right\"></ax-icon>\n        </ax-button>\n      </div>\n    </ax-popover>\n\n    <ax-button #linkBtn look=\"blank\">\n      <ax-icon class=\"ax-icon ax-icon-image\"></ax-icon>\n    </ax-button>\n\n    <ax-popover [openOn]=\"popoverOption.openOn\" [closeOn]=\"popoverOption.closeOn\" [target]=\"linkBtn\" [placement]=\"popoverOption.placement\">\n      <ax-text-box class=\"{{ textBoxOptions.size }}\" [(ngModel)]=\"textBoxOptions.text\" [placeholder]=\"textBoxOptions.placeholder\">\n      </ax-text-box>\n      <ax-suffix>\n        <ax-button (click)=\"submitLink()\" class=\"ax-sm\" color=\"secondary\" text=\"Add\"> </ax-button>\n      </ax-suffix>\n    </ax-popover>\n  </div>\n\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n","import { Component, ViewEncapsulation } from '@angular/core';\n\n@Component({\n  selector: 'ax-wysiwyg-view',\n  templateUrl: './wysiwyg-view.component.html',\n  styleUrl: './wysiwyg-view.component.scss',\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXWysiwygViewComponent {}\n","<!-- wysiwyg editor render here -->\n","import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXSelectBoxModule } from '@acorex/components/select-box';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { AXWysiwygContainerComponent } from './wysiwyg/wysiwyg-container/wysiwyg-container.component';\n\nimport { AXColorPaletteModule } from '@acorex/components/color-palette';\nimport { AXPopoverModule } from '@acorex/components/popover';\nimport { AXTextBoxModule } from '@acorex/components/text-box';\nimport { AXWysiwygToolbarComponent } from './wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component';\nimport { AXWysiwygViewComponent } from './wysiwyg/wysiwyg-view/wysiwyg-view.component';\nimport { AXWysiwygService } from './wysiwyg/wysiwyg.service';\n\nconst COMPONENT = [AXWysiwygContainerComponent, AXWysiwygViewComponent, AXWysiwygToolbarComponent];\n\nconst MODULES = [AXButtonModule, AXDecoratorModule, AXSelectBoxModule, FormsModule, AXColorPaletteModule, AXPopoverModule, AXTextBoxModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [AXWysiwygService],\n})\nexport class AXWysiwygModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acorex/components",
-  "version": "18.5.2",
+  "version": "18.5.4",
   "peerDependencies": {
     "@angular/common": ">=18.0.0",
     "@angular/core": ">=18.0.0",
@@ -31,11 +31,11 @@
       "esm": "./esm2022/action-sheet/acorex-components-action-sheet.mjs",
       "default": "./fesm2022/acorex-components-action-sheet.mjs"
     },
-    "./avatar": {
-      "types": "./avatar/index.d.ts",
-      "esm2022": "./esm2022/avatar/acorex-components-avatar.mjs",
-      "esm": "./esm2022/avatar/acorex-components-avatar.mjs",
-      "default": "./fesm2022/acorex-components-avatar.mjs"
+    "./badge": {
+      "types": "./badge/index.d.ts",
+      "esm2022": "./esm2022/badge/acorex-components-badge.mjs",
+      "esm": "./esm2022/badge/acorex-components-badge.mjs",
+      "default": "./fesm2022/acorex-components-badge.mjs"
     },
     "./bottom-navigation": {
       "types": "./bottom-navigation/index.d.ts",
@@ -43,17 +43,11 @@
       "esm": "./esm2022/bottom-navigation/acorex-components-bottom-navigation.mjs",
       "default": "./fesm2022/acorex-components-bottom-navigation.mjs"
     },
-    "./badge": {
-      "types": "./badge/index.d.ts",
-      "esm2022": "./esm2022/badge/acorex-components-badge.mjs",
-      "esm": "./esm2022/badge/acorex-components-badge.mjs",
-      "default": "./fesm2022/acorex-components-badge.mjs"
-    },
-    "./audio-wave": {
-      "types": "./audio-wave/index.d.ts",
-      "esm2022": "./esm2022/audio-wave/acorex-components-audio-wave.mjs",
-      "esm": "./esm2022/audio-wave/acorex-components-audio-wave.mjs",
-      "default": "./fesm2022/acorex-components-audio-wave.mjs"
+    "./avatar": {
+      "types": "./avatar/index.d.ts",
+      "esm2022": "./esm2022/avatar/acorex-components-avatar.mjs",
+      "esm": "./esm2022/avatar/acorex-components-avatar.mjs",
+      "default": "./fesm2022/acorex-components-avatar.mjs"
     },
     "./alert": {
       "types": "./alert/index.d.ts",
@@ -61,6 +55,12 @@
       "esm": "./esm2022/alert/acorex-components-alert.mjs",
       "default": "./fesm2022/acorex-components-alert.mjs"
     },
+    "./audio-wave": {
+      "types": "./audio-wave/index.d.ts",
+      "esm2022": "./esm2022/audio-wave/acorex-components-audio-wave.mjs",
+      "esm": "./esm2022/audio-wave/acorex-components-audio-wave.mjs",
+      "default": "./fesm2022/acorex-components-audio-wave.mjs"
+    },
     "./breadcrumbs": {
       "types": "./breadcrumbs/index.d.ts",
       "esm2022": "./esm2022/breadcrumbs/acorex-components-breadcrumbs.mjs",
@@ -181,36 +181,36 @@
       "esm": "./esm2022/dialog/acorex-components-dialog.mjs",
       "default": "./fesm2022/acorex-components-dialog.mjs"
     },
-    "./dropdown": {
-      "types": "./dropdown/index.d.ts",
-      "esm2022": "./esm2022/dropdown/acorex-components-dropdown.mjs",
-      "esm": "./esm2022/dropdown/acorex-components-dropdown.mjs",
-      "default": "./fesm2022/acorex-components-dropdown.mjs"
-    },
     "./drawer": {
       "types": "./drawer/index.d.ts",
       "esm2022": "./esm2022/drawer/acorex-components-drawer.mjs",
       "esm": "./esm2022/drawer/acorex-components-drawer.mjs",
       "default": "./fesm2022/acorex-components-drawer.mjs"
     },
+    "./dropdown": {
+      "types": "./dropdown/index.d.ts",
+      "esm2022": "./esm2022/dropdown/acorex-components-dropdown.mjs",
+      "esm": "./esm2022/dropdown/acorex-components-dropdown.mjs",
+      "default": "./fesm2022/acorex-components-dropdown.mjs"
+    },
     "./dropdown-button": {
       "types": "./dropdown-button/index.d.ts",
       "esm2022": "./esm2022/dropdown-button/acorex-components-dropdown-button.mjs",
       "esm": "./esm2022/dropdown-button/acorex-components-dropdown-button.mjs",
       "default": "./fesm2022/acorex-components-dropdown-button.mjs"
     },
-    "./form": {
-      "types": "./form/index.d.ts",
-      "esm2022": "./esm2022/form/acorex-components-form.mjs",
-      "esm": "./esm2022/form/acorex-components-form.mjs",
-      "default": "./fesm2022/acorex-components-form.mjs"
-    },
     "./image": {
       "types": "./image/index.d.ts",
       "esm2022": "./esm2022/image/acorex-components-image.mjs",
       "esm": "./esm2022/image/acorex-components-image.mjs",
       "default": "./fesm2022/acorex-components-image.mjs"
     },
+    "./form": {
+      "types": "./form/index.d.ts",
+      "esm2022": "./esm2022/form/acorex-components-form.mjs",
+      "esm": "./esm2022/form/acorex-components-form.mjs",
+      "default": "./fesm2022/acorex-components-form.mjs"
+    },
     "./label": {
       "types": "./label/index.d.ts",
       "esm2022": "./esm2022/label/acorex-components-label.mjs",
@@ -289,18 +289,18 @@
       "esm": "./esm2022/phone-box/acorex-components-phone-box.mjs",
       "default": "./fesm2022/acorex-components-phone-box.mjs"
     },
-    "./popover": {
-      "types": "./popover/index.d.ts",
-      "esm2022": "./esm2022/popover/acorex-components-popover.mjs",
-      "esm": "./esm2022/popover/acorex-components-popover.mjs",
-      "default": "./fesm2022/acorex-components-popover.mjs"
-    },
     "./picker": {
       "types": "./picker/index.d.ts",
       "esm2022": "./esm2022/picker/acorex-components-picker.mjs",
       "esm": "./esm2022/picker/acorex-components-picker.mjs",
       "default": "./fesm2022/acorex-components-picker.mjs"
     },
+    "./popover": {
+      "types": "./popover/index.d.ts",
+      "esm2022": "./esm2022/popover/acorex-components-popover.mjs",
+      "esm": "./esm2022/popover/acorex-components-popover.mjs",
+      "default": "./fesm2022/acorex-components-popover.mjs"
+    },
     "./popup": {
       "types": "./popup/index.d.ts",
       "esm2022": "./esm2022/popup/acorex-components-popup.mjs",
@@ -361,18 +361,18 @@
       "esm": "./esm2022/select-box/acorex-components-select-box.mjs",
       "default": "./fesm2022/acorex-components-select-box.mjs"
     },
-    "./side-menu": {
-      "types": "./side-menu/index.d.ts",
-      "esm2022": "./esm2022/side-menu/acorex-components-side-menu.mjs",
-      "esm": "./esm2022/side-menu/acorex-components-side-menu.mjs",
-      "default": "./fesm2022/acorex-components-side-menu.mjs"
-    },
     "./selection-list": {
       "types": "./selection-list/index.d.ts",
       "esm2022": "./esm2022/selection-list/acorex-components-selection-list.mjs",
       "esm": "./esm2022/selection-list/acorex-components-selection-list.mjs",
       "default": "./fesm2022/acorex-components-selection-list.mjs"
     },
+    "./side-menu": {
+      "types": "./side-menu/index.d.ts",
+      "esm2022": "./esm2022/side-menu/acorex-components-side-menu.mjs",
+      "esm": "./esm2022/side-menu/acorex-components-side-menu.mjs",
+      "default": "./fesm2022/acorex-components-side-menu.mjs"
+    },
     "./skeleton": {
       "types": "./skeleton/index.d.ts",
       "esm2022": "./esm2022/skeleton/acorex-components-skeleton.mjs",
@@ -391,36 +391,36 @@
       "esm": "./esm2022/step-wizard/acorex-components-step-wizard.mjs",
       "default": "./fesm2022/acorex-components-step-wizard.mjs"
     },
-    "./tabs": {
-      "types": "./tabs/index.d.ts",
-      "esm2022": "./esm2022/tabs/acorex-components-tabs.mjs",
-      "esm": "./esm2022/tabs/acorex-components-tabs.mjs",
-      "default": "./fesm2022/acorex-components-tabs.mjs"
-    },
     "./switch": {
       "types": "./switch/index.d.ts",
       "esm2022": "./esm2022/switch/acorex-components-switch.mjs",
       "esm": "./esm2022/switch/acorex-components-switch.mjs",
       "default": "./fesm2022/acorex-components-switch.mjs"
     },
+    "./tabs": {
+      "types": "./tabs/index.d.ts",
+      "esm2022": "./esm2022/tabs/acorex-components-tabs.mjs",
+      "esm": "./esm2022/tabs/acorex-components-tabs.mjs",
+      "default": "./fesm2022/acorex-components-tabs.mjs"
+    },
     "./tag": {
       "types": "./tag/index.d.ts",
       "esm2022": "./esm2022/tag/acorex-components-tag.mjs",
       "esm": "./esm2022/tag/acorex-components-tag.mjs",
       "default": "./fesm2022/acorex-components-tag.mjs"
     },
-    "./text-area": {
-      "types": "./text-area/index.d.ts",
-      "esm2022": "./esm2022/text-area/acorex-components-text-area.mjs",
-      "esm": "./esm2022/text-area/acorex-components-text-area.mjs",
-      "default": "./fesm2022/acorex-components-text-area.mjs"
-    },
     "./text-box": {
       "types": "./text-box/index.d.ts",
       "esm2022": "./esm2022/text-box/acorex-components-text-box.mjs",
       "esm": "./esm2022/text-box/acorex-components-text-box.mjs",
       "default": "./fesm2022/acorex-components-text-box.mjs"
     },
+    "./text-area": {
+      "types": "./text-area/index.d.ts",
+      "esm2022": "./esm2022/text-area/acorex-components-text-area.mjs",
+      "esm": "./esm2022/text-area/acorex-components-text-area.mjs",
+      "default": "./fesm2022/acorex-components-text-area.mjs"
+    },
     "./toast": {
       "types": "./toast/index.d.ts",
       "esm2022": "./esm2022/toast/acorex-components-toast.mjs",

package/wysiwyg/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.d.ts

@@ -1,20 +1,40 @@
 import { AXWysiwyg } from '@acorex/cdk/wysiwyg';
-import { AXClickEvent, AXDataSource } from '@acorex/components/common';
+import { AXClickEvent, AXDataSource, AXPlacement } from '@acorex/components/common';
+import { AXPopoverCloseTrigger, AXPopoverOpenTrigger } from '@acorex/components/popover';
 import { AXWysiwygService } from '../wysiwyg.service';
 import * as i0 from "@angular/core";
 export declare class AXWysiwygToolbarComponent {
     outputHTML: import("@angular/core").OutputEmitterRef<AXClickEvent>;
     service: AXWysiwygService;
-    wysiwyg: import("@angular/core").WritableSignal<AXWysiwyg>;
-    boldState: import("@angular/core").WritableSignal<boolean>;
-    italicState: import("@angular/core").WritableSignal<boolean>;
-    underLineState: import("@angular/core").WritableSignal<boolean>;
-    orderListState: import("@angular/core").WritableSignal<string>;
-    unOrderListState: import("@angular/core").WritableSignal<string>;
-    alignState: import("@angular/core").WritableSignal<string>;
-    protected fontSize: AXDataSource<string>;
+    protected wysiwyg: import("@angular/core").WritableSignal<AXWysiwyg>;
+    protected boldState: import("@angular/core").WritableSignal<boolean>;
+    protected italicState: import("@angular/core").WritableSignal<boolean>;
+    protected underLineState: import("@angular/core").WritableSignal<boolean>;
+    protected strikeLineState: import("@angular/core").WritableSignal<boolean>;
+    protected orderListState: import("@angular/core").WritableSignal<string>;
+    protected unOrderListState: import("@angular/core").WritableSignal<string>;
+    protected alignState: import("@angular/core").WritableSignal<string>;
     protected selectedFont: string;
+    protected selectedColor: string;
+    protected selectedHighlightColor: string;
+    protected linkAddress: string;
+    protected fontSize: AXDataSource<string>;
+    protected popoverOption: {
+        openOn: AXPopoverOpenTrigger;
+        closeOn: AXPopoverCloseTrigger;
+        placement: AXPlacement;
+        offsetX: number;
+        offsetY: number;
+    };
+    textBoxOptions: {
+        text: string;
+        placeholder: string;
+        size: string;
+    };
+    submitLink(): void;
     constructor();
+    changeColorHandler(e: string): void;
+    changeHighlightColorHandler(e: string): void;
     fontHandler(e: any): void;
     bold(): void;
     out(): void;
@@ -23,6 +43,10 @@ export declare class AXWysiwygToolbarComponent {
     orderList(): void;
     unOrderList(): void;
     alignStateHandler(e: any): void;
+    undo(): void;
+    redo(): void;
+    strike(): void;
+    background(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXWysiwygToolbarComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<AXWysiwygToolbarComponent, "ax-wysiwyg-toolbar", never, {}, { "outputHTML": "outputHTML"; }, never, ["ax-prefix", "ax-suffix"], false, never>;
 }

package/wysiwyg/lib/wysiwyg.module.d.ts

@@ -6,8 +6,11 @@ import * as i4 from "@acorex/components/button";
 import * as i5 from "@acorex/components/decorators";
 import * as i6 from "@acorex/components/select-box";
 import * as i7 from "@angular/forms";
+import * as i8 from "@acorex/components/color-palette";
+import * as i9 from "@acorex/components/popover";
+import * as i10 from "@acorex/components/text-box";
 export declare class AXWysiwygModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<AXWysiwygModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AXWysiwygModule, [typeof i1.AXWysiwygContainerComponent, typeof i2.AXWysiwygViewComponent, typeof i3.AXWysiwygToolbarComponent], [typeof i4.AXButtonModule, typeof i5.AXDecoratorModule, typeof i6.AXSelectBoxModule, typeof i7.FormsModule], [typeof i1.AXWysiwygContainerComponent, typeof i2.AXWysiwygViewComponent, typeof i3.AXWysiwygToolbarComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AXWysiwygModule, [typeof i1.AXWysiwygContainerComponent, typeof i2.AXWysiwygViewComponent, typeof i3.AXWysiwygToolbarComponent], [typeof i4.AXButtonModule, typeof i5.AXDecoratorModule, typeof i6.AXSelectBoxModule, typeof i7.FormsModule, typeof i8.AXColorPaletteModule, typeof i9.AXPopoverModule, typeof i10.AXTextBoxModule], [typeof i1.AXWysiwygContainerComponent, typeof i2.AXWysiwygViewComponent, typeof i3.AXWysiwygToolbarComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<AXWysiwygModule>;
 }