@acorex/components 20.2.21 → 21.0.0-next.10

package/drawer/README.md

@@ -1,3 +1,3 @@
-# @acorex/components/drawer
+# @acorex/components/drawer-2
 
-Secondary entry point of `@acorex/components`. It can be used by importing from `@acorex/components/drawer`.
+Secondary entry point of `@acorex/components`. It can be used by importing from `@acorex/components/drawer-2`.

package/drawer/index.d.ts

@@ -1,86 +1,61 @@
-import { MXBaseComponent } from '@acorex/cdk/common';
-import * as i0 from '@angular/core';
-import { AfterContentInit, DoCheck } from '@angular/core';
-import * as i1 from '@angular/common';
+import { MXBaseComponent, AXClickEvent } from '@acorex/cdk/common';
+import * as _angular_core from '@angular/core';
+import * as i1 from '@acorex/cdk/drawer';
+import { AXDrawerLocation, AXDrawerMode } from '@acorex/cdk/drawer';
 
 /**
  * A container component that organizes and positions drawer components.
  * @category component
  */
 declare class AXDrawerContainerComponent extends MXBaseComponent {
-    private service;
-    constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerContainerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerContainerComponent, "ax-drawer-container", never, {}, {}, never, ["ax-drawer", "ax-content"], true, never>;
+    #private;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXDrawerContainerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXDrawerContainerComponent, "ax-drawer-container", never, {}, {}, never, ["ax-drawer", "ax-content"], true, [{ directive: typeof i1.AXDrawerContainerDirective; inputs: {}; outputs: {}; }]>;
 }
 
-type AXDrawerMode = 'push' | 'overlay';
-type AXDrawerLocation = 'start' | 'end';
 /**
  * A component that represents a drawer with header and content sections.
  *
  * @category Components
  */
