@acorex/modules 19.2.17 → 19.2.20

package/fesm2022/{acorex-modules-document-management-acorex-modules-document-management-BmLGtKDq.mjs → acorex-modules-document-management-acorex-modules-document-management-_BOVaDOq.mjs}

@@ -2,8 +2,8 @@ import { AXPSessionService, AXPAuthGuard, AXP_PERMISSION_PROVIDER } from '@acore
 import { AXPSearchCommandProvider, createAllQueryView, AXPEntityCommandScope, AXPEntityQueryType, AXPFileTypeProviderService, AXP_FILE_TYPE_INFO_PROVIDER, AXPFileStorageService, AXPSettingScope, AXPSettingService, AXP_MENU_PROVIDER, AXP_SETTING_DEFINITION_PROVIDER, AXP_SEARCH_PROVIDER } from '@acorex/platform/common';
 import { AXPEntityService, AXMEntityCrudServiceImpl, AXP_ENTITY_CONFIG_TOKEN, AXP_ENTITY_DEFINITION_LOADER } from '@acorex/platform/layout/entity';
 import * as i0 from '@angular/core';
-import { inject, Injector, Injectable, NgModule, ChangeDetectionStrategy, Component, signal, computed, viewChild, effect } from '@angular/core';
-import { firstValueFrom, Subject } from 'rxjs';
+import { inject, Injector, Injectable, NgModule, ChangeDetectionStrategy, Component, signal, computed, viewChild, input, effect, ViewEncapsulation } from '@angular/core';
+import { firstValueFrom } from 'rxjs';
 import * as i6 from '@acorex/platform/layout/builder';
 import { AXPWidgetsCatalog, AXPWidgetComponent, AXPLayoutBuilderModule, AXP_WIDGETS_ADVANCE_GROUP, AXP_WIDGETS_EDITOR_GROUP } from '@acorex/platform/layout/builder';
 import { RouterModule, ROUTES } from '@angular/router';
@@ -13,11 +13,11 @@ import * as i1$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i7$1 from '@acorex/components/collapse';
 import { AXCollapseModule } from '@acorex/components/collapse';
-import * as i5$1 from '@acorex/components/decorators';
+import * as i3 from '@acorex/components/decorators';
 import { AXDecoratorModule } from '@acorex/components/decorators';
 import * as i7 from '@acorex/components/form';
 import { AXFormModule } from '@acorex/components/form';
-import * as i5 from '@acorex/components/label';
+import * as i4 from '@acorex/components/label';
 import { AXLabelModule } from '@acorex/components/label';
 import * as i1 from '@acorex/components/select-box';
 import { AXSelectBoxModule } from '@acorex/components/select-box';
@@ -26,27 +26,31 @@ import { FormsModule } from '@angular/forms';
 import get from 'lodash-es/get';
 import set from 'lodash-es/set';
 import { AXP_NAME_PROPERTY, AXP_DATA_PATH_PROPERTY } from '@acorex/platform/widgets';
+import * as i3$2 from '@acorex/components/media-viewer';
+import { AXMediaViewerModule } from '@acorex/components/media-viewer';
+import * as i3$4 from '@acorex/platform/workflow';
+import { AXPWorkflowService, AXPWorkflowAction, AXPWorkflowModule } from '@acorex/platform/workflow';
 import * as i2$1 from '@acorex/components/button';
-import { AXButtonComponent, AXButtonModule } from '@acorex/components/button';
+import { AXButtonModule, AXButtonComponent } from '@acorex/components/button';
 import { AXButtonGroupModule } from '@acorex/components/button-group';
-import * as i3$1 from '@acorex/components/dropdown';
+import * as i2$2 from '@acorex/components/dropdown';
 import { AXDropdownModule } from '@acorex/components/dropdown';
 import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
-import * as i4$1 from '@acorex/core/translation';
+import * as i3$3 from '@acorex/core/translation';
 import { AXTranslationService, AXTranslationModule } from '@acorex/core/translation';
 import { AXLoadingModule } from '@acorex/components/loading';
-import * as i4 from '@acorex/components/menu';
+import * as i3$1 from '@acorex/components/menu';
 import { AXMenuModule } from '@acorex/components/menu';
 import { AXDateTimeModule } from '@acorex/core/date-time';
-import * as i3 from '@acorex/core/format';
 import { AXFormatModule } from '@acorex/core/format';
-import { AXPElementDataDirective } from '@acorex/platform/core';
-import { get as get$1 } from 'lodash-es';
+import { AXPLayoutThemeService } from '@acorex/platform/themes/shared';
+import { get as get$1, set as set$1 } from 'lodash-es';
 import { AXDialogService } from '@acorex/components/dialog';
 import { AXPopupService } from '@acorex/components/popup';
+import { AXFileService } from '@acorex/core/file';
 import { signalStore, withState, withComputed, withMethods, patchState } from '@ngrx/signals';
-import * as i3$2 from '@acorex/components/media-viewer';
-import { AXMediaViewerModule } from '@acorex/components/media-viewer';
+import { AXBasePageComponent } from '@acorex/components/page';
+import { AXUploaderService } from '@acorex/components/uploader';
 
 const config = {
     i18n: 'document-management',
@@ -114,11 +118,11 @@ class AXMEntityProvider {
         if (moduleName == RootConfig.module.name) {
             switch (entityName) {
                 case RootConfig.entities.document.name:
-                    return (await Promise.resolve().then(function () { return index; })).documentFactory(this.injector);
+                    return (await Promise.resolve().then(function () { return index$1; })).documentFactory(this.injector);
                 case RootConfig.entities.documentType.name:
-                    return (await Promise.resolve().then(function () { return index; })).documentTypeFactory(this.injector);
+                    return (await Promise.resolve().then(function () { return index$1; })).documentTypeFactory(this.injector);
                 case RootConfig.entities.folder.name:
-                    return (await Promise.resolve().then(function () { return index; })).folderFactory(this.injector);
+                    return (await Promise.resolve().then(function () { return index$1; })).folderFactory(this.injector);
             }
         }
         return null;
@@ -668,9 +672,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                 }]
         }] });
 
-class AXMDocumentManagementDocumentTypeEntityService extends AXMEntityCrudServiceImpl {
+class AXMDocumentTypeService extends AXMEntityCrudServiceImpl {
 }
-class AXMDocumentManagementDocumentTypeEntityServiceImpl extends AXMDocumentManagementDocumentTypeEntityService {
+class AXMDocumentManagementDocumentTypeEntityServiceImpl extends AXMDocumentTypeService {
     constructor() {
         super(`${RootConfig.module.name}.${RootConfig.entities.documentType.name}`);
     }
@@ -682,7 +686,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
         }], ctorParameters: () => [] });
 
 async function documentTypeFactory(injector) {
-    const dataService = injector.get(AXMDocumentManagementDocumentTypeEntityService);
+    const dataService = injector.get(AXMDocumentTypeService);
     const metaDefinitionService = injector.get(AXMMetaDataDefinitionService);
     const i18n = RootConfig.config.i18n;
     const entityDef = {
@@ -823,7 +827,7 @@ async function documentTypeFactory(injector) {
                 schema: {
                     dataType: 'object',
                     interface: {
-                        type: AXPWidgetsCatalog.documentAttachment,
+                        type: AXPWidgetsCatalog.fileTypeExtension,
                         options: {},
                     },
                 },
@@ -851,9 +855,7 @@ async function documentTypeFactory(injector) {
         queries: {
             byKey: {
                 execute: async (id) => {
-                    const x = await dataService.getOne(id);
-                    console.log(x);
-                    return x;
+                    return await dataService.getOne(id);
                 },
                 type: AXPEntityQueryType.Single,
             },
@@ -1126,7 +1128,7 @@ class AXMDocumentManagementDocumentTypeEntityModule {
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentManagementDocumentTypeEntityModule }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentManagementDocumentTypeEntityModule, providers: [
             {
-                provide: AXMDocumentManagementDocumentTypeEntityService,
+                provide: AXMDocumentTypeService,
                 useClass: AXMDocumentManagementDocumentTypeEntityServiceImpl,
             },
         ] }); }
@@ -1139,7 +1141,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                     declarations: [],
                     providers: [
                         {
-                            provide: AXMDocumentManagementDocumentTypeEntityService,
+                            provide: AXMDocumentTypeService,
                             useClass: AXMDocumentManagementDocumentTypeEntityServiceImpl,
                         },
                     ],
@@ -2203,11 +2205,10 @@ async function folderFactory(injector) {
     return entityDef;
 }
 
-var index = /*#__PURE__*/Object.freeze({
+var index$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     AXMDocumentManagementDocumentEntityModule: AXMDocumentManagementDocumentEntityModule,
     AXMDocumentManagementDocumentTypeEntityModule: AXMDocumentManagementDocumentTypeEntityModule,
-    AXMDocumentManagementDocumentTypeEntityService: AXMDocumentManagementDocumentTypeEntityService,
     AXMDocumentManagementDocumentTypeEntityServiceImpl: AXMDocumentManagementDocumentTypeEntityServiceImpl,
     AXMDocumentManagementDocumentTypeMetaDefinitionEntityModule: AXMDocumentManagementDocumentTypeMetaDefinitionEntityModule,
     AXMDocumentManagementDocumentTypeMetaDefinitionEntityService: AXMDocumentManagementDocumentTypeMetaDefinitionEntityService,
@@ -2220,6 +2221,7 @@ var index = /*#__PURE__*/Object.freeze({
     AXMDocumentManagementDocumentTypeStatusDefinitionEntityServiceImpl: AXMDocumentManagementDocumentTypeStatusDefinitionEntityServiceImpl,
     AXMDocumentService: AXMDocumentService,
     AXMDocumentServiceImpl: AXMDocumentServiceImpl,
+    AXMDocumentTypeService: AXMDocumentTypeService,
     AXMFolderService: AXMFolderService,
     AXMFolderServiceImpl: AXMFolderServiceImpl,
     documentFactory: documentFactory,
@@ -2605,22 +2607,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                 }]
         }] });
 
