@acorex/modules 19.3.0-next.1 → 19.3.0-next.3

package/fesm2022/acorex-modules-common-dashboard-shortcut-widget-view.component-C9RGRmuR.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-modules-common-dashboard-shortcut-widget-view.component-C9RGRmuR.mjs","sources":["../../../../libs/modules/common/src/lib/features/home-dashboard/widgets/dashboard-shortcut/dashboard-shortcut-widget-view.component.ts"],"sourcesContent":["import { AXPopupService } from '@acorex/components/popup';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { AXPSearchDisplayResult } from '@acorex/platform/common';\nimport { AXPDataGenerator, AXPExecuteCommand } from '@acorex/platform/core';\nimport { AXPLayoutWidgetComponent } from '@acorex/platform/layout/builder';\nimport { AXP_GLOBAL_SEARCH_CONFIG_TOKEN } from '@acorex/platform/layout/search';\nimport { AXPWorkflowService } from '@acorex/platform/workflow';\nimport { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, HostBinding, inject } from '@angular/core';\n\n\nexport interface AXPShortcutItem {\n  name: string;\n  title: string;\n  description?: string;\n  icon: string;\n  command: AXPExecuteCommand;\n}\n\n\n@Component({\n  template: `\n    @if(item()) {\n      <div \n        class=\"ax-group ax-flex ax-flex-col ax-items-center ax-justify-center ax-p-3 ax-w-full ax-h-full ax-relative ax-overflow-hidden \"\n        (click)=\"executeCommand()\">\n        <div class=\"ax-absolute ax-inset-0 ax-bg-black/0 hover:ax-bg-black/10 ax-transition-opacity\"></div>\n        <i [class]=\"item().icon + ' ax-text-3xl'\"></i>\n        <span class=\"ax-text-xl ax-font-semibold\">{{ item().title | translate | async }}</span>\n        @if(item().description) {\n          <span class=\"ax-text-sm ax-opacity-90 ax-text-center ax-px-2\">{{ item().description! | translate | async }}</span>\n        }\n      </div>\n    } @else {\n      <div \n        (click)=\"setCommand()\" \n        class=\"ax-group ax-flex ax-flex-col ax-items-center ax-justify-center ax-p-3 ax-w-full ax-h-full  ax-relative ax-overflow-hidden\">\n        <div class=\"ax-absolute ax-inset-0 ax-bg-black/0 hover:ax-bg-black/5 ax-transition-opacity\"></div>\n        <i class=\"fa-light fa-plus ax-text-3xl\"></i>\n        <span class=\"ax-text-xl ax-font-semibold\">Add Shortcut</span>\n      </div>\n    }\n  `,\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [CommonModule, AXTranslationModule]\n})\nexport class AXPDashboardShortcutWidgetViewComponent extends AXPLayoutWidgetComponent {\n\n  private popupService = inject(AXPopupService);\n  private workflow = inject(AXPWorkflowService);\n  private searchConfig = inject(AXP_GLOBAL_SEARCH_CONFIG_TOKEN);\n\n  protected item = computed<AXPShortcutItem>(() => this.options()['item'] as AXPShortcutItem);\n  protected color = computed<string>(() => this.options()['color'] as string);\n\n  override ngOnInit(): void {\n    super.ngOnInit();\n    if (!this.color()) {\n      this.setOptions({\n        color: AXPDataGenerator.color()\n      });\n    }\n  }\n\n  protected async executeCommand() {\n    if (this.item()?.command) {\n      await this.workflow.execute(this.item().command.name, this.item().command.options);\n    }\n  }\n\n  protected async setCommand() {\n    const component = await this.searchConfig.window();\n    const popup = await this.popupService.open(component, {\n      title: 'Choose command...',\n      size: 'fit',\n      closeOnBackdropClick: true,\n      header: false,\n    });\n    if (popup.data) {\n      const result = popup.data as AXPSearchDisplayResult;\n      if (result && result.command) {\n        this.setOptions({\n          item: {\n            name: result.name,\n            title: result.title,\n            description: result.description,\n            icon: result.icon,\n            command: result.command\n          } as AXPShortcutItem\n        });\n      }\n    }\n  }\n\n  @HostBinding('style')\n  private get __style() {\n    const cls: any = {};\n    cls[`background-color`] = this.color();\n    return cls;\n  }\n\n  @HostBinding('class')\n  private get __class() {\n    const cls: any = {};\n    cls[`ax-flex`] = true;\n    cls[`ax-flex-col`] = true;\n    cls[`ax-items-center`] = true;\n    cls[`ax-justify-center`] = true;\n    cls[`ax-w-full`] = true;\n    cls[`ax-h-full`] = true;\n    cls[`ax-text-center`] = true;\n    cls[`ax-overflow-hidden`] = true;\n    cls[`ax-cursor-pointer`] = true;\n    cls[`ax-text-white`] = true;\n    return cls;\n  }\n}"],"names":[],"mappings":"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"}

package/fesm2022/{acorex-modules-common-index-rvP9ISgL.mjs → acorex-modules-common-index-Dt3vRkkx.mjs}

