import * as i1$1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { inject, ViewEncapsulation, Component, signal, computed, viewChild, effect, untracked, HostListener, ChangeDetectionStrategy } from '@angular/core';
import { AXBadgeModule } from '@acorex/components/badge';
import { AXBreadcrumbsModule } from '@acorex/components/breadcrumbs';
import * as i2 from '@acorex/components/button';
import { AXButtonModule } from '@acorex/components/button';
import { AXButtonGroupModule } from '@acorex/components/button-group';
import * as i1 from '@acorex/components/decorators';
import { AXDecoratorModule } from '@acorex/components/decorators';
import * as i2$2 from '@acorex/components/dropdown';
import { AXDropdownModule } from '@acorex/components/dropdown';
import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
import { AXLoadingModule } from '@acorex/components/loading';
import { AXMenuModule } from '@acorex/components/menu';
import * as i4 from '@acorex/components/search-box';
import { AXSearchBoxModule } from '@acorex/components/search-box';
import { AXDateTimeModule } from '@acorex/core/date-time';
import { AXFileModule } from '@acorex/core/file';
import * as i2$1 from '@acorex/core/format';
import { AXFormatModule } from '@acorex/core/format';
import * as i3 from '@acorex/core/translation';
import { AXTranslationModule } from '@acorex/core/translation';
import { AXPFileTypeProviderService } from '@acorex/platform/common';
import { AXPThemeLayoutBlockComponent } from '@acorex/platform/layout/components';
import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex/platform/layout/views';
import { resolvePlatformScopeKey, resolvePlatformScopeName } from '@acorex/platform/core';
import { Router, ActivatedRoute, RouterModule } from '@angular/router';
import { A as AXPDocumentExplorerViewModel, R as RootConfig, a as AXMDocumentManagerService, b as AXMDocumentExplorerComponent } from './acorex-modules-document-management-acorex-modules-document-management-BsfSETMk.mjs';