-// @if(allowSearch()) {
-//     <ax-search-box><ax-clear-button></ax-clear-button></ax-search-box>
-//     } @if(hasClearButton()) {
-//     <ax-clear-button></ax-clear-button>
-//     } @for (validation of validationRules(); track $index) {
-//     <ax-validation-rule
-//       [rule]="validation.rule"
-//       [message]="validation.options?.message"
-//       [options]="validation.options"
-//     ></ax-validation-rule>
-//     } @for (validation of validationRules(); track $index) {
-//     <ax-validation-rule
-//       [rule]="validation.rule"
-//       [message]="validation.options?.message"
-//       [options]="validation.options"
-//     ></ax-validation-rule>
 class AXMFileTypeExtensionWidgetEditComponent extends AXPWidgetComponent {
     constructor() {
         super(...arguments);
@@ -2665,6 +2651,7 @@ class AXMFileTypeExtensionWidgetEditComponent extends AXPWidgetComponent {
         super.ngOnInit();
         this.selectedItems.set(this.getValue()?.selectedItems ?? []);
         this.context.set(this.getValue()?.context ?? {});
+        console.log(this.selectedItems());
     }
     outputs() {
         return ['selectedItems', 'context'];
@@ -2723,137 +2710,143 @@ class AXMFileTypeExtensionWidgetEditComponent extends AXPWidgetComponent {
         }
         return false;
     }
+    hasMetaInExtensions(extensions) {
+        return extensions.some((ext) => ext.meta && ext.meta.length > 0);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMFileTypeExtensionWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXMFileTypeExtensionWidgetEditComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
-    <div>
-      <ax-select-box
-        #dd
-        [dataSource]="dataSource"
-        valueField="name"
-        textField="title"
-        [multiple]="true"
-        [ngModel]="getValue()?.selectedItems"
-        (onValueChanged)="handleValueChange($event)"
-      >
-      </ax-select-box>
-      <div class="ax-py-3"></div>
-      <axp-widgets-container (onContextChanged)="handleOnContextChange($event)" [context]="context()">
-        @if (selectedItems().length > 0) {
-          <ax-collapse-group look="fill">
-            @for (item of selectedItems(); track item.name) {
-              <!-- File Types -->
-              <ax-collapse [caption]="item.title">
-                <div class="ax-flex ax-flex-col ax-gap-5">
-                  @if (item.meta && item.meta.length > 0) {
-                    <div class="ax-flex ax-flex-col ax-gap-2">
-                      <ax-text [textContent]="'Global Meta Data'" class="ax-font-bold ax-text-sm"></ax-text>
-                      @for (metaFile of item.meta; track metaFile.name) {
-                        <!-- File Meta Data -->
-                        <ax-form-field>
-                        <ax-label [required]="filedIsRequired(metaFile)">{{ metaFile.title }}</ax-label>
-                        <ng-container axp-widget-renderer [node]="getNode(metaFile)" [mode]="'edit'"></ng-container>
-                      </ax-form-field>
-                      }
-                    </div>
-                  }
-                  @if (item.extensions && item.extensions.length > 0) {
-                    <div class="ax-flex ax-flex-col ax-gap-3">
-                      @for (ext of item.extensions; track ext.name) {
-                        <!-- Extensions -->
-                        @if (ext.meta && ext.meta.length > 0) {
-                          <ax-text [textContent]="ext.title" class="ax-font-bold ax-text-sm"></ax-text>
-                          <div class="ax-flex ax-flex-col ax-gap-2">
-                            @for (extMeta of ext.meta; track $index) {
-                              <!-- Extension Meta Data -->
-                              <ax-form-field>
-                                <ax-label [required]="filedIsRequired(extMeta)">{{ extMeta.title }}</ax-label>
-                                <ng-container axp-widget-renderer [node]="getNode(extMeta)"
-                                              [mode]="'edit'"></ng-container>
-                              </ax-form-field>
-                            }
-                          </div>
-                        }
-                        <!-- End Extension Meta Data -->
-                      }
-                    </div>
-                    <!-- End Extensions -->
-                  }
-                </div>
-              </ax-collapse>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXMFileTypeExtensionWidgetEditComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ` <div>
+    <ax-select-box
+      #dd
+      [dataSource]="dataSource"
+      valueField="name"
+      textField="title"
+      [multiple]="true"
+      [ngModel]="getValue()?.selectedItems"
+      (onValueChanged)="handleValueChange($event)"
+    >
+    </ax-select-box>
+    <div class="ax-py-3"></div>
+    <axp-widgets-container (onContextChanged)="handleOnContextChange($event)" [context]="context()">
+      @if (selectedItems().length > 0) {
+      <ax-collapse-group look="fill">
+        @for (item of selectedItems(); track item.name) {
+        <!-- File Types -->
+        <ax-collapse [caption]="item.title">
+          <div class="ax-flex ax-flex-col ax-gap-5">
+            @if (item.meta && item.meta.length > 0) {
+            <div class="ax-flex ax-flex-col ax-gap-2">
+              <ax-text [textContent]="'Global Meta Data'" class="ax-font-bold ax-text-sm"></ax-text>
+              @for (metaFile of item.meta; track metaFile.name) {
+              <!-- File Meta Data -->
+              <ax-form-field>
+                <ax-label [required]="filedIsRequired(metaFile)">{{ metaFile.title }}</ax-label>
+                <ng-container axp-widget-renderer [node]="getNode(metaFile)" [mode]="'edit'"></ng-container>
+              </ax-form-field>
+              }
+            </div>
+            } @if (item.extensions && item.extensions.length > 0) {
+            <div class="ax-flex ax-flex-col ax-gap-3">
+              @for (ext of item.extensions; track ext.name) {
+              <!-- Extensions -->
+              @if (ext.meta && ext.meta.length > 0) {
+              <ax-text [textContent]="ext.title" class="ax-font-bold ax-text-sm"></ax-text>
+              <div class="ax-flex ax-flex-col ax-gap-2">
+                @for (extMeta of ext.meta; track $index) {
+                <!-- Extension Meta Data -->
+                <ax-form-field>
+                  <ax-label [required]="filedIsRequired(extMeta)">{{ extMeta.title }}</ax-label>
+                  <ng-container axp-widget-renderer [node]="getNode(extMeta)" [mode]="'edit'"></ng-container>
+                </ax-form-field>
+                }
+              </div>
+              }
+              <!-- End Extension Meta Data -->
+              }
+            </div>
+            <!-- End Extensions -->
             }
-            <!-- End File Types -->
-          </ax-collapse-group>
-        }
-      </axp-widgets-container>
-    </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i7.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i5.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i5$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: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i6.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i6.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXCollapseModule }, { kind: "component", type: i7$1.AXCollapseComponent, selector: "ax-collapse", inputs: ["disabled", "look", "isCollapsed", "showHeader", "caption", "icon", "isLoading", "headerTemplate"], outputs: ["onClick", "isCollapsedChange"] }, { kind: "component", type: i7$1.AXCollapseGroupComponent, selector: "ax-collapse-group", inputs: ["look", "accordion", "activeIndex"], outputs: ["accordionChange", "activeIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+          </div>
+        </ax-collapse>
+          }
+        <!-- End File Types -->
+      </ax-collapse-group>
+      }
+    </axp-widgets-container>
+  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i7.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i4.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.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: AXPLayoutBuilderModule }, { kind: "component", type: i6.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i6.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXCollapseModule }, { kind: "component", type: i7$1.AXCollapseComponent, selector: "ax-collapse", inputs: ["disabled", "look", "isCollapsed", "showHeader", "caption", "icon", "isLoading", "headerTemplate"], outputs: ["onClick", "isCollapsedChange"] }, { kind: "component", type: i7$1.AXCollapseGroupComponent, selector: "ax-collapse-group", inputs: ["look", "accordion", "activeIndex"], outputs: ["accordionChange", "activeIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMFileTypeExtensionWidgetEditComponent, decorators: [{
             type: Component,
             args: [{
-                    template: `
-    <div>
-      <ax-select-box
-        #dd
-        [dataSource]="dataSource"
-        valueField="name"
-        textField="title"
-        [multiple]="true"
-        [ngModel]="getValue()?.selectedItems"
-        (onValueChanged)="handleValueChange($event)"
-      >
-      </ax-select-box>
-      <div class="ax-py-3"></div>
-      <axp-widgets-container (onContextChanged)="handleOnContextChange($event)" [context]="context()">
-        @if (selectedItems().length > 0) {
-          <ax-collapse-group look="fill">
-            @for (item of selectedItems(); track item.name) {
-              <!-- File Types -->
-              <ax-collapse [caption]="item.title">
-                <div class="ax-flex ax-flex-col ax-gap-5">
-                  @if (item.meta && item.meta.length > 0) {
-                    <div class="ax-flex ax-flex-col ax-gap-2">
-                      <ax-text [textContent]="'Global Meta Data'" class="ax-font-bold ax-text-sm"></ax-text>
-                      @for (metaFile of item.meta; track metaFile.name) {
-                        <!-- File Meta Data -->
-                        <ax-form-field>
-                        <ax-label [required]="filedIsRequired(metaFile)">{{ metaFile.title }}</ax-label>
-                        <ng-container axp-widget-renderer [node]="getNode(metaFile)" [mode]="'edit'"></ng-container>
-                      </ax-form-field>
-                      }
-                    </div>
-                  }
-                  @if (item.extensions && item.extensions.length > 0) {
-                    <div class="ax-flex ax-flex-col ax-gap-3">
-                      @for (ext of item.extensions; track ext.name) {
-                        <!-- Extensions -->
-                        @if (ext.meta && ext.meta.length > 0) {
-                          <ax-text [textContent]="ext.title" class="ax-font-bold ax-text-sm"></ax-text>
-                          <div class="ax-flex ax-flex-col ax-gap-2">
-                            @for (extMeta of ext.meta; track $index) {
-                              <!-- Extension Meta Data -->
-                              <ax-form-field>
-                                <ax-label [required]="filedIsRequired(extMeta)">{{ extMeta.title }}</ax-label>
-                                <ng-container axp-widget-renderer [node]="getNode(extMeta)"
-                                              [mode]="'edit'"></ng-container>
-                              </ax-form-field>
-                            }
-                          </div>
-                        }
-                        <!-- End Extension Meta Data -->
-                      }
-                    </div>
-                    <!-- End Extensions -->
-                  }
-                </div>
-              </ax-collapse>
+                    template: ` <div>
+    <ax-select-box
+      #dd
+      [dataSource]="dataSource"
+      valueField="name"
+      textField="title"
+      [multiple]="true"
+      [ngModel]="getValue()?.selectedItems"
+      (onValueChanged)="handleValueChange($event)"
+    >
+    </ax-select-box>
+    <div class="ax-py-3"></div>
+    <axp-widgets-container (onContextChanged)="handleOnContextChange($event)" [context]="context()">
+      @if (selectedItems().length > 0) {
+      <ax-collapse-group look="fill">
+        @for (item of selectedItems(); track item.name) {
+        <!-- File Types -->
+        <ax-collapse [caption]="item.title">
+          <div class="ax-flex ax-flex-col ax-gap-5">
+            @if (item.meta && item.meta.length > 0) {
+            <div class="ax-flex ax-flex-col ax-gap-2">
+              <ax-text [textContent]="'Global Meta Data'" class="ax-font-bold ax-text-sm"></ax-text>
+              @for (metaFile of item.meta; track metaFile.name) {
+              <!-- File Meta Data -->
+              <ax-form-field>
+                <ax-label [required]="filedIsRequired(metaFile)">{{ metaFile.title }}</ax-label>
+                <ng-container axp-widget-renderer [node]="getNode(metaFile)" [mode]="'edit'"></ng-container>
+              </ax-form-field>
+              }
+            </div>
+            } @if (item.extensions && item.extensions.length > 0) {
+            <div class="ax-flex ax-flex-col ax-gap-3">
+              @for (ext of item.extensions; track ext.name) {
+              <!-- Extensions -->
+              @if (ext.meta && ext.meta.length > 0) {
+              <ax-text [textContent]="ext.title" class="ax-font-bold ax-text-sm"></ax-text>
+              <div class="ax-flex ax-flex-col ax-gap-2">
+                @for (extMeta of ext.meta; track $index) {
+                <!-- Extension Meta Data -->
+                <ax-form-field>
+                  <ax-label [required]="filedIsRequired(extMeta)">{{ extMeta.title }}</ax-label>
+                  <ng-container axp-widget-renderer [node]="getNode(extMeta)" [mode]="'edit'"></ng-container>
+                </ax-form-field>
+                }
+              </div>
+              }
+              <!-- End Extension Meta Data -->
+              }
+            </div>
+            <!-- End Extensions -->
             }
-            <!-- End File Types -->
-          </ax-collapse-group>
-        }
-      </axp-widgets-container>
-    </div>`,
+          </div>
+        </ax-collapse>
+          }
+        <!-- End File Types -->
+      </ax-collapse-group>
+      }
+    </axp-widgets-container>
+  </div>`,
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule, AXSelectBoxModule, FormsModule, AXFormModule, AXLabelModule, AXDecoratorModule, AXPLayoutBuilderModule, AXCollapseModule],
+                    imports: [
+                        CommonModule,
+                        AXSelectBoxModule,
+                        FormsModule,
+                        AXFormModule,
+                        AXLabelModule,
+                        AXDecoratorModule,
+                        AXPLayoutBuilderModule,
+                        AXCollapseModule,
+                    ],
                     inputs: [],
                 }]
         }] });
@@ -3023,6 +3016,8 @@ class AXMDocumentManagerService {
         this.popupService = inject(AXPopupService);
         this.dialogService = inject(AXDialogService);
         this.fileService = inject(AXPFileStorageService);
+        this.fileMangerService = inject(AXFileService);
+        this.workflow = inject(AXPWorkflowService);
         this.scopedDriveCache = new Map();
     }
     scope(scope, options) {
@@ -3121,24 +3116,32 @@ class AXMDocumentManagerService {
             name: folder.name,
             type: 'folder',
             parentId: folder.parentId || null,
-            lastModified: folder.updatedAt,
+            modifiedAt: folder.updatedAt,
+            createdAt: folder.createdAt,
+            description: folder.description,
             childrenCount: folder.nodeCount,
+            size: folder.size,
             children: [
                 ...(folder.folders?.map((child) => ({
                     id: child.id,
                     name: child.name,
                     type: 'folder',
                     parentId: child.parentId || null,
-                    lastModified: child.updatedAt,
+                    modifiedAt: child.updatedAt,
+                    createdAt: child.createdAt,
                     childrenCount: child.nodeCount,
+                    description: child.description,
+                    size: child.size,
                 })) || []),
                 ...(folder.documents?.map((doc) => ({
                     id: doc.id,
                     name: doc.name,
                     type: 'file',
                     parentId: doc.parentId,
-                    lastModified: doc.meta?.['uploadedAt'],
-                    size: doc.meta?.['size'],
+                    modifiedAt: doc.updatedAt,
+                    createdAt: doc.createdAt,
+                    size: doc.size,
+                    description: doc.description,
                 })) || []),
             ],
         };
@@ -3230,6 +3233,7 @@ class AXMDocumentManagerService {
             isSystem: false,
             isHidden: false,
             isDeleted: false,
+            size: 0,
         };
         const createdFolder = await this.folderService.insertOne(folderToCreate);
         const folder = await this.folderService.getOne(createdFolder);
@@ -3260,8 +3264,9 @@ class AXMDocumentManagerService {
             name: file.name,
             type: 'file',
             parentId: file.parentId,
-            lastModified: new Date(),
-            size: file.meta?.['size'],
+            modifiedAt: file.updatedAt,
+            createdAt: file.createdAt,
+            size: file.size,
             fileId: file.fileId,
         };
     }
@@ -3280,23 +3285,18 @@ class AXMDocumentManagerService {
     async deleteFile(fileId) {
         await this.documentService.deleteOne(fileId);
     }
-    async deleteNodes(nodeIds) {
-        for (const nodeId of nodeIds) {
-            try {
-                await this.deleteFolder(nodeId);
+    async deleteNodes(nodes) {
+        for (const node of nodes) {
+            if (node.type == 'folder') {
+                await this.deleteFolder(node.id);
             }
-            catch {
-                try {
-                    await this.deleteFile(nodeId);
-                }
-                catch (error) {
-                    console.error(`Failed to delete node with id ${nodeId}:`, error);
-                }
+            else {
+                await this.deleteFile(node.id);
             }
         }
     }
     async showCreateFolderDialog(parentId) {
-        const comp = (await import('./acorex-modules-document-management-create-folder-dialog.component-DqoWmtm7.mjs'))
+        const comp = (await import('./acorex-modules-document-management-create-folder-dialog.component-D66KoQNb.mjs'))
             .AXMCreateFolderDialog;
         const popup = await this.popupService.open(comp, {
             title: 't("actions.create-folder")',
@@ -3306,47 +3306,95 @@ class AXMDocumentManagerService {
         });
         return popup.data?.folder;
     }
-    //Todo beacuse id is String here return type is string and need dynamic type and wrong process
-    async showTreeFolderPopup() {
-        const comp = (await import('./acorex-modules-document-management-index-9l8D5iEE.mjs')).AXMTreeFolderPopupComponent;
+    async moveTo(options) {
+        const comp = (await import('./acorex-modules-document-management-drive-choose.component-WoZfDyLK.mjs')).AXMDocumentDriveChooseComponent;
+        //
         const popup = await this.popupService.open(comp, {
-            title: 't("actions.create-folder")',
+            title: `Choose ${options.browseMode == 'file' ? 'File' : 'Folder'}`,
             data: {
-            //  parentId,
+                selectionMode: options.multiple ? 'multiple' : 'single',
+                browseMode: options.browseMode ?? 'file',
             },
         });
-        return popup.data?.selectedNodeId;
+        //
+        const selectedFolders = popup.data.result ? popup.data?.items ?? [] : [];
+        if (selectedFolders.length > 0) {
+            const selectedFolder = selectedFolders[0];
+            if (selectedFolder) {
+                if (options.node.type === 'folder') {
+                    await this.updateFolder(options.node.id, { parentId: selectedFolder.id });
+                }
+                else {
+                    await this.updateFile(options.node.id, { parentId: selectedFolder.id });
+                }
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        else {
+            return false;
+        }
+    }
+    async copyTo(options) {
+        const comp = (await import('./acorex-modules-document-management-drive-choose.component-WoZfDyLK.mjs')).AXMDocumentDriveChooseComponent;
+        //
+        const popup = await this.popupService.open(comp, {
+            title: `Choose ${options.browseMode == 'file' ? 'File' : 'Folder'}`,
+            data: {
+                selectionMode: options.multiple ? 'multiple' : 'single',
+                browseMode: options.browseMode ?? 'file',
+            },
+        });
+        //
+        const selectedFolders = popup.data.result ? popup.data?.items ?? [] : [];
+        if (selectedFolders.length > 0) {
+            const selectedFolder = selectedFolders[0];
+            if (selectedFolder) {
+                if (options.node.type === 'folder') {
+                    await this.createFolder({
+                        name: options.node.name,
+                        parentId: selectedFolder.id,
+                        color: '#ffffff',
+                        size: options.node.size,
+                    });
+                }
+                else {
+                    await this.createFile({
+                        title: options.node.name,
+                        name: options.node.name,
+                        parentId: selectedFolder.id,
+                        //TODO upload file to file storage
+                        fileId: '',
+                        size: 0,
+                    });
+                }
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        else {
+            return false;
+        }
     }
     async showFileViewerPopup(node) {
         const parentFolder = await this.folderService.getOne(node.parentId);
         const parentFolderName = parentFolder.name;
         const nodes = await Promise.all(parentFolder.documents?.map(async (doc) => {
-            const fileInfo = await this.fileService.getInfo(doc.fileId);
-            // Convert mimeType to supported type
-            let fileType = 'image';
-            if (fileInfo.mimeType.startsWith('image/')) {
-                fileType = 'image';
-            }
-            else if (fileInfo.mimeType.startsWith('audio/')) {
-                fileType = 'audio';
-            }
-            else if (fileInfo.mimeType.startsWith('video/')) {
-                fileType = 'video';
-            }
-            else if (fileInfo.mimeType === 'application/pdf') {
-                fileType = 'pdf';
-            }
             return {
                 id: doc.id || '',
                 name: doc.name,
-                type: fileType,
-                url: fileInfo.url || '',
-                size: String(fileInfo.size),
-                thumbnail: fileInfo.url || '',
+                type: doc.meta?.['type'],
+                url: doc.fileId,
+                size: doc.size.toString(),
+                thumbnail: doc.fileId,
             };
         }) || []);
         console.log(nodes);
-        const comp = (await import('./acorex-modules-document-management-file-viewer-popup.component-CaSagveT.mjs'))
+        const comp = (await Promise.resolve().then(function () { return fileViewerPopup_component; }))
             .AXMFileViewerPopupComponent;
         await this.popupService.open(comp, {
             title: `t("gallery" , ${RootConfig.module.name})` + ' - ' + parentFolderName,
@@ -3356,88 +3404,12 @@ class AXMDocumentManagerService {
         });
     }
     async openFile(node) {
+        console.log(node);
         const file = await this.documentService.getOne(node.id);
-        if (file && file.fileId) {
-            const fileInfo = await this.fileService.getInfo(file.fileId);
-            if (fileInfo.url) {
-                try {
-                    // Check if the URL looks like base64 - only attempt decoding if it matches base64 pattern
-                    const isBase64 = /^[A-Za-z0-9+/]*={0,2}$/.test(fileInfo.url);
-                    let url = fileInfo.url;
-                    if (isBase64) {
-                        try {
-                            url = atob(fileInfo.url);
-                            console.log('Successfully decoded base64 URL:', url);
-                        }
-                        catch (e) {
-                            console.warn('Failed to decode as base64, using original URL:', e);
-                        }
-                    }
-                    // Make sure URL has a protocol, add https if missing
-                    let finalUrl = url.startsWith('http') ? url : `https://${url}`;
-                    console.log('Attempting to open URL:', finalUrl);
-                    // Try to open in a new window with a friendly message to copy URL if it fails
-                    this.showUrlDialog(finalUrl, file.name);
-                }
-                catch (error) {
-                    console.error('Error processing URL:', error);
-                    this.showUrlDialog(fileInfo.url, file.name, true);
-                }
-            }
-            else {
-                console.warn('No URL found for file:', file);
-                this.dialogService.alert('No URL Available', 'No URL found for this file.', 'warning');
-            }
-        }
-        else {
-            console.warn('File not found or has no fileId:', node.id);
-            this.dialogService.alert('File Not Found', 'File information could not be retrieved.', 'warning');
-        }
-    }
-    /**
-     * Shows a dialog with URL options including a copy button
-     */
-    async showUrlDialog(url, fileName, isError = false) {
-        const title = `Open "${fileName}"`;
-        const message = isError
-            ? 'There was an issue processing the URL. You can try opening it manually:\n' + url
-            : 'Click the button below to open the URL, or copy it to open manually:\n' + url;
-        const result = await this.dialogService.confirm(title, message, 'primary');
-        if (result) {
-            try {
-                window.open(url, '_blank', 'noopener,noreferrer');
-            }
-            catch (e) {
-                console.error('Error opening URL from dialog:', e);
-                this.dialogService.alert('Error', 'Could not open URL in browser', 'danger');
-            }
-        }
-        else {
-            // If user cancels, offer to copy the URL
-            const copyResult = await this.dialogService.confirm('Copy URL', 'Would you like to copy the URL to clipboard?', 'primary');
-            if (copyResult) {
-                try {
-                    navigator.clipboard.writeText(url);
-                    this.dialogService.alert('Success', 'URL copied to clipboard', 'success');
-                }
-                catch (e) {
-                    console.error('Error copying URL to clipboard:', e);
-                    // Fallback for clipboard API not available
-                    const textArea = document.createElement('textarea');
-                    textArea.value = url;
-                    document.body.appendChild(textArea);
-                    textArea.focus();
-                    textArea.select();
-                    document.execCommand('copy');
-                    document.body.removeChild(textArea);
-                    this.dialogService.alert('Success', 'URL copied to clipboard', 'success');
-                }
-            }
-        }
-        return result;
+        console.log(file);
     }
     async rename(node) {
-        const comp = (await import('./acorex-modules-document-management-rename-node-dialog.component-BoODbM0H.mjs'))
+        const comp = (await import('./acorex-modules-document-management-rename-node-dialog.component-Dae6RWb8.mjs'))
             .AXMRenameNodeDialog;
         const popup = await this.popupService.open(comp, {
             title: 't("actions.rename")',
@@ -3445,42 +3417,16 @@ class AXMDocumentManagerService {
                 node,
             },
         });
-        return popup.data?.folder;
+        return popup.data?.result;
     }
     async showDeleteNodesDialog(nodeIds) {
-        const subject = new Subject();
-        subject.subscribe((status) => {
-            console.log(`The process has been "${status}".`);
-        });
-        const dialog = this.dialogService.open({
-            content: 'Are you sure?',
-            title: 'Delete',
-            type: 'danger',
-            buttons: [
-                {
-                    text: 'Yes',
-                    color: 'danger',
-                    onClick: async (e) => {
-                        e.handled = true;
-                        e.source.text = 'Deleting...';
-                        e.source.disabled = true;
-                        e.source.loading = true;
-                        subject.next('Started');
-                        await this.deleteNodes(nodeIds);
-                        subject.complete();
-                        dialog.close();
-                    },
-                },
-                {
-                    text: 'No',
-                    color: 'default',
-                    autofocus: true,
-                    onClick: () => {
-                        dialog.close();
-                    },
-                },
-            ],
+        const result = await this.workflow.execute('delete-entity', {
+            entities: nodeIds.map((node) => ({
+                source: `${RootConfig.module.name}.${node.type == 'folder' ? RootConfig.entities.folder.name : RootConfig.entities.document.name}`,
+                ids: [node.id],
+            })),
         });
+        return result.getOutput('result') ?? false;
     }
     async searchFolders(searchTerm, scope, options) {
         const { result: rootNode } = await this.getRoot(scope, options);
@@ -3511,7 +3457,7 @@ class AXMDocumentManagerService {
         return [...(await this.getAllFolders()), ...(await this.getAllFiles())];
     }
     async showChooseFileDialog() {
-        const comp = (await import('./acorex-modules-document-management-drive-choose.component-CkS8s7zm.mjs')).AXMDocumentDriveChooseComponent;
+        const comp = (await import('./acorex-modules-document-management-drive-choose.component-WoZfDyLK.mjs')).AXMDocumentDriveChooseComponent;
         await this.popupService.open(comp);
     }
     async downloadFile(node) {
@@ -3592,6 +3538,32 @@ class AXMDocumentManagerService {
         const extension = originalName.substring(lastDotIndex);
         return `${nameWithoutExt} copy${extension}`;
     }
+    async uploadFile(folderId) {
+        const folder = await this.folderService.getOne(folderId);
+        var docTypes = folder.documentType;
+        if (folder && docTypes == null) {
+            const comp = (await Promise.resolve().then(function () { return index; })).AXMChooseDocumentTypeComponent;
+            const result = await this.popupService.open(comp);
+            if (result.data != null && result.data.documentType != null) {
+                const { upload, ...metaContext } = result.data.context;
+                //Todo 
+                const fileInfo = await this.fileService.getInfo(upload[0]);
+                const file = await this.documentService.insertOne({
+                    fileId: upload[0],
+                    meta: metaContext,
+                    parentId: folderId,
+                    size: fileInfo.size,
+                    name: `test.${fileInfo.mimeType.split('/')[1]}`,
+                    title: 'Test',
+                });
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        return false;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentManagerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentManagerService, providedIn: 'root' }); }
 }
@@ -3677,13 +3649,19 @@ var AXPDocumentExplorerSettings;
 
 const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withState(() => ({
     // View State
-    viewMode: 'grid',
+    viewMode: 'large-tiles',
     isLoading: false,
     // Navigation State
     currentPath: [],
     currentNode: null,
     loadingFolderId: null,
     navigatingFolderId: null,
+    backHistory: [],
+    // Selection State
+    selectionMode: 'none',
+    selectedNodes: [],
+    // Browse State
+    browseMode: 'file',
     // Sort State
     sortField: 'name',
     sortDirection: 'asc',
@@ -3696,36 +3674,49 @@ const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withSta
     currentDrive: null,
     // File Type State
     fileTypes: [],
+    // Detail Panel State
+    detailPanel: false,
 })), withComputed((store) => ({
     isRoot: computed(() => {
         const node = store.currentNode();
         return node?.id === 'root' || !node?.parentId;
     }),
-    breadcrumb: computed(() => store.currentPath()),
     currentFolder: computed(() => store.currentNode()),
     currentFolderContents: computed(() => ({
         folders: store.folders(),
         files: store.files(),
     })),
-    parentFolder: computed(() => {
-        const currentNode = store.currentNode();
-        return currentNode?.parentId ? store.folders().find((folder) => folder.id === currentNode.parentId) : null;
-    }),
-    isGridView: computed(() => store.viewMode() === 'grid'),
+    isLargeTilesView: computed(() => store.viewMode() === 'large-tiles'),
+    isSmallTilesView: computed(() => store.viewMode() === 'small-tiles'),
     isListView: computed(() => store.viewMode() === 'list'),
-})), withMethods((store, fileTypeService = inject(AXPFileTypeProviderService), driveService = inject(AXMDocumentManagerService), settingService = inject(AXPSettingService)) => ({
-    async initialize(path = 'root') {
+    isDetailsView: computed(() => store.viewMode() === 'details'),
+    isLargeIconsView: computed(() => store.viewMode() === 'large-icons'),
+    isSmallIconsView: computed(() => store.viewMode() === 'small-icons'),
+    isBackAvailable: computed(() => store.backHistory().length > 0),
+    isUpAvailable: computed(() => {
+        const node = store.currentNode();
+        return node?.parentId != null;
+    }),
+    selectedCount: computed(() => store.selectedNodes().length),
+    hasSelectedItems: computed(() => store.selectedNodes().length > 0),
+    hasMultipleSelectedItems: computed(() => store.selectedNodes().length > 1),
+    isMultiSelect: computed(() => store.selectionMode() === 'multiple'),
+    selectedNode: computed(() => store.selectedNodes()[0] ?? null),
+    isDetailPanelOpen: computed(() => store.detailPanel()),
+})), withMethods((store, fileTypeService = inject(AXPFileTypeProviderService), documentTypeService = inject(AXMDocumentTypeService), driveService = inject(AXMDocumentManagerService), settingService = inject(AXPSettingService), translateService = inject(AXTranslationService)) => ({
+    async initialize(options) {
         // Load file types
         const fileTypes = await fileTypeService.items();
         patchState(store, { fileTypes });
         // Load initial settings
-        const viewMode = await settingService.get(AXPDocumentExplorerSettings.ViewMode);
-        const sortField = await settingService.get(AXPDocumentExplorerSettings.SortField);
-        const sortDirection = await settingService.get(AXPDocumentExplorerSettings.SortDirection);
+        const viewMode = await settingService.scope(AXPSettingScope.User).get(AXPDocumentExplorerSettings.ViewMode);
+        const sortField = await settingService.scope(AXPSettingScope.User).get(AXPDocumentExplorerSettings.SortField);
+        const sortDirection = await settingService.scope(AXPSettingScope.User).get(AXPDocumentExplorerSettings.SortDirection);
         patchState(store, {
-            viewMode: viewMode || 'grid',
+            viewMode: viewMode || 'large-tiles',
             sortField: sortField || 'name',
             sortDirection: sortDirection || 'asc',
+            browseMode: options?.browseMode || 'file',
         });
     },
     _load: async (folderId) => {
@@ -3737,7 +3728,7 @@ const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withSta
                 currentNode: node.result,
                 currentPath: node.path,
                 folders: node.result.children?.filter((item) => item.type === 'folder') || [],
-                files: node.result.children?.filter((item) => item.type === 'file') || [],
+                files: node.result.children?.filter((item) => store.browseMode() == 'file' && item.type === 'file') || [],
                 itemsCount: node.result.children?.length || 0,
                 availableSpace: await driveService.getAvailableSpace(),
                 loadingFolderId: null,
@@ -3754,15 +3745,25 @@ const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withSta
         }
     },
     navigateToFolder(folderId) {
+        const currentNode = store.currentNode();
+        if (currentNode) {
+            patchState(store, {
+                backHistory: [...store.backHistory(), { folderId: currentNode.id, path: store.currentPath() }],
+            });
+        }
         patchState(store, { navigatingFolderId: folderId });
     },
     async loadFolderContents(folderId) {
         await this._load(folderId);
+        this.deselectAll();
     },
     setViewMode(mode) {
         patchState(store, { viewMode: mode });
         settingService.scope(AXPSettingScope.User).set(AXPDocumentExplorerSettings.ViewMode, mode);
     },
+    isViewMode(mode) {
+        return store.viewMode() === mode;
+    },
     setSortField(field) {
         patchState(store, { sortField: field });
         settingService.scope(AXPSettingScope.User).set(AXPDocumentExplorerSettings.SortField, field);
@@ -3771,6 +3772,9 @@ const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withSta
         patchState(store, { sortDirection: direction });
         settingService.scope(AXPSettingScope.User).set(AXPDocumentExplorerSettings.SortDirection, direction);
     },
+    setSelectionMode(mode) {
+        patchState(store, { selectionMode: mode });
+    },
     setDrive(scope) {
         patchState(store, { currentDrive: scope });
     },
@@ -3787,6 +3791,107 @@ const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withSta
             type: fileType?.name || 'Unknown',
         };
     },
+    getNodeInfo(node) {
+        // If no node, return a default object
+        if (!node) {
+            return {
+                name: '---',
+                icon: 'fa-light fa-folder',
+                type: 'Folder',
+                sections: [
+                    {
+                        title: 'Details',
+                        details: [],
+                    },
+                ],
+            };
+        }
+        // If the node is a file, return the file info
+        if (node.type === 'file') {
+            const fileTypes = store.fileTypes();
+            const extension = node.name.split('.').pop()?.toLowerCase() || '';
+            const extensions = fileTypes.flatMap((type) => type.extensions);
+            const fileType = extensions.find((e) => e.name === extension);
+            return {
+                name: node.name,
+                icon: fileType?.icon || 'fa-light fa-file',
+                type: 'File',
+                sections: [
+                    {
+                        title: 'Details',
+                        details: [
+                            {
+                                title: 'Description',
+                                content: node.description,
+                                icon: 'fa-solid fa-file-lines',
+                            },
+                            {
+                                title: 'Size',
+                                content: node.size || 0,
+                                format: 'filesize',
+                                icon: 'fa-solid fa-file-lines',
+                            },
+                            {
+                                title: 'Created at',
+                                content: node.createdAt || new Date(),
+                                format: 'datetime',
+                                icon: 'fa-solid fa-calendar-days',
+                            },
+                            {
+                                title: 'Modified at',
+                                content: node.modifiedAt || new Date(),
+                                format: 'datetime',
+                                icon: 'fa-solid fa-calendar-days',
+                            }
+                        ]
+                    }
+                ]
+            };
+        }
+        // If the node is a folder, return the folder info
+        else {
+            return {
+                name: node.name,
+                icon: 'fa-light fa-folder ax-text-yellow-500',
+                type: 'Folder',
+                sections: [
+                    {
+                        title: 'Details',
+                        details: [
+                            {
+                                title: 'Description',
+                                content: node.description,
+                                icon: 'fa-solid fa-file-lines',
+                            },
+                            {
+                                title: 'Items',
+                                content: node.childrenCount,
+                                icon: 'fa-solid fa-file-lines',
+                            },
+                            {
+                                title: 'Size',
+                                content: node.size || 0,
+                                format: 'filesize',
+                                icon: 'fa-solid fa-file-lines',
+                            },
+                            {
+                                title: 'Created at',
+                                content: node.createdAt || new Date(),
+                                format: 'datetime',
+                                icon: 'fa-solid fa-calendar-days',
+                            },
+                            {
+                                title: 'Modified at',
+                                content: node.modifiedAt || new Date(),
+                                format: 'datetime',
+                                icon: 'fa-solid fa-calendar-days',
+                            }
+                        ]
+                    }
+                ]
+            };
+        }
+    },
     sortItems(items) {
         const field = store.sortField();
         const direction = store.sortDirection();
@@ -3797,8 +3902,8 @@ const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withSta
                     comparison = a.name.localeCompare(b.name);
                     break;
                 case 'modified':
-                    const aDate = a.lastModified ? new Date(a.lastModified) : new Date(0);
-                    const bDate = b.lastModified ? new Date(b.lastModified) : new Date(0);
+                    const aDate = a.modifiedAt ? new Date(a.modifiedAt) : new Date(0);
+                    const bDate = b.modifiedAt ? new Date(b.modifiedAt) : new Date(0);
                     comparison = aDate.getTime() - bDate.getTime();
                     break;
                 case 'size':
@@ -3814,6 +3919,115 @@ const AXPDocumentExplorerViewModel = signalStore({ providedIn: 'root' }, withSta
             await this._load(currentFolder.id);
         }
     },
+    navigateToUp() {
+        const currentNode = store.currentNode();
+        const parentId = currentNode?.parentId;
+        if (parentId && currentNode) {
+            patchState(store, {
+                backHistory: [...store.backHistory(), { folderId: currentNode.id, path: store.currentPath() }],
+            });
+            patchState(store, { navigatingFolderId: parentId });
+            this.loadFolderContents(parentId);
+        }
+    },
+    async navigateBack() {
+        const history = store.backHistory();
+        if (history.length === 0) {
+            return;
+        }
+        const lastEntry = history[history.length - 1];
+        patchState(store, { backHistory: history.slice(0, history.length - 1) });
+        patchState(store, { navigatingFolderId: lastEntry.folderId });
+        await this.loadFolderContents(lastEntry.folderId);
+    },
+    async openFile(file) {
+        await driveService.openFile(file);
+    },
+    //TODO: Delete only one node at a time  
+    async deleteNodes(nodes = store.selectedNodes()) {
+        const result = await driveService.showDeleteNodesDialog(nodes);
+        if (result) {
+            this.deselectAll();
+            await this.refresh();
+        }
+    },
+    toggleSelect(node) {
+        if (store.selectionMode() === 'multiple') {
+            patchState(store, { selectedNodes: store.selectedNodes().includes(node) ? store.selectedNodes().filter(n => n.id !== node.id) : [...store.selectedNodes(), node] });
+        }
+        else {
+            patchState(store, { selectedNodes: [node] });
+        }
+        console.log(store.currentPath());
+    },
+    isItemSelected(node) {
+        return store.selectedNodes().some(selectedNode => selectedNode.id === node.id);
+    },
+    selectAll() {
+        patchState(store, { selectedNodes: [...store.folders(), ...store.files()] });
+    },
+    deselectAll() {
+        patchState(store, { selectedNodes: [] });
+    },
+    openDetailPanel() {
+        patchState(store, { detailPanel: true });
+    },
+    closeDetailPanel() {
+        patchState(store, { detailPanel: false });
+    },
+    toggleDetailPanel() {
+        patchState(store, { detailPanel: !store.detailPanel() });
+    },
+    //#region Menu Items
+    async getFolderAddMenuItems() {
+        const documentTypes = await documentTypeService.query();
+        const items = documentTypes.items.map(item => ({
+            name: item.name,
+            title: item.title,
+        })) ?? [];
+        //
+        const scope = RootConfig.config.i18n;
+        return [
+            {
+                title: await translateService.translateAsync('actions.create-folder', { scope }),
+                icon: 'fa-light fa-folder-plus',
+                break: true,
+                command: {
+                    name: 'new-folder',
+                    options: {
+                        folderId: store.currentFolder()?.id,
+                    }
+                }
+            },
+            {
+                title: await translateService.translateAsync('actions.upload-file', { scope }),
+                icon: 'fa-light fa-file-arrow-up',
+                items: items
+            },
+        ];
+    },
+    async getFolderActionMenuItems() {
+        return [
+            {
+                name: 'refresh',
+                title: 'Refresh',
+                icon: 'fa-light fa-rotate-right',
+                break: true,
+            },
+            {
+                name: 'delete',
+                title: 'Delete',
+                color: 'danger',
+                icon: 'fa-light fa-trash',
+            },
+        ];
+    },
+    //#endregion
+    //#region Context Menu Items
+    async getContextMenuItems() {
+        return [...await this.getFolderAddMenuItems(), ...await this.getFolderActionMenuItems()];
+    },
+    //#endregion
 })));
 
 class AXMDocumentExplorerComponent {
@@ -3823,22 +4037,51 @@ class AXMDocumentExplorerComponent {
         this.rootContextMenu = viewChild('rootContextMenu');
         this.driveService = inject(AXMDocumentManagerService);
         this.translateService = inject(AXTranslationService);
+        this.layout = inject(AXPLayoutThemeService);
+        this.browseMode = input('file');
+        this.viewMode = input();
+        this.selectionMode = input('none');
+        this.showContextMenu = input(true);
+        this.view = signal(null);
+        this.viewMap = {
+            list: async () => (await import('./acorex-modules-document-management-list-view.component-B6J6Tokv.mjs')).AXMDocumentExplorerListViewComponent,
+            'small-tiles': async () => (await import('./acorex-modules-document-management-small-tiles-view.component-DDKdWg8I.mjs')).AXMDocumentExplorerSmallTilesViewComponent,
+            'large-tiles': async () => (await import('./acorex-modules-document-management-large-tiles-view.component-ByWrKvZe.mjs')).AXMDocumentExplorerLargeTilesViewComponent,
+            details: async () => (await import('./acorex-modules-document-management-details-view.component-BHcu_gYH.mjs')).AXMDocumentExplorerDetailsViewComponent,
+            'large-icons': async () => (await import('./acorex-modules-document-management-large-icons-view.component-DvriE0YR.mjs')).AXMDocumentExplorerLargeIconsViewComponent,
+            'small-icons': async () => (await import('./acorex-modules-document-management-small-icons-view.component-TrYeB22e.mjs')).AXMDocumentExplorerSmallIconsViewComponent,
+        };
         this.#effect = effect(() => {
             const navigatingFolderId = this.vm.loadingFolderId();
             if (!navigatingFolderId) {
                 setTimeout(() => {
                     this.contextMenu()?.refresh();
                     this.rootContextMenu()?.refresh();
-                }, 100);
+                }, 300);
+            }
+        });
+        this.#effect2 = effect(() => {
+            if (this.viewMode()) {
+                this.vm.setViewMode(this.viewMode());
             }