-declare class AXDrawerComponent extends MXBaseComponent implements AfterContentInit, DoCheck {
+declare class AXDrawerComponent extends MXBaseComponent {
     #private;
-    location: i0.ModelSignal<AXDrawerLocation>;
-    showBackdrop: i0.InputSignal<boolean>;
-    mode: i0.ModelSignal<AXDrawerMode>;
-    closeOthers: i0.InputSignal<boolean>;
-    collapsed: i0.ModelSignal<boolean>;
-    private backdropElement;
-    protected loaded: i0.WritableSignal<boolean>;
-    private service;
-    private _zone;
-    private document;
-    private platformID;
-    /**
+    readonly location: _angular_core.InputSignal<AXDrawerLocation>;
+    readonly showBackdrop: _angular_core.InputSignal<boolean>;
+    readonly mode: _angular_core.InputSignal<AXDrawerMode>;
+    readonly transition: _angular_core.InputSignal<number>;
+    readonly closeOnBackdropClick: _angular_core.InputSignal<boolean>;
+    readonly backdropClass: _angular_core.InputSignal<string>;
+    readonly collapsed: _angular_core.InputSignal<boolean>;
+    onBackdropClick: _angular_core.OutputEmitterRef<AXClickEvent>;
+    collapsedStateChanged: _angular_core.OutputEmitterRef<boolean>;
+    private drawerItem;
+    /**
+     * Toggles the drawer state between open and closed.
      *
-     *  @ignore
-     */
-    ngAfterContentInit(): void;
-    /**
-     *  @ignore
-     */
-    ngDoCheck(): void;
-    /**
-     *  @ignore
-     */
-    private _detectBoundingSize;
-    /**
-     * Toggles the collapsed state of the drawer.
+     * @returns void - No return value. The drawer state is toggled.
      */
     toggle(): void;
     /**
-     * Collapses the drawer.
-     * @ignore
+     * Closes the drawer.
+     *
+     * @returns void - No return value. The drawer is collapsed.
      */
     close(): void;
     /**
-     * Expands the drawer.
+     * Opens the drawer.
+     *
+     * @returns void - No return value. The drawer is expanded.
      */
     open(): void;
-    /**
-     *  @ignore
-     */
-    private _addBackdrop;
-    /**
-     *  @ignore
-     */
-    private _removeBackdrop;
-    /**
-     *  @ignore
-     */
-    private get __hostClass();
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerComponent, "ax-drawer", never, { "location": { "alias": "location"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "closeOthers": { "alias": "closeOthers"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; }, { "location": "locationChange"; "mode": "modeChange"; "collapsed": "collapsedChange"; }, never, ["ax-header", "ax-content"], true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXDrawerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXDrawerComponent, "ax-drawer", never, { "location": { "alias": "location"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "transition": { "alias": "transition"; "required": false; "isSignal": true; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; "isSignal": true; }; "backdropClass": { "alias": "backdropClass"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; }, { "onBackdropClick": "onBackdropClick"; "collapsedStateChanged": "collapsedStateChanged"; }, never, ["ax-header", "ax-content"], true, [{ directive: typeof i1.AXDrawerItemDirective; inputs: {}; outputs: {}; }]>;
 }
 
 declare class AXDrawerModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AXDrawerModule, never, [typeof i1.CommonModule, typeof AXDrawerComponent, typeof AXDrawerContainerComponent], [typeof AXDrawerComponent, typeof AXDrawerContainerComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<AXDrawerModule>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXDrawerModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<AXDrawerModule, never, [typeof AXDrawerComponent, typeof AXDrawerContainerComponent], [typeof AXDrawerComponent, typeof AXDrawerContainerComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<AXDrawerModule>;
 }
 
 export { AXDrawerComponent, AXDrawerContainerComponent, AXDrawerModule };
-export type { AXDrawerLocation, AXDrawerMode };

package/drawer-legacy/README.md

@@ -0,0 +1,3 @@
+# @acorex/components/drawer
+
+Secondary entry point of `@acorex/components`. It can be used by importing from `@acorex/components/drawer`.

package/drawer-legacy/index.d.ts

@@ -0,0 +1,86 @@
+import { MXBaseComponent } from '@acorex/cdk/common';
+import * as i0 from '@angular/core';
+import { AfterContentInit, DoCheck } from '@angular/core';
+import * as i1 from '@angular/common';
+
+/**
+ * A container component that organizes and positions drawer components.
+ * @category component
+ */
+declare class AXDrawerLegacyContainerComponent extends MXBaseComponent {
+    private service;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerLegacyContainerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerLegacyContainerComponent, "ax-drawer-legacy-container", never, {}, {}, never, ["ax-drawer", "ax-content"], true, never>;
+}
+
+type AXDrawerMode = 'push' | 'overlay';
+type AXDrawerLocation = 'start' | 'end';
+/**
+ * A component that represents a drawer with header and content sections.
+ *
+ * @category Components
+ */
+declare class AXDrawerLegacyComponent extends MXBaseComponent implements AfterContentInit, DoCheck {
+    #private;
+    location: i0.ModelSignal<AXDrawerLocation>;
+    showBackdrop: i0.InputSignal<boolean>;
+    mode: i0.ModelSignal<AXDrawerMode>;
+    closeOthers: i0.InputSignal<boolean>;
+    collapsed: i0.ModelSignal<boolean>;
+    private backdropElement;
+    protected loaded: i0.WritableSignal<boolean>;
+    private service;
+    private _zone;
+    private document;
+    private platformID;
+    /**
+     *
+     *  @ignore
+     */
+    ngAfterContentInit(): void;
+    /**
+     *  @ignore
+     */
+    ngDoCheck(): void;
+    /**
+     *  @ignore
+     */
+    private _detectBoundingSize;
+    /**
+     * Toggles the collapsed state of the drawer.
+     */
+    toggle(): void;
+    /**
+     * Collapses the drawer.
+     * @ignore
+     */
+    close(): void;
+    /**
+     * Expands the drawer.
+     */
+    open(): void;
+    /**
+     *  @ignore
+     */
+    private _addBackdrop;
+    /**
+     *  @ignore
+     */
+    private _removeBackdrop;
+    /**
+     *  @ignore
+     */
+    private get __hostClass();
+    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerLegacyComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerLegacyComponent, "ax-drawer-legacy", never, { "location": { "alias": "location"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "closeOthers": { "alias": "closeOthers"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; }, { "location": "locationChange"; "mode": "modeChange"; "collapsed": "collapsedChange"; }, never, ["ax-header", "ax-content"], true, never>;
+}
+
+declare class AXDrawerLegacyModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerLegacyModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AXDrawerLegacyModule, never, [typeof i1.CommonModule, typeof AXDrawerLegacyComponent, typeof AXDrawerLegacyContainerComponent], [typeof AXDrawerLegacyComponent, typeof AXDrawerLegacyContainerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AXDrawerLegacyModule>;
+}
+
+export { AXDrawerLegacyComponent, AXDrawerLegacyContainerComponent, AXDrawerLegacyModule };
+export type { AXDrawerLocation, AXDrawerMode };

package/fesm2022/acorex-components-color-palette.mjs

@@ -447,7 +447,7 @@ class AXColorPaletteInputComponent extends MXBaseComponent {
             },
             AXUnsubscriber,
             { provide: AXComponent, useExisting: AXColorPaletteInputComponent },
-        ], usesInheritance: true, ngImport: i0, template: "<div class=\"palette-inputs ax-sm\">\n  <div class=\"select-box-container\">\n    <ax-select-box\n      [dataSource]=\"['hex', 'rgba']\"\n      [(ngModel)]=\"_colorMode\"\n      (ngModelChange)=\"_handleChangeInputMode()\"\n      [disabled]=\"_parent.disabled\"\n    >\n    </ax-select-box>\n  </div>\n  @switch (_colorMode) {\n    @case ('hex') {\n      <div>\n        <ax-text-box\n          [ngModel]=\"_hex\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          [state]=\"isValid ? 'clear' : 'error'\"\n          (onValueChanged)=\"_handleHEXAValueChanged($event)\"\n          [mask-options]=\"_hexMaskOptions\"\n        >\n        </ax-text-box>\n      </div>\n    }\n    @case ('rgba') {\n      <div>\n        <ax-number-box\n          name=\"r\"\n          [minValue]=\"0\"\n          [maxValue]=\"255\"\n          [ngModel]=\"_rgba.r\"\n          [showSpinButtons]=\"false\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n      <div>\n        <ax-number-box\n          name=\"g\"\n          [minValue]=\"0\"\n          [maxValue]=\"255\"\n          [ngModel]=\"_rgba.g\"\n          [showSpinButtons]=\"false\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n      <div>\n        <ax-number-box\n          name=\"b\"\n          [minValue]=\"0\"\n          [maxValue]=\"255\"\n          [ngModel]=\"_rgba.b\"\n          [showSpinButtons]=\"false\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n      <div>\n        <ax-number-box\n          name=\"a\"\n          [minValue]=\"0\"\n          [maxValue]=\"1\"\n          [ngModel]=\"_rgba.a\"\n          [decimals]=\"2\"\n          [step]=\"0.1\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          [showSpinButtons]=\"false\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n    }\n  }\n</div>\n", styles: [".ax-bold{font-weight:700}\n"], dependencies: [{ kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { 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: 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"] }, { kind: "component", type: AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "type", "changeOnScroll", "allDigits", "thousandsSeparator", "padDecimalZeros", "step", "decimals", "decimalStep", "showSpinButtons", "minValue", "maxValue", "class"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<div class=\"palette-inputs ax-sm\">\n  <div class=\"select-box-container\">\n    <ax-select-box\n      [dataSource]=\"['hex', 'rgba']\"\n      [(ngModel)]=\"_colorMode\"\n      (ngModelChange)=\"_handleChangeInputMode()\"\n      [disabled]=\"_parent.disabled\"\n    >\n    </ax-select-box>\n  </div>\n  @switch (_colorMode) {\n    @case ('hex') {\n      <div>\n        <ax-text-box\n          [ngModel]=\"_hex\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          [state]=\"isValid ? 'clear' : 'error'\"\n          (onValueChanged)=\"_handleHEXAValueChanged($event)\"\n          [mask-options]=\"_hexMaskOptions\"\n        >\n        </ax-text-box>\n      </div>\n    }\n    @case ('rgba') {\n      <div>\n        <ax-number-box\n          name=\"r\"\n          [minValue]=\"0\"\n          [maxValue]=\"255\"\n          [ngModel]=\"_rgba.r\"\n          [showSpinButtons]=\"false\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n      <div>\n        <ax-number-box\n          name=\"g\"\n          [minValue]=\"0\"\n          [maxValue]=\"255\"\n          [ngModel]=\"_rgba.g\"\n          [showSpinButtons]=\"false\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n      <div>\n        <ax-number-box\n          name=\"b\"\n          [minValue]=\"0\"\n          [maxValue]=\"255\"\n          [ngModel]=\"_rgba.b\"\n          [showSpinButtons]=\"false\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n      <div>\n        <ax-number-box\n          name=\"a\"\n          [minValue]=\"0\"\n          [maxValue]=\"1\"\n          [ngModel]=\"_rgba.a\"\n          [decimals]=\"2\"\n          [step]=\"0.1\"\n          [disabled]=\"_parent.disabled\"\n          [readonly]=\"_parent.readonly\"\n          [showSpinButtons]=\"false\"\n          (onValueChanged)=\"_handleRGBAValueChanged($event)\"\n        >\n        </ax-number-box>\n      </div>\n    }\n  }\n</div>\n", styles: [".ax-bold{font-weight:700}\n"], dependencies: [{ kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { 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: 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"] }, { kind: "component", type: AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: AXColorPaletteInputComponent, decorators: [{
             type: Component,