class AXMDocumentExplorerDetailPanelComponent {
    constructor() {
        this.vm = inject(AXPDocumentExplorerViewModel);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AXMDocumentExplorerDetailPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: AXMDocumentExplorerDetailPanelComponent, isStandalone: true, selector: "axm-document-explorer-detail-panel", ngImport: i0, template: "<!--  Multiple Selected  -->\n@if (vm.hasMultipleSelectedItems()) {\n  <div class=\"__header\" *translate=\"let t\">\n    <div class=\"__title\">\n      <i class=\"fa-fw fa-lg fa-solid\"></i>\n      <span> {{ vm.selectedCount() }} {{ '@general:terms.items-selected' | translate | async }}</span>\n    </div>\n    <ax-button [look]=\"'blank'\" class=\"ax-sm ax-rounded-full\" (onClick)=\"vm.closeDetailPanel()\">\n      <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n    </ax-button>\n  </div>\n  <div class=\"__content\"></div>\n}\n<!-- Single Selected -->\n@else {\n  <!-- Info -->\n  @let nodeInfo = vm.getNodeInfo((vm.selectedNode() ?? vm.currentFolder())!);\n  <div class=\"__header\">\n    <div class=\"__title\">\n      <i class=\"fa-fw fa-lg {{ nodeInfo.icon }} fa-solid\"></i>\n      <span>{{ nodeInfo.name }}</span>\n    </div>\n    <ax-button [look]=\"'blank'\" class=\"ax-sm ax-rounded-full\" (onClick)=\"vm.closeDetailPanel()\">\n      <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n    </ax-button>\n  </div>\n  <div class=\"__content\">\n    @for (section of nodeInfo.sections; track section.title) {\n      <div class=\"__section\">\n        <div class=\"__title\">\n          <span>{{ section.title }}</span>\n        </div>\n        <div class=\"__content\">\n          @for (detail of section.details; track detail.title) {\n            <div class=\"__row\">\n              <div class=\"__title\">\n                <span>{{ detail.title }}</span>\n              </div>\n              <div class=\"__content\">\n                @if (detail.format) {\n                  <span>{{ detail.content | format: detail.format | async }}</span>\n                } @else {\n                  <span>{{ detail.content ?? '---' }}</span>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n}\n", styles: ["axm-document-explorer-detail-panel{display:flex;flex-direction:column;border-radius:.5rem;border-width:1px;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);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))}@media (min-width: 1024px){axm-document-explorer-detail-panel{min-width:20rem}}axm-document-explorer-detail-panel>.__header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;border-bottom-width:1px;padding:1rem}axm-document-explorer-detail-panel>.__header>.__title{display:flex;width:90%;flex-direction:row;align-items:center;gap:.5rem}axm-document-explorer-detail-panel>.__header>.__title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;font-weight:600;line-height:1.625}axm-document-explorer-detail-panel>.__content{display:flex;flex-direction:column}axm-document-explorer-detail-panel>.__content>:not([hidden])~:not([hidden]){--tw-divide-y-reverse: 0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))}axm-document-explorer-detail-panel>.__content>.__section{display:flex;flex-direction:column;padding:1rem}axm-document-explorer-detail-panel>.__content>.__section>.__title{margin-bottom:1rem;font-size:.875rem;line-height:1.25rem;font-weight:700}axm-document-explorer-detail-panel>.__content>.__section>.__content{display:flex;flex-direction:column;gap:1rem}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row{display:flex;flex-direction:column;gap:.25rem}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row>.__title{display:flex;font-size:.875rem;line-height:1.25rem;font-weight:600;opacity:.9}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row>.__content{display:flex;flex-direction:row;align-items:center;gap:.5rem}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row>.__content span{opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.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: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.AXFormatPipe, name: "format" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AXMDocumentExplorerDetailPanelComponent, decorators: [{
            type: Component,
            args: [{ selector: 'axm-document-explorer-detail-panel', standalone: true, encapsulation: ViewEncapsulation.None, imports: [
                        CommonModule,
                        AXDecoratorModule,
                        AXFormatModule,
                        AXButtonModule,
                        AXTranslationModule
                    ], template: "<!--  Multiple Selected  -->\n@if (vm.hasMultipleSelectedItems()) {\n  <div class=\"__header\" *translate=\"let t\">\n    <div class=\"__title\">\n      <i class=\"fa-fw fa-lg fa-solid\"></i>\n      <span> {{ vm.selectedCount() }} {{ '@general:terms.items-selected' | translate | async }}</span>\n    </div>\n    <ax-button [look]=\"'blank'\" class=\"ax-sm ax-rounded-full\" (onClick)=\"vm.closeDetailPanel()\">\n      <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n    </ax-button>\n  </div>\n  <div class=\"__content\"></div>\n}\n<!-- Single Selected -->\n@else {\n  <!-- Info -->\n  @let nodeInfo = vm.getNodeInfo((vm.selectedNode() ?? vm.currentFolder())!);\n  <div class=\"__header\">\n    <div class=\"__title\">\n      <i class=\"fa-fw fa-lg {{ nodeInfo.icon }} fa-solid\"></i>\n      <span>{{ nodeInfo.name }}</span>\n    </div>\n    <ax-button [look]=\"'blank'\" class=\"ax-sm ax-rounded-full\" (onClick)=\"vm.closeDetailPanel()\">\n      <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n    </ax-button>\n  </div>\n  <div class=\"__content\">\n    @for (section of nodeInfo.sections; track section.title) {\n      <div class=\"__section\">\n        <div class=\"__title\">\n          <span>{{ section.title }}</span>\n        </div>\n        <div class=\"__content\">\n          @for (detail of section.details; track detail.title) {\n            <div class=\"__row\">\n              <div class=\"__title\">\n                <span>{{ detail.title }}</span>\n              </div>\n              <div class=\"__content\">\n                @if (detail.format) {\n                  <span>{{ detail.content | format: detail.format | async }}</span>\n                } @else {\n                  <span>{{ detail.content ?? '---' }}</span>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n}\n", styles: ["axm-document-explorer-detail-panel{display:flex;flex-direction:column;border-radius:.5rem;border-width:1px;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);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))}@media (min-width: 1024px){axm-document-explorer-detail-panel{min-width:20rem}}axm-document-explorer-detail-panel>.__header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;border-bottom-width:1px;padding:1rem}axm-document-explorer-detail-panel>.__header>.__title{display:flex;width:90%;flex-direction:row;align-items:center;gap:.5rem}axm-document-explorer-detail-panel>.__header>.__title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;font-weight:600;line-height:1.625}axm-document-explorer-detail-panel>.__content{display:flex;flex-direction:column}axm-document-explorer-detail-panel>.__content>:not([hidden])~:not([hidden]){--tw-divide-y-reverse: 0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))}axm-document-explorer-detail-panel>.__content>.__section{display:flex;flex-direction:column;padding:1rem}axm-document-explorer-detail-panel>.__content>.__section>.__title{margin-bottom:1rem;font-size:.875rem;line-height:1.25rem;font-weight:700}axm-document-explorer-detail-panel>.__content>.__section>.__content{display:flex;flex-direction:column;gap:1rem}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row{display:flex;flex-direction:column;gap:.25rem}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row>.__title{display:flex;font-size:.875rem;line-height:1.25rem;font-weight:600;opacity:.9}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row>.__content{display:flex;flex-direction:row;align-items:center;gap:.5rem}axm-document-explorer-detail-panel>.__content>.__section>.__content>.__row>.__content span{opacity:.7}\n"] }]
        }] });

