@acorex/components 19.11.6 → 19.11.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/fesm2022/acorex-components-action-sheet.mjs +10 -10
  2. package/fesm2022/acorex-components-alert.mjs +7 -7
  3. package/fesm2022/acorex-components-audio-wave.mjs +7 -7
  4. package/fesm2022/acorex-components-autocomplete.mjs +7 -7
  5. package/fesm2022/acorex-components-avatar.mjs +10 -10
  6. package/fesm2022/acorex-components-badge.mjs +7 -7
  7. package/fesm2022/acorex-components-bottom-navigation.mjs +10 -10
  8. package/fesm2022/acorex-components-breadcrumbs.mjs +10 -10
  9. package/fesm2022/acorex-components-button-group.mjs +10 -10
  10. package/fesm2022/acorex-components-button.mjs +13 -13
  11. package/fesm2022/acorex-components-calendar.mjs +13 -13
  12. package/fesm2022/acorex-components-check-box.mjs +7 -7
  13. package/fesm2022/acorex-components-chips.mjs +7 -7
  14. package/fesm2022/acorex-components-circular-progress.mjs +7 -7
  15. package/fesm2022/acorex-components-collapse.mjs +10 -10
  16. package/fesm2022/acorex-components-color-box.mjs +7 -7
  17. package/fesm2022/acorex-components-color-palette.mjs +25 -25
  18. package/fesm2022/acorex-components-comment.mjs +28 -28
  19. package/fesm2022/acorex-components-common.mjs +91 -91
  20. package/fesm2022/acorex-components-conversation.mjs +49 -49
  21. package/fesm2022/acorex-components-cron-job.mjs +46 -46
  22. package/fesm2022/acorex-components-data-pager.mjs +31 -31
  23. package/fesm2022/acorex-components-data-table.mjs +37 -37
  24. package/fesm2022/acorex-components-datetime-box.mjs +7 -7
  25. package/fesm2022/acorex-components-datetime-input.mjs +7 -7
  26. package/fesm2022/acorex-components-datetime-picker.mjs +7 -7
  27. package/fesm2022/acorex-components-decorators.mjs +25 -25
  28. package/fesm2022/acorex-components-dialog.mjs +10 -10
  29. package/fesm2022/acorex-components-drawer.mjs +13 -13
  30. package/fesm2022/acorex-components-dropdown-button.mjs +7 -7
  31. package/fesm2022/acorex-components-dropdown.mjs +13 -13
  32. package/fesm2022/acorex-components-file-explorer.mjs +25 -25
  33. package/fesm2022/acorex-components-form.mjs +16 -16
  34. package/fesm2022/acorex-components-grid-layout-builder.mjs +10 -10
  35. package/fesm2022/acorex-components-image-editor.mjs +46 -38
  36. package/fesm2022/acorex-components-image-editor.mjs.map +1 -1
  37. package/fesm2022/acorex-components-image.mjs +7 -7
  38. package/fesm2022/acorex-components-json-viewer.mjs +7 -7
  39. package/fesm2022/acorex-components-kbd.mjs +10 -10
  40. package/fesm2022/acorex-components-label.mjs +7 -7
  41. package/fesm2022/acorex-components-list.mjs +7 -7
  42. package/fesm2022/acorex-components-loading-dialog.mjs +10 -10
  43. package/fesm2022/acorex-components-loading.mjs +16 -16
  44. package/fesm2022/acorex-components-map.mjs +10 -10
  45. package/fesm2022/acorex-components-media-viewer.mjs +38 -35
  46. package/fesm2022/acorex-components-media-viewer.mjs.map +1 -1
  47. package/fesm2022/acorex-components-menu.mjs +20 -20
  48. package/fesm2022/acorex-components-menu.mjs.map +1 -1
  49. package/fesm2022/acorex-components-navbar.mjs +7 -7
  50. package/fesm2022/acorex-components-notification.mjs +10 -10
  51. package/fesm2022/acorex-components-number-box.mjs +7 -7
  52. package/fesm2022/acorex-components-otp.mjs +7 -7
  53. package/fesm2022/acorex-components-page.mjs +10 -10
  54. package/fesm2022/acorex-components-paint.mjs +185 -106
  55. package/fesm2022/acorex-components-paint.mjs.map +1 -1
  56. package/fesm2022/acorex-components-password-box.mjs +12 -12
  57. package/fesm2022/acorex-components-password-box.mjs.map +1 -1
  58. package/fesm2022/acorex-components-pdf-reader.mjs +7 -7
  59. package/fesm2022/acorex-components-phone-box.mjs +7 -7
  60. package/fesm2022/acorex-components-picker.mjs +13 -13
  61. package/fesm2022/acorex-components-popover.mjs +7 -7
  62. package/fesm2022/acorex-components-popup.mjs +23 -14
  63. package/fesm2022/acorex-components-popup.mjs.map +1 -1
  64. package/fesm2022/acorex-components-progress-bar.mjs +7 -7
  65. package/fesm2022/acorex-components-qrcode.mjs +7 -7
  66. package/fesm2022/acorex-components-query-builder.mjs +7 -7
  67. package/fesm2022/acorex-components-radio.mjs +7 -7
  68. package/fesm2022/acorex-components-rail-navigation.mjs +13 -13
  69. package/fesm2022/acorex-components-range-slider.mjs +7 -7
  70. package/fesm2022/acorex-components-rate-picker.mjs +7 -7
  71. package/fesm2022/acorex-components-rest-api-generator.mjs +22 -22
  72. package/fesm2022/acorex-components-result.mjs +7 -7
  73. package/fesm2022/acorex-components-routing-progress.mjs +7 -7
  74. package/fesm2022/acorex-components-scheduler.mjs +13 -13
  75. package/fesm2022/acorex-components-scss.mjs +4 -4
  76. package/fesm2022/acorex-components-search-box.mjs +7 -7
  77. package/fesm2022/acorex-components-select-box.mjs +7 -7
  78. package/fesm2022/acorex-components-selection-list.mjs +7 -7
  79. package/fesm2022/acorex-components-side-menu.mjs +13 -13
  80. package/fesm2022/acorex-components-skeleton.mjs +7 -7
  81. package/fesm2022/acorex-components-slider.mjs +7 -7
  82. package/fesm2022/acorex-components-sliding-item.mjs +13 -13
  83. package/fesm2022/acorex-components-step-wizard.mjs +13 -13
  84. package/fesm2022/acorex-components-switch.mjs +10 -10
  85. package/fesm2022/acorex-components-tabs.mjs +13 -13
  86. package/fesm2022/acorex-components-tag-box.mjs +7 -7
  87. package/fesm2022/acorex-components-tag.mjs +7 -7
  88. package/fesm2022/acorex-components-text-area.mjs +7 -7
  89. package/fesm2022/acorex-components-text-box.mjs +10 -10
  90. package/fesm2022/acorex-components-time-line.mjs +10 -10
  91. package/fesm2022/acorex-components-toast.mjs +10 -10
  92. package/fesm2022/acorex-components-toolbar.mjs +7 -7
  93. package/fesm2022/acorex-components-tooltip.mjs +10 -10
  94. package/fesm2022/acorex-components-tree-view.mjs +10 -10
  95. package/fesm2022/acorex-components-uploader.mjs +22 -22
  96. package/fesm2022/acorex-components-video-player.mjs +7 -7
  97. package/fesm2022/acorex-components-wysiwyg.mjs +31 -31
  98. package/image-editor/lib/image-editor-container/image-editor-container.component.d.ts +2 -1
  99. package/media-viewer/lib/media-viewer-container/media-viewer-container.component.d.ts +1 -0
  100. package/package.json +5 -5
  101. package/paint/index.d.ts +4 -2
  102. package/paint/lib/paint/paint-container/paint-container.component.d.ts +4 -1
  103. package/paint/lib/paint/paint-tools/paint-eraser-tool/paint-eraser-tool.component.d.ts +15 -0
  104. package/paint/lib/paint/paint-tools/paint-highlight-tool/paint-highlight-tool.component.d.ts +18 -0
  105. package/paint/lib/paint/paint-tools/paint-pen-tool/paint-pen-tool.component.d.ts +18 -0
  106. package/paint/lib/paint/paint-tools-selector/paint-tools-selector.component.d.ts +9 -0
  107. package/paint/lib/paint/paint.service.d.ts +5 -2
  108. package/paint/lib/paint.module.d.ts +5 -3
  109. package/paint/lib/paint/paint-tools/paint-color-picker/paint-color-picker.component.d.ts +0 -17
  110. package/paint/lib/paint/paint-tools/paint-pen-mode-changer/paint-pen-mode-changer.component.d.ts +0 -36