+            if (this.selectionMode()) {
+                this.vm.setSelectionMode(this.selectionMode());
+            }
+        });
+        this.#effect3 = effect(async () => {
+            const func = get$1(this.viewMap, this.vm.viewMode()) ?? this.viewMap['large-tiles'];
+            const comp = await func();
+            this.view.set(comp);
         });
     }
     #effect;
+    #effect2;
+    #effect3;
     handleNavigateToFolder(folderId) {
         this.vm.navigateToFolder(folderId);
         console.log(this.vm.currentFolder());
     }
-    // Context Menu Handlers
+    //#region Menu and Context Menu
     async handleContextMenuOnOpening(e) {
         const node = get$1(e.targetElement, '__data__');
         if (!node) {
@@ -3973,37 +4216,17 @@ class AXMDocumentExplorerComponent {
             },
         ];
         if (node.type == 'file') {
-            e.items.splice(e.items.length - 1, 0, openWith);
+            e.items.splice(1, 0, openWith);
         }
     }
-    handleContextMenuRootOnOpening(e) {
-        //TODO: check async translate method in acorex
-        const scope = RootConfig.config.i18n;
-        e.items = [
-            {
-                name: 'new-folder',
-                text: this.translateService.translateSync('actions.create-folder', { scope }),
-                icon: 'fa-light fa-folder-plus',
-            },
-            {
-                name: 'upload-file',
-                text: this.translateService.translateSync('actions.upload-file', { scope }),
-                icon: 'fa-light fa-file-arrow-up',
-                break: true,
-            },
-            {
-                name: 'refresh',
-                text: 'Refresh',
-                icon: 'fa-light fa-rotate-right',
-                break: true,
-            },
-            {
-                name: 'delete',
-                text: 'Delete',
-                color: 'danger',
-                icon: 'fa-light fa-trash',
-            },
-        ];
+    async handleContextMenuRootOnOpening(e) {
+        //TODO: check async translate method in acorex  
+        const items = [...await this.vm.getFolderAddMenuItems(), ...await this.vm.getFolderActionMenuItems()];
+        const mappedItems = items.map(m => ({
+            ...m,
+            text: m.title,
+        }));
+        e.items.push(...mappedItems);
     }
     async handleContextMenuItemClick(e) {
         const node = e.item.data;
@@ -4031,16 +4254,16 @@ class AXMDocumentExplorerComponent {
                 // Handle paste operation
                 break;
             case 'move-to':
-                this.moveNode(node);
+                this.moveTo(node);
                 break;
             case 'copy-to':
-                this.copyNodeToNewPath(node);
+                this.copyTo(node);
                 break;
             case 'rename':
                 this.renameNode(node);
                 break;
             case 'delete':
-                this.deleteNode(node);
+                this.vm.deleteNodes([node]);
                 break;
             case 'refresh':
                 this.vm.refresh();
@@ -4050,6 +4273,7 @@ class AXMDocumentExplorerComponent {
                 break;
         }
     }
+    //#endregion 
     async openGallery(node) {
         await this.driveService.showFileViewerPopup(node);
     }
@@ -4068,12 +4292,6 @@ class AXMDocumentExplorerComponent {
             }
         }
     }