@@ -1,7 +1,7 @@
-import * as i5 from '@angular/common';
+import * as i1$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { output, input, ChangeDetectionStrategy, Component, model, signal, inject, Injectable, computed, effect, ViewEncapsulation } from '@angular/core';
+import { output, contentChild, afterNextRender, input, signal, ChangeDetectionStrategy, Component, model, inject, Injectable, computed, effect, ViewEncapsulation } from '@angular/core';
 import { Router, ActivatedRoute } from '@angular/router';
 import { AXBreadcrumbsModule } from '@acorex/components/breadcrumbs';
 import * as i1 from '@acorex/components/button';
@@ -13,34 +13,49 @@ import { AXDialogService } from '@acorex/components/dialog';
 import * as i3 from '@acorex/components/dropdown';
 import { AXDropdownModule } from '@acorex/components/dropdown';
 import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
-import * as i3$2 from '@acorex/components/grid-layout-builder';
+import * as i4$1 from '@acorex/components/grid-layout-builder';
 import { AXGridLayoutBuilderModule } from '@acorex/components/grid-layout-builder';
-import * as i4 from '@acorex/core/translation';
+import * as i2$1 from '@acorex/core/translation';
 import { AXTranslationModule, AXTranslationService } from '@acorex/core/translation';
-import * as i2$1 from '@acorex/platform/layout/builder';
-import { AXPWidgetGroupEnum, AXPLayoutBuilderModule } from '@acorex/platform/layout/builder';
+import * as i3$2 from '@acorex/platform/layout/builder';
+import { AXPWidgetRendererDirective, AXPWidgetGroupEnum, AXPLayoutBuilderModule } from '@acorex/platform/layout/builder';
 import { AXPWidgetPropertyViewerComponent, AXPWidgetPickerService, AXPDesignerService } from '@acorex/platform/layout/designer';
 import { AXPBasePageComponent, AXPPageLayoutComponent, AXPBasePage } from '@acorex/platform/themes/default';
 import { AXPLayoutThemeService, AXPThemeLayoutBlockComponent } from '@acorex/platform/themes/shared';
+import * as i2$2 from '@acorex/components/loading';
+import { AXLoadingModule } from '@acorex/components/loading';
 import { AXPopupService } from '@acorex/components/popup';
 import { AXMDashboardService, RootConfig } from './acorex-modules-common.mjs';
 import { AXPSettingService } from '@acorex/platform/common';
 import { AXPPlatformScope, AXPDataGenerator } from '@acorex/platform/core';
 import { signalStore, withState, withComputed, withMethods, patchState } from '@ngrx/signals';
-import * as i4$1 from '@acorex/components/label';
+import * as i4 from '@acorex/components/label';
 import { AXLabelModule } from '@acorex/components/label';
 import { AXBasePageComponent } from '@acorex/components/page';
 import * as i3$1 from '@acorex/components/text-box';
 import { AXTextBoxModule } from '@acorex/components/text-box';
-import * as i1$1 from '@angular/forms';
+import * as i1$2 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 
 class AXCDashboardWidgetWrapperComponent {
     constructor() {
         this.onDelete = output();
         this.onConfiguration = output();
-        this.hasOptions = input(true);
+        this.onValueChanged = output();
+        this.onOptionsChanged = output();
+        this.widget = contentChild(AXPWidgetRendererDirective);
+        this.#init = afterNextRender(() => {
+            this.widget()?.onOptionsChanged.subscribe((c) => {
+                this.onOptionsChanged.emit(c.widget.options());
+            });
+            this.widget()?.onValueChanged.subscribe((c) => {
+                this.onValueChanged.emit(c.widget.getValue());
+            });
+        });
+        this.hasConfiguration = input(true);
+        this.isDropdownOpen = signal(false);
     }