@@ -36,10 +36,10 @@ class AXImageEditorService {
36
36
  this.redoPressed = signal(false);
37
37
  this.cropperRatio = signal(null);
38
38
  }
39
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
40
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorService }); }
39
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
40
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorService }); }
41
41
  }
42
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorService, decorators: [{
42
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorService, decorators: [{
43
43
  type: Injectable
44
44
  }] });
45
45
 
@@ -63,10 +63,10 @@ class AXImageEditorCropComponent {
63
63
  this.service.cropperRatio.set(r);
64
64
  }
65
65
  }
66
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorCropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
67
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AXImageEditorCropComponent, isStandalone: true, selector: "ax-image-editor-crop", outputs: { cropPressed: "cropPressed" }, ngImport: i0, template: "<ax-button (click)=\"cropButtonHandler()\" class=\"ax-crop-save ax-sm\" text=\"Crop\"></ax-button>\n\n<ax-button\n [selected]=\"this.service.cropperRatio() === '1:1' ? true : false\"\n [color]=\"this.service.cropperRatio() === '1:1' ? 'primary' : 'default'\"\n (click)=\"ratioHandler('1:1')\"\n class=\"ax-crop-save ax-sm\"\n text=\"1:1\"\n></ax-button>\n<ax-button\n [selected]=\"this.service.cropperRatio() === '16:9' ? true : false\"\n [color]=\"this.service.cropperRatio() === '16:9' ? 'primary' : 'default'\"\n (click)=\"ratioHandler('16:9')\"\n class=\"ax-crop-save ax-sm\"\n text=\"16:9\"\n></ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
66
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorCropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
67
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AXImageEditorCropComponent, isStandalone: true, selector: "ax-image-editor-crop", outputs: { cropPressed: "cropPressed" }, ngImport: i0, template: "<ax-button (click)=\"cropButtonHandler()\" class=\"ax-crop-save ax-sm\" text=\"Crop\"></ax-button>\n\n<ax-button\n [selected]=\"this.service.cropperRatio() === '1:1' ? true : false\"\n [color]=\"this.service.cropperRatio() === '1:1' ? 'primary' : 'default'\"\n (click)=\"ratioHandler('1:1')\"\n class=\"ax-crop-save ax-sm\"\n text=\"1:1\"\n></ax-button>\n<ax-button\n [selected]=\"this.service.cropperRatio() === '16:9' ? true : false\"\n [color]=\"this.service.cropperRatio() === '16:9' ? 'primary' : 'default'\"\n (click)=\"ratioHandler('16:9')\"\n class=\"ax-crop-save ax-sm\"\n text=\"16:9\"\n></ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
68
68
  }
69
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorCropComponent, decorators: [{
69
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorCropComponent, decorators: [{
70
70
  type: Component,
71
71
  args: [{ selector: 'ax-image-editor-crop', encapsulation: ViewEncapsulation.None, imports: [AXButtonComponent], template: "<ax-button (click)=\"cropButtonHandler()\" class=\"ax-crop-save ax-sm\" text=\"Crop\"></ax-button>\n\n<ax-button\n [selected]=\"this.service.cropperRatio() === '1:1' ? true : false\"\n [color]=\"this.service.cropperRatio() === '1:1' ? 'primary' : 'default'\"\n (click)=\"ratioHandler('1:1')\"\n class=\"ax-crop-save ax-sm\"\n text=\"1:1\"\n></ax-button>\n<ax-button\n [selected]=\"this.service.cropperRatio() === '16:9' ? true : false\"\n [color]=\"this.service.cropperRatio() === '16:9' ? 'primary' : 'default'\"\n (click)=\"ratioHandler('16:9')\"\n class=\"ax-crop-save ax-sm\"\n text=\"16:9\"\n></ax-button>\n" }]
72
72
  }] });