-    async deleteNode(node) {
-        if (node) {
-            await this.driveService.showDeleteNodesDialog([node.id]);
-            await this.vm.refresh();
-        }
-    }
     async renameNode(node) {
         if (node) {
             const result = await this.driveService.rename(node);
@@ -4085,10 +4303,10 @@ class AXMDocumentExplorerComponent {
     async uploadFile(node) {
         const folderId = node?.id ?? this.vm.currentFolder()?.id;
         if (folderId) {
-            // const result = await this.driveService.showCreateFolderDialog(this.vm.currentFolder()?.id);
-            // if (result) {
-            //   await this.vm.refresh();
-            // }
+            const res = await this.driveService.uploadFile(folderId);
+            if (res) {
+                await this.vm.refresh();
+            }
         }
     }
     async chooseFile() {
@@ -4106,50 +4324,28 @@ class AXMDocumentExplorerComponent {
             }
         }
     }
-    async moveNode(node) {
+    async moveTo(node) {
         if (node) {
-            const result = await this.driveService.showTreeFolderPopup();
+            const result = await this.driveService.moveTo({ browseMode: 'folder', node: node });
             if (result) {
-                if (node.type === 'folder') {
-                    await this.driveService.updateFolder(node.id, { parentId: result });
-                }
-                else {
-                    await this.driveService.updateFile(node.id, { parentId: result });
-                }
                 await this.vm.refresh();
             }
         }
     }
-    async copyNodeToNewPath(node) {
+    async copyTo(node) {
         if (node) {
-            const result = await this.driveService.showTreeFolderPopup();
+            const result = await this.driveService.copyTo({ browseMode: 'folder', node: node });
             if (result) {
-                if (node.type === 'folder') {
-                    await this.driveService.createFolder({
-                        name: node.name,
-                        parentId: result,
-                        color: '#ffffff',
-                    });
-                }
-                else {
-                    await this.driveService.createFile({
-                        title: node.name,
-                        name: node.name,
-                        parentId: result,
-                        //TODO upload file to file storage
-                        fileId: '',
-                    });
-                }
                 await this.vm.refresh();
             }
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentExplorerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXMDocumentExplorerComponent, isStandalone: true, selector: "axm-document-explorer", viewQueries: [{ propertyName: "contextMenu", first: true, predicate: ["itemsContextMenu"], descendants: true, isSignal: true }, { propertyName: "rootContextMenu", first: true, predicate: ["rootContextMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Content -->\n<div class=\"content\">\n  <!-- Empty State -->\n  @if (vm.folders().length === 0 && vm.files().length === 0) {\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-py-16 ax-h-full\">\n    <ax-icon icon=\"fa-light fa-folder-open\" class=\"ax-text-6xl ax-mb-4\"></ax-icon>\n    <h3 class=\"ax-text-xl ax-font-medium ax-mb-2\">No Items Found</h3>\n    <p class=\"\">This folder is empty. Add some files or folders to get started.</p>\n  </div>\n  } @else {\n  <!-- Grid View -->\n  @if (vm.isGridView()) {\n  <!-- Folders Section -->\n  @if (vm.folders().length > 0) {\n  <div class=\"section\">\n    <h3 class=\"section-title\">Folders</h3>\n    <div class=\"items-grid\">\n      @for (folder of vm.folders(); track folder.id) {\n      <ng-container [ngTemplateOutlet]=\"gridFolderTemplate\" [ngTemplateOutletContext]=\"{ $implicit: folder }\">\n      </ng-container>\n      }\n    </div>\n  </div>\n  }\n\n  <!-- Files Section -->\n  @if (vm.files().length > 0) {\n  <div class=\"section\">\n    <h3 class=\"section-title\">Files</h3>\n    <div class=\"items-grid\">\n      @for (file of vm.files(); track file.id) {\n      <ng-container [ngTemplateOutlet]=\"gridFileTemplate\" [ngTemplateOutletContext]=\"{ $implicit: file }\">\n      </ng-container>\n      }\n    </div>\n  </div>\n  }\n  <!-- Grid View End -->\n  }\n\n  <!-- List View -->\n  @if (vm.isListView()) {\n  <div class=\"list-view\">\n    <table class=\"items-table\">\n      <thead>\n        <tr>\n          <th class=\"name-column\">Name</th>\n          <th class=\"type-column\">Type</th>\n          <th class=\"size-column\">Size</th>\n          <th class=\"date-column\">Last Modified</th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (folder of vm.folders(); track folder.id) {\n        <ng-container [ngTemplateOutlet]=\"listFolderTemplate\" [ngTemplateOutletContext]=\"{ $implicit: folder }\">\n        </ng-container>\n        } @for (file of vm.files(); track file.id) {\n        <ng-container [ngTemplateOutlet]=\"listFileTemplate\" [ngTemplateOutletContext]=\"{ $implicit: file }\">\n        </ng-container>\n        }\n      </tbody>\n    </table>\n  </div>\n  } }\n</div>\n\n<!-- Grid View Templates -->\n<ng-template #gridFolderTemplate let-folder>\n  <div\n    class=\"ax-group ax-cursor-pointer axp-explorer-item\"\n    [axp-data]=\"folder\"\n    (dblclick)=\"handleNavigateToFolder(folder.id)\"\n  >\n    <div class=\"ax-flex ax-flex-col ax-gap-1 ax-p-4 ax-rounded-lg ax-border ax-lighter-surface\">\n      <div class=\"ax-text-yellow-400 fa-3x ax-mb-2\" style=\"--fa-animation-duration: 2s\">\n        @if (vm.isLoadingFolder(folder.id)) {\n        <ng-container [ngTemplateOutlet]=\"folderLoading\"> </ng-container>\n        } @else {\n        <ax-icon icon=\"fa-solid fa-folder-closed \"></ax-icon>\n        }\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-font-semibold ax-w-full\">\n        <span class=\"ax-text-sm ax-truncate ax-text-start\">{{ folder.name }}</span>\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-w-full ax-font-semibold ax-opacity-65\">\n        <span class=\"ax-text-xs ax-text-neutral\">{{ folder.childrenCount }} items</span>\n        <span class=\"ax-text-xs ax-text-neutral\">{{\n          folder.lastModified | format : 'datetime' : { format: 'datetime' } | async\n        }}</span>\n      </div>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #gridFileTemplate let-file>\n  @let fileInfo = vm.getFileInfo(file.name);\n  <div class=\"ax-group ax-cursor-pointer axp-explorer-item\" [axp-data]=\"file\" (dblclick)=\"openFile(file)\">\n    <div class=\"ax-flex ax-flex-col ax-gap-1 ax-p-4 ax-rounded-lg ax-border ax-lighter-surface\">\n      <div class=\"ax-text-yellow-400 fa-3x ax-mb-2\" style=\"--fa-animation-duration: 2s\">\n        <i class=\"fa-fw  {{ fileInfo.icon }} fa-solid\"></i>\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-font-semibold ax-w-full\">\n        <span class=\"ax-text-sm ax-truncate ax-text-start\">{{ file.name }}</span>\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-w-full ax-font-semibold ax-opacity-65\">\n        <span class=\"ax-text-xs ax-text-neutral\">{{ file.size | format : 'filesize' | async }}</span>\n        <span class=\"ax-text-xs ax-text-neutral\">{{\n          file.lastModified | format : 'datetime' : { format: 'datetime' } | async\n        }}</span>\n      </div>\n    </div>\n  </div>\n</ng-template>\n\n<!-- List View Templates -->\n<ng-template #listFolderTemplate let-folder>\n  <tr class=\"folder-row\" (dblclick)=\"handleNavigateToFolder(folder.id)\">\n    <td class=\"name-column axp-explorer-item\" [axp-data]=\"folder\">\n      <div class=\"item-name\">\n        @if (vm.isLoadingFolder(folder.id)) {\n        <ng-container [ngTemplateOutlet]=\"folderLoading\"> </ng-container>\n        } @else {\n        <i class=\"fas fa-folder-closed\"></i>\n        }\n        <span>{{ folder.name }}</span>\n      </div>\n    </td>\n    <td class=\"type-column axp-explorer-item\" [axp-data]=\"folder\">Folder</td>\n    <td class=\"size-column axp-explorer-item\" [axp-data]=\"folder\">{{ folder.size | format : 'filesize' | async }}</td>\n    <td class=\"date-column axp-explorer-item\" [axp-data]=\"folder\">\n      {{ folder.lastModified | format : 'datetime' : { format: 'datetime' } | async }}\n    </td>\n  </tr>\n</ng-template>\n\n<ng-template #listFileTemplate let-file>\n  <tr class=\"file-row\">\n    @let fileInfo = vm.getFileInfo(file.name);\n    <td class=\"name-column axp-explorer-item\" [axp-data]=\"file\">\n      <div class=\"item-name hover:ax-underline\">\n        <i class=\"fa-fw {{ fileInfo.icon }} fa-solid\"></i>\n        <span>{{ file.name }}</span>\n      </div>\n    </td>\n    <td class=\"type-column axp-explorer-item\" [axp-data]=\"file\">{{ fileInfo.type }}</td>\n    <td class=\"size-column axp-explorer-item\" [axp-data]=\"file\">{{ file.size | format : 'filesize' | async }}</td>\n    <td class=\"date-column axp-explorer-item\" [axp-data]=\"file\">\n      {{ file.lastModified | format : 'datetime' : { format: 'datetime' } | async }}\n    </td>\n  </tr>\n</ng-template>\n\n<ng-template #folderLoading>\n  <i class=\"fa-light fa-spinner fa-spin-pulse ax-text-2xl\"></i>\n</ng-template>\n\n<!-- Context Menu-->\n<ax-context-menu\n  #itemsContextMenu\n  [target]=\"'.axp-explorer-item'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuOnOpening($event)\"\n>\n</ax-context-menu>\n\n<ax-context-menu\n  #rootContextMenu\n  [target]=\"'axm-document-explorer'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuRootOnOpening($event)\"\n>\n</ax-context-menu>\n", styles: [":host{display:flex;height:100%;flex:1 1 0%;flex-direction:column;gap:1rem}:host .content{flex:1 1 0%;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none;overflow-y:auto}:host .content .loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}:host .content .loading-state i{font-size:1.5rem;line-height:2rem}:host .content .section{margin-bottom:2rem}:host .content .section:last-child{margin-bottom:0}:host .content .section .section-title{margin-bottom:1rem;font-size:1.125rem;line-height:1.75rem;font-weight:500}:host .content .section .items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}:host .content .list-view .items-table{width:100%;border-collapse:collapse}:host .content .list-view .items-table th{border-bottom-width:1px;padding:.75rem;text-align:start;font-weight:500;background-color:rgb(var(--ax-sys-color-surface));color:rgb(var(--ax-sys-color-on-surface));border-color:rgb(var(--ax-sys-color-border-surface))}:host .content .list-view .items-table th.name-column{width:50%}:host .content .list-view .items-table th.type-column{width:20%}:host .content .list-view .items-table th.size-column{width:15%}:host .content .list-view .items-table th.date-column{width:15%}:host .content .list-view .items-table td{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-surface),var(--tw-border-opacity, 1));padding:.75rem}:host .content .list-view .items-table td.name-column .item-name{display:flex;align-items:center;gap:.5rem}:host .content .list-view .items-table td.name-column .item-name i{font-size:1.25rem;line-height:1.75rem}:host .content .list-view .items-table tr{cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:host .content .list-view .items-table tr:hover{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lighter-surface),var(--tw-bg-opacity, 1))}:host .content .list-view .items-table tr.folder-row td .item-name i{--tw-text-opacity: 1;color:rgb(234 179 8 / var(--tw-text-opacity, 1))}.animation-duration-2s{--fa-animation-duration: 2s}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i5$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXFormatModule }, { kind: "pipe", type: i3.AXFormatPipe, name: "format" }, { kind: "ngmodule", type: AXDateTimeModule }, { kind: "ngmodule", type: AXMenuModule }, { kind: "component", type: i4.AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "items", "target"], outputs: ["onItemClick", "onOpening"] }, { kind: "directive", type: AXPElementDataDirective, selector: "[axp-data]", inputs: ["axp-data", "axp-data-path"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXMDocumentExplorerComponent, isStandalone: true, selector: "axm-document-explorer", inputs: { browseMode: { classPropertyName: "browseMode", publicName: "browseMode", isSignal: true, isRequired: false, transformFunction: null }, viewMode: { classPropertyName: "viewMode", publicName: "viewMode", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, showContextMenu: { classPropertyName: "showContextMenu", publicName: "showContextMenu", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "contextMenu", first: true, predicate: ["itemsContextMenu"], descendants: true, isSignal: true }, { propertyName: "rootContextMenu", first: true, predicate: ["rootContextMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Empty State -->\n<div class=\"view-container\">\n  @if (vm.folders().length === 0 && vm.files().length === 0) {\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-py-16 ax-h-full\">\n    <ax-icon icon=\"fa-light fa-folder-open\" class=\"ax-text-6xl ax-mb-4\"></ax-icon>\n    <h3 class=\"ax-text-xl ax-font-medium ax-mb-2\">No Items Found</h3>\n    <p class=\"\">This folder is empty. Add some files or folders to get started.</p>\n  </div>\n  } @else {\n  <ng-container [ngComponentOutlet]=\"view()\"></ng-container>\n  }\n</div>\n\n<!-- Context Menu -->\n@if (showContextMenu()) {\n<!-- Item Context Menu-->\n<ax-context-menu\n  #itemsContextMenu\n  [target]=\"'.__explorer-item'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuOnOpening($event)\"\n>\n</ax-context-menu>\n<!-- Root Context Menu-->\n<ax-context-menu\n  #rootContextMenu\n  [target]=\"'.view-container'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuRootOnOpening($event)\"\n>\n</ax-context-menu>\n}\n", styles: ["axm-document-explorer{display:flex;height:max-content;min-height:100%;width:100%;flex-direction:row;gap:1rem;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}axm-document-explorer>.view-container{display:flex;flex:1 1 0%;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none;flex-direction:column;gap:1rem}axm-document-explorer .animation-duration-2s{--fa-animation-duration: 2s}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXDateTimeModule }, { kind: "ngmodule", type: AXMenuModule }, { kind: "component", type: i3$1.AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "items", "target"], outputs: ["onItemClick", "onOpening"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentExplorerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axm-document-explorer', standalone: true, imports: [
+            args: [{ selector: 'axm-document-explorer', standalone: true, encapsulation: ViewEncapsulation.None, imports: [
                         CommonModule,
                         RouterModule,
                         AXDecoratorModule,
@@ -4157,10 +4353,117 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                         AXFormatModule,
                         AXDateTimeModule,
                         AXMenuModule,
-                        AXPElementDataDirective,
-                    ], template: "<!-- Content -->\n<div class=\"content\">\n  <!-- Empty State -->\n  @if (vm.folders().length === 0 && vm.files().length === 0) {\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-py-16 ax-h-full\">\n    <ax-icon icon=\"fa-light fa-folder-open\" class=\"ax-text-6xl ax-mb-4\"></ax-icon>\n    <h3 class=\"ax-text-xl ax-font-medium ax-mb-2\">No Items Found</h3>\n    <p class=\"\">This folder is empty. Add some files or folders to get started.</p>\n  </div>\n  } @else {\n  <!-- Grid View -->\n  @if (vm.isGridView()) {\n  <!-- Folders Section -->\n  @if (vm.folders().length > 0) {\n  <div class=\"section\">\n    <h3 class=\"section-title\">Folders</h3>\n    <div class=\"items-grid\">\n      @for (folder of vm.folders(); track folder.id) {\n      <ng-container [ngTemplateOutlet]=\"gridFolderTemplate\" [ngTemplateOutletContext]=\"{ $implicit: folder }\">\n      </ng-container>\n      }\n    </div>\n  </div>\n  }\n\n  <!-- Files Section -->\n  @if (vm.files().length > 0) {\n  <div class=\"section\">\n    <h3 class=\"section-title\">Files</h3>\n    <div class=\"items-grid\">\n      @for (file of vm.files(); track file.id) {\n      <ng-container [ngTemplateOutlet]=\"gridFileTemplate\" [ngTemplateOutletContext]=\"{ $implicit: file }\">\n      </ng-container>\n      }\n    </div>\n  </div>\n  }\n  <!-- Grid View End -->\n  }\n\n  <!-- List View -->\n  @if (vm.isListView()) {\n  <div class=\"list-view\">\n    <table class=\"items-table\">\n      <thead>\n        <tr>\n          <th class=\"name-column\">Name</th>\n          <th class=\"type-column\">Type</th>\n          <th class=\"size-column\">Size</th>\n          <th class=\"date-column\">Last Modified</th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (folder of vm.folders(); track folder.id) {\n        <ng-container [ngTemplateOutlet]=\"listFolderTemplate\" [ngTemplateOutletContext]=\"{ $implicit: folder }\">\n        </ng-container>\n        } @for (file of vm.files(); track file.id) {\n        <ng-container [ngTemplateOutlet]=\"listFileTemplate\" [ngTemplateOutletContext]=\"{ $implicit: file }\">\n        </ng-container>\n        }\n      </tbody>\n    </table>\n  </div>\n  } }\n</div>\n\n<!-- Grid View Templates -->\n<ng-template #gridFolderTemplate let-folder>\n  <div\n    class=\"ax-group ax-cursor-pointer axp-explorer-item\"\n    [axp-data]=\"folder\"\n    (dblclick)=\"handleNavigateToFolder(folder.id)\"\n  >\n    <div class=\"ax-flex ax-flex-col ax-gap-1 ax-p-4 ax-rounded-lg ax-border ax-lighter-surface\">\n      <div class=\"ax-text-yellow-400 fa-3x ax-mb-2\" style=\"--fa-animation-duration: 2s\">\n        @if (vm.isLoadingFolder(folder.id)) {\n        <ng-container [ngTemplateOutlet]=\"folderLoading\"> </ng-container>\n        } @else {\n        <ax-icon icon=\"fa-solid fa-folder-closed \"></ax-icon>\n        }\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-font-semibold ax-w-full\">\n        <span class=\"ax-text-sm ax-truncate ax-text-start\">{{ folder.name }}</span>\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-w-full ax-font-semibold ax-opacity-65\">\n        <span class=\"ax-text-xs ax-text-neutral\">{{ folder.childrenCount }} items</span>\n        <span class=\"ax-text-xs ax-text-neutral\">{{\n          folder.lastModified | format : 'datetime' : { format: 'datetime' } | async\n        }}</span>\n      </div>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #gridFileTemplate let-file>\n  @let fileInfo = vm.getFileInfo(file.name);\n  <div class=\"ax-group ax-cursor-pointer axp-explorer-item\" [axp-data]=\"file\" (dblclick)=\"openFile(file)\">\n    <div class=\"ax-flex ax-flex-col ax-gap-1 ax-p-4 ax-rounded-lg ax-border ax-lighter-surface\">\n      <div class=\"ax-text-yellow-400 fa-3x ax-mb-2\" style=\"--fa-animation-duration: 2s\">\n        <i class=\"fa-fw  {{ fileInfo.icon }} fa-solid\"></i>\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-font-semibold ax-w-full\">\n        <span class=\"ax-text-sm ax-truncate ax-text-start\">{{ file.name }}</span>\n      </div>\n      <div class=\"ax-flex ax-justify-between ax-w-full ax-font-semibold ax-opacity-65\">\n        <span class=\"ax-text-xs ax-text-neutral\">{{ file.size | format : 'filesize' | async }}</span>\n        <span class=\"ax-text-xs ax-text-neutral\">{{\n          file.lastModified | format : 'datetime' : { format: 'datetime' } | async\n        }}</span>\n      </div>\n    </div>\n  </div>\n</ng-template>\n\n<!-- List View Templates -->\n<ng-template #listFolderTemplate let-folder>\n  <tr class=\"folder-row\" (dblclick)=\"handleNavigateToFolder(folder.id)\">\n    <td class=\"name-column axp-explorer-item\" [axp-data]=\"folder\">\n      <div class=\"item-name\">\n        @if (vm.isLoadingFolder(folder.id)) {\n        <ng-container [ngTemplateOutlet]=\"folderLoading\"> </ng-container>\n        } @else {\n        <i class=\"fas fa-folder-closed\"></i>\n        }\n        <span>{{ folder.name }}</span>\n      </div>\n    </td>\n    <td class=\"type-column axp-explorer-item\" [axp-data]=\"folder\">Folder</td>\n    <td class=\"size-column axp-explorer-item\" [axp-data]=\"folder\">{{ folder.size | format : 'filesize' | async }}</td>\n    <td class=\"date-column axp-explorer-item\" [axp-data]=\"folder\">\n      {{ folder.lastModified | format : 'datetime' : { format: 'datetime' } | async }}\n    </td>\n  </tr>\n</ng-template>\n\n<ng-template #listFileTemplate let-file>\n  <tr class=\"file-row\">\n    @let fileInfo = vm.getFileInfo(file.name);\n    <td class=\"name-column axp-explorer-item\" [axp-data]=\"file\">\n      <div class=\"item-name hover:ax-underline\">\n        <i class=\"fa-fw {{ fileInfo.icon }} fa-solid\"></i>\n        <span>{{ file.name }}</span>\n      </div>\n    </td>\n    <td class=\"type-column axp-explorer-item\" [axp-data]=\"file\">{{ fileInfo.type }}</td>\n    <td class=\"size-column axp-explorer-item\" [axp-data]=\"file\">{{ file.size | format : 'filesize' | async }}</td>\n    <td class=\"date-column axp-explorer-item\" [axp-data]=\"file\">\n      {{ file.lastModified | format : 'datetime' : { format: 'datetime' } | async }}\n    </td>\n  </tr>\n</ng-template>\n\n<ng-template #folderLoading>\n  <i class=\"fa-light fa-spinner fa-spin-pulse ax-text-2xl\"></i>\n</ng-template>\n\n<!-- Context Menu-->\n<ax-context-menu\n  #itemsContextMenu\n  [target]=\"'.axp-explorer-item'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuOnOpening($event)\"\n>\n</ax-context-menu>\n\n<ax-context-menu\n  #rootContextMenu\n  [target]=\"'axm-document-explorer'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuRootOnOpening($event)\"\n>\n</ax-context-menu>\n", styles: [":host{display:flex;height:100%;flex:1 1 0%;flex-direction:column;gap:1rem}:host .content{flex:1 1 0%;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none;overflow-y:auto}:host .content .loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}:host .content .loading-state i{font-size:1.5rem;line-height:2rem}:host .content .section{margin-bottom:2rem}:host .content .section:last-child{margin-bottom:0}:host .content .section .section-title{margin-bottom:1rem;font-size:1.125rem;line-height:1.75rem;font-weight:500}:host .content .section .items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}:host .content .list-view .items-table{width:100%;border-collapse:collapse}:host .content .list-view .items-table th{border-bottom-width:1px;padding:.75rem;text-align:start;font-weight:500;background-color:rgb(var(--ax-sys-color-surface));color:rgb(var(--ax-sys-color-on-surface));border-color:rgb(var(--ax-sys-color-border-surface))}:host .content .list-view .items-table th.name-column{width:50%}:host .content .list-view .items-table th.type-column{width:20%}:host .content .list-view .items-table th.size-column{width:15%}:host .content .list-view .items-table th.date-column{width:15%}:host .content .list-view .items-table td{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-surface),var(--tw-border-opacity, 1));padding:.75rem}:host .content .list-view .items-table td.name-column .item-name{display:flex;align-items:center;gap:.5rem}:host .content .list-view .items-table td.name-column .item-name i{font-size:1.25rem;line-height:1.75rem}:host .content .list-view .items-table tr{cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:host .content .list-view .items-table tr:hover{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lighter-surface),var(--tw-bg-opacity, 1))}:host .content .list-view .items-table tr.folder-row td .item-name i{--tw-text-opacity: 1;color:rgb(234 179 8 / var(--tw-text-opacity, 1))}.animation-duration-2s{--fa-animation-duration: 2s}\n"] }]
+                    ], template: "<!-- Empty State -->\n<div class=\"view-container\">\n  @if (vm.folders().length === 0 && vm.files().length === 0) {\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-py-16 ax-h-full\">\n    <ax-icon icon=\"fa-light fa-folder-open\" class=\"ax-text-6xl ax-mb-4\"></ax-icon>\n    <h3 class=\"ax-text-xl ax-font-medium ax-mb-2\">No Items Found</h3>\n    <p class=\"\">This folder is empty. Add some files or folders to get started.</p>\n  </div>\n  } @else {\n  <ng-container [ngComponentOutlet]=\"view()\"></ng-container>\n  }\n</div>\n\n<!-- Context Menu -->\n@if (showContextMenu()) {\n<!-- Item Context Menu-->\n<ax-context-menu\n  #itemsContextMenu\n  [target]=\"'.__explorer-item'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuOnOpening($event)\"\n>\n</ax-context-menu>\n<!-- Root Context Menu-->\n<ax-context-menu\n  #rootContextMenu\n  [target]=\"'.view-container'\"\n  [orientation]=\"'vertical'\"\n  [closeOn]=\"'leave'\"\n  (onItemClick)=\"handleContextMenuItemClick($event)\"\n  (onOpening)=\"handleContextMenuRootOnOpening($event)\"\n>\n</ax-context-menu>\n}\n", styles: ["axm-document-explorer{display:flex;height:max-content;min-height:100%;width:100%;flex-direction:row;gap:1rem;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}axm-document-explorer>.view-container{display:flex;flex:1 1 0%;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none;flex-direction:column;gap:1rem}axm-document-explorer .animation-duration-2s{--fa-animation-duration: 2s}\n"] }]
+        }] });
+
+class AXMChooseDocumentTypeComponent extends AXBasePageComponent {
+    constructor() {
+        super(...arguments);
+        this.documentTypeService = inject(AXMDocumentTypeService);
+        this.fileTypeService = inject(AXPFileTypeProviderService);
+        this.documentTypeSelected = signal([]);
+        this.context = signal({});
+        this.documentTypesSource = new AXDataSource({
+            load: async (_) => {
+                return await this.documentTypeService.query();
+            },
+            pageSize: 10,
+            key: 'id',
+        });
+        this.uploadNode = signal({
+            name: 'upload',
+            path: 'upload',
+            type: 'file',
+            options: {
+                accept: '.pdf',
+                multiple: false,
+            },
+        });
+    }
+    async handleChangeDocumentType(event) {
+        const item = event.component.selectedItems[0];
+        this.uploadNode.update((old) => {
+            return {
+                ...old,
+                options: {
+                    multiple: item.isMultiple,
+                    accept: item.name == 'any' ? '' : item.type.selectedItems.map((i) => `.${i.name.split('.')[1]}`).join(','),
+                },
+            };
+        });
+        for (const i of item.meta) {
+            console.log(JSON.parse(i.interface)['children'][0]);
+            if (!get(i, '__node__')) {
+                set$1(i, '__node__', typeof i.interface == 'function' ? await i.interface() :
+                    JSON.parse(i.interface)['children'][0]['children'][0]);
+            }
+        }
+        this.documentTypeSelected.set([item]);
+    }
+    handleContextChanged(e) {
+        this.context.set(e.data);
+    }
+    handleCancel() {
+        this.close();
+    }
+    handlesubmit() {
+        this.close({
+            documentType: this.documentTypeSelected(),
+            context: this.context(),
+        });
+    }
+    getNode(meta) {
+        console.log(meta);
+        return get(meta, '__node__');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMChooseDocumentTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXMChooseDocumentTypeComponent, isStandalone: true, selector: "axm-choose-document-type", usesInheritance: true, ngImport: i0, template: "<ax-header> </ax-header>\n<ax-content>\n  <div class=\"ax-flex ax-flex-col ax-py-4 ax-px-6\">\n    <ax-label> Select Document Type </ax-label>\n    <ax-select-box\n      [dataSource]=\"documentTypesSource\"\n      textField=\"title\"\n      valueField=\"id\"\n      (onValueChanged)=\"handleChangeDocumentType($event)\"\n    >\n    </ax-select-box>\n    @if (documentTypeSelected().length > 0) {\n      <axp-widgets-container [context]=\"context()\" (onContextChanged)=\"handleContextChanged($event)\">\n      <ax-form>\n        @for(doc of documentTypeSelected()[0].meta; track doc.name) {\n          <ax-form-field>\n            <ax-label >{{ doc.title }}</ax-label>\n            <ng-container axp-widget-renderer [node]=\"getNode(doc)\" [mode]=\"'edit'\"></ng-container>\n          </ax-form-field>\n        }\n\n        <ng-container axp-widget-renderer [node]=\"uploadNode()\" mode=\"edit\"></ng-container>\n\n      </ax-form>\n    </axp-widgets-container>\n    }\n  </div>\n</ax-content>\n<ax-footer>\n  <ax-suffix>\n    <ax-button text=\"Cancel\" look=\"blank\" (onClick)=\"handleCancel()\"> </ax-button>\n    <ax-button text=\"Next\" (onClick)=\"handlesubmit()\"> </ax-button>\n  </ax-suffix>\n</ax-footer>\n", dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$1.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: i3.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: AXFormModule }, { kind: "component", type: i7.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "component", type: i7.AXFormComponent, selector: "ax-form", inputs: ["labelMode", "look", "messageStyle", "updateOn"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i4.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i6.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i6.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], exportAs: ["widgetRenderer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMChooseDocumentTypeComponent, decorators: [{
+            type: Component,
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'axm-choose-document-type', imports: [AXButtonModule, AXDecoratorModule, AXFormModule, AXLabelModule, AXSelectBoxModule, AXPLayoutBuilderModule], template: "<ax-header> </ax-header>\n<ax-content>\n  <div class=\"ax-flex ax-flex-col ax-py-4 ax-px-6\">\n    <ax-label> Select Document Type </ax-label>\n    <ax-select-box\n      [dataSource]=\"documentTypesSource\"\n      textField=\"title\"\n      valueField=\"id\"\n      (onValueChanged)=\"handleChangeDocumentType($event)\"\n    >\n    </ax-select-box>\n    @if (documentTypeSelected().length > 0) {\n      <axp-widgets-container [context]=\"context()\" (onContextChanged)=\"handleContextChanged($event)\">\n      <ax-form>\n        @for(doc of documentTypeSelected()[0].meta; track doc.name) {\n          <ax-form-field>\n            <ax-label >{{ doc.title }}</ax-label>\n            <ng-container axp-widget-renderer [node]=\"getNode(doc)\" [mode]=\"'edit'\"></ng-container>\n          </ax-form-field>\n        }\n\n        <ng-container axp-widget-renderer [node]=\"uploadNode()\" mode=\"edit\"></ng-container>\n\n      </ax-form>\n    </axp-widgets-container>\n    }\n  </div>\n</ax-content>\n<ax-footer>\n  <ax-suffix>\n    <ax-button text=\"Cancel\" look=\"blank\" (onClick)=\"handleCancel()\"> </ax-button>\n    <ax-button text=\"Next\" (onClick)=\"handlesubmit()\"> </ax-button>\n  </ax-suffix>\n</ax-footer>\n" }]
+        }] });
+
+class AXMFileViewerPopupComponent extends AXBasePageComponent {
+    onClose() {
+        this.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMFileViewerPopupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: AXMFileViewerPopupComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div>\n  <ax-content>\n    <ax-media-viewer-container #c [dataArray]=\"nodes\">\n      <ax-header>\n        <ax-file-info></ax-file-info>\n      </ax-header>\n\n      <ax-prefix>\n        <ax-button (click)=\"c.next()\">\n          <ax-icon class=\"ax-icon ax-icon-chevron-right\"> </ax-icon>\n        </ax-button>\n      </ax-prefix>\n\n      <ax-suffix>\n        <ax-button (click)=\"c.prev()\">\n          <ax-icon class=\"ax-icon ax-icon-chevron-left\"> </ax-icon>\n        </ax-button>\n      </ax-suffix>\n    </ax-media-viewer-container>\n  </ax-content>\n\n  <ax-footer>\n    <ax-suffix>\n      <ax-button [text]=\"'close'\" (click)=\"onClose()\" />\n    </ax-suffix>\n  </ax-footer>\n</div>\n", dependencies: [{ kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.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: AXButtonModule }, { kind: "component", type: i2$1.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: AXMediaViewerModule }, { kind: "component", type: i3$2.AXMediaViewerContainerComponent, selector: "ax-media-viewer-container", inputs: ["dataArray", "thumbnail"] }, { kind: "component", type: i3$2.AXFileInfoComponent, selector: "ax-file-info" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMFileViewerPopupComponent, decorators: [{
+            type: Component,
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXDecoratorModule, AXButtonModule, AXMediaViewerModule], template: "<div>\n  <ax-content>\n    <ax-media-viewer-container #c [dataArray]=\"nodes\">\n      <ax-header>\n        <ax-file-info></ax-file-info>\n      </ax-header>\n\n      <ax-prefix>\n        <ax-button (click)=\"c.next()\">\n          <ax-icon class=\"ax-icon ax-icon-chevron-right\"> </ax-icon>\n        </ax-button>\n      </ax-prefix>\n\n      <ax-suffix>\n        <ax-button (click)=\"c.prev()\">\n          <ax-icon class=\"ax-icon ax-icon-chevron-left\"> </ax-icon>\n        </ax-button>\n      </ax-suffix>\n    </ax-media-viewer-container>\n  </ax-content>\n\n  <ax-footer>\n    <ax-suffix>\n      <ax-button [text]=\"'close'\" (click)=\"onClose()\" />\n    </ax-suffix>\n  </ax-footer>\n</div>\n" }]
         }] });
 