+    #init;
     handleOnItemClick(event) {
         switch (event.item.data) {
             case 'delete':
@@ -52,13 +67,17 @@ class AXCDashboardWidgetWrapperComponent {
             default:
                 break;
         }
+        this.isDropdownOpen.set(false);
+    }
+    log(event) {
+        console.log('Dropdown event:', event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXCDashboardWidgetWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXCDashboardWidgetWrapperComponent, isStandalone: true, selector: "axc-dashboard-widget-wrapper", inputs: { hasOptions: { classPropertyName: "hasOptions", publicName: "hasOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDelete: "onDelete", onConfiguration: "onConfiguration" }, ngImport: i0, template: "<section class=\"ax-relative ax-size-full ax-flex ax-justify-center ax-items-center ax-group\">\n  @if(hasOptions()){\n  <div class=\"ax-p-1 ax-absolute ax-top-0 ax-left-0 ax-z-[9999] ax-invisible group-hover:ax-visible\">\n    <ax-button class=\"ax-sm\" [look]=\"'blank'\">\n      <ax-prefix>\n        <ax-icon icon=\"fa-light fa-ellipsis-h\"></ax-icon>\n      </ax-prefix>\n      <ax-dropdown-panel>\n        <ng-container *translate=\"let t\">\n          <ax-button-item-list (onItemClick)=\"handleOnItemClick($event)\">\n            <ax-button-item\n              [data]=\"'configuration'\"\n              [text]=\"(t('configuration', { scope: 'dashboard' }) | async) || 'configuration'\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-cog\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n            <ax-divider></ax-divider>\n            <ax-button-item\n              [data]=\"'delete'\"\n              [text]=\"(t('delete', { scope: 'dashboard' }) | async) || 'delete'\"\n              color=\"danger\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-trash-can\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n          </ax-button-item-list>\n        </ng-container>\n      </ax-dropdown-panel>\n    </ax-button>\n  </div>\n  }\n  <ng-content></ng-content>\n</section>\n", styles: [":host{display:block;width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.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: "component", type: i1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i3.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i4.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXCDashboardWidgetWrapperComponent, isStandalone: true, selector: "axc-dashboard-widget-wrapper", inputs: { hasConfiguration: { classPropertyName: "hasConfiguration", publicName: "hasConfiguration", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDelete: "onDelete", onConfiguration: "onConfiguration", onValueChanged: "onValueChanged", onOptionsChanged: "onOptionsChanged" }, queries: [{ propertyName: "widget", first: true, predicate: AXPWidgetRendererDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<section class=\"ax-relative ax-size-full ax-flex ax-justify-center ax-items-center ax-group\">\n  <div\n    class=\"ax-p-1 ax-absolute ax-top-0 ax-end-0 ax-z-[99] ax-invisible group-hover:ax-visible\"\n    [class.!ax-visible]=\"isDropdownOpen()\"\n  >\n    <ax-button class=\"ax-sm\" [look]=\"'blank'\">\n      <ax-prefix>\n        <ax-icon icon=\"fa-light fa-ellipsis-vertical\"></ax-icon>\n      </ax-prefix>\n      <ax-dropdown-panel (onOpened)=\"isDropdownOpen.set(true)\" (onClosed)=\"isDropdownOpen.set(false)\">\n        <ng-container *translate=\"let t\">\n          <ax-button-item-list (onItemClick)=\"handleOnItemClick($event)\">\n            @if(hasConfiguration()){\n            <ax-button-item\n              [data]=\"'configuration'\"\n              [text]=\"(t('configuration', { scope: 'dashboard' }) | async) || 'configuration'\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-cog\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n            <ax-divider></ax-divider>\n            }\n            <ax-button-item\n              [data]=\"'delete'\"\n              [text]=\"(t('delete', { scope: 'dashboard' }) | async) || 'delete'\"\n              color=\"danger\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-trash-can\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n          </ax-button-item-list>\n        </ng-container>\n      </ax-dropdown-panel>\n    </ax-button>\n  </div>\n\n  <ng-content></ng-content>\n</section>\n", styles: [":host{display:block;width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.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: "component", type: i1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i3.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i2$1.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXCDashboardWidgetWrapperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axc-dashboard-widget-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXButtonModule, AXDecoratorModule, AXDropdownModule, AXTranslationModule, CommonModule], standalone: true, template: "<section class=\"ax-relative ax-size-full ax-flex ax-justify-center ax-items-center ax-group\">\n  @if(hasOptions()){\n  <div class=\"ax-p-1 ax-absolute ax-top-0 ax-left-0 ax-z-[9999] ax-invisible group-hover:ax-visible\">\n    <ax-button class=\"ax-sm\" [look]=\"'blank'\">\n      <ax-prefix>\n        <ax-icon icon=\"fa-light fa-ellipsis-h\"></ax-icon>\n      </ax-prefix>\n      <ax-dropdown-panel>\n        <ng-container *translate=\"let t\">\n          <ax-button-item-list (onItemClick)=\"handleOnItemClick($event)\">\n            <ax-button-item\n              [data]=\"'configuration'\"\n              [text]=\"(t('configuration', { scope: 'dashboard' }) | async) || 'configuration'\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-cog\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n            <ax-divider></ax-divider>\n            <ax-button-item\n              [data]=\"'delete'\"\n              [text]=\"(t('delete', { scope: 'dashboard' }) | async) || 'delete'\"\n              color=\"danger\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-trash-can\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n          </ax-button-item-list>\n        </ng-container>\n      </ax-dropdown-panel>\n    </ax-button>\n  </div>\n  }\n  <ng-content></ng-content>\n</section>\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
+            args: [{ selector: 'axc-dashboard-widget-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXButtonModule, AXDecoratorModule, AXDropdownModule, AXTranslationModule, CommonModule], standalone: true, template: "<section class=\"ax-relative ax-size-full ax-flex ax-justify-center ax-items-center ax-group\">\n  <div\n    class=\"ax-p-1 ax-absolute ax-top-0 ax-end-0 ax-z-[99] ax-invisible group-hover:ax-visible\"\n    [class.!ax-visible]=\"isDropdownOpen()\"\n  >\n    <ax-button class=\"ax-sm\" [look]=\"'blank'\">\n      <ax-prefix>\n        <ax-icon icon=\"fa-light fa-ellipsis-vertical\"></ax-icon>\n      </ax-prefix>\n      <ax-dropdown-panel (onOpened)=\"isDropdownOpen.set(true)\" (onClosed)=\"isDropdownOpen.set(false)\">\n        <ng-container *translate=\"let t\">\n          <ax-button-item-list (onItemClick)=\"handleOnItemClick($event)\">\n            @if(hasConfiguration()){\n            <ax-button-item\n              [data]=\"'configuration'\"\n              [text]=\"(t('configuration', { scope: 'dashboard' }) | async) || 'configuration'\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-cog\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n            <ax-divider></ax-divider>\n            }\n            <ax-button-item\n              [data]=\"'delete'\"\n              [text]=\"(t('delete', { scope: 'dashboard' }) | async) || 'delete'\"\n              color=\"danger\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-solid fa-trash-can\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n          </ax-button-item-list>\n        </ng-container>\n      </ax-dropdown-panel>\n    </ax-button>\n  </div>\n\n  <ng-content></ng-content>\n</section>\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
         }] });
 
 class AXCAddDashboardPopup extends AXBasePageComponent {
@@ -101,7 +120,7 @@ class AXCAddDashboardPopup extends AXBasePageComponent {
         </ax-button>
       </ax-suffix>
     </ax-footer>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.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: AXTextBoxModule }, { kind: "component", type: i3$1.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: "ngmodule", type: AXLabelModule }, { kind: "component", type: i4$1.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.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: AXTextBoxModule }, { kind: "component", type: i3$1.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: "ngmodule", type: AXLabelModule }, { kind: "component", type: i4.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXCAddDashboardPopup, decorators: [{
             type: Component,
@@ -315,7 +334,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
             id: model.id || '',
             title: model.title,
             description: model.description,
-            widget: model.widget || [],
+            widgets: model.widgets || [],
         };
     }
     // Convert dashboard layout to entity model
@@ -325,7 +344,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
             name: layout.title,
             title: layout.title,
             description: layout.description || '',
-            widget: layout.widget,
+            widgets: layout.widgets,
         };
     }
     return {
@@ -340,11 +359,11 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                 const newDashboard = await dashboardPopup.generateDashboardLayout({});
                 if (!newDashboard)
                     return;
-                newDashboard.id = AXPDataGenerator.uuid();
-                newDashboard.widget = [];
                 // Create dashboard model and save to service
                 const dashboardModel = dashboardLayoutToModel(newDashboard);
-                await dashboardService.insertOne(dashboardModel);
+                const createdDashboardId = await dashboardService.insertOne(dashboardModel);
+                newDashboard.id = createdDashboardId;
+                newDashboard.widgets = [];
                 // Update local state
                 const updatedDashboards = [...store.dashboards(), newDashboard];
                 patchState(store, {
@@ -368,8 +387,17 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                 const widgets = await widgetPickerService.showPicker({
                     groups: [AXPWidgetGroupEnum.DashboardWidget],
                 });
-                //remove meta from widgets
+                //remove meta from widgets //TODO TEMPORARY FIX
                 const filteredWidgets = widgets.map(({ __meta__, ...rest }) => rest);
+                if (filteredWidgets[0]?.type === 'sticky-note') {
+                    if (!filteredWidgets[0].options) {
+                        filteredWidgets[0].options = {};
+                    }
+                    filteredWidgets[0].options.hasConfiguration = false;
+                }
+                filteredWidgets.forEach((widget) => {
+                    widget.path = widget?.type + '-' + widget?.name;
+                });
                 // Step 2: Convert the selected widgets into AXPDashboardWidgetData format
                 const convertedWidgets = filteredWidgets.map((widget) => {
                     const id = AXPDataGenerator.uuid();
@@ -391,7 +419,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                     if (dashboard.id === store.currentDashboardId()) {
                         return {
                             ...dashboard,
-                            widget: [...dashboard.widget, ...convertedWidgets],
+                            widgets: [...dashboard.widgets, ...convertedWidgets],
                         };
                     }
                     return dashboard;
@@ -423,7 +451,8 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                     // Update state and select a new current dashboard if needed
                     let newCurrentDashboardId = store.currentDashboardId();
                     if (id === store.currentDashboardId()) {
-                        newCurrentDashboardId = updatedDashboards.length > 0 ? updatedDashboards[0].id : null;
+                        newCurrentDashboardId =
+                            updatedDashboards.length > 0 ? updatedDashboards[updatedDashboards.length - 1].id : null;
                         // Save to settings if we changed the current dashboard
                         if (newCurrentDashboardId) {
                             settingService
@@ -448,7 +477,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                 return;
             const updatedDashboard = {
                 ...currentDashboard,
-                widget: currentDashboard.widget.filter((widget) => widget.config.id !== widgetId),
+                widgets: currentDashboard.widgets.filter((widget) => widget.config.id !== widgetId),
             };
             // Save to service
             await dashboardService.updateOne(dashboardId, dashboardLayoutToModel(updatedDashboard));
@@ -473,7 +502,6 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
         },
         // Handle grid layout changes
         async onGridChange(event) {
-            console.log('onGridChange', event);
             if (!store.currentDashboard()) {
                 console.warn('No current dashboard for grid change');
                 return;
@@ -482,7 +510,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
             const nodes = event.nodes.map(({ element, ...rest }) => rest);
             // Update the current dashboard
             const currentDashboard = store.currentDashboard();
-            const updatedWidgets = currentDashboard.widget.map((widget) => {
+            const updatedWidgets = currentDashboard.widgets.map((widget) => {
                 const updatedNode = nodes.find((node) => node.id === widget.config.id);
                 if (updatedNode) {
                     return {
@@ -494,7 +522,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
             });
             const updatedDashboard = {
                 ...currentDashboard,
-                widget: updatedWidgets,
+                widgets: updatedWidgets,
             };
             // Save to service
             await dashboardService.updateOne(updatedDashboard.id, dashboardLayoutToModel(updatedDashboard));
@@ -517,7 +545,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                 }
                 // Update the current dashboard's widget with the new configuration
                 const currentDashboard = store.currentDashboard();
-                const updatedWidgets = currentDashboard.widget.map((widget) => {
+                const updatedWidgets = currentDashboard.widgets.map((widget) => {
                     if (widget.node?.name === widgetNode.name && widget.node?.path === widgetNode.path) {
                         return {
                             ...widget,
@@ -528,7 +556,7 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                 });
                 const updatedDashboard = {
                     ...currentDashboard,
-                    widget: updatedWidgets,
+                    widgets: updatedWidgets,
                 };
                 // Save to service
                 await dashboardService.updateOne(updatedDashboard.id, dashboardLayoutToModel(updatedDashboard));
@@ -542,6 +570,83 @@ withMethods((store, dashboardPopup = inject(AXPDashboardPopupService), dialogSer
                 console.error('Error handling widget configuration:', error);
             }
         },
+        // Handle widget value changes
+        async handleValueChanged(widgetNode, data) {
+            if (!store.currentDashboard()) {
+                console.warn('No current dashboard selected');
+                return;
+            }
+            try {
+                // Update the current dashboard's widget with the new value
+                const currentDashboard = store.currentDashboard();
+                const updatedWidgets = currentDashboard.widgets.map((widget) => {
+                    if (widget.node && widget.node.name === widgetNode.name && widget.node.path === widgetNode.path) {
+                        return {
+                            ...widget,
+                            node: {
+                                ...widget.node,
+                                defaultValue: data,
+                            },
+                        };
+                    }
+                    return widget;
+                });
+                const updatedDashboard = {
+                    ...currentDashboard,
+                    widgets: updatedWidgets,
+                };
+                // Save to service
+                await dashboardService.updateOne(updatedDashboard.id, dashboardLayoutToModel(updatedDashboard));
+                // Update the dashboards state
+                const updatedDashboards = store
+                    .dashboards()
+                    .map((dashboard) => (dashboard.id === updatedDashboard.id ? updatedDashboard : dashboard));
+                // patchState(store, { dashboards: updatedDashboards });
+            }
+            catch (error) {
+                console.error('Error handling widget value change:', error);
+            }
+        },
+        // Handle widget options changes
+        async handleOptionsChanged(widgetNode, data) {
+            if (!store.currentDashboard()) {
+                console.warn('No current dashboard selected');
+                return;
+            }
+            try {
+                // Update the current dashboard's widget with the new options
+                const currentDashboard = store.currentDashboard();
+                const updatedWidgets = currentDashboard.widgets.map((widget) => {
+                    if (widget.node && widget.node.name === widgetNode.name && widget.node.path === widgetNode.path) {
+                        return {
+                            ...widget,
+                            node: {
+                                ...widget.node,
+                                options: {
+                                    ...(widget.node.options || {}),
+                                    ...data,
+                                },
+                            },
+                        };
+                    }
+                    return widget;
+                });
+                const updatedDashboard = {
+                    ...currentDashboard,
+                    widgets: updatedWidgets,
+                };
+                // Save to service
+                await dashboardService.updateOne(updatedDashboard.id, dashboardLayoutToModel(updatedDashboard));
+                // Update the dashboards state
+                const updatedDashboards = store
+                    .dashboards()
+                    .map((dashboard) => (dashboard.id === updatedDashboard.id ? updatedDashboard : dashboard));
+                patchState(store, { dashboards: updatedDashboards });
+            }
+            catch (error) {
+                console.error('Error handling widget options change:', error);
+            }
+        },
         // Reload dashboards from service
         async refreshDashboards() {
             await loadDashboards();
@@ -647,14 +752,6 @@ class AXPDashboardHomeComponent extends AXPBasePageComponent {
             },
         ];
     }
-    getPageBreadcrumbs() {
-        return [
-            {
-                title: this.translateService.translateSync('entity.home'),
-                icon: 'fa-solid fa-home ax-text-xs ax-me-2',
-            },
-        ];
-    }
     async execute(command) {
         if (command.metadata?.['isDashboard']) {
             this.store.handleConfigChange(command.metadata?.['dashboard']);
@@ -677,6 +774,12 @@ class AXPDashboardHomeComponent extends AXPBasePageComponent {
             }
         }
     }
+    // #af = afterNextRender(() => {
+    //   this.store.refreshDashboards();
+    // });
+    log(event) {
+        console.log(event);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPDashboardHomeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXPDashboardHomeComponent, isStandalone: true, selector: "axp-dashboard-home", providers: [
             AXPDesignerService,
@@ -685,12 +788,13 @@ class AXPDashboardHomeComponent extends AXPBasePageComponent {
                 provide: AXPBasePage,
                 useExisting: AXPDashboardHomeComponent,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <!-- Content Section -->\n\n  <axp-page-content class=\"ax-relative\">\n    <ax-grid-layout-container [options]=\"store.dashboardsOption()\" (onChange)=\"store.onGridChange($event)\">\n      @for(widget of store.currentDashboard()?.widget; track widget.config.id) {\n      <ax-grid-layout-widget [options]=\"widget.config\">\n        <axc-dashboard-widget-wrapper\n          [hasOptions]=\"widget.node?.options?.['hasOptions'] ?? true\"\n          (onDelete)=\"confirmWidgetDelete(store.currentDashboard()?.id!, widget.config.id!)\"\n          (onConfiguration)=\"store.handlePopupConfiguration(widget.node!)\"\n        >\n          @if(widget.node) {\n          <axp-widgets-container [context]=\"context()\">\n            <ng-container axp-widget-renderer [node]=\"widget.node\" [mode]=\"'view'\"></ng-container>\n          </axp-widgets-container>\n          }\n        </axc-dashboard-widget-wrapper>\n      </ax-grid-layout-widget>\n      } @empty {\n      <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-h-full ax-bg-gray-50 ax-p-4\">\n        <ax-icon icon=\"fa-light fa-shapes\" class=\"ax-text-4xl ax-text-gray-400 ax-mb-4\"></ax-icon>\n        <h2 class=\"ax-text-xl ax-font-semibold ax-text-gray-700 ax-mb-2\">\n          {{ t('no-widgets', { scope: 'dashboard' }) | async }}\n        </h2>\n        <p class=\"ax-text-gray-500 ax-text-center ax-mb-6\">\n          {{ t('add-first-widget', { scope: 'dashboard' }) | async }}\n        </p>\n      </div>\n      }\n    </ax-grid-layout-container>\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["axp-dashboard-home{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}axp-dashboard-home .placeholder-content{border-radius:.5rem!important;border-width:1px!important;border-style:dashed!important;--tw-border-opacity: 1 !important;border-color:rgba(var(--ax-sys-color-primary-500),var(--tw-border-opacity, 1))!important;background-color:rgba(var(--ax-sys-color-primary-lightest-surface),.5)!important}axp-dashboard-home ax-grid-layout-widget .grid-stack-item-content{border-style:none!important;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1) !important;--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important;background-color:rgb(var(--ax-sys-color-lightest-surface))!important;color:rgb(var(--ax-sys-color-on-lightest-surface))!important;border-color:rgb(var(--ax-sys-color-border-lightest-surface))!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i2$1.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i2$1.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "ngmodule", type: AXGridLayoutBuilderModule }, { kind: "component", type: i3$2.AXGridLayoutContainerComponent, selector: "ax-grid-layout-container", inputs: ["options", "isEmpty"], outputs: ["onAdded", "onRemoved", "onWidgetChange", "onChange", "isLayoutRendered", "isEmptyChange"] }, { kind: "component", type: i3$2.AXGridLayoutWidgetComponent, selector: "ax-grid-layout-widget", inputs: ["options"] }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPThemeLayoutBlockComponent, selector: "    axp-page-content,     axp-page-footer,    axp-page-header,    axp-page-toolbar,    axp-layout-content,     axp-layout-page-content,     axp-layout-sections,    axp-layout-body,    axp-layout-container,    axp-layout-page-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title-bar,    axp-layout-title,     axp-layout-title-actions,     axp-layout-nav-button,     axp-layout-description,     axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i4.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "component", type: AXCDashboardWidgetWrapperComponent, selector: "axc-dashboard-widget-wrapper", inputs: ["hasOptions"], outputs: ["onDelete", "onConfiguration"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <!-- Content Section -->\n\n  <axp-page-content class=\"ax-relative\">\n    @if(store.isLoading()) {\n    <div\n      class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-h-full ax-w-full ax-absolute ax-z-10 ax-bg-white/80\"\n    >\n      <ax-loading></ax-loading>\n      <p class=\"ax-mt-3 ax-text-gray-600\">{{ t('loading', { scope: 'dashboard' }) | async }}</p>\n    </div>\n    } @else {\n    <axp-widgets-container [context]=\"context()\">\n      <ax-grid-layout-container [options]=\"store.dashboardsOption()\" (onChange)=\"store.onGridChange($event)\">\n        @for(widget of store.currentDashboard()?.widgets; track widget.config.id) {\n        <ax-grid-layout-widget [options]=\"widget.config\">\n          <axc-dashboard-widget-wrapper\n            [hasConfiguration]=\"widget.node?.options?.['hasConfiguration'] ?? true\"\n            (onDelete)=\"confirmWidgetDelete(store.currentDashboard()?.id!, widget.config.id!)\"\n            (onConfiguration)=\"store.handlePopupConfiguration(widget.node!)\"\n            (onValueChanged)=\"store.handleValueChanged(widget?.node!,$event)\"\n            (onOptionsChanged)=\"store.handleOptionsChanged(widget?.node!,$event)\"\n          >\n            @if(widget.node) {\n            <ng-container axp-widget-renderer [node]=\"widget.node\" [mode]=\"'view'\"></ng-container>\n            }\n          </axc-dashboard-widget-wrapper>\n        </ax-grid-layout-widget>\n        } @empty {\n        <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-h-full ax-bg-gray-50 ax-p-4\">\n          <ax-icon icon=\"fa-light fa-shapes\" class=\"ax-text-4xl ax-text-gray-400 ax-mb-4\"></ax-icon>\n          <h2 class=\"ax-text-xl ax-font-semibold ax-text-gray-700 ax-mb-2\">\n            {{ t('no-widgets', { scope: 'dashboard' }) | async }}\n          </h2>\n          <p class=\"ax-text-gray-500 ax-text-center ax-mb-6\">\n            {{ t('add-first-widget', { scope: 'dashboard' }) | async }}\n          </p>\n        </div>\n        }\n      </ax-grid-layout-container>\n    </axp-widgets-container>\n    }\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["axp-dashboard-home{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}axp-dashboard-home .placeholder-content{border-radius:.5rem!important;border-width:1px!important;border-style:dashed!important;--tw-border-opacity: 1 !important;border-color:rgba(var(--ax-sys-color-primary-500),var(--tw-border-opacity, 1))!important;background-color:rgba(var(--ax-sys-color-primary-lightest-surface),.5)!important}axp-dashboard-home ax-grid-layout-widget .grid-stack-item-content{border-radius:.375rem!important;border-width:1px!important;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05) !important;--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important;background-color:rgb(var(--ax-sys-color-lightest-surface))!important;color:rgb(var(--ax-sys-color-on-lightest-surface))!important;border-color:rgb(var(--ax-sys-color-border-lightest-surface))!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i2$2.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i3$2.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i3$2.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "ngmodule", type: AXGridLayoutBuilderModule }, { kind: "component", type: i4$1.AXGridLayoutContainerComponent, selector: "ax-grid-layout-container", inputs: ["options", "isEmpty"], outputs: ["onAdded", "onRemoved", "onWidgetChange", "onChange", "isLayoutRendered", "isEmptyChange"] }, { kind: "component", type: i4$1.AXGridLayoutWidgetComponent, selector: "ax-grid-layout-widget", inputs: ["options"] }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPThemeLayoutBlockComponent, selector: "    axp-page-content,     axp-page-footer,    axp-page-header,    axp-page-toolbar,    axp-layout-content,     axp-layout-page-content,     axp-layout-sections,    axp-layout-body,    axp-layout-container,    axp-layout-page-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title-bar,    axp-layout-title,     axp-layout-title-actions,     axp-layout-nav-button,     axp-layout-description,     axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i2$1.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "component", type: AXCDashboardWidgetWrapperComponent, selector: "axc-dashboard-widget-wrapper", inputs: ["hasConfiguration"], outputs: ["onDelete", "onConfiguration", "onValueChanged", "onOptionsChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPDashboardHomeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'axp-dashboard-home', standalone: true, imports: [
                         CommonModule,
+                        AXLoadingModule,
                         AXPLayoutBuilderModule,
                         AXButtonModule,
                         AXButtonGroupModule,
@@ -710,8 +814,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                             provide: AXPBasePage,
                             useExisting: AXPDashboardHomeComponent,
                         },
-                    ], template: "<axp-page-layout *translate=\"let t\">\n  <!-- Content Section -->\n\n  <axp-page-content class=\"ax-relative\">\n    <ax-grid-layout-container [options]=\"store.dashboardsOption()\" (onChange)=\"store.onGridChange($event)\">\n      @for(widget of store.currentDashboard()?.widget; track widget.config.id) {\n      <ax-grid-layout-widget [options]=\"widget.config\">\n        <axc-dashboard-widget-wrapper\n          [hasOptions]=\"widget.node?.options?.['hasOptions'] ?? true\"\n          (onDelete)=\"confirmWidgetDelete(store.currentDashboard()?.id!, widget.config.id!)\"\n          (onConfiguration)=\"store.handlePopupConfiguration(widget.node!)\"\n        >\n          @if(widget.node) {\n          <axp-widgets-container [context]=\"context()\">\n            <ng-container axp-widget-renderer [node]=\"widget.node\" [mode]=\"'view'\"></ng-container>\n          </axp-widgets-container>\n          }\n        </axc-dashboard-widget-wrapper>\n      </ax-grid-layout-widget>\n      } @empty {\n      <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-h-full ax-bg-gray-50 ax-p-4\">\n        <ax-icon icon=\"fa-light fa-shapes\" class=\"ax-text-4xl ax-text-gray-400 ax-mb-4\"></ax-icon>\n        <h2 class=\"ax-text-xl ax-font-semibold ax-text-gray-700 ax-mb-2\">\n          {{ t('no-widgets', { scope: 'dashboard' }) | async }}\n        </h2>\n        <p class=\"ax-text-gray-500 ax-text-center ax-mb-6\">\n          {{ t('add-first-widget', { scope: 'dashboard' }) | async }}\n        </p>\n      </div>\n      }\n    </ax-grid-layout-container>\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["axp-dashboard-home{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}axp-dashboard-home .placeholder-content{border-radius:.5rem!important;border-width:1px!important;border-style:dashed!important;--tw-border-opacity: 1 !important;border-color:rgba(var(--ax-sys-color-primary-500),var(--tw-border-opacity, 1))!important;background-color:rgba(var(--ax-sys-color-primary-lightest-surface),.5)!important}axp-dashboard-home ax-grid-layout-widget .grid-stack-item-content{border-style:none!important;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1) !important;--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important;background-color:rgb(var(--ax-sys-color-lightest-surface))!important;color:rgb(var(--ax-sys-color-on-lightest-surface))!important;border-color:rgb(var(--ax-sys-color-border-lightest-surface))!important}\n"] }]
+                    ], template: "<axp-page-layout *translate=\"let t\">\n  <!-- Content Section -->\n\n  <axp-page-content class=\"ax-relative\">\n    @if(store.isLoading()) {\n    <div\n      class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-h-full ax-w-full ax-absolute ax-z-10 ax-bg-white/80\"\n    >\n      <ax-loading></ax-loading>\n      <p class=\"ax-mt-3 ax-text-gray-600\">{{ t('loading', { scope: 'dashboard' }) | async }}</p>\n    </div>\n    } @else {\n    <axp-widgets-container [context]=\"context()\">\n      <ax-grid-layout-container [options]=\"store.dashboardsOption()\" (onChange)=\"store.onGridChange($event)\">\n        @for(widget of store.currentDashboard()?.widgets; track widget.config.id) {\n        <ax-grid-layout-widget [options]=\"widget.config\">\n          <axc-dashboard-widget-wrapper\n            [hasConfiguration]=\"widget.node?.options?.['hasConfiguration'] ?? true\"\n            (onDelete)=\"confirmWidgetDelete(store.currentDashboard()?.id!, widget.config.id!)\"\n            (onConfiguration)=\"store.handlePopupConfiguration(widget.node!)\"\n            (onValueChanged)=\"store.handleValueChanged(widget?.node!,$event)\"\n            (onOptionsChanged)=\"store.handleOptionsChanged(widget?.node!,$event)\"\n          >\n            @if(widget.node) {\n            <ng-container axp-widget-renderer [node]=\"widget.node\" [mode]=\"'view'\"></ng-container>\n            }\n          </axc-dashboard-widget-wrapper>\n        </ax-grid-layout-widget>\n        } @empty {\n        <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-h-full ax-bg-gray-50 ax-p-4\">\n          <ax-icon icon=\"fa-light fa-shapes\" class=\"ax-text-4xl ax-text-gray-400 ax-mb-4\"></ax-icon>\n          <h2 class=\"ax-text-xl ax-font-semibold ax-text-gray-700 ax-mb-2\">\n            {{ t('no-widgets', { scope: 'dashboard' }) | async }}\n          </h2>\n          <p class=\"ax-text-gray-500 ax-text-center ax-mb-6\">\n            {{ t('add-first-widget', { scope: 'dashboard' }) | async }}\n          </p>\n        </div>\n        }\n      </ax-grid-layout-container>\n    </axp-widgets-container>\n    }\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["axp-dashboard-home{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}axp-dashboard-home .placeholder-content{border-radius:.5rem!important;border-width:1px!important;border-style:dashed!important;--tw-border-opacity: 1 !important;border-color:rgba(var(--ax-sys-color-primary-500),var(--tw-border-opacity, 1))!important;background-color:rgba(var(--ax-sys-color-primary-lightest-surface),.5)!important}axp-dashboard-home ax-grid-layout-widget .grid-stack-item-content{border-radius:.375rem!important;border-width:1px!important;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05) !important;--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important;background-color:rgb(var(--ax-sys-color-lightest-surface))!important;color:rgb(var(--ax-sys-color-on-lightest-surface))!important;border-color:rgb(var(--ax-sys-color-border-lightest-surface))!important}\n"] }]
         }] });
 
 export { AXCDashboardStore, AXPDashboardHomeComponent };
-//# sourceMappingURL=acorex-modules-common-index-rvP9ISgL.mjs.map
+//# sourceMappingURL=acorex-modules-common-index-Dt3vRkkx.mjs.map