@@ -91,10 +91,10 @@ class AXImageEditorHighlightComponent {
91
91
  valueHandler(e) {
92
92
  this.service.highlightWidth.set(e);
93
93
  }
94
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorHighlightComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
95
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AXImageEditorHighlightComponent, isStandalone: true, selector: "ax-image-editor-highlight", ngImport: i0, template: "<ax-color-box\n [showValue]=\"false\"\n [showIcon]=\"false\"\n axTooltip=\"Highlight Color Picker\"\n axTooltipPlacement=\"top\"\n look=\"none\"\n [ngModel]=\"selectedColor()\"\n (ngModelChange)=\"changeColorHandler($event)\"\n>\n</ax-color-box>\n\n<ax-range-slider [min]=\"2\" [max]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-range-slider>\n", styles: ["ax-image-editor-highlight{display:flex}ax-image-editor-highlight ax-range-slider{padding:.5rem .75rem;width:10rem}ax-image-editor-highlight ax-range-slider .ax-range-slider .ax-range-slider-handler{width:1rem!important;height:1rem!important}\n"], dependencies: [{ kind: "component", type: AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
94
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorHighlightComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
95
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AXImageEditorHighlightComponent, isStandalone: true, selector: "ax-image-editor-highlight", ngImport: i0, template: "<ax-color-box\n [showValue]=\"false\"\n [showIcon]=\"false\"\n axTooltip=\"Highlight Color Picker\"\n axTooltipPlacement=\"top\"\n look=\"none\"\n [ngModel]=\"selectedColor()\"\n (ngModelChange)=\"changeColorHandler($event)\"\n>\n</ax-color-box>\n\n<ax-range-slider [min]=\"2\" [max]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-range-slider>\n", styles: ["ax-image-editor-highlight{display:flex}ax-image-editor-highlight ax-range-slider{padding:.5rem .75rem;width:10rem}ax-image-editor-highlight ax-range-slider .ax-range-slider .ax-range-slider-handler{width:1rem!important;height:1rem!important}\n"], dependencies: [{ kind: "component", type: AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
96
96
  }
97
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorHighlightComponent, decorators: [{
97
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorHighlightComponent, decorators: [{
98
98
  type: Component,
99
99
  args: [{ selector: 'ax-image-editor-highlight', encapsulation: ViewEncapsulation.None, imports: [AXColorBoxComponent, CommonModule, FormsModule, AXRangeSliderComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ax-color-box\n [showValue]=\"false\"\n [showIcon]=\"false\"\n axTooltip=\"Highlight Color Picker\"\n axTooltipPlacement=\"top\"\n look=\"none\"\n [ngModel]=\"selectedColor()\"\n (ngModelChange)=\"changeColorHandler($event)\"\n>\n</ax-color-box>\n\n<ax-range-slider [min]=\"2\" [max]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-range-slider>\n", styles: ["ax-image-editor-highlight{display:flex}ax-image-editor-highlight ax-range-slider{padding:.5rem .75rem;width:10rem}ax-image-editor-highlight ax-range-slider .ax-range-slider .ax-range-slider-handler{width:1rem!important;height:1rem!important}\n"] }]
100
100
  }] });
@@ -119,10 +119,10 @@ class AXImageEditorPenComponent {
119
119
  valueHandler(e) {
120
120
  this.service.penWidth.set(e);
121
121
  }
122
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorPenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
123
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AXImageEditorPenComponent, isStandalone: true, selector: "ax-image-editor-pen", ngImport: i0, template: "<ax-color-box\n [showValue]=\"false\"\n [showIcon]=\"false\"\n axTooltip=\"Pen Color Picker\"\n axTooltipPlacement=\"top\"\n look=\"none\"\n [ngModel]=\"selectedColor()\"\n (ngModelChange)=\"changeColorHandler($event)\"\n>\n</ax-color-box>\n\n<ax-range-slider [min]=\"2\" [max]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-range-slider>\n", styles: ["ax-image-editor-pen{display:flex}ax-image-editor-pen ax-range-slider{padding:.5rem .75rem;width:10rem}ax-image-editor-pen ax-range-slider .ax-range-slider .ax-range-slider-handler{width:1rem!important;height:1rem!important}\n"], dependencies: [{ kind: "component", type: AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
122
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorPenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
123
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AXImageEditorPenComponent, isStandalone: true, selector: "ax-image-editor-pen", ngImport: i0, template: "<ax-color-box\n [showValue]=\"false\"\n [showIcon]=\"false\"\n axTooltip=\"Pen Color Picker\"\n axTooltipPlacement=\"top\"\n look=\"none\"\n [ngModel]=\"selectedColor()\"\n (ngModelChange)=\"changeColorHandler($event)\"\n>\n</ax-color-box>\n\n<ax-range-slider [min]=\"2\" [max]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-range-slider>\n", styles: ["ax-image-editor-pen{display:flex}ax-image-editor-pen ax-range-slider{padding:.5rem .75rem;width:10rem}ax-image-editor-pen ax-range-slider .ax-range-slider .ax-range-slider-handler{width:1rem!important;height:1rem!important}\n"], dependencies: [{ kind: "component", type: AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
124
124
  }
125
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorPenComponent, decorators: [{
125
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorPenComponent, decorators: [{
126
126
  type: Component,
127
127
  args: [{ selector: 'ax-image-editor-pen', encapsulation: ViewEncapsulation.None, imports: [AXColorBoxComponent, CommonModule, FormsModule, AXRangeSliderComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ax-color-box\n [showValue]=\"false\"\n [showIcon]=\"false\"\n axTooltip=\"Pen Color Picker\"\n axTooltipPlacement=\"top\"\n look=\"none\"\n [ngModel]=\"selectedColor()\"\n (ngModelChange)=\"changeColorHandler($event)\"\n>\n</ax-color-box>\n\n<ax-range-slider [min]=\"2\" [max]=\"20\" [(ngModel)]=\"value\" (ngModelChange)=\"valueHandler($event)\"></ax-range-slider>\n", styles: ["ax-image-editor-pen{display:flex}ax-image-editor-pen ax-range-slider{padding:.5rem .75rem;width:10rem}ax-image-editor-pen ax-range-slider .ax-range-slider .ax-range-slider-handler{width:1rem!important;height:1rem!important}\n"] }]
128
128
  }] });
@@ -144,10 +144,10 @@ class AXImageEditorRotateComponent {
144
144
  rotateLeftHandler() {
145
145
  this.service.rotate.set({ state: -90, userInteract: true });
146
146
  }
147
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorRotateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
148
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AXImageEditorRotateComponent, isStandalone: true, selector: "ax-image-editor-rotate", ngImport: i0, template: "<ax-button axTooltip=\"Rotate Left\" axTooltipPlacement=\"top\" (click)=\"rotateLeftHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-arrow-turn-left\"></ax-icon>\n</ax-button>\n\n<ax-button axTooltip=\"Rotate Right\" axTooltipPlacement=\"top\" (click)=\"rotateRightHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-arrow-turn-right\"></ax-icon>\n</ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
147
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorRotateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
148
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AXImageEditorRotateComponent, isStandalone: true, selector: "ax-image-editor-rotate", ngImport: i0, template: "<ax-button axTooltip=\"Rotate Left\" axTooltipPlacement=\"top\" (click)=\"rotateLeftHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-arrow-turn-left\"></ax-icon>\n</ax-button>\n\n<ax-button axTooltip=\"Rotate Right\" axTooltipPlacement=\"top\" (click)=\"rotateRightHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-arrow-turn-right\"></ax-icon>\n</ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
149
149
  }
150
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorRotateComponent, decorators: [{
150
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorRotateComponent, decorators: [{
151
151
  type: Component,
152
152
  args: [{ selector: 'ax-image-editor-rotate', encapsulation: ViewEncapsulation.None, imports: [AXButtonComponent, AXTooltipDirective, AXDecoratorIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ax-button axTooltip=\"Rotate Left\" axTooltipPlacement=\"top\" (click)=\"rotateLeftHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-arrow-turn-left\"></ax-icon>\n</ax-button>\n\n<ax-button axTooltip=\"Rotate Right\" axTooltipPlacement=\"top\" (click)=\"rotateRightHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-arrow-turn-right\"></ax-icon>\n</ax-button>\n" }]
153
153
  }] });
@@ -170,10 +170,10 @@ class AXImageEditorToolSelectorComponent {
170
170
  this.service.penType.set(tool);
171
171
  }
172
172
  }
173
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorToolSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
174
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AXImageEditorToolSelectorComponent, isStandalone: true, selector: "ax-image-editor-tool-selector", ngImport: i0, template: "<ax-button\n axTooltip=\"pen\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('pen')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'pen' ? true : false\"\n [color]=\"this.service.activeToolState() === 'pen' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-pen\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"highlight\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('highlight')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'highlight' ? true : false\"\n [color]=\"this.service.activeToolState() === 'highlight' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"crop\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('crop')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'crop' ? true : false\"\n [color]=\"this.service.activeToolState() === 'crop' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-crop\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"rotate\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('rotate')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'rotate' ? true : false\"\n [color]=\"this.service.activeToolState() === 'rotate' ? 'primary' : 'default'\"\n>\n <i class=\"fa-solid fa-rotate\"></i>\n</ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], encapsulation: i0.ViewEncapsulation.None }); }
173
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorToolSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
174
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AXImageEditorToolSelectorComponent, isStandalone: true, selector: "ax-image-editor-tool-selector", ngImport: i0, template: "<ax-button\n axTooltip=\"pen\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('pen')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'pen' ? true : false\"\n [color]=\"this.service.activeToolState() === 'pen' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-pen\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"highlight\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('highlight')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'highlight' ? true : false\"\n [color]=\"this.service.activeToolState() === 'highlight' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"crop\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('crop')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'crop' ? true : false\"\n [color]=\"this.service.activeToolState() === 'crop' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-crop\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"rotate\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('rotate')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'rotate' ? true : false\"\n [color]=\"this.service.activeToolState() === 'rotate' ? 'primary' : 'default'\"\n>\n <i class=\"fa-solid fa-rotate\"></i>\n</ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], encapsulation: i0.ViewEncapsulation.None }); }
175
175
  }
176
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorToolSelectorComponent, decorators: [{
176
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorToolSelectorComponent, decorators: [{
177
177
  type: Component,
178
178
  args: [{ selector: 'ax-image-editor-tool-selector', encapsulation: ViewEncapsulation.None, imports: [AXButtonComponent, AXDecoratorModule, AXTooltipDirective], template: "<ax-button\n axTooltip=\"pen\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('pen')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'pen' ? true : false\"\n [color]=\"this.service.activeToolState() === 'pen' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-pen\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"highlight\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('highlight')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'highlight' ? true : false\"\n [color]=\"this.service.activeToolState() === 'highlight' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-highlight\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"crop\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('crop')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'crop' ? true : false\"\n [color]=\"this.service.activeToolState() === 'crop' ? 'primary' : 'default'\"\n>\n <ax-icon class=\"ax-icon ax-icon-crop\"></ax-icon>\n</ax-button>\n\n<ax-button\n axTooltip=\"rotate\"\n axTooltipPlacement=\"top\"\n (onClick)=\"changeToolHandler('rotate')\"\n look=\"blank\"\n [selected]=\"this.service.activeToolState() === 'rotate' ? true : false\"\n [color]=\"this.service.activeToolState() === 'rotate' ? 'primary' : 'default'\"\n>\n <i class=\"fa-solid fa-rotate\"></i>\n</ax-button>\n" }]
179
179
  }] });
@@ -404,10 +404,10 @@ class AXImageEditorCropperWindowComponent {
404
404
  }
405
405
  this.selectedHandle.set(null);
406
406
  }
407
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorCropperWindowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
408
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXImageEditorCropperWindowComponent, isStandalone: true, selector: "ax-image-editor-cropper-window", inputs: { showGrid: { classPropertyName: "showGrid", publicName: "showGrid", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "cropperWindow", first: true, predicate: ["r"], descendants: true, isSignal: true }], ngImport: i0, template: "<div [ngStyle]=\"!showGrid() && { border: '1px dashed white' }\" #r class=\"ax-image-cropper-window-container\">\n @if (!this.service.cropperRatio()) {\n <div (pointerdown)=\"handleSelector($event, 'right')\" class=\"ax-image-right-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'top')\" class=\"ax-image-top-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'left')\" class=\"ax-image-left-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'bottom')\" class=\"ax-image-bottom-handle ax-handle-shape\"></div>\n }\n\n <div (pointerdown)=\"handleSelector($event, 'right-top')\" class=\"ax-image-right-top-handle ax-handle-shape\"></div>\n <div\n (pointerdown)=\"handleSelector($event, 'bottom-right')\"\n class=\"ax-image-bottom-right-handle ax-handle-shape\"\n ></div>\n <div (pointerdown)=\"handleSelector($event, 'bottom-left')\" class=\"ax-image-bottom-left-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'left-top')\" class=\"ax-image-left-top-handle ax-handle-shape\"></div>\n\n @if (showGrid()) {\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n }\n</div>\n", styles: ["ax-image-editor-cropper-window{position:absolute;top:45%;left:45%;-webkit-user-select:none;user-select:none;touch-action:none}ax-image-editor-cropper-window .ax-image-cropper-window-container{position:relative;height:100%;cursor:move;outline:rgba(0,0,0,.7) solid 100vmax;display:grid;grid-template-columns:repeat(3,1fr)}ax-image-editor-cropper-window .ax-image-cropper-window-container .ax-grid-item{border:1px dashed rgba(255,255,255,.5)}ax-image-editor-cropper-window .ax-handle-shape{width:1rem;height:1rem;border:1px dashed white;background-color:gray;position:absolute;-webkit-user-select:none;user-select:none}ax-image-editor-cropper-window .ax-image-right-top-handle{top:-.5rem;right:-.5rem;cursor:ne-resize}ax-image-editor-cropper-window .ax-image-bottom-right-handle{bottom:-.5rem;right:-.5rem;cursor:se-resize}ax-image-editor-cropper-window .ax-image-right-handle{right:-.5rem;top:calc(50% - .5rem);cursor:e-resize}ax-image-editor-cropper-window .ax-image-bottom-left-handle{bottom:-.5rem;left:-.5rem;cursor:sw-resize}ax-image-editor-cropper-window .ax-image-left-top-handle{top:-.5rem;left:-.5rem;cursor:nw-resize}ax-image-editor-cropper-window .ax-image-bottom-handle{bottom:-.5rem;right:calc(50% - .5rem);cursor:s-resize}ax-image-editor-cropper-window .ax-image-left-handle{left:-.5rem;top:calc(50% - .5rem);cursor:w-resize}ax-image-editor-cropper-window .ax-image-top-handle{top:-.5rem;right:calc(50% - .5rem);cursor:n-resize}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
407
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorCropperWindowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
408
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXImageEditorCropperWindowComponent, isStandalone: true, selector: "ax-image-editor-cropper-window", inputs: { showGrid: { classPropertyName: "showGrid", publicName: "showGrid", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "cropperWindow", first: true, predicate: ["r"], descendants: true, isSignal: true }], ngImport: i0, template: "<div [ngStyle]=\"!showGrid() && { border: '1px dashed white' }\" #r class=\"ax-image-cropper-window-container\">\n @if (!this.service.cropperRatio()) {\n <div (pointerdown)=\"handleSelector($event, 'right')\" class=\"ax-image-right-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'top')\" class=\"ax-image-top-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'left')\" class=\"ax-image-left-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'bottom')\" class=\"ax-image-bottom-handle ax-handle-shape\"></div>\n }\n\n <div (pointerdown)=\"handleSelector($event, 'right-top')\" class=\"ax-image-right-top-handle ax-handle-shape\"></div>\n <div\n (pointerdown)=\"handleSelector($event, 'bottom-right')\"\n class=\"ax-image-bottom-right-handle ax-handle-shape\"\n ></div>\n <div (pointerdown)=\"handleSelector($event, 'bottom-left')\" class=\"ax-image-bottom-left-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'left-top')\" class=\"ax-image-left-top-handle ax-handle-shape\"></div>\n\n @if (showGrid()) {\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n }\n</div>\n", styles: ["ax-image-editor-cropper-window{position:absolute;top:45%;left:45%;-webkit-user-select:none;user-select:none;touch-action:none}ax-image-editor-cropper-window .ax-image-cropper-window-container{position:relative;height:100%;cursor:move;outline:rgba(0,0,0,.7) solid 100vmax;display:grid;grid-template-columns:repeat(3,1fr)}ax-image-editor-cropper-window .ax-image-cropper-window-container .ax-grid-item{border:1px dashed rgba(255,255,255,.5)}ax-image-editor-cropper-window .ax-handle-shape{width:1rem;height:1rem;border:1px dashed white;background-color:gray;position:absolute;-webkit-user-select:none;user-select:none}ax-image-editor-cropper-window .ax-image-right-top-handle{top:-.5rem;right:-.5rem;cursor:ne-resize}ax-image-editor-cropper-window .ax-image-bottom-right-handle{bottom:-.5rem;right:-.5rem;cursor:se-resize}ax-image-editor-cropper-window .ax-image-right-handle{right:-.5rem;top:calc(50% - .5rem);cursor:e-resize}ax-image-editor-cropper-window .ax-image-bottom-left-handle{bottom:-.5rem;left:-.5rem;cursor:sw-resize}ax-image-editor-cropper-window .ax-image-left-top-handle{top:-.5rem;left:-.5rem;cursor:nw-resize}ax-image-editor-cropper-window .ax-image-bottom-handle{bottom:-.5rem;right:calc(50% - .5rem);cursor:s-resize}ax-image-editor-cropper-window .ax-image-left-handle{left:-.5rem;top:calc(50% - .5rem);cursor:w-resize}ax-image-editor-cropper-window .ax-image-top-handle{top:-.5rem;right:calc(50% - .5rem);cursor:n-resize}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
409
409
  }
410
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorCropperWindowComponent, decorators: [{
410
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorCropperWindowComponent, decorators: [{
411
411
  type: Component,
412
412
  args: [{ selector: 'ax-image-editor-cropper-window', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule], template: "<div [ngStyle]=\"!showGrid() && { border: '1px dashed white' }\" #r class=\"ax-image-cropper-window-container\">\n @if (!this.service.cropperRatio()) {\n <div (pointerdown)=\"handleSelector($event, 'right')\" class=\"ax-image-right-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'top')\" class=\"ax-image-top-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'left')\" class=\"ax-image-left-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'bottom')\" class=\"ax-image-bottom-handle ax-handle-shape\"></div>\n }\n\n <div (pointerdown)=\"handleSelector($event, 'right-top')\" class=\"ax-image-right-top-handle ax-handle-shape\"></div>\n <div\n (pointerdown)=\"handleSelector($event, 'bottom-right')\"\n class=\"ax-image-bottom-right-handle ax-handle-shape\"\n ></div>\n <div (pointerdown)=\"handleSelector($event, 'bottom-left')\" class=\"ax-image-bottom-left-handle ax-handle-shape\"></div>\n <div (pointerdown)=\"handleSelector($event, 'left-top')\" class=\"ax-image-left-top-handle ax-handle-shape\"></div>\n\n @if (showGrid()) {\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n <div class=\"ax-grid-item\"></div>\n }\n</div>\n", styles: ["ax-image-editor-cropper-window{position:absolute;top:45%;left:45%;-webkit-user-select:none;user-select:none;touch-action:none}ax-image-editor-cropper-window .ax-image-cropper-window-container{position:relative;height:100%;cursor:move;outline:rgba(0,0,0,.7) solid 100vmax;display:grid;grid-template-columns:repeat(3,1fr)}ax-image-editor-cropper-window .ax-image-cropper-window-container .ax-grid-item{border:1px dashed rgba(255,255,255,.5)}ax-image-editor-cropper-window .ax-handle-shape{width:1rem;height:1rem;border:1px dashed white;background-color:gray;position:absolute;-webkit-user-select:none;user-select:none}ax-image-editor-cropper-window .ax-image-right-top-handle{top:-.5rem;right:-.5rem;cursor:ne-resize}ax-image-editor-cropper-window .ax-image-bottom-right-handle{bottom:-.5rem;right:-.5rem;cursor:se-resize}ax-image-editor-cropper-window .ax-image-right-handle{right:-.5rem;top:calc(50% - .5rem);cursor:e-resize}ax-image-editor-cropper-window .ax-image-bottom-left-handle{bottom:-.5rem;left:-.5rem;cursor:sw-resize}ax-image-editor-cropper-window .ax-image-left-top-handle{top:-.5rem;left:-.5rem;cursor:nw-resize}ax-image-editor-cropper-window .ax-image-bottom-handle{bottom:-.5rem;right:calc(50% - .5rem);cursor:s-resize}ax-image-editor-cropper-window .ax-image-left-handle{left:-.5rem;top:calc(50% - .5rem);cursor:w-resize}ax-image-editor-cropper-window .ax-image-top-handle{top:-.5rem;right:calc(50% - .5rem);cursor:n-resize}\n"] }]
413
413
  }] });
@@ -635,10 +635,10 @@ class AXImageEditorViewComponent extends MXBaseComponent {
635
635
  get __hostStyle() {
636
636
  return `width: ${this.service.initialImage()?.width}px; height: ${this.service.initialImage()?.height}px`;
637
637
  }
638
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
639
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXImageEditorViewComponent, isStandalone: true, selector: "ax-image-editor-view", inputs: { showGrid: { classPropertyName: "showGrid", publicName: "showGrid", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "this.__hostStyle" } }, viewQueries: [{ propertyName: "canvasElem", first: true, predicate: ["canvasElem"], descendants: true, isSignal: true }, { propertyName: "cropperWindow", first: true, predicate: ["f"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<canvas\n tabindex=\"1\"\n (pointerdown)=\"mouseDownHandler($event)\"\n (pointerup)=\"mouseUpHandler()\"\n (pointermove)=\"mouseMoveHandler($event)\"\n class=\"ax-canvas-element\"\n #canvasElem\n></canvas>\n\n@if (this.service.activeToolState() === 'crop') {\n <ax-image-editor-cropper-window [showGrid]=\"showGrid()\" #f></ax-image-editor-cropper-window>\n}\n", styles: ["ax-image-editor-view{position:relative;display:flex;justify-content:center;align-items:center;background-color:#fff;width:100%;touch-action:none;overflow:hidden}ax-image-editor-view .ax-canvas-element{cursor:crosshair}ax-image-editor-view .ax-crop-save{position:absolute;top:0;right:0;margin:1rem}\n"], dependencies: [{ kind: "component", type: AXImageEditorCropperWindowComponent, selector: "ax-image-editor-cropper-window", inputs: ["showGrid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
638
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
639
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXImageEditorViewComponent, isStandalone: true, selector: "ax-image-editor-view", inputs: { showGrid: { classPropertyName: "showGrid", publicName: "showGrid", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "this.__hostStyle" } }, viewQueries: [{ propertyName: "canvasElem", first: true, predicate: ["canvasElem"], descendants: true, isSignal: true }, { propertyName: "cropperWindow", first: true, predicate: ["f"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<canvas\n tabindex=\"1\"\n (pointerdown)=\"mouseDownHandler($event)\"\n (pointerup)=\"mouseUpHandler()\"\n (pointermove)=\"mouseMoveHandler($event)\"\n class=\"ax-canvas-element\"\n #canvasElem\n></canvas>\n\n@if (this.service.activeToolState() === 'crop') {\n <ax-image-editor-cropper-window [showGrid]=\"showGrid()\" #f></ax-image-editor-cropper-window>\n}\n", styles: ["ax-image-editor-view{position:relative;display:flex;justify-content:center;align-items:center;background-color:#fff;width:100%;touch-action:none;overflow:hidden}ax-image-editor-view .ax-canvas-element{cursor:crosshair}ax-image-editor-view .ax-crop-save{position:absolute;top:0;right:0;margin:1rem}\n"], dependencies: [{ kind: "component", type: AXImageEditorCropperWindowComponent, selector: "ax-image-editor-cropper-window", inputs: ["showGrid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
640
640
  }
641
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorViewComponent, decorators: [{
641
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorViewComponent, decorators: [{
642
642
  type: Component,
643
643
  args: [{ selector: 'ax-image-editor-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXImageEditorCropperWindowComponent], template: "<canvas\n tabindex=\"1\"\n (pointerdown)=\"mouseDownHandler($event)\"\n (pointerup)=\"mouseUpHandler()\"\n (pointermove)=\"mouseMoveHandler($event)\"\n class=\"ax-canvas-element\"\n #canvasElem\n></canvas>\n\n@if (this.service.activeToolState() === 'crop') {\n <ax-image-editor-cropper-window [showGrid]=\"showGrid()\" #f></ax-image-editor-cropper-window>\n}\n", styles: ["ax-image-editor-view{position:relative;display:flex;justify-content:center;align-items:center;background-color:#fff;width:100%;touch-action:none;overflow:hidden}ax-image-editor-view .ax-canvas-element{cursor:crosshair}ax-image-editor-view .ax-crop-save{position:absolute;top:0;right:0;margin:1rem}\n"] }]
644
644
  }], ctorParameters: () => [], propDecorators: { __hostStyle: [{
@@ -669,8 +669,13 @@ class AXImageEditorContainerComponent extends classes((MXInputBaseValueComponent
669
669
  cropButtonHandler() {
670
670
  this.view().cropButtonHandler();
671
671
  }
672
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
673
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXImageEditorContainerComponent, isStandalone: true, selector: "ax-image-editor-container", inputs: { look: "look" }, outputs: { onValueChanged: "onValueChanged" }, providers: [
672
+ get __hostClass() {
673
+ if (this.disabled)
674
+ return 'ax-state-disabled';
675
+ return '';
676
+ }
677
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
678
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXImageEditorContainerComponent, isStandalone: true, selector: "ax-image-editor-container", inputs: { look: "look", disabled: "disabled" }, outputs: { onValueChanged: "onValueChanged" }, host: { properties: { "class": "this.__hostClass" } }, providers: [
674
679
  AXImageEditorService,
675
680
  { provide: AXComponent, useExisting: AXImageEditorContainerComponent },
676
681
  { provide: AXFocusableComponent, useExisting: AXImageEditorContainerComponent },
@@ -681,11 +686,11 @@ class AXImageEditorContainerComponent extends classes((MXInputBaseValueComponent
681
686
  useExisting: forwardRef(() => AXImageEditorContainerComponent),
682
687
  multi: true,
683
688
  },
684
- ], queries: [{ propertyName: "view", first: true, predicate: AXImageEditorViewComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "imageEditorContainer", first: true, predicate: ["f"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (service.isImageLoad()) {\n <div #f class=\"ax-editor-container ax-{{ look }}\">\n <ng-content select=\"ax-header\"></ng-content>\n\n <ng-content select=\"ax-image-editor-view\"> </ng-content>\n\n @if (service.activeToolState()) {\n <ax-toolbar class=\"ax-secondary-toolbar\">\n <ax-prefix>\n @switch (service.activeToolState()) {\n @case ('pen') {\n <ax-image-editor-pen></ax-image-editor-pen>\n }\n @case ('crop') {\n <ax-image-editor-crop (cropPressed)=\"cropButtonHandler()\"></ax-image-editor-crop>\n }\n @case ('highlight') {\n <ax-image-editor-highlight></ax-image-editor-highlight>\n }\n @case ('rotate') {\n <ax-image-editor-rotate></ax-image-editor-rotate>\n }\n }\n </ax-prefix>\n </ax-toolbar>\n }\n\n <ax-toolbar class=\"ax-main-toolbar\">\n <ax-content>\n <ax-image-editor-tool-selector></ax-image-editor-tool-selector>\n </ax-content>\n </ax-toolbar>\n </div>\n <div class=\"ax-error-container\"></div>\n} @else {\n <div class=\"ax-loading-spinner-container\">\n <ax-loading-spinner [size]=\"16\" color=\"primary\" text=\"Loading Image ...\"></ax-loading-spinner>\n </div>\n}\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n", styles: ["ax-image-editor-container{width:fit-content;display:block}ax-image-editor-container>.ax-editor-container{display:block;height:auto!important;--ax-comp-editor-space-start-size: 0;--ax-comp-editor-space-end-size: 0}ax-image-editor-container .ax-loading-spinner-container{display:flex;justify-content:center;align-items:center}ax-image-editor-container .ax-main-toolbar{justify-content:center;padding:.2rem}ax-image-editor-container .ax-secondary-toolbar{padding:.2rem;border-bottom:1px solid rgba(var(--ax-sys-color-border-surface));justify-content:center}ax-image-editor-container ax-header{width:100%}ax-image-editor-container ax-header ax-toolbar{justify-content:space-between}ax-image-editor-container ax-header .ax-start-toolbar-divider{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXLoadingSpinnerComponent, selector: "ax-loading-spinner", inputs: ["text", "color", "size", "stroke"] }, { kind: "ngmodule", type: AXToolBarModule }, { kind: "component", type: i2.AXToolBarComponent, selector: "ax-toolbar" }, { kind: "component", type: AXImageEditorCropComponent, selector: "ax-image-editor-crop", outputs: ["cropPressed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: AXImageEditorToolSelectorComponent, selector: "ax-image-editor-tool-selector" }, { kind: "component", type: AXImageEditorPenComponent, selector: "ax-image-editor-pen" }, { kind: "component", type: AXImageEditorHighlightComponent, selector: "ax-image-editor-highlight" }, { kind: "component", type: AXImageEditorRotateComponent, selector: "ax-image-editor-rotate" }], encapsulation: i0.ViewEncapsulation.None }); }
689
+ ], queries: [{ propertyName: "view", first: true, predicate: AXImageEditorViewComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "imageEditorContainer", first: true, predicate: ["f"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (service.isImageLoad()) {\n <div #f class=\"ax-editor-container ax-{{ look }}\">\n <ng-content select=\"ax-header\"></ng-content>\n\n <ng-content select=\"ax-image-editor-view\"> </ng-content>\n\n @if (service.activeToolState()) {\n <ax-toolbar class=\"ax-secondary-toolbar\">\n <ax-prefix>\n @switch (service.activeToolState()) {\n @case ('pen') {\n <ax-image-editor-pen></ax-image-editor-pen>\n }\n @case ('crop') {\n <ax-image-editor-crop (cropPressed)=\"cropButtonHandler()\"></ax-image-editor-crop>\n }\n @case ('highlight') {\n <ax-image-editor-highlight></ax-image-editor-highlight>\n }\n @case ('rotate') {\n <ax-image-editor-rotate></ax-image-editor-rotate>\n }\n }\n </ax-prefix>\n </ax-toolbar>\n }\n\n <ax-toolbar class=\"ax-main-toolbar\">\n <ax-content>\n <ax-image-editor-tool-selector></ax-image-editor-tool-selector>\n </ax-content>\n </ax-toolbar>\n </div>\n <div class=\"ax-error-container\"></div>\n} @else {\n <div class=\"ax-loading-spinner-container\">\n <ax-loading-spinner [size]=\"16\" color=\"primary\" text=\"Loading Image ...\"></ax-loading-spinner>\n </div>\n}\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n\n@if (disabled) {\n <div class=\"ax-disable-overlay\"></div>\n}\n", styles: ["ax-image-editor-container{width:fit-content;display:block;position:relative}ax-image-editor-container.ax-state-disabled{opacity:.5}ax-image-editor-container .ax-disable-overlay{position:absolute;top:0;left:0;width:100%;height:100%;cursor:not-allowed}ax-image-editor-container>.ax-editor-container{display:block;height:auto!important;--ax-comp-editor-space-start-size: 0;--ax-comp-editor-space-end-size: 0}ax-image-editor-container .ax-loading-spinner-container{display:flex;justify-content:center;align-items:center}ax-image-editor-container .ax-main-toolbar{justify-content:center;padding:.2rem}ax-image-editor-container .ax-secondary-toolbar{padding:.2rem;border-bottom:1px solid rgba(var(--ax-sys-color-border-surface));justify-content:center}ax-image-editor-container ax-header{width:100%}ax-image-editor-container ax-header ax-toolbar{justify-content:space-between}ax-image-editor-container ax-header .ax-start-toolbar-divider{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXLoadingSpinnerComponent, selector: "ax-loading-spinner", inputs: ["text", "color", "size", "stroke"] }, { kind: "ngmodule", type: AXToolBarModule }, { kind: "component", type: i2.AXToolBarComponent, selector: "ax-toolbar" }, { kind: "component", type: AXImageEditorCropComponent, selector: "ax-image-editor-crop", outputs: ["cropPressed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: AXImageEditorToolSelectorComponent, selector: "ax-image-editor-tool-selector" }, { kind: "component", type: AXImageEditorPenComponent, selector: "ax-image-editor-pen" }, { kind: "component", type: AXImageEditorHighlightComponent, selector: "ax-image-editor-highlight" }, { kind: "component", type: AXImageEditorRotateComponent, selector: "ax-image-editor-rotate" }], encapsulation: i0.ViewEncapsulation.None }); }
685
690
  }
686
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorContainerComponent, decorators: [{
691
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorContainerComponent, decorators: [{
687
692
  type: Component,
688
- args: [{ selector: 'ax-image-editor-container', encapsulation: ViewEncapsulation.None, outputs: ['onValueChanged'], inputs: ['look'], providers: [
693
+ args: [{ selector: 'ax-image-editor-container', encapsulation: ViewEncapsulation.None, outputs: ['onValueChanged'], inputs: ['look', 'disabled'], providers: [
689
694
  AXImageEditorService,
690
695
  { provide: AXComponent, useExisting: AXImageEditorContainerComponent },
691
696
  { provide: AXFocusableComponent, useExisting: AXImageEditorContainerComponent },
@@ -707,8 +712,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
707
712
  AXImageEditorPenComponent,
708
713
  AXImageEditorHighlightComponent,
709
714
  AXImageEditorRotateComponent,
710
- ], template: "@if (service.isImageLoad()) {\n <div #f class=\"ax-editor-container ax-{{ look }}\">\n <ng-content select=\"ax-header\"></ng-content>\n\n <ng-content select=\"ax-image-editor-view\"> </ng-content>\n\n @if (service.activeToolState()) {\n <ax-toolbar class=\"ax-secondary-toolbar\">\n <ax-prefix>\n @switch (service.activeToolState()) {\n @case ('pen') {\n <ax-image-editor-pen></ax-image-editor-pen>\n }\n @case ('crop') {\n <ax-image-editor-crop (cropPressed)=\"cropButtonHandler()\"></ax-image-editor-crop>\n }\n @case ('highlight') {\n <ax-image-editor-highlight></ax-image-editor-highlight>\n }\n @case ('rotate') {\n <ax-image-editor-rotate></ax-image-editor-rotate>\n }\n }\n </ax-prefix>\n </ax-toolbar>\n }\n\n <ax-toolbar class=\"ax-main-toolbar\">\n <ax-content>\n <ax-image-editor-tool-selector></ax-image-editor-tool-selector>\n </ax-content>\n </ax-toolbar>\n </div>\n <div class=\"ax-error-container\"></div>\n} @else {\n <div class=\"ax-loading-spinner-container\">\n <ax-loading-spinner [size]=\"16\" color=\"primary\" text=\"Loading Image ...\"></ax-loading-spinner>\n </div>\n}\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n", styles: ["ax-image-editor-container{width:fit-content;display:block}ax-image-editor-container>.ax-editor-container{display:block;height:auto!important;--ax-comp-editor-space-start-size: 0;--ax-comp-editor-space-end-size: 0}ax-image-editor-container .ax-loading-spinner-container{display:flex;justify-content:center;align-items:center}ax-image-editor-container .ax-main-toolbar{justify-content:center;padding:.2rem}ax-image-editor-container .ax-secondary-toolbar{padding:.2rem;border-bottom:1px solid rgba(var(--ax-sys-color-border-surface));justify-content:center}ax-image-editor-container ax-header{width:100%}ax-image-editor-container ax-header ax-toolbar{justify-content:space-between}ax-image-editor-container ax-header .ax-start-toolbar-divider{display:none}\n"] }]
711
- }] });
715
+ ], template: "@if (service.isImageLoad()) {\n <div #f class=\"ax-editor-container ax-{{ look }}\">\n <ng-content select=\"ax-header\"></ng-content>\n\n <ng-content select=\"ax-image-editor-view\"> </ng-content>\n\n @if (service.activeToolState()) {\n <ax-toolbar class=\"ax-secondary-toolbar\">\n <ax-prefix>\n @switch (service.activeToolState()) {\n @case ('pen') {\n <ax-image-editor-pen></ax-image-editor-pen>\n }\n @case ('crop') {\n <ax-image-editor-crop (cropPressed)=\"cropButtonHandler()\"></ax-image-editor-crop>\n }\n @case ('highlight') {\n <ax-image-editor-highlight></ax-image-editor-highlight>\n }\n @case ('rotate') {\n <ax-image-editor-rotate></ax-image-editor-rotate>\n }\n }\n </ax-prefix>\n </ax-toolbar>\n }\n\n <ax-toolbar class=\"ax-main-toolbar\">\n <ax-content>\n <ax-image-editor-tool-selector></ax-image-editor-tool-selector>\n </ax-content>\n </ax-toolbar>\n </div>\n <div class=\"ax-error-container\"></div>\n} @else {\n <div class=\"ax-loading-spinner-container\">\n <ax-loading-spinner [size]=\"16\" color=\"primary\" text=\"Loading Image ...\"></ax-loading-spinner>\n </div>\n}\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n\n@if (disabled) {\n <div class=\"ax-disable-overlay\"></div>\n}\n", styles: ["ax-image-editor-container{width:fit-content;display:block;position:relative}ax-image-editor-container.ax-state-disabled{opacity:.5}ax-image-editor-container .ax-disable-overlay{position:absolute;top:0;left:0;width:100%;height:100%;cursor:not-allowed}ax-image-editor-container>.ax-editor-container{display:block;height:auto!important;--ax-comp-editor-space-start-size: 0;--ax-comp-editor-space-end-size: 0}ax-image-editor-container .ax-loading-spinner-container{display:flex;justify-content:center;align-items:center}ax-image-editor-container .ax-main-toolbar{justify-content:center;padding:.2rem}ax-image-editor-container .ax-secondary-toolbar{padding:.2rem;border-bottom:1px solid rgba(var(--ax-sys-color-border-surface));justify-content:center}ax-image-editor-container ax-header{width:100%}ax-image-editor-container ax-header ax-toolbar{justify-content:space-between}ax-image-editor-container ax-header .ax-start-toolbar-divider{display:none}\n"] }]
716
+ }], propDecorators: { __hostClass: [{
717
+ type: HostBinding,
718
+ args: ['class']
719
+ }] } });
712
720
 
713
721
  /**
714
722
  * paint mode.
@@ -724,10 +732,10 @@ class AXImageEditorHistoryComponent {
724
732
  RedoHandler() {
725
733
  this.service.redoPressed.set(true);
726
734
  }
727
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
728
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AXImageEditorHistoryComponent, isStandalone: true, selector: "ax-image-editor-history", ngImport: i0, template: "<ax-button axTooltip=\"Undo\" axTooltipPlacement=\"top\" (onClick)=\"UndoHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n</ax-button>\n\n<ax-button axTooltip=\"Redo\" axTooltipPlacement=\"top\" (onClick)=\"RedoHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-redo\"></ax-icon>\n</ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
735
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
736
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AXImageEditorHistoryComponent, isStandalone: true, selector: "ax-image-editor-history", ngImport: i0, template: "<ax-button axTooltip=\"Undo\" axTooltipPlacement=\"top\" (onClick)=\"UndoHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n</ax-button>\n\n<ax-button axTooltip=\"Redo\" axTooltipPlacement=\"top\" (onClick)=\"RedoHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-redo\"></ax-icon>\n</ax-button>\n", dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
729
737
  }
730
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorHistoryComponent, decorators: [{
738
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorHistoryComponent, decorators: [{
731
739
  type: Component,
732
740
  args: [{ selector: 'ax-image-editor-history', encapsulation: ViewEncapsulation.None, imports: [AXButtonComponent, AXDecoratorModule, AXTooltipDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ax-button axTooltip=\"Undo\" axTooltipPlacement=\"top\" (onClick)=\"UndoHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-undo\"></ax-icon>\n</ax-button>\n\n<ax-button axTooltip=\"Redo\" axTooltipPlacement=\"top\" (onClick)=\"RedoHandler()\" look=\"blank\">\n <ax-icon class=\"ax-icon ax-icon-redo\"></ax-icon>\n</ax-button>\n" }]
733
741
  }] });
@@ -756,8 +764,8 @@ const MODULES = [
756
764
  AXTooltipModule,
757
765
  ];
758
766
  class AXImageEditorModule {
759
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
760
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorModule, imports: [AXButtonModule,
767
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
768
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorModule, imports: [AXButtonModule,
761
769
  FormsModule,
762
770
  AXRangeSliderModule,
763
771
  AXSelectBoxModule,
@@ -783,9 +791,9 @@ class AXImageEditorModule {
783
791
  AXImageEditorHighlightComponent,
784
792
  AXImageEditorRotateComponent,
785
793
  AXImageEditorCropperWindowComponent] }); }
786
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorModule, imports: [MODULES, COMPONENT] }); }
794
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorModule, imports: [MODULES, COMPONENT] }); }
787
795
  }
788
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXImageEditorModule, decorators: [{
796
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXImageEditorModule, decorators: [{
789
797
  type: NgModule,
790
798
  args: [{
791
799
  imports: [...MODULES, ...COMPONENT],