@acorex/modules 21.0.0-next.42 → 21.0.0-next.44

package/fesm2022/{acorex-modules-organization-management-org-chart.page-fudrNddI.mjs → acorex-modules-organization-management-org-chart.page-BcHO5kKP.mjs}

@@ -21,12 +21,12 @@ import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase }
 import * as i3$1 from '@angular/common';
 import { AsyncPipe, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, Injectable, signal, viewChild, NgZone, Injector, ViewContainerRef, LOCALE_ID, afterNextRender } from '@angular/core';
+import { inject, input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, Injectable, signal, viewChild, NgZone, Injector, ViewContainerRef, LOCALE_ID, afterNextRender, effect } from '@angular/core';
 import * as i1$1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { ActivatedRoute, RouterModule } from '@angular/router';
 import set from 'lodash-es/set';
-import { A as AXM_ORG_CHART_HOST, a as AXMOrgChartNodeType, b as AXM_ORG_CHART_NODE_CONTRIBUTOR, R as RootConfig, n as normalizeVacantLeafSeatsSetting, c as AXPOrganizationManagementSettings, p as parseOrgChartMode, d as AXMOrgChartCategory, e as AXMOrgChartDetailPanelComponent } from './acorex-modules-organization-management-acorex-modules-organization-management-Bu8fRj_5.mjs';
+import { A as AXM_ORG_CHART_HOST, a as AXMOrgChartNodeType, b as AXM_ORG_CHART_NODE_CONTRIBUTOR, R as RootConfig, n as normalizeVacantLeafSeatsSetting, c as AXPOrganizationManagementSettings, p as parseOrgChartMode, d as AXMOrgChartStructureRefreshHub, e as AXMOrgChartCategory, f as AXM_ORG_CHART_EMPLOYEE_SUBMENU_GROUP_ID, g as AXMOrgChartDetailPanelComponent } from './acorex-modules-organization-management-acorex-modules-organization-management-CGzZcKEy.mjs';
 import { AXLoadingDialogService } from '@acorex/components/loading-dialog';
 import { AXPExportService, AXPSettingsService } from '@acorex/platform/common';
 import { AXPEntityService } from '@acorex/platform/layout/entity';
