@acorex/components 20.8.22 → 20.8.23

package/image-editor/index.d.ts

@@ -12,8 +12,9 @@ import * as i7 from '@acorex/components/decorators';
 import * as i8 from '@acorex/components/loading';
 import * as i9 from '@acorex/components/dialog';
 
+type AXImageEditorTool = 'pen' | 'highlight' | 'crop' | 'rotate';
 declare class AXImageEditorService {
-    activeToolState: _angular_core.WritableSignal<"pen" | "highlight" | "crop" | "rotate" | "history">;
+    activeToolState: _angular_core.WritableSignal<AXImageEditorTool>;
     penColor: _angular_core.WritableSignal<string | CanvasGradient | CanvasPattern>;
     highlightColor: _angular_core.WritableSignal<string | CanvasGradient | CanvasPattern>;
     penWidth: _angular_core.WritableSignal<number>;
@@ -30,6 +31,8 @@ declare class AXImageEditorService {
     undoPressed: _angular_core.WritableSignal<boolean>;
     redoPressed: _angular_core.WritableSignal<boolean>;
     cropperRatio: _angular_core.WritableSignal<string>;
+    toggleTool(tool: AXImageEditorTool): void;
+    activateTool(tool: AXImageEditorTool): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorService, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<AXImageEditorService>;
 }
@@ -165,41 +168,39 @@ declare class AXImageEditorContainerComponent extends AXImageEditorContainerComp
     protected service: AXImageEditorService;
     imageEditorContainer: _angular_core.Signal<ElementRef<any>>;
     view: _angular_core.Signal<AXImageEditorViewComponent>;
-    aspectRatio: _angular_core.InputSignal<string[]>;
-    protected cropButtonHandler(): void;
     get __hostClass(): string;
     private get __hostName();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorContainerComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorContainerComponent, "ax-image-editor-container", never, { "look": { "alias": "look"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; "isSignal": true; }; }, { "onValueChanged": "onValueChanged"; }, ["view"], ["ax-header", "ax-image-editor-view", "ax-validation-rule"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorContainerComponent, "ax-image-editor-container", never, { "look": { "alias": "look"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "onValueChanged": "onValueChanged"; }, ["view"], ["ax-header", "ax-image-editor-view", "ax-footer", "ax-validation-rule"], true, never>;
 }
 
 /**
- * paint mode.
+ * Base class for image editor tool trigger components.
  * @category Components
  */
-declare class AXImageEditorCropComponent {
+declare abstract class AXImageEditorToolComponent {
     protected service: AXImageEditorService;
-    cropPressed: _angular_core.OutputEmitterRef<void>;
+    abstract readonly tool: AXImageEditorTool;
+    setActive(): void;
+}
+
+/**
+ * Crop tool trigger for the image editor toolbar.
+ * @category Components
+ */
+declare class AXImageEditorCropComponent extends AXImageEditorToolComponent {
+    readonly tool = "crop";
     aspectRatio: _angular_core.InputSignal<string[]>;
-    protected cropButtonHandler(): void;
-    protected ratioHandler(r: '1:1' | '16:9' | string): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorCropComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorCropComponent, "ax-image-editor-crop", never, { "aspectRatio": { "alias": "aspectRatio"; "required": false; "isSignal": true; }; }, { "cropPressed": "cropPressed"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorCropComponent, "ax-image-editor-crop", never, { "aspectRatio": { "alias": "aspectRatio"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /**
- * paint mode.
+ * Highlight tool trigger for the image editor toolbar.
  * @category Components
  */
-declare class AXImageEditorHighlightComponent {
-    protected service: AXImageEditorService;
-    /** @ignore */
-    protected selectedColor: _angular_core.WritableSignal<string | CanvasGradient | CanvasPattern>;
-    /** @ignore */
-    protected value: number;
-    protected changeColorHandler(e: string): void;
-    /** @ignore */
-    protected valueHandler(e: number): void;
+declare class AXImageEditorHighlightComponent extends AXImageEditorToolComponent {
+    readonly tool = "highlight";
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorHighlightComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorHighlightComponent, "ax-image-editor-highlight", never, {}, {}, never, never, true, never>;
 }
@@ -217,52 +218,60 @@ declare class AXImageEditorHistoryComponent {
 }
 
 /**
- * paint mode.
+ * Pen tool trigger for the image editor toolbar.
  * @category Components
  */
-declare class AXImageEditorPenComponent {
-    protected service: AXImageEditorService;
-    /** @ignore */
-    protected value: number;
-    /** @ignore */
-    protected selectedColor: _angular_core.WritableSignal<string | CanvasGradient | CanvasPattern>;
-    protected changeColorHandler(e: string): void;
-    /** @ignore */
-    protected valueHandler(e: number): void;
+declare class AXImageEditorPenComponent extends AXImageEditorToolComponent {
+    readonly tool = "pen";
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorPenComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorPenComponent, "ax-image-editor-pen", never, {}, {}, never, never, true, never>;
 }
 
 /**
- * paint mode.
+ * Rotate tool trigger for the image editor toolbar.
  * @category Components
  */
-declare class AXImageEditorRotateComponent {
-    /** @ignore */
-    protected service: AXImageEditorService;
-    /** @ignore */
-    protected rotateRightHandler(): void;
-    /** @ignore */
-    protected rotateLeftHandler(): void;
+declare class AXImageEditorRotateComponent extends AXImageEditorToolComponent {
+    readonly tool = "rotate";
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorRotateComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorRotateComponent, "ax-image-editor-rotate", never, {}, {}, never, never, true, never>;
 }
 
 /**
- * paint mode.
+ * Toolbar layout for configurable image editor tools.
  * @category Components
  */
-declare class AXImageEditorToolSelectorComponent {
+declare class AXImageEditorToolsBarComponent {
+    #private;
     protected service: AXImageEditorService;
-    protected changeToolHandler(tool: 'pen' | 'highlight' | 'crop' | 'rotate'): void;
+    /**
+     * Tool component reference to activate on load.
+     */
+    active: _angular_core.InputSignal<AXImageEditorToolComponent>;
+    protected penTool: _angular_core.Signal<AXImageEditorPenComponent>;
+    protected highlightTool: _angular_core.Signal<AXImageEditorHighlightComponent>;
+    protected cropTool: _angular_core.Signal<AXImageEditorCropComponent>;
+    protected rotateTool: _angular_core.Signal<AXImageEditorRotateComponent>;
+    protected cropAspectRatio: _angular_core.Signal<string[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorToolsBarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorToolsBarComponent, "ax-image-editor-tools-bar", never, { "active": { "alias": "active"; "required": false; "isSignal": true; }; }, {}, ["penTool", "highlightTool", "cropTool", "rotateTool"], ["ax-image-editor-pen, ax-image-editor-highlight, ax-image-editor-crop, ax-image-editor-rotate"], true, never>;
+}
+
+/**
+ * Convenience wrapper that includes all image editor tools.
+ * @category Components
+ */
+declare class AXImageEditorToolSelectorComponent {
+    aspectRatio: _angular_core.InputSignal<string[]>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorToolSelectorComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorToolSelectorComponent, "ax-image-editor-tool-selector", never, {}, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXImageEditorToolSelectorComponent, "ax-image-editor-tool-selector", never, { "aspectRatio": { "alias": "aspectRatio"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class AXImageEditorModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXImageEditorModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<AXImageEditorModule, never, [typeof i1.AXButtonModule, typeof i2.FormsModule, typeof i3.AXRangeSliderModule, typeof i4.AXSelectBoxModule, typeof i5.AXColorBoxModule, typeof i6.AXPopoverModule, typeof i7.AXDecoratorModule, typeof i8.AXLoadingModule, typeof i9.AXDialogModule, typeof AXImageEditorViewComponent, typeof AXImageEditorContainerComponent, typeof AXImageEditorCropComponent, typeof AXImageEditorHistoryComponent, typeof AXImageEditorToolSelectorComponent, typeof AXImageEditorPenComponent, typeof AXImageEditorHighlightComponent, typeof AXImageEditorRotateComponent, typeof AXImageEditorCropperWindowComponent], [typeof AXImageEditorViewComponent, typeof AXImageEditorContainerComponent, typeof AXImageEditorCropComponent, typeof AXImageEditorHistoryComponent, typeof AXImageEditorToolSelectorComponent, typeof AXImageEditorPenComponent, typeof AXImageEditorHighlightComponent, typeof AXImageEditorRotateComponent, typeof AXImageEditorCropperWindowComponent]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<AXImageEditorModule, never, [typeof i1.AXButtonModule, typeof i2.FormsModule, typeof i3.AXRangeSliderModule, typeof i4.AXSelectBoxModule, typeof i5.AXColorBoxModule, typeof i6.AXPopoverModule, typeof i7.AXDecoratorModule, typeof i8.AXLoadingModule, typeof i9.AXDialogModule, typeof AXImageEditorViewComponent, typeof AXImageEditorContainerComponent, typeof AXImageEditorCropComponent, typeof AXImageEditorHistoryComponent, typeof AXImageEditorToolSelectorComponent, typeof AXImageEditorToolsBarComponent, typeof AXImageEditorPenComponent, typeof AXImageEditorHighlightComponent, typeof AXImageEditorRotateComponent, typeof AXImageEditorCropperWindowComponent], [typeof AXImageEditorViewComponent, typeof AXImageEditorContainerComponent, typeof AXImageEditorCropComponent, typeof AXImageEditorHistoryComponent, typeof AXImageEditorToolSelectorComponent, typeof AXImageEditorToolsBarComponent, typeof AXImageEditorPenComponent, typeof AXImageEditorHighlightComponent, typeof AXImageEditorRotateComponent, typeof AXImageEditorCropperWindowComponent]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<AXImageEditorModule>;
 }
 
-export { AXImageEditorContainerComponent, AXImageEditorCropComponent, AXImageEditorCropperWindowComponent, AXImageEditorHighlightComponent, AXImageEditorHistoryComponent, AXImageEditorModule, AXImageEditorPenComponent, AXImageEditorRotateComponent, AXImageEditorService, AXImageEditorToolSelectorComponent, AXImageEditorViewComponent };
+export { AXImageEditorContainerComponent, AXImageEditorCropComponent, AXImageEditorCropperWindowComponent, AXImageEditorHighlightComponent, AXImageEditorHistoryComponent, AXImageEditorModule, AXImageEditorPenComponent, AXImageEditorRotateComponent, AXImageEditorService, AXImageEditorToolComponent, AXImageEditorToolSelectorComponent, AXImageEditorToolsBarComponent, AXImageEditorViewComponent };
+export type { AXImageEditorTool };

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@acorex/components",
-  "version": "20.8.22",
+  "version": "20.8.23",
   "peerDependencies": {
-    "@acorex/core": "20.8.22",
-    "@acorex/cdk": "20.8.22",
+    "@acorex/core": "20.8.23",
+    "@acorex/cdk": "20.8.23",
     "polytype": ">=0.17.0",
     "angular-imask": ">=7.6.1",
     "gridstack": ">=12.0.0",
@@ -60,14 +60,14 @@
       "types": "./accordion/index.d.ts",
       "default": "./fesm2022/acorex-components-accordion.mjs"
     },
-    "./alert": {
-      "types": "./alert/index.d.ts",
-      "default": "./fesm2022/acorex-components-alert.mjs"
-    },
     "./action-sheet": {
       "types": "./action-sheet/index.d.ts",
       "default": "./fesm2022/acorex-components-action-sheet.mjs"
     },
+    "./alert": {
+      "types": "./alert/index.d.ts",
+      "default": "./fesm2022/acorex-components-alert.mjs"
+    },
     "./aspect-ratio": {
       "types": "./aspect-ratio/index.d.ts",
       "default": "./fesm2022/acorex-components-aspect-ratio.mjs"
@@ -260,14 +260,14 @@
       "types": "./loading/index.d.ts",
       "default": "./fesm2022/acorex-components-loading.mjs"
     },
-    "./loading-dialog": {
-      "types": "./loading-dialog/index.d.ts",
-      "default": "./fesm2022/acorex-components-loading-dialog.mjs"
-    },
     "./map": {
       "types": "./map/index.d.ts",
       "default": "./fesm2022/acorex-components-map.mjs"
     },
+    "./loading-dialog": {
+      "types": "./loading-dialog/index.d.ts",
+      "default": "./fesm2022/acorex-components-loading-dialog.mjs"
+    },
     "./media-viewer": {
       "types": "./media-viewer/index.d.ts",
       "default": "./fesm2022/acorex-components-media-viewer.mjs"
@@ -352,14 +352,14 @@
       "types": "./rail-navigation/index.d.ts",
       "default": "./fesm2022/acorex-components-rail-navigation.mjs"
     },
-    "./range-slider": {
-      "types": "./range-slider/index.d.ts",
-      "default": "./fesm2022/acorex-components-range-slider.mjs"
-    },
     "./rate-picker": {
       "types": "./rate-picker/index.d.ts",
       "default": "./fesm2022/acorex-components-rate-picker.mjs"
     },
+    "./range-slider": {
+      "types": "./range-slider/index.d.ts",
+      "default": "./fesm2022/acorex-components-range-slider.mjs"
+    },
     "./rest-api-generator": {
       "types": "./rest-api-generator/index.d.ts",
       "default": "./fesm2022/acorex-components-rest-api-generator.mjs"
@@ -412,14 +412,14 @@
       "types": "./skeleton/index.d.ts",
       "default": "./fesm2022/acorex-components-skeleton.mjs"
     },
-    "./slider": {
-      "types": "./slider/index.d.ts",
-      "default": "./fesm2022/acorex-components-slider.mjs"
-    },
     "./sliding-item": {
       "types": "./sliding-item/index.d.ts",
       "default": "./fesm2022/acorex-components-sliding-item.mjs"
     },
+    "./slider": {
+      "types": "./slider/index.d.ts",
+      "default": "./fesm2022/acorex-components-slider.mjs"
+    },
     "./step-wizard": {
       "types": "./step-wizard/index.d.ts",
       "default": "./fesm2022/acorex-components-step-wizard.mjs"
@@ -476,14 +476,14 @@
       "types": "./tree-view-legacy/index.d.ts",
       "default": "./fesm2022/acorex-components-tree-view-legacy.mjs"
     },
-    "./uploader": {
-      "types": "./uploader/index.d.ts",
-      "default": "./fesm2022/acorex-components-uploader.mjs"
-    },
     "./video-player": {
       "types": "./video-player/index.d.ts",
       "default": "./fesm2022/acorex-components-video-player.mjs"
     },
+    "./uploader": {
+      "types": "./uploader/index.d.ts",
+      "default": "./fesm2022/acorex-components-uploader.mjs"
+    },
     "./wysiwyg": {
       "types": "./wysiwyg/index.d.ts",
       "default": "./fesm2022/acorex-components-wysiwyg.mjs"