+var fileViewerPopup_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXMFileViewerPopupComponent: AXMFileViewerPopupComponent
+});
+
+class AXMFolderPathBreadcrumbsComponent {
+    constructor() {
+        this.vm = inject(AXPDocumentExplorerViewModel);
+        this.layout = inject(AXPLayoutThemeService);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMFolderPathBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXMFolderPathBreadcrumbsComponent, isStandalone: true, selector: "axm-folder-path-breadcrumbs", ngImport: i0, template: "<!-- Breadcrumbs Section -->\n<div class=\"__breadcrumb ax-xs\">\n  <!-- Desktop Breadcrumb -->\n  @for (item of vm.currentPath(); track item.id; let i = $index;let last = $last) {\n  <!-- Navigation Button -->\n  <ax-button look=\"blank\" (onClick)=\"vm.navigateToFolder(item.id)\" [text]=\"item.name\" [disabled]=\"last\">\n    @if(i === 0) {\n    <ax-icon icon=\"fa-light fa-cloud\"></ax-icon>\n    }@else {\n    <ax-icon icon=\"fa-light fa-folder-closed\"></ax-icon>\n    }\n  </ax-button>\n  <!-- Separator -->\n  @if(!last) {\n  <i class=\"far fa-chevron-right rtl:ax-rotate-180 fa-fw fa-xs ax-me-2\"></i>\n  }\n  <!-- End Navigation Button -->\n  }\n</div>\n", styles: [":host{display:flex;width:100%;align-items:center}:host .__nav{display:flex;flex-direction:row;align-items:center;gap:.25rem;border-inline-end-width:1px;padding-inline-start:.25rem;padding-inline-end:.5rem}:host .__breadcrumb{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;padding-inline-start:.5rem;padding-inline-end:.25rem}:host .__breadcrumb .ax-state-disabled button,:host .__breadcrumb .ax-state-loading button{cursor:default!important}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$1.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: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMFolderPathBreadcrumbsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'axm-folder-path-breadcrumbs', standalone: true, imports: [
+                        AXButtonModule,
+                        AXDecoratorModule,
+                    ], template: "<!-- Breadcrumbs Section -->\n<div class=\"__breadcrumb ax-xs\">\n  <!-- Desktop Breadcrumb -->\n  @for (item of vm.currentPath(); track item.id; let i = $index;let last = $last) {\n  <!-- Navigation Button -->\n  <ax-button look=\"blank\" (onClick)=\"vm.navigateToFolder(item.id)\" [text]=\"item.name\" [disabled]=\"last\">\n    @if(i === 0) {\n    <ax-icon icon=\"fa-light fa-cloud\"></ax-icon>\n    }@else {\n    <ax-icon icon=\"fa-light fa-folder-closed\"></ax-icon>\n    }\n  </ax-button>\n  <!-- Separator -->\n  @if(!last) {\n  <i class=\"far fa-chevron-right rtl:ax-rotate-180 fa-fw fa-xs ax-me-2\"></i>\n  }\n  <!-- End Navigation Button -->\n  }\n</div>\n", styles: [":host{display:flex;width:100%;align-items:center}:host .__nav{display:flex;flex-direction:row;align-items:center;gap:.25rem;border-inline-end-width:1px;padding-inline-start:.25rem;padding-inline-end:.5rem}:host .__breadcrumb{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;padding-inline-start:.5rem;padding-inline-end:.25rem}:host .__breadcrumb .ax-state-disabled button,:host .__breadcrumb .ax-state-loading button{cursor:default!important}\n"] }]
+        }] });
+
+var index = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXMChooseDocumentTypeComponent: AXMChooseDocumentTypeComponent,
+    AXMFileViewerPopupComponent: AXMFileViewerPopupComponent,
+    AXMFolderPathBreadcrumbsComponent: AXMFolderPathBreadcrumbsComponent
+});
+
 class AXMDocumentAttachmentWidgetEditComponent extends AXPWidgetComponent {
     constructor() {
         super(...arguments);
@@ -4178,7 +4481,7 @@ class AXMDocumentAttachmentWidgetEditComponent extends AXPWidgetComponent {
     #navigateEffect;
     ngOnInit() {
         super.ngOnInit();
-        this.vm.initialize();
+        this.vm.initialize({ browseMode: 'file' });
         this.loadDrive();
     }
     async loadDrive(folderId) {
@@ -4196,7 +4499,7 @@ class AXMDocumentAttachmentWidgetEditComponent extends AXPWidgetComponent {
         this.vm.navigateToFolder(folderId);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentAttachmentWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.3", type: AXMDocumentAttachmentWidgetEditComponent, isStandalone: true, selector: "axm-document-attachment-edit-widget", providers: [AXPDocumentExplorerViewModel], viewQueries: [{ propertyName: "documentExplorer", first: true, predicate: AXMDocumentExplorerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-gap-3\" *translate=\"let t\">\n  <!-- Header Section -->\n  <div class=\"ax-flex ax-flex-row ax-justify-between\">\n    <ax-button\n      (onClick)=\"handleNavigateToFolder(vm.currentFolder()?.parentId!)\"\n      [ngClass]=\"{ 'ax-invisible': !vm.currentFolder()?.parentId }\"\n    >\n      <ax-prefix>\n        <ax-icon icon=\"fa-light fa-arrow-left\"></ax-icon>\n      </ax-prefix>\n    </ax-button>\n    <!-- Primary Actions -->\n    <ax-button [text]=\"t('actions.add-item', { scope: rootConfig.config.i18n }) | async\" [color]=\"'primary'\">\n      <ax-prefix>\n        <ax-icon icon=\"fa-light  fa-plus\"></ax-icon>\n      </ax-prefix>\n      <ax-dropdown-panel>\n        <!-- Upload Dropdown -->\n        <ax-button-item-list>\n          <ax-button-item\n            (onClick)=\"documentExplorer()?.chooseFile()\"\n            [text]=\"(t('drive-types.platform-drive', { scope: rootConfig.config.i18n }) | async)!\"\n          >\n            <ax-prefix>\n              <ax-icon icon=\"fa-light fa-file-arrow-up\"></ax-icon>\n            </ax-prefix>\n          </ax-button-item>\n        </ax-button-item-list>\n      </ax-dropdown-panel>\n    </ax-button>\n  </div>\n  <axm-document-explorer></axm-document-explorer>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "component", type: AXMDocumentExplorerComponent, selector: "axm-document-explorer" }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i3$1.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i5$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i5$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: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i4$1.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i2$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXButtonGroupModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.3", type: AXMDocumentAttachmentWidgetEditComponent, isStandalone: true, selector: "axm-document-attachment-edit-widget", providers: [AXPDocumentExplorerViewModel], viewQueries: [{ propertyName: "documentExplorer", first: true, predicate: AXMDocumentExplorerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-gap-3\" *translate=\"let t\">\n  <!-- Header Section -->\n  <div class=\"ax-flex ax-flex-row ax-justify-between\">\n    <ax-button\n      (onClick)=\"handleNavigateToFolder(vm.currentFolder()?.parentId!)\"\n      [ngClass]=\"{ 'ax-invisible': !vm.currentFolder()?.parentId }\"\n    >\n      <ax-prefix>\n        <ax-icon icon=\"fa-light fa-arrow-left\"></ax-icon>\n      </ax-prefix>\n    </ax-button>\n    <!-- Primary Actions -->\n    <ax-button [text]=\"t('actions.add-item', { scope: rootConfig.config.i18n }) | async\" [color]=\"'primary'\">\n      <ax-prefix>\n        <ax-icon icon=\"fa-light  fa-plus\"></ax-icon>\n      </ax-prefix>\n      <ax-dropdown-panel>\n        <!-- Upload Dropdown -->\n        <ax-button-item-list>\n          <ax-button-item\n            (onClick)=\"documentExplorer()?.chooseFile()\"\n            [text]=\"(t('drive-types.platform-drive', { scope: rootConfig.config.i18n }) | async)!\"\n          >\n            <ax-prefix>\n              <ax-icon icon=\"fa-light fa-file-arrow-up\"></ax-icon>\n            </ax-prefix>\n          </ax-button-item>\n        </ax-button-item-list>\n      </ax-dropdown-panel>\n    </ax-button>\n  </div>\n  <axm-document-explorer></axm-document-explorer>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "component", type: AXMDocumentExplorerComponent, selector: "axm-document-explorer", inputs: ["browseMode", "viewMode", "selectionMode", "showContextMenu"] }, { 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: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i2$2.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.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: AXTranslationModule }, { kind: "directive", type: i3$3.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i2$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXButtonGroupModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentAttachmentWidgetEditComponent, decorators: [{
             type: Component,
@@ -4307,6 +4610,85 @@ const AXMDocumentAttachmentWidget = {
     },
 };
 
+class AXMCheckDocumentTypeWorkflowAction extends AXPWorkflowAction {
+    async execute(context) {
+        const documentType = context.getVariable('documentType');
+        if (documentType) {
+            context.setOutput('need-choose-document-type', false);
+        }
+        else {
+            context.setOutput('need-choose-document-type', true);
+        }
+    }
+}
+class AXMChooseDocumentTypeWorkflowAction extends AXPWorkflowAction {
+    constructor() {
+        super(...arguments);
+        this.popupService = inject(AXPopupService);
+    }
+    async execute(context) {
+        const comp = (await Promise.resolve().then(function () { return index; })).AXMChooseDocumentTypeComponent;
+        const result = await this.popupService.open(comp);
+        if (result.data != null && result.data.documentTypeId != null) {
+            context.setVariable('documentTypeId', result.data.documentTypeId);
+            context.setOutput('isCanceled', false);
+        }
+        else {
+            context.setOutput('isCanceled', true);
+        }
+    }
+}
+class AXMChooseFileWorkflowAction extends AXPWorkflowAction {
+    constructor() {
+        super(...arguments);
+        this.documentTypeService = inject(AXMDocumentTypeService);
+        this.uploadService = inject(AXUploaderService);
+    }
+    async execute(context) {
+        var doc = context.getVariable('documentType');
+        if (!doc) {
+            const docId = context.getVariable('documentTypeId');
+            doc = await this.documentTypeService.getOne(docId);
+        }
+        this.uploadService.browse({
+            //accept: doc.type,
+            multiple: doc.isMultiple,
+        });
+    }
+}
+const AXMUploadWorkflow = {
+    startStepId: 'check-document-type',
+    steps: {
+        'check-document-type': {
+            action: 'AXMCheckDocumentTypeWorkflowAction',
+            nextSteps: [
+                {
+                    conditions: [{ type: 'SINGLE', expression: 'context.getOutput("need-choose-document-type") == true' }],
+                    nextStepId: 'choose-document-type',
+                },
+            ],
+        },
+        'choose-document-type': {
+            action: 'AXMChooseDocumentTypeWorkflowAction',
+            nextSteps: [
+                {
+                    conditions: [{ type: 'SINGLE', expression: 'context.getOutput("isCanceled") == false' }],
+                    nextStepId: 'file-browser',
+                },
+            ],
+        },
+        'file-browser': {
+            action: 'AXMChooseFileWorkflowAction',
+            nextSteps: [
+                {
+                    conditions: [],
+                    nextStepId: 'dispatch-event',
+                },
+            ],
+        },
+    },
+};
+
 function routesFacory() {
     const config = inject(AXP_ENTITY_CONFIG_TOKEN);
     const routes = [
@@ -4320,11 +4702,11 @@ function routesFacory() {
             children: [
                 {
                     path: '',
-                    loadComponent: () => import('./acorex-modules-document-management-drive.component-B6az6-_w.mjs').then((c) => c.AXMDocumentDriveComponent),
+                    loadComponent: () => import('./acorex-modules-document-management-drive.component-B3BCzdVv.mjs').then((c) => c.AXMDocumentDriveComponent),
                 },
                 {
                     path: ':id',
-                    loadComponent: () => import('./acorex-modules-document-management-drive.component-B6az6-_w.mjs').then((c) => c.AXMDocumentDriveComponent),
+                    loadComponent: () => import('./acorex-modules-document-management-drive.component-B3BCzdVv.mjs').then((c) => c.AXMDocumentDriveComponent),
                 },
             ],
         },
@@ -4337,7 +4719,7 @@ class AXMDocumentManagementModule {
             AXMDocumentManagementDocumentTypeMetaValueEntityModule,
             AXMDocumentManagementDocumentTypeMetaDefinitionEntityModule,
             AXMDocumentManagementDocumentTypeEntityModule,
-            AXMDocumentManagementDocumentEntityModule, i6.AXPLayoutBuilderModule, AXMFileTypeModule, i3$2.AXMediaViewerModule] }); }
+            AXMDocumentManagementDocumentEntityModule, i6.AXPLayoutBuilderModule, AXMFileTypeModule, i3$2.AXMediaViewerModule, i3$4.AXPWorkflowModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentManagementModule, providers: [
             {
                 provide: AXMFolderService,
@@ -4382,7 +4764,17 @@ class AXMDocumentManagementModule {
                 widgets: [AXmFileTypeExtensionWidget, AXMDocumentAttachmentWidget],
             }),
             AXMFileTypeModule,
-            AXMediaViewerModule.forRoot()] }); }
+            AXMediaViewerModule.forRoot(),
+            AXPWorkflowModule.forChild({
+                actions: {
+                    AXMCheckDocumentTypeWorkflowAction,
+                    AXMChooseDocumentTypeWorkflowAction,
+                    AXMChooseFileWorkflowAction,
+                },
+                workflows: {
+                    'upload-document': AXMUploadWorkflow,
+                },
+            })] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMDocumentManagementModule, decorators: [{
             type: NgModule,
@@ -4398,6 +4790,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                         }),
                         AXMFileTypeModule,
                         AXMediaViewerModule.forRoot(),
+                        AXPWorkflowModule.forChild({
+                            actions: {
+                                AXMCheckDocumentTypeWorkflowAction,
+                                AXMChooseDocumentTypeWorkflowAction,
+                                AXMChooseFileWorkflowAction,
+                            },
+                            workflows: {
+                                'upload-document': AXMUploadWorkflow,
+                            },
+                        }),
                     ],
                     exports: [],
                     providers: [
@@ -4443,5 +4845,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AXMDocumentManagerService as A, AXMFolderServiceImpl as B, AXMEntityProvider as C, AXMMenuProvider as D, AXMSearchCommandProvider as E, AXMSettingProvider as F, RootConfig as R, AXPDocumentExplorerViewModel as a, AXMDocumentExplorerComponent as b, AXMDriveScope as c, AXMDocumentManagementModule as d, documentFactory as e, AXMDocumentManagementDocumentEntityModule as f, AXMDocumentService as g, AXMDocumentServiceImpl as h, documentTypeFactory as i, AXMDocumentManagementDocumentTypeEntityModule as j, AXMDocumentManagementDocumentTypeEntityService as k, AXMDocumentManagementDocumentTypeEntityServiceImpl as l, documentTypeMetaDefinitionfactory as m, AXMDocumentManagementDocumentTypeMetaDefinitionEntityModule as n, AXMDocumentManagementDocumentTypeMetaDefinitionEntityService as o, AXMDocumentManagementDocumentTypeMetaDefinitionEntityServiceImpl as p, documentTypeMetaValueFactory as q, AXMDocumentManagementDocumentTypeMetaValueEntityModule as r, AXMDocumentManagementDocumentTypeMetaValueEntityService as s, AXMDocumentManagementDocumentTypeMetaValueEntityServiceImpl as t, documentTypeStatusDefinitionFactory as u, AXMDocumentManagementDocumentTypeStatusDefinitionEntityModule as v, AXMDocumentManagementDocumentTypeStatusDefinitionEntityService as w, AXMDocumentManagementDocumentTypeStatusDefinitionEntityServiceImpl as x, folderFactory as y, AXMFolderService as z };
-//# sourceMappingURL=acorex-modules-document-management-acorex-modules-document-management-BmLGtKDq.mjs.map
+export { AXPDocumentExplorerViewModel as A, AXMFolderService as B, AXMFolderServiceImpl as C, AXMEntityProvider as D, AXMMenuProvider as E, AXMSearchCommandProvider as F, AXMSettingProvider as G, RootConfig as R, AXMDocumentManagerService as a, AXMDocumentExplorerComponent as b, AXMDriveScope as c, AXMFolderPathBreadcrumbsComponent as d, AXMDocumentManagementModule as e, documentFactory as f, AXMDocumentManagementDocumentEntityModule as g, AXMDocumentService as h, AXMDocumentServiceImpl as i, documentTypeFactory as j, AXMDocumentManagementDocumentTypeEntityModule as k, AXMDocumentTypeService as l, AXMDocumentManagementDocumentTypeEntityServiceImpl as m, documentTypeMetaDefinitionfactory as n, AXMDocumentManagementDocumentTypeMetaDefinitionEntityModule as o, AXMDocumentManagementDocumentTypeMetaDefinitionEntityService as p, AXMDocumentManagementDocumentTypeMetaDefinitionEntityServiceImpl as q, documentTypeMetaValueFactory as r, AXMDocumentManagementDocumentTypeMetaValueEntityModule as s, AXMDocumentManagementDocumentTypeMetaValueEntityService as t, AXMDocumentManagementDocumentTypeMetaValueEntityServiceImpl as u, documentTypeStatusDefinitionFactory as v, AXMDocumentManagementDocumentTypeStatusDefinitionEntityModule as w, AXMDocumentManagementDocumentTypeStatusDefinitionEntityService as x, AXMDocumentManagementDocumentTypeStatusDefinitionEntityServiceImpl as y, folderFactory as z };
+//# sourceMappingURL=acorex-modules-document-management-acorex-modules-document-management-_BOVaDOq.mjs.map