@@ -246,13 +246,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
 //#region ---- Service ----
 class AXMOrgChartNodeContributionService {
     constructor() {
-        this.contributors = inject(AXM_ORG_CHART_NODE_CONTRIBUTOR, { optional: true }) ?? [];
+        /** `inject` typings for this multi-token omit the array wrapper; runtime value is always `T[]`. */
+        this.contributorSlots = inject(AXM_ORG_CHART_NODE_CONTRIBUTOR, { optional: true }) ?? [];
+    }
+    /**
+     * Resolves eager contributors and lazy `provideLazyProvider` slots (factory returns a Promise).
+     */
+    async resolveContributors() {
+        return Promise.all(this.contributorSlots.map((slot) => Promise.resolve(slot)));
     }
     /**
      * Collects and sorts menu actions contributed by all providers for the current node context.
      */
     async getMenuActions(context) {
-        const buckets = await Promise.all(this.contributors.map((provider) => provider.getMenuActions(context)));
+        const contributors = await this.resolveContributors();
+        const buckets = await Promise.all(contributors.map((provider) => provider.getMenuActions(context)));
         return buckets
             .flat()
             .sort((a, b) => (a.order ?? Number.MAX_SAFE_INTEGER) - (b.order ?? Number.MAX_SAFE_INTEGER));
@@ -262,7 +270,8 @@ class AXMOrgChartNodeContributionService {
      * This is used by the upcoming node detail drawer.
      */
     async getInfoContributions(context) {
-        const buckets = await Promise.all(this.contributors.map((provider) => provider.getInfoContributions?.(context) ?? Promise.resolve([])));
+        const contributors = await this.resolveContributors();
+        const buckets = await Promise.all(contributors.map((provider) => provider.getInfoContributions?.(context) ?? Promise.resolve([])));
         return buckets
             .flat()
             .sort((a, b) => (a.order ?? Number.MAX_SAFE_INTEGER) - (b.order ?? Number.MAX_SAFE_INTEGER));
@@ -522,6 +531,7 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
         this.route = inject(ActivatedRoute);
         this.localeId = inject(LOCALE_ID);
         this.deviceService = inject(AXPDeviceService);
+        this.orgChartStructureRefreshHub = inject(AXMOrgChartStructureRefreshHub);
         //#endregion
         //#region ---- Chart State & UI Metadata ----
         this.NODE_STROKE_COLOR = 'rgba(var(--ax-sys-color-primary-400))';
@@ -601,6 +611,13 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
             await this.refresh();
         });
         this.chartService.applyHydratedUiPrefs(this.route.snapshot.data['orgChartUi']);
+        effect(() => {
+            const rev = this.orgChartStructureRefreshHub.structureDataRevision();
+            if (rev === 0) {
+                return;
+            }
+            void this.reloadChartFromPersistedStructure();
+        });
     }
     //#endregion
     //#region ---- Initialization ----
@@ -610,6 +627,14 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
     toggleDetailPanel() {
         this.isDetailPanelOpen.update((open) => !open);
     }
+    /**
+     * Expands or collapses a node's branch and redraws the chart.
+     */
+    setNodeBranchExpanded(data, expanded) {
+        data.isExpanded = expanded;
+        this.selectNode(data);
+        this.redrawChart();
+    }
     //#endregion
     //#region ---- Pan & Fullscreen ----
     /**
@@ -1032,11 +1057,18 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
         this.createChart(this.treeContainer().nativeElement, this.chartService.rootNode());
     }
     async refresh() {
+        await this.chartService.load();
         if (this.d3) {
-            await this.chartService.load();
             this.redrawChart();
         }
     }
+    /**
+     * Invoked when chart JSON was rebuilt outside this page (e.g. mock listener after entity changes).
+     */
+    async reloadChartFromPersistedStructure() {
+        await this.refresh();
+        this.recompute();
+    }
     onVacantLeafSeatsChange(event) {
         if (!event.isUserInteraction) {
             return;
@@ -1068,7 +1100,64 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
         await this.openOrgChartContextMenuAt(clientX, clientY, node, targetElement);
     }
     /**
-     * Loads actions, builds menu items with sync translation, then opens the context menu with a pre-filled opening event.
+     * Turns carry {@link AXMOrgChartContextMenuItem.orgChartBreakBefore} into `AXMenuItem.break` on the **previous**
+     * sibling at the same level. Recurses into nested flyouts, then removes `orgChartBreakBefore`.
+     */
+    materializeOrgChartMenuBreaks(items) {
+        if (items.length === 0) {
+            return;
+        }
+        for (const entry of items) {
+            if (entry.items != null && entry.items.length > 0) {
+                this.materializeOrgChartMenuBreaks(entry.items);
+            }
+        }
+        for (let i = 0; i < items.length; i++) {
+            if (items[i].orgChartBreakBefore === true && i > 0) {
+                items[i - 1].break = true;
+            }
+            delete items[i].orgChartBreakBefore;
+        }
+    }
+    /**
+     * Removes a trailing `break` on the last row at each nesting level so the menu does not show a divider after the final item.
+     * Recursive for nested flyouts.
+     */
+    normalizeOrgChartContextMenuBreaks(items) {
+        if (items.length === 0) {
+            return;
+        }
+        for (const entry of items) {
+            if (entry.items != null && entry.items.length > 0) {
+                this.normalizeOrgChartContextMenuBreaks(entry.items);
+            }
+        }
+        const last = items[items.length - 1];
+        if (last.break === true) {
+            last.break = false;
+        }
+    }
+    /**
+     * Whether this action renders `AXMenuItem.break` after its **row**: `break` `after` / `both`, and
+     * {@link AXMOrgChartNodeMenuAction.submenuSectionBreak} (separator after this row at any nesting level, including
+     * root when the Employee flyout is flattened on employee cards).
+     */
+    menuActionRowBreakAfter(action) {
+        const b = action.break;
+        const hasAfter = b === 'after' || b === 'both';
+        return action.submenuSectionBreak === true || hasAfter;
+    }
+    /** `break` `before` / `both` for carry / bucket (not for inner-only submenuSectionBreak). */
+    menuActionHasBreakBefore(action) {
+        return action.break === 'before' || action.break === 'both';
+    }
+    /** `after` / `both` for grouped parent bucket trailing separator. */
+    menuActionContributesGroupBreakAfter(action) {
+        return action.break === 'after' || action.break === 'both';
+    }
+    /**
+     * Loads actions, assigns menu structures, then opens the context menu with a pre-filled opening event (`items`
+     * must be populated before {@link AXContextMenuComponent.showAt}: async `onOpening` alone loses the assignment).
      */
     async openOrgChartContextMenuAt(clientX, clientY, node, targetElement) {
         this.selectNode(node);
@@ -1080,25 +1169,37 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
         if (!actions.length) {
             items.push({
                 name: 'org-chart.no-actions',
-                text: this.translateService.translateSync(this.chartML.noActionsAvailable),
+                text: this.chartML.noActionsAvailable,
                 icon: 'fa-light fa-circle-info',
                 disabled: true,
             });
         }
         else {
-            const addActions = actions.filter((action) => this.isAddNodeMenuAction(action));
-            const nonAddActions = actions.filter((action) => !this.isAddNodeMenuAction(action));
-            if (addActions.length > 0) {
+            const addFlyoutActions = actions.filter((action) => action.nestedInAddFlyout === true);
+            const otherActions = actions.filter((action) => action.nestedInAddFlyout !== true);
+            if (addFlyoutActions.length > 0) {
                 items.push({
                     name: 'org-chart.group.add',
-                    text: this.translateService.translateSync(this.chartML.add),
+                    text: this.chartML.add,
                     icon: 'fa-light fa-plus',
                     break: true,
-                    items: addActions.map((action) => this.buildContextMenuLeafItem(action)),
+                    items: addFlyoutActions.map((action) => this.buildContextMenuLeafItem(action)),
                 });
             }
-            items.push(...this.buildGroupedNonAddContextMenuItems(nonAddActions));
+            const nonAddMenuActions = context.nodeKind === 'employee'
+                ? otherActions.map((action) => action.submenuGroupId === AXM_ORG_CHART_EMPLOYEE_SUBMENU_GROUP_ID
+                    ? {
+                        ...action,
+                        submenuGroupId: undefined,
+                        submenuGroupTitle: undefined,
+                        submenuGroupIcon: undefined,
+                    }
+                    : action)
+                : otherActions;
+            items.push(...this.buildGroupedNonAddContextMenuItems(nonAddMenuActions));
         }
+        this.materializeOrgChartMenuBreaks(items);
+        this.normalizeOrgChartContextMenuBreaks(items);
         const menu = this.contextMenu();
         if (!menu) {
             return;
@@ -1108,33 +1209,14 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
                 sender: menu,
                 canceled: false,
                 targetElement,
-                items,
+                items: items,
             };
             menu.showAt({ x: clientX, y: clientY }, targetElement, openingEvent);
         });
     }
-    resolveOrgChartNodeMenuTitleSync(action) {
-        if (typeof action.title !== 'string') {
-            return this.translateService.resolve(action.title);
-        }
-        if (action.titleParams && Object.keys(action.titleParams).length > 0) {
-            return this.translateService.translateSync(action.title, { params: action.titleParams });
-        }
-        return this.translateService.translateSync(action.title);
-    }
-    isAddNodeMenuAction(action) {
-        if (typeof action.title === 'string' &&
-            action.title.startsWith('@organization-management:organization-chart.node-actions.add-')) {
-            return true;
-        }
-        if (/^add([\-._:]|$)/i.test(action.id) || /[.\-_]add([\-._:]|$)/i.test(action.id)) {
-            return true;
-        }
-        const resolvedTitle = this.resolveOrgChartNodeMenuTitleSync(action).trim();
-        return /^add(\s|-)/i.test(resolvedTitle) || resolvedTitle.startsWith('افزودن');
-    }
     /**
-     * Builds top-level context rows for non-add actions, collapsing {@link AXMOrgChartNodeMenuAction.submenuGroupId} sets into one flyout.
+     * Builds top-level rows for actions not under {@link AXMOrgChartNodeMenuAction.nestedInAddFlyout},
+     * collapsing {@link AXMOrgChartNodeMenuAction.submenuGroupId} sets into one flyout.
      */
     buildGroupedNonAddContextMenuItems(actions) {
         const groups = new Map();
@@ -1148,17 +1230,21 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
             let bucket = groups.get(gid);
             if (!bucket) {
                 bucket = {
-                    title: this.resolveSubmenuGroupTitleSync(action),
+                    title: action.submenuGroupTitle,
                     icon: action.submenuGroupIcon,
                     actions: [],
                     breakAfter: false,
+                    breakBefore: false,
                 };
                 groups.set(gid, bucket);
             }
             bucket.actions.push(action);
-            if (action.break === true) {
+            if (this.menuActionContributesGroupBreakAfter(action)) {
                 bucket.breakAfter = true;
             }
+            if (this.menuActionHasBreakBefore(action)) {
+                bucket.breakBefore = true;
+            }
             if (!bucket.icon && action.submenuGroupIcon) {
                 bucket.icon = action.submenuGroupIcon;
             }
@@ -1192,12 +1278,8 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
                 continue;
             }
             const sortedMembers = [...bucket.actions].sort((a, b) => (a.order ?? Number.MAX_SAFE_INTEGER) - (b.order ?? Number.MAX_SAFE_INTEGER));
-            if (sortedMembers.length === 1) {
-                const only = sortedMembers[0];
-                items.push(this.buildContextMenuLeafItem({
-                    ...only,
-                    break: bucket.breakAfter ? true : only.break,
-                }));
+            if (sortedMembers.length === 1 && entry.groupId !== AXM_ORG_CHART_EMPLOYEE_SUBMENU_GROUP_ID) {
+                items.push(this.buildContextMenuLeafItem(sortedMembers[0]));
                 continue;
             }
             items.push({
@@ -1205,33 +1287,22 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
                 text: bucket.title,
                 icon: bucket.icon ?? 'fa-light fa-comments',
                 break: bucket.breakAfter,
-                items: sortedMembers.map((action) => this.buildContextMenuLeafItem({
-                    ...action,
-                    break: false,
-                })),
+                orgChartBreakBefore: bucket.breakBefore === true,
+                items: sortedMembers.map((action) => this.buildContextMenuLeafItem(action)),
             });
         }
         return items;
     }
-    resolveSubmenuGroupTitleSync(action) {
-        const raw = action.submenuGroupTitle;
-        if (raw == null) {
-            return '';
-        }
-        if (typeof raw !== 'string') {
-            return this.translateService.resolve(raw);
-        }
-        return this.translateService.translateSync(raw);
-    }
     buildContextMenuLeafItem(action) {
         this.activeContextMenuActions.set(action.id, action);
         return {
             name: action.id,
-            text: this.resolveOrgChartNodeMenuTitleSync(action),
+            text: action.title,
             icon: action.icon,
             color: action.color,
             disabled: action.disabled,
-            break: action.break,
+            break: this.menuActionRowBreakAfter(action),
+            orgChartBreakBefore: this.menuActionHasBreakBefore(action),
         };
     }
     async handleContextMenuItemClick(e) {
@@ -1330,6 +1401,7 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
                 await this.refresh();
                 this.recompute();
             },
+            host: this,
         };
     }
     resolveNodeKind(node) {
@@ -1697,7 +1769,7 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
                 useExisting: AXMOrgChartPage,
             },
             { provide: AXM_ORG_CHART_HOST, useExisting: AXMOrgChartPage },