class AXMDocumentDriveComponent extends AXPPageLayoutBaseComponent {
    constructor() {
        super(...arguments);
        //#region ----------------   Services & Dependencies   ----------------
        this.rootConfig = RootConfig;
        this.fileTypeService = inject(AXPFileTypeProviderService);
        this.driveService = inject(AXMDocumentManagerService);
        this.vm = inject(AXPDocumentExplorerViewModel);
        this.router = inject(Router);
        this.activatedRoute = inject(ActivatedRoute);
        //#endregion
        //#region ----------------   View Properties   ----------------
        this.filterItems = signal([], ...(ngDevMode ? [{ debugName: "filterItems" }] : []));
        this.selectedFilter = signal('all', ...(ngDevMode ? [{ debugName: "selectedFilter" }] : []));
        this.searchQuery = '';
        this.sortItems = signal([
            { key: 'name', textKey: 'actions.sort-by-name', icon: 'fa-light fa-font' },
            { key: 'modified', textKey: 'actions.sort-by-date', icon: 'fa-light fa-calendar' },
            { key: 'size', textKey: 'actions.sort-by-size', icon: 'fa-light fa-weight-hanging' },
        ], ...(ngDevMode ? [{ debugName: "sortItems" }] : []));
        this.viewsItems = signal([
            { key: 'large-icons', icon: 'fa-light fa-grid' },
            { key: 'small-icons', icon: 'fa-light fa-grid', break: true },
            { key: 'large-tiles', icon: 'fa-grid-2' },
            { key: 'small-tiles', icon: 'fa-grid-2', break: true },
            { key: 'details', icon: 'fa-bars', break: true },
            { key: 'list', icon: 'fa-list' },
        ], ...(ngDevMode ? [{ debugName: "viewsItems" }] : []));
        this.selectedViewMode = computed(() => this.viewsItems().find((item) => item.key === this.vm.viewMode()) || this.viewsItems()[0], ...(ngDevMode ? [{ debugName: "selectedViewMode" }] : []));
        this.selectionMode = signal('single', ...(ngDevMode ? [{ debugName: "selectionMode" }] : []));
        this.documentExplorer = viewChild(AXMDocumentExplorerComponent, ...(ngDevMode ? [{ debugName: "documentExplorer" }] : []));
        //#endregion
        //#region ----------------   Computed Properties   ----------------
        this.selectedSort = computed(() => {
            const items = this.sortItems();
            return items.find((item) => item.key === this.vm.sortField()) || items[0];
        }, ...(ngDevMode ? [{ debugName: "selectedSort" }] : []));
        //#endregion
        //#region ----------------   Effects   ----------------
        this.#navigateEffect = effect(() => {
            const navigatingFolderId = this.vm.navigatingFolderId();
            if (navigatingFolderId) {
                this.handleNavigateToFolder(navigatingFolderId);
            }
        }, ...(ngDevMode ? [{ debugName: "#navigateEffect" }] : []));
        this.#loadingEffect = effect(() => {
            const isLoading = this.vm.isLoading();
            untracked(() => {
                this.layoutService.setNavigationLoading(isLoading);
            });
        }, ...(ngDevMode ? [{ debugName: "#loadingEffect" }] : []));
    }
    //#endregion
    //#region ----------------   Effects   ----------------
    #navigateEffect;
    #loadingEffect;
    //#endregion
    //#region ----------------   Lifecycle Hooks   ----------------
    async ngOnInit() {
        super.ngOnInit();
        await this.loadFilterItems();
        const snapshot = this.activatedRoute.snapshot;
        const routerScope = resolvePlatformScopeKey(snapshot.parent?.paramMap.get('scope')?.trim()?.toLowerCase());
        await this.vm.initialize({ browseMode: 'file', scope: routerScope });
        this.activatedRoute.paramMap.subscribe(async () => {
            this.loadDrive();
        });
    }
    //#endregion
    //#region ----------------   Event Handlers   ----------------
    async handleSearchChange(event) {
        if (event.value == null) {
            return;
        }
        if (event.value?.length > 0) {
            const result = await this.driveService.searchNodes(event.value, this.vm.scope(), {
                tenantId: this.sessionService.tenant?.id,
                userId: this.sessionService.user?.id,
                folderId: this.vm.currentNode()?.id,
            });
            this.vm.virtualFolder(result, {
                name: 'Search Result',
                parentId: this.vm.currentNode()?.id == 'virtual'
                    ? (this.vm.currentNode()?.parentId ?? undefined)
                    : this.vm.currentNode()?.id,
            });
        }
        else {
            this.vm.navigateToUp();
        }
    }
    handleCtrlKey(e) {
        this.selectionMode.set('multiple');
    }
    handleCtrlKeyUp(e) {
        this.selectionMode.set('single');
    }
    handleNavigateToFolder(folderId) {
        this.router.navigate([
            `${this.sessionService.application?.name}/drive/${resolvePlatformScopeName(this.vm.scope())}/${folderId}`,
        ]);
        setTimeout(() => {
            this.searchQuery = null;
        }, 200);
    }
    //#endregion
    //#region ----------------   Data Loading Methods   ----------------
    async loadDrive() {
        const folderId = this.activatedRoute.snapshot.paramMap.get('id');
        if (folderId) {
            await this.vm.loadFolderContents(folderId);
        }
        else {
            // TODO: get root from tenant or user by scope
            const root = await this.driveService.getRoot(this.vm.scope(), {
                tenantId: this.sessionService.tenant?.id,
                userId: this.sessionService.user?.id,
            });
            if (root.result) {
                await this.router.navigate([
                    `${this.sessionService.application?.name}/drive/${resolvePlatformScopeName(this.vm.scope())}/${root.result.id}`,
                ], {
                    replaceUrl: true,
                });
            }
        }
        //
        this.recompute();
    }
    async loadFilterItems() {
        const types = await this.fileTypeService.items();
        const items = [
            { key: 'all', textKey: 'file-types.all', icon: 'fa-light fa-folder-closed' },
            ...types.map((type) => ({
                key: type.name,
                textKey: `file-types.${type.name}`,
                icon: type.icon || 'fa-light fa-file',
            })),
        ];
        this.filterItems.set(items);
    }
    //#endregion
    //#region ----------------   Filter Methods   ----------------
    setFilter(key) {
        this.selectedFilter.set(key);
    }
    getFilterIcon() {
        if (this.selectedFilter() === 'all') {
            return 'fa-light fa-folder-closed';
        }
        const item = this.filterItems().find((item) => item.key === this.selectedFilter());
        return item?.icon || 'fa-light fa-file';
    }
    getFilterText() {
        if (this.selectedFilter() === 'all') {
            return 'file-types.all';
        }
        const item = this.filterItems().find((item) => item.key === this.selectedFilter());
        return item?.textKey || 'file-types.all';
    }
    //#endregion
    //#region ----------------   Page Configuration Overrides   ----------------
    async getPrimaryMenuItems() {
        if (this.vm.hasMultipleSelectedItems()) {
            return [
                {
                    name: 'deleteItems',
                    title: '@general:actions.delete-items.title',
                    icon: 'fa-light fa-trash-can',
                    color: 'danger',
                },
            ];
        }
        const addItemItems = await this.vm.getFolderAddMenuItems();
        addItemItems[addItemItems.length - 1].break = false;
        return [
            {
                title: '@document-management:actions.add-item',
                icon: 'fa-light fa-plus',
                color: 'primary',
                items: addItemItems,
            },
        ];
    }
    async getSecondaryMenuItems() {
        if (this.vm.hasMultipleSelectedItems()) {
            return [
                {
                    name: 'delete',
                    title: '@general:actions.delete.title',
                    icon: 'fa-light fa-trash-can',
                    color: 'danger',
                },
            ];
        }
        return this.vm.getFolderActionMenuItems();
    }
    async getPageTitle() {
        if (this.vm.isRoot()) {
            return this.translateService.translateAsync(`@document-management:scopes.${resolvePlatformScopeName(this.vm.scope())}.title`);
        }
        return this.vm.currentFolder()?.name || '';
    }
    async getPageDescription() {
        const count = await this.vm.itemsCount();
        const size = await this.vm.availableSpace();
        const formattedSize = await this.formatService.format(size, 'filesize');
        return this.translateService.translateAsync(`@document-management:scopes.${resolvePlatformScopeName(this.vm.scope())}.description`, {
            params: {
                count,
                size: formattedSize,
            },
        });
    }
    getBackButton() {
        if (this.vm.isUpAvailable() && this.vm.currentPath().length > 1) {
            return {
                title: this.vm.currentPath()[this.vm.currentPath().length - 2].name,
            };
        }
        return null;
    }
    onBackButtonClick() {
        if (this.vm.isUpAvailable()) {
            this.vm.navigateToUp();
        }
    }
    async getPageBreadcrumbs() {
        const path = this.vm.currentPath();
        if (!path || path.length === 0) {
            return [
                {
                    title: await this.translateService.translateAsync(`@document-management:scopes.${resolvePlatformScopeName(this.vm.scope())}.title`),
                },
            ];
        }
        const breadcrumbs = [];
        for (let i = 0; i < path.length; i++) {
            const node = path[i];
            const isLast = i === path.length - 1;
            breadcrumbs.push({
                name: node.id,
                title: node.name,
                command: isLast
                    ? undefined
                    : {
                        name: 'navigate-to-folder',
                        options: { folderId: node.id },
                    },
            });
        }
        return breadcrumbs;
    }
    async execute(command) {
        const folderId = command.options?.['folderId'];
        switch (command.name) {
            case 'navigate-to-folder':
                if (folderId) {
                    this.vm.navigateToFolder(folderId);
                }
                break;
            case 'new-folder':
                if (folderId) {
                    await this.driveService.showCreateFolderDialog(folderId);
                    this.vm.refresh();
                }
                break;
            case 'open-gallery':
                if (folderId) {
                    await this.driveService.showFileViewerPopup(this.vm.currentFolder().children[0]);
                }
                break;
            default:
                if (command.name.startsWith('upload.')) {
                    await this.driveService.uploadFileByType(folderId, command.options?.['documentType']?.id);
                    this.vm.refresh();
                }
                break;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AXMDocumentDriveComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: AXMDocumentDriveComponent, isStandalone: true, selector: "axp-document-drive", host: { listeners: { "document:keydown.control": "handleCtrlKey($event)", "document:keyup.control": "handleCtrlKeyUp($event)" } }, providers: [
            AXPDocumentExplorerViewModel,
            {
                provide: AXPPageLayoutBase,
                useExisting: AXMDocumentDriveComponent,
            },
        ], viewQueries: [{ propertyName: "documentExplorer", first: true, predicate: AXMDocumentExplorerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- Main Layout -->\n<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <!-- Left Side Toolbar -->\n    <axp-layout-prefix>\n      @if (vm.hasMultipleSelectedItems()) {\n        <div class=\"ax-flex ax-gap-3 ax-items-center ax-h-10\">\n          <span class=\"ax-text-xl ax-font-bold\">\n            {{ vm.selectedCount() }} {{ '@general:terms.items-selected' | translate | async }}\n          </span>\n          <span (click)=\"vm.deselectAll()\" class=\"ax-text-sm ax-text-secondary ax-underline ax-cursor-pointer\">{{\n            '@general:actions.unselect.title' | translate | async\n          }}</span>\n        </div>\n      }\n      <!---------->\n      @else {\n        <!-- Filter Dropdown -->\n        <ax-button [text]=\"t(getFilterText(), { scope: rootConfig.config.i18n }) | async\">\n          <ax-prefix>\n            <ax-icon [icon]=\"getFilterIcon()\"></ax-icon>\n          </ax-prefix>\n\n          <ax-dropdown-panel>\n            <ax-button-item-list class=\"ax-p-2\">\n              @for (item of filterItems(); track item.key) {\n                <ax-button-item\n                  (onClick)=\"setFilter(item.key)\"\n                  [text]=\"(t(item.textKey, { scope: rootConfig.config.i18n }) | async)!\"\n                >\n                  <ax-prefix>\n                    <ax-icon [icon]=\"item.icon\"></ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              }\n            </ax-button-item-list>\n          </ax-dropdown-panel>\n        </ax-button>\n        <!-- Search Box -->\n        <ax-search-box\n          [(value)]=\"searchQuery\"\n          (onValueChanged)=\"handleSearchChange($event)\"\n          class=\"ax-w-72 ax-hidden md:ax-flex\"\n          [placeholder]=\"t('actions.search', { scope: rootConfig.config.i18n }) | async\"\n          ><ax-clear-button></ax-clear-button\n        ></ax-search-box>\n      }\n    </axp-layout-prefix>\n\n    <!-- Right Side Toolbar -->\n    <axp-layout-suffix>\n      <!-- Sort Dropdown -->\n      <ax-button>\n        <ax-icon\n          [icon]=\"'fa-light fa-arrow-' + (vm.sortDirection() === 'asc' ? 'up' : 'down') + '-wide-short'\"\n        ></ax-icon>\n        <ax-dropdown-panel>\n          <ax-button-item-list>\n            <!-- Sort By Options -->\n            @for (item of sortItems(); track item.key) {\n              <ax-button-item\n                [text]=\"(t(item.textKey, { scope: rootConfig.config.i18n }) | async)!\"\n                (onClick)=\"vm.setSortField(item.key)\"\n                [selected]=\"vm.sortField() === item.key\"\n              >\n                <ax-prefix>\n                  <ax-icon [icon]=\"item.icon\"></ax-icon>\n                </ax-prefix>\n              </ax-button-item>\n            }\n            <ax-divider></ax-divider>\n            <!-- Sort Direction Options -->\n            <ax-button-item\n              [text]=\"(t('actions.sort-ascending', { scope: rootConfig.config.i18n }) | async)!\"\n              [selected]=\"vm.sortDirection() === 'asc'\"\n              (onClick)=\"vm.setSortDirection('asc')\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-light fa-arrow-up-wide-short\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n            <ax-button-item\n              [text]=\"(t('actions.sort-descending', { scope: rootConfig.config.i18n }) | async)!\"\n              [selected]=\"vm.sortDirection() === 'desc'\"\n              (onClick)=\"vm.setSortDirection('desc')\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-light fa-arrow-down-wide-short\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n          </ax-button-item-list>\n        </ax-dropdown-panel>\n      </ax-button>\n\n      <!-- View Mode Toggle -->\n      <ax-button>\n        <ax-icon icon=\"fa-light {{ selectedViewMode().icon }}\"></ax-icon>\n        <ax-dropdown-panel>\n          <ax-button-item-list>\n            @for (item of viewsItems(); track item.key) {\n              <!-- view mode items -->\n              <ax-button-item\n                [text]=\"(t('view-modes.' + item.key, { scope: rootConfig.config.i18n }) | async)!\"\n                [selected]=\"vm.isViewMode(item.key)\"\n                (onClick)=\"vm.setViewMode(item.key)\"\n              >\n                <ax-prefix>\n                  <ax-icon icon=\"fa-light {{ item.icon }}\"></ax-icon>\n                </ax-prefix>\n              </ax-button-item>\n              @if (item.break) {\n                <ax-divider></ax-divider>\n              }\n              <!-- end of view mode items -->\n            }\n          </ax-button-item-list>\n        </ax-dropdown-panel>\n      </ax-button>\n\n      @if (layoutService.isLarge()) {\n        <!-- Detail Panel Toggle -->\n        <ax-button (onClick)=\"vm.toggleDetailPanel()\">\n          <ax-icon\n            icon=\"{{ vm.isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"\n          ></ax-icon>\n        </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n\n  <!-- Content Section -->\n  <axp-page-content class=\"ax-overflow-auto ax-flex ax-flex-row ax-gap-4\">\n    <axm-document-explorer [selectionMode]=\"selectionMode()\"></axm-document-explorer>\n    @if (vm.isDetailPanelOpen() && layoutService.isLarge()) {\n      <axm-document-explorer-detail-panel class=\"ax-sticky ax-top-0 ax-z-50\"></axm-document-explorer-detail-panel>\n    }\n  </axp-page-content>\n\n  <!-- Footer Section removed: breadcrumbs are now provided via page-level breadcrumbs -->\n</axp-page-layout>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: 
                //
                AXMenuModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXButtonGroupModule }, { 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: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i1.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: AXLoadingModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i4.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXFileModule }, { kind: "ngmodule", type: AXDateTimeModule }, { kind: "component", type: 
                //
                AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPThemeLayoutBlockComponent, selector: "    axp-page-content,     axp-page-footer-container,    axp-page-footer,    axp-page-header,    axp-page-header-container,    axp-page-toolbar,    axp-layout-content,     axp-layout-page-content,     axp-layout-sections,    axp-layout-body,    axp-layout-page-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title-bar,    axp-layout-title,     axp-layout-title-actions,     axp-layout-nav-button,     axp-layout-description,     axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "component", type: 
                //
                AXMDocumentExplorerComponent, selector: "axm-document-explorer", inputs: ["browseMode", "viewMode", "selectionMode", "showContextMenu"] }, { kind: "component", type: AXMDocumentExplorerDetailPanelComponent, selector: "axm-document-explorer-detail-panel" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AXMDocumentDriveComponent, decorators: [{
            type: Component,
            args: [{ selector: 'axp-document-drive', standalone: true, imports: [
                        CommonModule,
                        RouterModule,
                        //
                        AXMenuModule,
                        AXButtonModule,
                        AXButtonGroupModule,
                        AXDropdownButtonModule,
                        AXDropdownModule,
                        AXTranslationModule,
                        AXDecoratorModule,
                        AXLoadingModule,
                        AXBreadcrumbsModule,
                        AXBadgeModule,
                        AXSearchBoxModule,
                        AXFormatModule,
                        AXFileModule,
                        AXDateTimeModule,
                        //
                        AXPPageLayoutComponent,
                        AXPThemeLayoutBlockComponent,
                        //
                        AXMDocumentExplorerComponent,
                        AXMDocumentExplorerDetailPanelComponent,
                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                        AXPDocumentExplorerViewModel,
                        {
                            provide: AXPPageLayoutBase,
                            useExisting: AXMDocumentDriveComponent,
                        },
                    ], template: "<!-- Main Layout -->\n<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <!-- Left Side Toolbar -->\n    <axp-layout-prefix>\n      @if (vm.hasMultipleSelectedItems()) {\n        <div class=\"ax-flex ax-gap-3 ax-items-center ax-h-10\">\n          <span class=\"ax-text-xl ax-font-bold\">\n            {{ vm.selectedCount() }} {{ '@general:terms.items-selected' | translate | async }}\n          </span>\n          <span (click)=\"vm.deselectAll()\" class=\"ax-text-sm ax-text-secondary ax-underline ax-cursor-pointer\">{{\n            '@general:actions.unselect.title' | translate | async\n          }}</span>\n        </div>\n      }\n      <!---------->\n      @else {\n        <!-- Filter Dropdown -->\n        <ax-button [text]=\"t(getFilterText(), { scope: rootConfig.config.i18n }) | async\">\n          <ax-prefix>\n            <ax-icon [icon]=\"getFilterIcon()\"></ax-icon>\n          </ax-prefix>\n\n          <ax-dropdown-panel>\n            <ax-button-item-list class=\"ax-p-2\">\n              @for (item of filterItems(); track item.key) {\n                <ax-button-item\n                  (onClick)=\"setFilter(item.key)\"\n                  [text]=\"(t(item.textKey, { scope: rootConfig.config.i18n }) | async)!\"\n                >\n                  <ax-prefix>\n                    <ax-icon [icon]=\"item.icon\"></ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              }\n            </ax-button-item-list>\n          </ax-dropdown-panel>\n        </ax-button>\n        <!-- Search Box -->\n        <ax-search-box\n          [(value)]=\"searchQuery\"\n          (onValueChanged)=\"handleSearchChange($event)\"\n          class=\"ax-w-72 ax-hidden md:ax-flex\"\n          [placeholder]=\"t('actions.search', { scope: rootConfig.config.i18n }) | async\"\n          ><ax-clear-button></ax-clear-button\n        ></ax-search-box>\n      }\n    </axp-layout-prefix>\n\n    <!-- Right Side Toolbar -->\n    <axp-layout-suffix>\n      <!-- Sort Dropdown -->\n      <ax-button>\n        <ax-icon\n          [icon]=\"'fa-light fa-arrow-' + (vm.sortDirection() === 'asc' ? 'up' : 'down') + '-wide-short'\"\n        ></ax-icon>\n        <ax-dropdown-panel>\n          <ax-button-item-list>\n            <!-- Sort By Options -->\n            @for (item of sortItems(); track item.key) {\n              <ax-button-item\n                [text]=\"(t(item.textKey, { scope: rootConfig.config.i18n }) | async)!\"\n                (onClick)=\"vm.setSortField(item.key)\"\n                [selected]=\"vm.sortField() === item.key\"\n              >\n                <ax-prefix>\n                  <ax-icon [icon]=\"item.icon\"></ax-icon>\n                </ax-prefix>\n              </ax-button-item>\n            }\n            <ax-divider></ax-divider>\n            <!-- Sort Direction Options -->\n            <ax-button-item\n              [text]=\"(t('actions.sort-ascending', { scope: rootConfig.config.i18n }) | async)!\"\n              [selected]=\"vm.sortDirection() === 'asc'\"\n              (onClick)=\"vm.setSortDirection('asc')\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-light fa-arrow-up-wide-short\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n            <ax-button-item\n              [text]=\"(t('actions.sort-descending', { scope: rootConfig.config.i18n }) | async)!\"\n              [selected]=\"vm.sortDirection() === 'desc'\"\n              (onClick)=\"vm.setSortDirection('desc')\"\n            >\n              <ax-prefix>\n                <ax-icon icon=\"fa-light fa-arrow-down-wide-short\"></ax-icon>\n              </ax-prefix>\n            </ax-button-item>\n          </ax-button-item-list>\n        </ax-dropdown-panel>\n      </ax-button>\n\n      <!-- View Mode Toggle -->\n      <ax-button>\n        <ax-icon icon=\"fa-light {{ selectedViewMode().icon }}\"></ax-icon>\n        <ax-dropdown-panel>\n          <ax-button-item-list>\n            @for (item of viewsItems(); track item.key) {\n              <!-- view mode items -->\n              <ax-button-item\n                [text]=\"(t('view-modes.' + item.key, { scope: rootConfig.config.i18n }) | async)!\"\n                [selected]=\"vm.isViewMode(item.key)\"\n                (onClick)=\"vm.setViewMode(item.key)\"\n              >\n                <ax-prefix>\n                  <ax-icon icon=\"fa-light {{ item.icon }}\"></ax-icon>\n                </ax-prefix>\n              </ax-button-item>\n              @if (item.break) {\n                <ax-divider></ax-divider>\n              }\n              <!-- end of view mode items -->\n            }\n          </ax-button-item-list>\n        </ax-dropdown-panel>\n      </ax-button>\n\n      @if (layoutService.isLarge()) {\n        <!-- Detail Panel Toggle -->\n        <ax-button (onClick)=\"vm.toggleDetailPanel()\">\n          <ax-icon\n            icon=\"{{ vm.isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"\n          ></ax-icon>\n        </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n\n  <!-- Content Section -->\n  <axp-page-content class=\"ax-overflow-auto ax-flex ax-flex-row ax-gap-4\">\n    <axm-document-explorer [selectionMode]=\"selectionMode()\"></axm-document-explorer>\n    @if (vm.isDetailPanelOpen() && layoutService.isLarge()) {\n      <axm-document-explorer-detail-panel class=\"ax-sticky ax-top-0 ax-z-50\"></axm-document-explorer-detail-panel>\n    }\n  </axp-page-content>\n\n  <!-- Footer Section removed: breadcrumbs are now provided via page-level breadcrumbs -->\n</axp-page-layout>\n" }]
        }], propDecorators: { handleCtrlKey: [{
                type: HostListener,
                args: ['document:keydown.control', ['$event']]
            }], handleCtrlKeyUp: [{
                type: HostListener,
                args: ['document:keyup.control', ['$event']]
            }] } });

export { AXMDocumentDriveComponent };
//# sourceMappingURL=acorex-modules-document-management-drive.component-BVgm40pD.mjs.map