-        ], viewQueries: [{ propertyName: "treeContainer", first: true, predicate: ["chart"], descendants: true, isSignal: true }, { propertyName: "parent", first: true, predicate: ["parent"], descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: AXContextMenuComponent, descendants: true, isSignal: true }, { propertyName: "panView", first: true, predicate: AXPanViewDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"ax-flex ax-flex-wrap ax-items-center ax-gap-3\">\n        <ax-search-box class=\"ax-w-72\" [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\" [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"ax-flex ax-items-center ax-gap-2 ax-flex-shrink-0 ax-whitespace-nowrap\">\n          <span class=\"ax-text-sm\">{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate\n            | async\n            }}</span>\n          <ax-switch [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"ax-overflow-hidden ax-flex ax-flex-col\">\n    <div class=\"ax-flex ax-flex-row ax-gap-4 ax-flex-1 ax-min-h-0 ax-overflow-hidden\" #parent id=\"parent\">\n      <div class=\"ax-flex-1 ax-min-w-0 ax-min-h-0 ax-overflow-hidden ax-relative ax-light\">\n        <div #chart axPanView [(panX)]=\"panX\" [(panY)]=\"panY\" [freeMode]=\"true\" [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\" wrapperClasses=\"h\" class=\"ax-light\" (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\">\n        </div>\n        <div class=\"axm-org-chart-page__floating-zoom\">\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomOut()\">\n            <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n          </ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomPercentageLabel()\"\n            (onClick)=\"zoomReset()\"></ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomIn()\">\n            <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n          </ax-button>\n        </div>\n        <ax-context-menu [orientation]=\"'vertical'\" [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\">\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axm-org-chart-detail-panel class=\"ax-sticky ax-top-0 ax-z-10 ax-max-h-full ax-flex-none\"\n        [node]=\"detailPanelSelectedNode()\" (panelClose)=\"toggleDetailPanel()\" />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>", styles: ["@charset \"UTF-8\";foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container{--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--selected .--container{border-width:2px;border-style:dashed;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:.375rem;border-width:1px;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;left:0;right:0;bottom:-.75rem;display:flex;width:100%;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:0px}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:1rem;--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient(ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100%);--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 8%, transparent);--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent);box-shadow:0 1px 2px #0000000a,0 12px 32px #00000014,0 32px 64px -24px #0000001a,0 0 36px var(--oc-ring-1),0 0 16px var(--oc-ring-2),0 0 28px var(--oc-ring-3),inset 0 1px #fffc}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}.dark .axp-chart-node .--node-container.axm-org-chart-card{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)));box-shadow:0 1px 2px #00000061,0 14px 36px #0000006b,0 28px 64px -28px #0000007a,0 0 30px var(--oc-ring-1),0 0 14px var(--oc-ring-2),0 0 24px var(--oc-ring-3)}.dark .axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent);--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:1rem;border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:0px;flex-direction:column;overflow:hidden;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))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:is(.ax-dark *){background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:1rem;line-height:1.5rem;font-weight:600}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:0px;align-items:flex-start;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:0px;align-items:center;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:3rem;height:3rem;flex:none;align-items:center;justify-content:center;border-radius:.75rem;color:rgb(var(--node-bg-color));background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:600;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.9;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.85;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-width:0px;padding:.5rem 1rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:.5rem;font-size:.75rem;line-height:1rem;font-weight:700;line-height:1.25;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:0px;align-items:center;gap:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:700;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;letter-spacing:.025em;color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-top:1rem;padding-bottom:1rem;border-top-width:1px;min-height:3.5rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not([hidden])~:not([hidden]){--tw-divide-x-reverse: 0;border-right-width:calc(1px * var(--tw-divide-x-reverse));border-left-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)));--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *)>:not([hidden])~:not([hidden]){--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *){--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1 1 0%;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:.875rem;line-height:1.25rem;opacity:.95;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:0px;flex:none;flex-direction:column;align-items:center;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:.875rem;line-height:1.25rem;font-weight:600;line-height:1}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.25;opacity:.75;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axm-org-chart-page__floating-zoom{position:absolute;bottom:1rem;z-index:20;display:flex;align-items:center;gap:.25rem;border-radius:1rem;padding:.375rem;border-width:1px;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));inset-inline-end:1rem;backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axm-org-chart-page__floating-zoom .__zoom-button{border-radius:.75rem;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}.axm-org-chart-page__floating-zoom .__zoom-value{min-width:4rem;border-radius:.75rem;font-weight:600;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: 
+        ], viewQueries: [{ propertyName: "treeContainer", first: true, predicate: ["chart"], descendants: true, isSignal: true }, { propertyName: "parent", first: true, predicate: ["parent"], descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: AXContextMenuComponent, descendants: true, isSignal: true }, { propertyName: "panView", first: true, predicate: AXPanViewDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"ax-flex ax-flex-wrap ax-items-center ax-gap-3\">\n        <ax-search-box class=\"ax-w-72\" [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\" [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"ax-flex ax-items-center ax-gap-2 ax-flex-shrink-0 ax-whitespace-nowrap\">\n          <span class=\"ax-text-sm\">{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate\n            | async\n            }}</span>\n          <ax-switch [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"ax-overflow-hidden ax-flex ax-flex-col\">\n    <div class=\"ax-flex ax-flex-row ax-gap-4 ax-flex-1 ax-min-h-0 ax-overflow-hidden\" #parent id=\"parent\">\n      <div class=\"ax-flex-1 ax-min-w-0 ax-min-h-0 ax-overflow-hidden ax-relative ax-light\">\n        <div #chart axPanView [(panX)]=\"panX\" [(panY)]=\"panY\" [freeMode]=\"true\" [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\" wrapperClasses=\"h\" class=\"ax-light\" (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\">\n        </div>\n        <div class=\"axm-org-chart-page__floating-zoom\">\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomOut()\">\n            <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n          </ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomPercentageLabel()\"\n            (onClick)=\"zoomReset()\"></ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomIn()\">\n            <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n          </ax-button>\n        </div>\n        <ax-context-menu [orientation]=\"'vertical'\" [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\">\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axm-org-chart-detail-panel class=\"ax-sticky ax-top-0 ax-z-10 ax-max-h-full ax-flex-none\"\n        [node]=\"detailPanelSelectedNode()\" (panelClose)=\"toggleDetailPanel()\" />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>", styles: ["@charset \"UTF-8\";foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container{--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--selected .--container{border-width:2px;border-style:dashed;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:.375rem;border-width:1px;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;left:0;right:0;bottom:-.75rem;display:flex;width:100%;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:0px}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:1rem;--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient(ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100%);--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 5%, transparent);--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent);box-shadow:0 1px 2px #00000008,0 4px 12px #0000000d,0 14px 28px -16px #0000000f,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3),inset 0 1px #fffc}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}.dark .axp-chart-node .--node-container.axm-org-chart-card{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)));box-shadow:0 1px 2px #00000038,0 6px 18px #00000042,0 16px 36px -18px #0000004d,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3)}.dark .axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent);--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:1rem;border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:0px;flex-direction:column;overflow:hidden;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))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:is(.ax-dark *){background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:1rem;line-height:1.5rem;font-weight:600}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:0px;align-items:flex-start;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:0px;align-items:center;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:3rem;height:3rem;flex:none;align-items:center;justify-content:center;border-radius:.75rem;color:rgb(var(--node-bg-color));background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:600;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.9;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.85;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-width:0px;padding:.5rem 1rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:.5rem;font-size:.75rem;line-height:1rem;font-weight:700;line-height:1.25;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:0px;align-items:center;gap:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:700;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;letter-spacing:.025em;color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-top:1rem;padding-bottom:1rem;border-top-width:1px;min-height:3.5rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not([hidden])~:not([hidden]){--tw-divide-x-reverse: 0;border-right-width:calc(1px * var(--tw-divide-x-reverse));border-left-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)));--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *)>:not([hidden])~:not([hidden]){--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *){--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1 1 0%;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:.875rem;line-height:1.25rem;opacity:.95;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:0px;flex:none;flex-direction:column;align-items:center;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:.875rem;line-height:1.25rem;font-weight:600;line-height:1}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.25;opacity:.75;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axm-org-chart-page__floating-zoom{position:absolute;bottom:1rem;z-index:20;display:flex;align-items:center;gap:.25rem;border-radius:1rem;padding:.375rem;border-width:1px;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));inset-inline-end:1rem;backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axm-org-chart-page__floating-zoom .__zoom-button{border-radius:.75rem;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}.axm-org-chart-page__floating-zoom .__zoom-value{min-width:4rem;border-radius:.75rem;font-weight:600;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: 
                 //
                 AXMenuModule }, { kind: "component", type: i2$1.AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "items", "target"], outputs: ["onItemClick", "onOpening", "onClose"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "directive", type: AXPanViewDirective, selector: "[axPanView]", inputs: ["zoomStep", "minZoom", "maxZoom", "freeMode", "fitContent", "disablePan", "disableZoom", "wrapperClasses", "panX", "panY", "zoom"], outputs: ["panXChange", "panYChange", "zoomChange", "positionChange"], exportAs: ["axPanView"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i6.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "component", type: i7.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: 
                 //
@@ -1733,8 +1805,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                             useExisting: AXMOrgChartPage,
                         },
                         { provide: AXM_ORG_CHART_HOST, useExisting: AXMOrgChartPage },
-                    ], template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"ax-flex ax-flex-wrap ax-items-center ax-gap-3\">\n        <ax-search-box class=\"ax-w-72\" [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\" [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"ax-flex ax-items-center ax-gap-2 ax-flex-shrink-0 ax-whitespace-nowrap\">\n          <span class=\"ax-text-sm\">{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate\n            | async\n            }}</span>\n          <ax-switch [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"ax-overflow-hidden ax-flex ax-flex-col\">\n    <div class=\"ax-flex ax-flex-row ax-gap-4 ax-flex-1 ax-min-h-0 ax-overflow-hidden\" #parent id=\"parent\">\n      <div class=\"ax-flex-1 ax-min-w-0 ax-min-h-0 ax-overflow-hidden ax-relative ax-light\">\n        <div #chart axPanView [(panX)]=\"panX\" [(panY)]=\"panY\" [freeMode]=\"true\" [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\" wrapperClasses=\"h\" class=\"ax-light\" (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\">\n        </div>\n        <div class=\"axm-org-chart-page__floating-zoom\">\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomOut()\">\n            <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n          </ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomPercentageLabel()\"\n            (onClick)=\"zoomReset()\"></ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomIn()\">\n            <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n          </ax-button>\n        </div>\n        <ax-context-menu [orientation]=\"'vertical'\" [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\">\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axm-org-chart-detail-panel class=\"ax-sticky ax-top-0 ax-z-10 ax-max-h-full ax-flex-none\"\n        [node]=\"detailPanelSelectedNode()\" (panelClose)=\"toggleDetailPanel()\" />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>", styles: ["@charset \"UTF-8\";foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container{--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--selected .--container{border-width:2px;border-style:dashed;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:.375rem;border-width:1px;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;left:0;right:0;bottom:-.75rem;display:flex;width:100%;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:0px}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:1rem;--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient(ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100%);--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 8%, transparent);--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent);box-shadow:0 1px 2px #0000000a,0 12px 32px #00000014,0 32px 64px -24px #0000001a,0 0 36px var(--oc-ring-1),0 0 16px var(--oc-ring-2),0 0 28px var(--oc-ring-3),inset 0 1px #fffc}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}.dark .axp-chart-node .--node-container.axm-org-chart-card{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)));box-shadow:0 1px 2px #00000061,0 14px 36px #0000006b,0 28px 64px -28px #0000007a,0 0 30px var(--oc-ring-1),0 0 14px var(--oc-ring-2),0 0 24px var(--oc-ring-3)}.dark .axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent);--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:1rem;border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:0px;flex-direction:column;overflow:hidden;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))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:is(.ax-dark *){background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:1rem;line-height:1.5rem;font-weight:600}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:0px;align-items:flex-start;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:0px;align-items:center;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:3rem;height:3rem;flex:none;align-items:center;justify-content:center;border-radius:.75rem;color:rgb(var(--node-bg-color));background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:600;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.9;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.85;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-width:0px;padding:.5rem 1rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:.5rem;font-size:.75rem;line-height:1rem;font-weight:700;line-height:1.25;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:0px;align-items:center;gap:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:700;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;letter-spacing:.025em;color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-top:1rem;padding-bottom:1rem;border-top-width:1px;min-height:3.5rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not([hidden])~:not([hidden]){--tw-divide-x-reverse: 0;border-right-width:calc(1px * var(--tw-divide-x-reverse));border-left-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)));--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *)>:not([hidden])~:not([hidden]){--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *){--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1 1 0%;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:.875rem;line-height:1.25rem;opacity:.95;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:0px;flex:none;flex-direction:column;align-items:center;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:.875rem;line-height:1.25rem;font-weight:600;line-height:1}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.25;opacity:.75;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axm-org-chart-page__floating-zoom{position:absolute;bottom:1rem;z-index:20;display:flex;align-items:center;gap:.25rem;border-radius:1rem;padding:.375rem;border-width:1px;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));inset-inline-end:1rem;backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axm-org-chart-page__floating-zoom .__zoom-button{border-radius:.75rem;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}.axm-org-chart-page__floating-zoom .__zoom-value{min-width:4rem;border-radius:.75rem;font-weight:600;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}\n"] }]
+                    ], template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"ax-flex ax-flex-wrap ax-items-center ax-gap-3\">\n        <ax-search-box class=\"ax-w-72\" [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\" [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"ax-flex ax-items-center ax-gap-2 ax-flex-shrink-0 ax-whitespace-nowrap\">\n          <span class=\"ax-text-sm\">{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate\n            | async\n            }}</span>\n          <ax-switch [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"ax-overflow-hidden ax-flex ax-flex-col\">\n    <div class=\"ax-flex ax-flex-row ax-gap-4 ax-flex-1 ax-min-h-0 ax-overflow-hidden\" #parent id=\"parent\">\n      <div class=\"ax-flex-1 ax-min-w-0 ax-min-h-0 ax-overflow-hidden ax-relative ax-light\">\n        <div #chart axPanView [(panX)]=\"panX\" [(panY)]=\"panY\" [freeMode]=\"true\" [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\" wrapperClasses=\"h\" class=\"ax-light\" (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\">\n        </div>\n        <div class=\"axm-org-chart-page__floating-zoom\">\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomOut()\">\n            <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n          </ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomPercentageLabel()\"\n            (onClick)=\"zoomReset()\"></ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomIn()\">\n            <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n          </ax-button>\n        </div>\n        <ax-context-menu [orientation]=\"'vertical'\" [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\">\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axm-org-chart-detail-panel class=\"ax-sticky ax-top-0 ax-z-10 ax-max-h-full ax-flex-none\"\n        [node]=\"detailPanelSelectedNode()\" (panelClose)=\"toggleDetailPanel()\" />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>", styles: ["@charset \"UTF-8\";foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container{--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--selected .--container{border-width:2px;border-style:dashed;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:.375rem;border-width:1px;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;left:0;right:0;bottom:-.75rem;display:flex;width:100%;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:0px}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:1rem;--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient(ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100%);--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 5%, transparent);--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent);box-shadow:0 1px 2px #00000008,0 4px 12px #0000000d,0 14px 28px -16px #0000000f,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3),inset 0 1px #fffc}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}.dark .axp-chart-node .--node-container.axm-org-chart-card{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)));box-shadow:0 1px 2px #00000038,0 6px 18px #00000042,0 16px 36px -18px #0000004d,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3)}.dark .axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent);--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent);--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:1rem;border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:0px;flex-direction:column;overflow:hidden;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))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:is(.ax-dark *){background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:1rem;line-height:1.5rem;font-weight:600}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:0px;align-items:flex-start;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:0px;align-items:center;gap:1rem;padding:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:3rem;height:3rem;flex:none;align-items:center;justify-content:center;border-radius:.75rem;color:rgb(var(--node-bg-color));background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:600;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.9;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.75rem;line-height:1rem;line-height:1.375;opacity:.85;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-width:0px;padding:.5rem 1rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:.5rem;font-size:.75rem;line-height:1rem;font-weight:700;line-height:1.25;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:0px;align-items:center;gap:1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:700;line-height:1.25;color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;line-height:1.375;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;letter-spacing:.025em;color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-top:1rem;padding-bottom:1rem;border-top-width:1px;min-height:3.5rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not([hidden])~:not([hidden]){--tw-divide-x-reverse: 0;border-right-width:calc(1px * var(--tw-divide-x-reverse));border-left-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)));--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *)>:not([hidden])~:not([hidden]){--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-divide-opacity, 1))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:is(.ax-dark *){--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-darkest-surface),var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1 1 0%;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:.875rem;line-height:1.25rem;opacity:.95;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:0px;flex:none;flex-direction:column;align-items:center;gap:.125rem}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:.875rem;line-height:1.25rem;font-weight:600;line-height:1}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.25;opacity:.75;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axm-org-chart-page__floating-zoom{position:absolute;bottom:1rem;z-index:20;display:flex;align-items:center;gap:.25rem;border-radius:1rem;padding:.375rem;border-width:1px;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));inset-inline-end:1rem;backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axm-org-chart-page__floating-zoom .__zoom-button{border-radius:.75rem;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}.axm-org-chart-page__floating-zoom .__zoom-value{min-width:4rem;border-radius:.75rem;font-weight:600;color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { treeContainer: [{ type: i0.ViewChild, args: ['chart', { isSignal: true }] }], parent: [{ type: i0.ViewChild, args: ['parent', { isSignal: true }] }], contextMenu: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXContextMenuComponent), { isSignal: true }] }], panView: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPanViewDirective), { isSignal: true }] }] } });
 
 export { AXMOrgChartPage };
-//# sourceMappingURL=acorex-modules-organization-management-org-chart.page-fudrNddI.mjs.map
+//# sourceMappingURL=acorex-modules-organization-management-org-chart.page-BcHO5kKP.mjs.map