@acorex-platform/module-platform-dev-tools-client 0.0.38 → 0.0.48

package/fesm2022/acorex-platform-module-platform-dev-tools-client.mjs

@@ -1,45 +1,42 @@
-import { AXPModuleManifestRegistry, AXP_MODULE_MANIFEST_PROVIDER, provideLazyProvider } from '@acorex-platform/framework-client/core';
+import { AXPModuleManifestRegistry, AXPDeviceService, provideLazyProvider } from '@acorex-platform/framework-client/core';
 import { AXP_SETTING_DEFINITION_PROVIDER, AXP_MENU_PROVIDER } from '@acorex-platform/framework-client/common';
-import { AXPPermissionDefinitionService, AXPAuthGuard, AXP_PERMISSION_DEFINITION_PROVIDER } from '@acorex-platform/framework-client/auth';
+import { AXPAuthGuard, AXP_PERMISSION_DEFINITION_PROVIDER } from '@acorex-platform/framework-client/auth';
 import { AXPRootLayoutComponent } from '@acorex-platform/framework-client/themes/default';
 import * as i0 from '@angular/core';
-import { Injectable, inject, input, ChangeDetectionStrategy, ViewEncapsulation, Component, signal, effect, viewChild, output, NgModule } from '@angular/core';
-import { ROUTES } from '@angular/router';
-import { RootConfig, AXPApplicationsPlatformPermissionKeys, AXPPlatformDevToolsSettings, AXP_PLATFORM_DEV_TOOLS_COMMUNICATION_DEBUG_REDIRECT_SECTION } from '@acorex-platform/module-platform-dev-tools-client/contracts';
+import { Injectable, inject, signal, input, computed, ChangeDetectionStrategy, ViewEncapsulation, Component, DestroyRef, linkedSignal, effect, viewChild, NgModule } from '@angular/core';
+import { ActivatedRoute, ROUTES } from '@angular/router';
 import { AXPCommonPermissionGroupKeys } from '@acorex-platform/module-common-client/contracts';
-import { AXPWidgetsList } from '@acorex-platform/framework-shared/core';
-import { AXPEntityResolver } from '@acorex-platform/framework-client/layout/entity';
+import { AXPApplicationsPlatformPermissionKeys, AXPPlatformDevToolsSettings, AXP_PLATFORM_DEV_TOOLS_COMMUNICATION_DEBUG_REDIRECT_SECTION } from '@acorex-platform/module-platform-dev-tools-client/contracts';
+export { PlatformDevToolsManifest } from '@acorex-platform/module-platform-dev-tools-client/contracts';
+import { AXPWidgetsList, runtimeQueryPayloadData, AXP_MODULE_TYPE, resolveModuleType, resolveModuleDomain } from '@acorex-platform/framework-shared/core';
+import { AXPQueryService } from '@acorex-platform/framework-client/runtime';
+import { AXMPlatformExplorerQueryKeys } from '@acorex-platform/module-platform-management-client/contracts';
 import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
+import { CommonModule, NgTemplateOutlet } from '@angular/common';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { AXResizableDirective } from '@acorex/cdk/resizable';
 import { AXTreeViewComponent } from '@acorex/components/tree-view';
-import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex-platform/framework-client/layout/views';
-import * as i2 from '@acorex/core/translation';
+import * as i4 from '@acorex/components/decorators';
+import { AXDecoratorModule } from '@acorex/components/decorators';
+import * as i2$1 from '@acorex/components/loading';
+import { AXLoadingModule } from '@acorex/components/loading';
+import * as i3$1 from '@acorex/components/search-box';
+import { AXSearchBoxModule } from '@acorex/components/search-box';
+import * as i5$1 from '@acorex/components/tabs';
+import { AXTabsModule } from '@acorex/components/tabs';
+import * as i3 from '@acorex/core/translation';
 import { AXTranslationModule } from '@acorex/core/translation';
-import { AXPThemeLayoutStartSideComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutBlockComponent } from '@acorex-platform/framework-client/layout/components';
+import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex-platform/framework-client/layout/views';
+import { AXPStateMessageComponent, AXPThemeLayoutStartSideComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutBlockComponent } from '@acorex-platform/framework-client/layout/components';
+import * as i2 from '@acorex/components/badge';
+import { AXBadgeModule } from '@acorex/components/badge';
+import * as i5 from '@acorex/components/drawer';
+import { AXDrawerModule } from '@acorex/components/drawer';
+import { arrangeWorkflowDiagram, AXPWorkflowDesignerComponent } from '@acorex-platform/module-platform-management-client';
 import { AXDataSource } from '@acorex/cdk/common';
 import * as i1$1 from '@acorex/components/data-table';
 import { AXDataTableModule } from '@acorex/components/data-table';
 
-//#region ----   Imports   ----
-//#endregion
-//#region ----   Manifest Definition   ----
-/**
- * Platform Dev Tools Module Manifest.
- * Development-only module for exploring platform structure (modules, entities, permissions, features).
- */
-const PlatformDevToolsManifest = {
-    name: RootConfig.module.name,
-    version: '1.0.0',
-    title: RootConfig.module.title,
-    icon: RootConfig.module.icon,
-    i18n: RootConfig.config.i18n,
-    type: 'platform',
-    domain: 'platform',
-    description: '@platform-dev-tools:module.description',
-    required: false,
-};
-//#endregion
-
 //#endregion
 //#region ---- Permission Definition Provider ----
 /**
@@ -100,147 +97,353 @@ class AXPPlatformDevToolsSettingProvider {
 }
 //#endregion
 
-//#region ----   Tree node types   ----
+//#region ----- Tree node types -----
 //#endregion
 
-//#region ----   Imports   ----
 //#endregion
-//#region ----   Service   ----
+//#region ----- Constants -----
+const EXPLORER_QUERY_MODULE = 'module';
+const EXPLORER_QUERY_KIND = 'kind';
+const EXPLORER_QUERY_NAME = 'name';
+const EXPLORER_QUERY_SEARCH = 'q';
+const FOLDER_KINDS = new Set(['entities', 'commands', 'queries', 'plugins', 'widgets']);
+const PAGE_KINDS = new Set([
+    'module',
+    'diagram',
+    'entity',
+    'command',
+    'query',
+    'plugin',
+    'widget',
+]);
+//#endregion
+//#region ----- Kind helpers -----
+function isExplorerFolderKind(kind) {
+    return !!kind && FOLDER_KINDS.has(kind);
+}
+function isExplorerPageKind(kind) {
+    return !!kind && PAGE_KINDS.has(kind);
+}
+function catalogFolderKind(kind) {
+    switch (kind) {
+        case 'entity':
+            return 'entities';
+        case 'command':
+            return 'commands';
+        case 'query':
+            return 'queries';
+        case 'plugin':
+            return 'plugins';
+        case 'widget':
+            return 'widgets';
+    }
+}
+//#endregion
+//#region ----- Query params -----
+function param(map, key) {
+    const value = map.get(key)?.trim();
+    return value || undefined;
+}
+function explorerStateFromQuery(map) {
+    const module = param(map, EXPLORER_QUERY_MODULE);
+    const rawKind = param(map, EXPLORER_QUERY_KIND);
+    const kind = rawKind === 'entities' ? 'diagram' : rawKind;
+    return {
+        ...(module ? { module } : {}),
+        ...(isExplorerPageKind(kind) ? { kind } : {}),
+        ...(param(map, EXPLORER_QUERY_NAME) ? { name: param(map, EXPLORER_QUERY_NAME) } : {}),
+        ...(param(map, EXPLORER_QUERY_SEARCH) ? { search: param(map, EXPLORER_QUERY_SEARCH) } : {}),
+    };
+}
+function queryParamsFromExplorer(node, search) {
+    const q = search.trim();
+    const params = {
+        [EXPLORER_QUERY_MODULE]: null,
+        [EXPLORER_QUERY_KIND]: null,
+        [EXPLORER_QUERY_NAME]: null,
+        [EXPLORER_QUERY_SEARCH]: q || null,
+    };
+    if (!node || node.kind === 'type-group' || isExplorerFolderKind(node.kind)) {
+        return params;
+    }
+    if (node.moduleName) {
+        params[EXPLORER_QUERY_MODULE] = node.moduleName;
+    }
+    if (node.kind === 'module') {
+        return params;
+    }
+    if (node.kind === 'diagram') {
+        params[EXPLORER_QUERY_KIND] = 'diagram';
+        return params;
+    }
+    if (node.kind === 'entity' ||
+        node.kind === 'command' ||
+        node.kind === 'query' ||
+        node.kind === 'plugin' ||
+        node.kind === 'widget') {
+        params[EXPLORER_QUERY_KIND] = node.kind;
+        const payload = node.payload;
+        const name = String(payload?.name ?? '').trim() ||
+            String(payload?.fullName ?? '').trim() ||
+            node.label;
+        params[EXPLORER_QUERY_NAME] = name;
+    }
+    return params;
+}
+function explorerNodeId(moduleName, kind, name) {
+    if (kind === 'module') {
+        return `module-${moduleName}`;
+    }
+    if (kind === 'diagram') {
+        return `module-${moduleName}-diagram`;
+    }
+    return `${kind}-${name ?? ''}`;
+}
+function explorerRevealIds(node) {
+    const moduleName = node.moduleName;
+    if (!moduleName) {
+        return [node.id];
+    }
+    const ids = [`module-${moduleName}`];
+    if (node.kind === 'entity' ||
+        node.kind === 'command' ||
+        node.kind === 'query' ||
+        node.kind === 'plugin' ||
+        node.kind === 'widget') {
+        ids.push(`module-${moduleName}-${catalogFolderKind(node.kind)}`);
+    }
+    if (node.kind !== 'module') {
+        ids.push(node.id);
+    }
+    return ids;
+}
+function sameExplorerNode(left, right) {
+    return left?.id === right?.id;
+}
+//#endregion
+
+//#region ----- Imports -----
+//#endregion
+//#region ----- Service -----
 class PlatformExplorerDataService {
     constructor() {
-        this.manifestRegistry = inject(AXPModuleManifestRegistry);
-        this.entityResolver = inject(AXPEntityResolver);
-        this.permissionService = inject(AXPPermissionDefinitionService);
-    }
-    /**
-     * Build only root-level module nodes (no children). Children are loaded on expand via getModuleChildren.
-     * Includes all modules; use buildModulesOnlyFiltered() to exclude modules with no entities/permissions/features.
-     */
-    async buildModulesOnly() {
-        await this.manifestRegistry.initialize();
-        const modules = this.manifestRegistry.getAll();
-        const tree = modules.map((mod) => ({
-            id: `module-${mod.name}`,
-            kind: 'module',
-            label: mod.title,
-            moduleName: mod.name,
-            moduleTitle: mod.title,
-            payload: mod,
-            children: [],
-        }));
-        tree.sort((a, b) => {
-            const nameA = a.payload?.name ?? a.moduleName ?? '';
-            const nameB = b.payload?.name ?? b.moduleName ?? '';
-            return nameA.localeCompare(nameB, undefined, { sensitivity: 'base' });
-        });
-        return tree;
-    }
-    /**
-     * Build root-level module nodes, excluding modules that have no entities, permissions, or features.
-     * Each module node gets itemCount = number of non-empty subcategories (for badge).
-     */
-    async buildModulesOnlyFiltered() {
-        const all = await this.buildModulesOnly();
-        const filtered = [];
-        for (const modNode of all) {
-            const children = await this.getModuleChildren(modNode.id);
-            if (children.length > 0) {
-                filtered.push({
-                    ...modNode,
-                    itemCount: children.length,
-                });
-            }
+        this.queryService = inject(AXPQueryService);
+        this.manifestRegistry = inject(AXPModuleManifestRegistry, { optional: true });
+        this.moduleCache = new Map();
+        this.entityTabs = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "entityTabs" }] : /* istanbul ignore next */ []));
+        this.activeEntitySection = signal('properties', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "activeEntitySection" }] : /* istanbul ignore next */ []));
+    }
+    clearCache() {
+        this.moduleCache.clear();
+    }
+    setEntityTabs(tabs) {
+        this.entityTabs.set(tabs);
+    }
+    selectEntitySection(section) {
+        this.activeEntitySection.set(section);
+    }
+    clearEntityTabs() {
+        this.entityTabs.set([]);
+        this.activeEntitySection.set('properties');
+    }
+    async listModules(search) {
+        const result = await this.queryService.fetch(AXMPlatformExplorerQueryKeys.ListModules, { search: search?.trim() || undefined });
+        return runtimeQueryPayloadData(result)?.items ?? [];
+    }
+    async getModule(moduleName) {
+        const name = moduleName.trim();
+        const cached = this.moduleCache.get(name);
+        if (cached) {
+            return cached;
+        }
+        const result = await this.queryService.fetch(AXMPlatformExplorerQueryKeys.GetModule, { module: name });
+        const catalog = runtimeQueryPayloadData(result) ?? null;
+        if (catalog) {
+            this.moduleCache.set(name, catalog);
         }
-        return filtered;
+        return catalog;
     }
-    /**
-     * Load entities, permissions, and features for a module (called when module node is expanded or clicked).
-     * Only includes subcategories that have at least one item. Returns empty array if module has no items.
-     */
-    async getModuleChildren(moduleId) {
-        const moduleName = moduleId.startsWith('module-') ? moduleId.slice(7) : moduleId;
-        const mod = this.manifestRegistry.get(moduleName);
-        if (!mod)
-            return [];
-        const moduleTitle = mod.title;
-        const [allEntries, permissions, features] = await Promise.all([
-            this.entityResolver.listAll(),
-            this.getPermissionsForModule(moduleName),
-            Promise.resolve(this.getFeaturesForModule(moduleName)),
-        ]);
-        const moduleEntities = allEntries.filter((e) => e.module === moduleName);
-        const permissionsCount = permissions.length;
-        const featuresCount = features.length;
-        const nodes = [];
-        if (moduleEntities.length > 0) {
-            nodes.push({
-                id: `module-${moduleName}-entities`,
-                kind: 'entities',
-                label: '@platform-dev-tools:module.terms.entities',
+    async getEntity(moduleName, entityName) {
+        const result = await this.queryService.fetch(AXMPlatformExplorerQueryKeys.GetEntity, { module: moduleName, entity: entityName });
+        return runtimeQueryPayloadData(result) ?? null;
+    }
+    async getCatalogItem(kind, name) {
+        const result = await this.queryService.fetch(AXMPlatformExplorerQueryKeys.GetCatalogItem, { kind, name });
+        return runtimeQueryPayloadData(result) ?? null;
+    }
+    getManifest(moduleName) {
+        return this.manifestRegistry?.get(moduleName);
+    }
+    moduleTitle(moduleName) {
+        return this.getManifest(moduleName)?.title ?? moduleName;
+    }
+    moduleIcon(moduleName) {
+        return this.getManifest(moduleName)?.icon || 'fa-light fa-cube';
+    }
+    async resolveExplorerSelection(state, moduleNodes) {
+        const moduleName = state.module?.trim();
+        if (!moduleName) {
+            return null;
+        }
+        const moduleNode = moduleNodes.find((node) => node.kind === 'module' && node.moduleName === moduleName);
+        if (!moduleNode) {
+            return null;
+        }
+        const kind = state.kind;
+        if (!kind || kind === 'module') {
+            return moduleNode;
+        }
+        const title = this.moduleTitle(moduleName);
+        if (kind === 'diagram') {
+            const catalog = await this.getModule(moduleName);
+            if (!catalog?.entities.length) {
+                return moduleNode;
+            }
+            return {
+                id: `module-${moduleName}-diagram`,
+                kind: 'diagram',
+                label: '@platform-dev-tools:module.terms.diagram',
                 moduleName,
-                moduleTitle,
-                itemCount: moduleEntities.length,
-                children: moduleEntities.map((e) => ({
-                    id: `entity-${moduleName}-${e.name}`,
-                    kind: 'entity',
-                    label: e.name,
-                    moduleName,
-                    moduleTitle,
-                    payload: e,
-                })),
+                moduleTitle: title,
+            };
+        }
+        const name = state.name?.trim();
+        if (!name) {
+            return moduleNode;
+        }
+        const children = await this.getCategoryChildren(moduleName, catalogFolderKind(kind));
+        return (children.find((node) => {
+            const payload = node.payload;
+            return (node.id === `${kind}-${name}` ||
+                String(payload?.name ?? '') === name ||
+                String(payload?.fullName ?? '') === name);
+        }) ?? moduleNode);
+    }
+    toModuleTreeNodes(modules) {
+        const buckets = new Map();
+        for (const type of Object.values(AXP_MODULE_TYPE)) {
+            buckets.set(type, []);
+        }
+        for (const mod of modules) {
+            const manifest = this.getManifest(mod.name);
+            const type = resolveModuleType({
+                name: mod.name,
+                type: manifest?.type,
+                required: manifest?.required,
             });
+            const list = buckets.get(type) ?? [];
+            list.push(mod);
+            buckets.set(type, list);
         }
-        if (permissionsCount > 0) {
+        const nodes = [];
+        let firstGroup = true;
+        for (const type of Object.values(AXP_MODULE_TYPE)) {
+            const list = [...(buckets.get(type) ?? [])].sort((a, b) => this.moduleTitle(a.name).localeCompare(this.moduleTitle(b.name), undefined, { sensitivity: 'base' }));
+            if (list.length === 0) {
+                continue;
+            }
             nodes.push({
-                id: `module-${moduleName}-permissions`,
-                kind: 'permissions',
-                label: '@platform-dev-tools:module.terms.permissions',
-                moduleName,
-                moduleTitle,
-                itemCount: permissionsCount,
+                id: `type-group-${type}`,
+                kind: 'type-group',
+                label: `@application-management:editions.modules-editor.types.${type}`,
+                divided: !firstGroup,
             });
+            firstGroup = false;
+            for (const mod of list) {
+                nodes.push(this.toModuleNode(mod));
+            }
+        }
+        return nodes;
+    }
+    toModuleNode(mod) {
+        return {
+            id: `module-${mod.name}`,
+            kind: 'module',
+            label: this.moduleTitle(mod.name),
+            moduleName: mod.name,
+            moduleTitle: this.moduleTitle(mod.name),
+            icon: this.moduleIcon(mod.name),
+            itemCount: mod.categoryCount + (mod.entityCount > 0 ? 1 : 0),
+            payload: mod,
+        };
+    }
+    async getModuleChildren(moduleName) {
+        const catalog = await this.getModule(moduleName);
+        if (!catalog) {
+            return [];
         }
-        if (featuresCount > 0) {
+        const title = this.moduleTitle(moduleName);
+        const nodes = [];
+        if (catalog.entities.length > 0) {
             nodes.push({
-                id: `module-${moduleName}-features`,
-                kind: 'features',
-                label: '@platform-dev-tools:module.terms.features',
+                id: `module-${moduleName}-diagram`,
+                kind: 'diagram',
+                label: '@platform-dev-tools:module.terms.diagram',
                 moduleName,
-                moduleTitle,
-                itemCount: featuresCount,
+                moduleTitle: title,
             });
         }
+        this.pushCategory(nodes, moduleName, title, 'entities', catalog.entities.length);
+        this.pushCategory(nodes, moduleName, title, 'commands', catalog.commands.length);
+        this.pushCategory(nodes, moduleName, title, 'queries', catalog.queries.length);
+        this.pushCategory(nodes, moduleName, title, 'plugins', catalog.plugins.length);
+        this.pushCategory(nodes, moduleName, title, 'widgets', catalog.widgets.length);
         return nodes;
     }
-    /**
-     * Get all permissions for a module (for display in module detail).
-     */
-    async getPermissionsForModule(moduleName) {
-        const groups = await this.permissionService.getGroups();
-        return this.collectPermissionsForModule(groups, moduleName);
-    }
-    /**
-     * Get all features for a module (for display in module detail).
-     */
-    getFeaturesForModule(moduleName) {
-        return this.manifestRegistry.getModuleFeatures(moduleName);
-    }
-    collectPermissionsForModule(groups, moduleName) {
-        const prefix = `${moduleName}:`;
-        const out = [];
-        const collect = (items) => {
-            for (const p of items) {
-                if (p.name.startsWith(prefix))
-                    out.push(p);
-                if (p.children?.length)
-                    collect(p.children);
-            }
-        };
-        for (const g of groups) {
-            if (g.name === moduleName)
-                collect(g.permissions);
+    async getCategoryChildren(moduleName, kind) {
+        const catalog = await this.getModule(moduleName);
+        if (!catalog) {
+            return [];
+        }
+        const title = this.moduleTitle(moduleName);
+        switch (kind) {
+            case 'entities':
+                return catalog.entities.map((item) => ({
+                    id: `entity-${item.fullName}`,
+                    kind: 'entity',
+                    label: item.name,
+                    moduleName,
+                    moduleTitle: title,
+                    icon: item.icon,
+                    payload: item,
+                }));
+            case 'commands':
+                return catalog.commands.map((item) => this.namedNode('command', item.name, item.title ?? item.name, moduleName, title, item, item.icon));
+            case 'queries':
+                return catalog.queries.map((item) => this.namedNode('query', item.name, item.title ?? item.name, moduleName, title, item, item.icon));
+            case 'plugins':
+                return catalog.plugins.map((item) => this.namedNode('plugin', item.name, item.title ?? item.name, moduleName, title, item, item.icon));
+            case 'widgets':
+                return catalog.widgets.map((item) => this.namedNode('widget', item.name, item.title ?? item.name, moduleName, title, item, item.icon));
+            default:
+                return [];
+        }
+    }
+    pushCategory(nodes, moduleName, moduleTitle, kind, count) {
+        if (count <= 0) {
+            return;
         }
-        return out;
+        nodes.push({
+            id: `module-${moduleName}-${kind}`,
+            kind,
+            label: `@platform-dev-tools:module.terms.${kind}`,
+            moduleName,
+            moduleTitle,
+            itemCount: count,
+        });
+    }
+    namedNode(kind, name, label, moduleName, moduleTitle, payload, icon) {
+        return {
+            id: `${kind}-${name}`,
+            kind,
+            label,
+            moduleName,
+            moduleTitle,
+            icon,
+            payload,
+        };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: PlatformExplorerDataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: PlatformExplorerDataService }); }
@@ -249,540 +452,1883 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             type: Injectable
         }] });
 
-//#region ----   Imports   ----
+//#region ----- Imports -----
 //#endregion
+//#region ----- Constants -----
+const TYPE_I18N = '@application-management:editions.modules-editor.types';
+const DOMAIN_I18N = '@application-management:editions.modules-editor.domains';
+//#endregion
+//#region ----- Component -----
 class AXPlatformExplorerModuleDetailComponent {
     constructor() {
         this.payload = input(/* @ts-ignore */
         ...(ngDevMode ? [undefined, { debugName: "payload" }] : /* istanbul ignore next */ []));
+        this.dataService = inject(PlatformExplorerDataService);
+        this.view = computed(() => {
+            const summary = this.payload();
+            if (!summary) {
+                return null;
+            }
+            const manifest = this.dataService.getManifest(summary.name);
+            if (!manifest) {
+                return null;
+            }
+            return this.toView(summary.name, manifest);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "view" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerModuleDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerModuleDetailComponent, isStandalone: true, selector: "axp-platform-explorer-module-detail", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-    @if (payload()) {
-      <section class="axp-module-detail">
-        <h3 class="axp-module-detail__section-title">
-          {{ '@platform-dev-tools:module.terms.module-info' | translate | async }}
-        </h3>
-        <dl class="axp-detail-dl">
-          <dt>
-            {{ '@platform-dev-tools:module.terms.name' | translate | async }}
-          </dt>
-          <dd>{{ payload()!.name }}</dd>
-
-          <dt>
-            {{ '@platform-dev-tools:module.terms.version' | translate | async }}
-          </dt>
-          <dd>{{ payload()!.version }}</dd>
-
-          <dt>
-            {{ '@platform-dev-tools:module.terms.title' | translate | async }}
-          </dt>
-          <dd>{{ payload()!.title }}</dd>
-
-          @if (payload()!.description) {
-            <dt>
-              {{ '@platform-dev-tools:module.terms.description' | translate | async }}
-            </dt>
-            <dd>{{ payload()!.description }}</dd>
-          }
-
-          @if (payload()!.i18n) {
-            <dt>i18n</dt>
-            <dd>{{ payload()!.i18n }}</dd>
-          }
-
-          @if (payload()!.required !== undefined) {
-            <dt>
-              {{ '@platform-dev-tools:module.terms.required' | translate | async }}
-            </dt>
-            <dd>{{ payload()!.required }}</dd>
-          }
-        </dl>
-      </section>
+    toView(name, manifest) {
+        const type = resolveModuleType(manifest);
+        const domain = resolveModuleDomain(manifest);
+        return {
+            name,
+            title: manifest.title || name,
+            description: manifest.description,
+            icon: manifest.icon || 'fa-light fa-cube',
+            version: manifest.version,
+            type,
+            typeKey: `${TYPE_I18N}.${type}`,
+            domain,
+            domainKey: `${DOMAIN_I18N}.${domain}`,
+            i18n: manifest.i18n,
+            required: !!manifest.required,
+            dependencies: (manifest.dependencies ?? []).map((dep) => ({
+                name: dep,
+                title: dep.includes('.') ? dep : this.dataService.moduleTitle(dep),
+            })),
+        };
     }
-  `, isInline: true, styles: [".axp-module-detail{margin-bottom:24px}.axp-module-detail__section-title{margin:0 0 12px;font-size:15px;font-weight:600}.axp-detail-dl{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin:0}.axp-detail-dl dt{font-weight:600;color:var(--ax-neutral-text-secondary, #666)}.axp-detail-dl dd{margin:0}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerModuleDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerModuleDetailComponent, isStandalone: true, selector: "axp-platform-explorer-module-detail", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: "<div class=\"flex flex-col flex-1 min-h-0 overflow-auto\">\n  <!-- ----- Module identity from client manifest ----- -->\n  @if (payload(); as mod) {\n    <section class=\"flex flex-col gap-5 p-4\">\n      <!--->\n      <!-- ----- Manifest header when the module is registered on the client ----- -->\n      @if (view(); as info) {\n        <div class=\"flex items-start gap-3\">\n          <i class=\"text-2xl text-primary shrink-0 mt-0.5\" [ngClass]=\"info.icon\" aria-hidden=\"true\"></i>\n          <div class=\"flex flex-col gap-1 min-w-0\">\n            <div class=\"flex flex-wrap items-center gap-2\">\n              <h2 class=\"m-0 text-lg font-semibold\">{{ info.title | translate | async }}</h2>\n              <ax-badge color=\"secondary\" [text]=\"info.version\"></ax-badge>\n              <ax-badge color=\"primary\" [text]=\"(info.typeKey | translate | async) ?? info.type\"></ax-badge>\n              <ax-badge [text]=\"(info.domainKey | translate | async) ?? info.domain\"></ax-badge>\n              <!--->\n              <!-- ----- Required modules cannot be disabled in editions ----- -->\n              @if (info.required) {\n                <ax-badge\n                  color=\"success\"\n                  [text]=\"('@platform-dev-tools:module.terms.required' | translate | async) ?? ''\"\n                ></ax-badge>\n              }\n            </div>\n            <!--->\n            <!-- ----- Optional manifest description ----- -->\n            @if (info.description) {\n              <p class=\"m-0 text-sm text-muted\">{{ info.description | translate | async }}</p>\n            }\n          </div>\n        </div>\n\n        <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-2 m-0\">\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n          <dd class=\"m-0\"><code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ info.name }}</code></dd>\n          <!--->\n          <!-- ----- i18n scope from the module manifest ----- -->\n          @if (info.i18n) {\n            <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.i18n' | translate | async }}</dt>\n            <dd class=\"m-0\"><code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ info.i18n }}</code></dd>\n          }\n        </dl>\n\n        <div class=\"flex flex-col gap-2\">\n          <div class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.dependencies' | translate | async }}</div>\n          <!--->\n          <!-- ----- Empty dependency list ----- -->\n          @if (info.dependencies.length === 0) {\n            <p class=\"m-0 text-sm text-muted\">{{ '@platform-dev-tools:module.messages.no-dependencies' | translate | async }}</p>\n          }\n          <!-- ----- Manifest dependency chips ----- -->\n          @else {\n            <div class=\"flex flex-wrap gap-2\">\n              @for (dep of info.dependencies; track dep.name) {\n                <ax-badge [text]=\"(dep.title | translate | async) ?? dep.name\"></ax-badge>\n              }\n            </div>\n          }\n        </div>\n      }\n      <!-- ----- Catalog-only module with no client manifest ----- -->\n      @else {\n        <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-2 m-0\">\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ mod.name }}</dd>\n        </dl>\n        <p class=\"m-0 text-sm text-muted\">{{ '@platform-dev-tools:module.messages.no-manifest' | translate | async }}</p>\n      }\n\n      <div class=\"flex flex-wrap gap-2\">\n        <ax-badge\n          color=\"primary\"\n          [text]=\"('@platform-dev-tools:module.badges.entities' | translate: { params: { count: mod.entityCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          color=\"success\"\n          [text]=\"('@platform-dev-tools:module.badges.commands' | translate: { params: { count: mod.commandCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          color=\"primary\"\n          [text]=\"('@platform-dev-tools:module.badges.queries' | translate: { params: { count: mod.queryCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          color=\"warning\"\n          [text]=\"('@platform-dev-tools:module.badges.plugins' | translate: { params: { count: mod.pluginCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          [text]=\"('@platform-dev-tools:module.badges.widgets' | translate: { params: { count: mod.widgetCount } } | async) ?? ''\"\n        ></ax-badge>\n      </div>\n    </section>\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i2.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i1.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: "22.0.8", ngImport: i0, type: AXPlatformExplorerModuleDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axp-platform-explorer-module-detail', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, AXTranslationModule], template: `
-    @if (payload()) {
-      <section class="axp-module-detail">
-        <h3 class="axp-module-detail__section-title">
-          {{ '@platform-dev-tools:module.terms.module-info' | translate | async }}
-        </h3>
-        <dl class="axp-detail-dl">
-          <dt>
-            {{ '@platform-dev-tools:module.terms.name' | translate | async }}
-          </dt>
-          <dd>{{ payload()!.name }}</dd>
-
-          <dt>
-            {{ '@platform-dev-tools:module.terms.version' | translate | async }}
-          </dt>
-          <dd>{{ payload()!.version }}</dd>
-
-          <dt>
-            {{ '@platform-dev-tools:module.terms.title' | translate | async }}
-          </dt>
-          <dd>{{ payload()!.title }}</dd>
+            args: [{ selector: 'axp-platform-explorer-module-detail', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'flex flex-col flex-1 min-h-0' }, imports: [CommonModule, AXTranslationModule, AXBadgeModule], template: "<div class=\"flex flex-col flex-1 min-h-0 overflow-auto\">\n  <!-- ----- Module identity from client manifest ----- -->\n  @if (payload(); as mod) {\n    <section class=\"flex flex-col gap-5 p-4\">\n      <!--->\n      <!-- ----- Manifest header when the module is registered on the client ----- -->\n      @if (view(); as info) {\n        <div class=\"flex items-start gap-3\">\n          <i class=\"text-2xl text-primary shrink-0 mt-0.5\" [ngClass]=\"info.icon\" aria-hidden=\"true\"></i>\n          <div class=\"flex flex-col gap-1 min-w-0\">\n            <div class=\"flex flex-wrap items-center gap-2\">\n              <h2 class=\"m-0 text-lg font-semibold\">{{ info.title | translate | async }}</h2>\n              <ax-badge color=\"secondary\" [text]=\"info.version\"></ax-badge>\n              <ax-badge color=\"primary\" [text]=\"(info.typeKey | translate | async) ?? info.type\"></ax-badge>\n              <ax-badge [text]=\"(info.domainKey | translate | async) ?? info.domain\"></ax-badge>\n              <!--->\n              <!-- ----- Required modules cannot be disabled in editions ----- -->\n              @if (info.required) {\n                <ax-badge\n                  color=\"success\"\n                  [text]=\"('@platform-dev-tools:module.terms.required' | translate | async) ?? ''\"\n                ></ax-badge>\n              }\n            </div>\n            <!--->\n            <!-- ----- Optional manifest description ----- -->\n            @if (info.description) {\n              <p class=\"m-0 text-sm text-muted\">{{ info.description | translate | async }}</p>\n            }\n          </div>\n        </div>\n\n        <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-2 m-0\">\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n          <dd class=\"m-0\"><code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ info.name }}</code></dd>\n          <!--->\n          <!-- ----- i18n scope from the module manifest ----- -->\n          @if (info.i18n) {\n            <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.i18n' | translate | async }}</dt>\n            <dd class=\"m-0\"><code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ info.i18n }}</code></dd>\n          }\n        </dl>\n\n        <div class=\"flex flex-col gap-2\">\n          <div class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.dependencies' | translate | async }}</div>\n          <!--->\n          <!-- ----- Empty dependency list ----- -->\n          @if (info.dependencies.length === 0) {\n            <p class=\"m-0 text-sm text-muted\">{{ '@platform-dev-tools:module.messages.no-dependencies' | translate | async }}</p>\n          }\n          <!-- ----- Manifest dependency chips ----- -->\n          @else {\n            <div class=\"flex flex-wrap gap-2\">\n              @for (dep of info.dependencies; track dep.name) {\n                <ax-badge [text]=\"(dep.title | translate | async) ?? dep.name\"></ax-badge>\n              }\n            </div>\n          }\n        </div>\n      }\n      <!-- ----- Catalog-only module with no client manifest ----- -->\n      @else {\n        <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-2 m-0\">\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ mod.name }}</dd>\n        </dl>\n        <p class=\"m-0 text-sm text-muted\">{{ '@platform-dev-tools:module.messages.no-manifest' | translate | async }}</p>\n      }\n\n      <div class=\"flex flex-wrap gap-2\">\n        <ax-badge\n          color=\"primary\"\n          [text]=\"('@platform-dev-tools:module.badges.entities' | translate: { params: { count: mod.entityCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          color=\"success\"\n          [text]=\"('@platform-dev-tools:module.badges.commands' | translate: { params: { count: mod.commandCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          color=\"primary\"\n          [text]=\"('@platform-dev-tools:module.badges.queries' | translate: { params: { count: mod.queryCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          color=\"warning\"\n          [text]=\"('@platform-dev-tools:module.badges.plugins' | translate: { params: { count: mod.pluginCount } } | async) ?? ''\"\n        ></ax-badge>\n        <ax-badge\n          [text]=\"('@platform-dev-tools:module.badges.widgets' | translate: { params: { count: mod.widgetCount } } | async) ?? ''\"\n        ></ax-badge>\n      </div>\n    </section>\n  }\n</div>\n" }]
+        }], propDecorators: { payload: [{ type: i0.Input, args: [{ isSignal: true, alias: "payload", required: false }] }] } });
 
-          @if (payload()!.description) {
-            <dt>
-              {{ '@platform-dev-tools:module.terms.description' | translate | async }}
-            </dt>
-            <dd>{{ payload()!.description }}</dd>
-          }
+//#endregion
+//#region ----- Plugin contribution field names -----
+function isPlaceholderName(name) {
+    const trimmed = name.trim();
+    return trimmed.startsWith('(from ') || trimmed.includes('options.fields[]');
+}
+function parseContributions(json) {
+    if (json == null) {
+        return null;
+    }
+    let parsed = json;
+    if (typeof json === 'string') {
+        const trimmed = json.trim();
+        if (!trimmed) {
+            return null;
+        }
+        try {
+            parsed = JSON.parse(trimmed);
+        }
+        catch {
+            return null;
+        }
+    }
+    if (parsed == null || typeof parsed !== 'object') {
+        return null;
+    }
+    return parsed;
+}
+function optionString(options, key) {
+    if (!key || options == null || typeof options !== 'object') {
+        return '';
+    }
+    const value = options[key];
+    return typeof value === 'string' ? value.trim() : '';
+}
+function contributedNames(plugin) {
+    const contributions = parseContributions(plugin.contributionsJson);
+    const names = new Set();
+    const add = (name, nameFromOption) => {
+        const fromOption = optionString(plugin.options, nameFromOption);
+        const fieldName = fromOption || name?.trim() || '';
+        if (fieldName && !isPlaceholderName(fieldName)) {
+            names.add(fieldName);
+        }
+    };
+    for (const property of contributions?.properties ?? []) {
+        add(property.name, property.nameFromOption);
+    }
+    for (const column of contributions?.columns ?? []) {
+        add(column.name, column.nameFromOption);
+    }
+    return [...names];
+}
+/**
+ * Maps host property/column names to the plugin that contributed them.
+ * First matching plugin wins when two plugins claim the same name.
+ */
+function pluginSourceByFieldName(plugins) {
+    const map = new Map();
+    for (const plugin of plugins) {
+        const source = {
+            name: plugin.name,
+            title: plugin.title || plugin.name,
+        };
+        for (const fieldName of contributedNames(plugin)) {
+            if (!map.has(fieldName)) {
+                map.set(fieldName, source);
+            }
+        }
+    }
+    return map;
+}
+//#endregion
 
-          @if (payload()!.i18n) {
-            <dt>i18n</dt>
-            <dd>{{ payload()!.i18n }}</dd>
-          }
+//#region ----- Types -----
+//#endregion
+//#region ----- Flatten -----
+function formatLeaf(value) {
+    if (value === null) {
+        return 'null';
+    }
+    if (typeof value === 'string') {
+        return value;
+    }
+    if (typeof value === 'number' || typeof value === 'boolean' || typeof value === 'bigint') {
+        return String(value);
+    }
+    try {
+        return JSON.stringify(value);
+    }
+    catch {
+        return String(value);
+    }
+}
+function joinPath(prefix, key) {
+    return prefix ? `${prefix}.${key}` : key;
+}
+function flattenToPairs(value, prefix = '') {
+    if (value === undefined || typeof value === 'function') {
+        return [];
+    }
+    if (value !== null && typeof value === 'object') {
+        if (Array.isArray(value)) {
+            if (value.length === 0) {
+                return prefix ? [{ path: prefix, value: '[]' }] : [];
+            }
+            return value.flatMap((item, index) => flattenToPairs(item, joinPath(prefix, String(index))));
+        }
+        const entries = Object.entries(value).filter(([, nested]) => nested !== undefined && typeof nested !== 'function');
+        if (entries.length === 0) {
+            return prefix ? [{ path: prefix, value: '{}' }] : [];
+        }
+        return entries.flatMap(([key, nested]) => flattenToPairs(nested, joinPath(prefix, key)));
+    }
+    return [{ path: prefix, value: formatLeaf(value) }];
+}
+function flattenJsonText(json) {
+    if (!json?.trim()) {
+        return [];
+    }
+    try {
+        return flattenToPairs(JSON.parse(json));
+    }
+    catch {
+        return [{ path: '', value: json }];
+    }
+}
+//#endregion
 
-          @if (payload()!.required !== undefined) {
-            <dt>
-              {{ '@platform-dev-tools:module.terms.required' | translate | async }}
-            </dt>
-            <dd>{{ payload()!.required }}</dd>
-          }
-        </dl>
-      </section>
-    }
-  `, styles: [".axp-module-detail{margin-bottom:24px}.axp-module-detail__section-title{margin:0 0 12px;font-size:15px;font-weight:600}.axp-detail-dl{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin:0}.axp-detail-dl dt{font-weight:600;color:var(--ax-neutral-text-secondary, #666)}.axp-detail-dl dd{margin:0}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
-        }], propDecorators: { payload: [{ type: i0.Input, args: [{ isSignal: true, alias: "payload", required: false }] }] } });
+//#endregion
+//#region ----- Constants -----
+const SCOPE_ORDER = ['typeLevel', 'selected', 'individual', 'section'];
+//#endregion
+//#region ----- Serialize -----
+function humanText(value) {
+    if (typeof value !== 'string') {
+        return undefined;
+    }
+    const trimmed = value.trim();
+    if (!trimmed || trimmed.includes('{{')) {
+        return undefined;
+    }
+    return trimmed;
+}
+function titleCaseType(type) {
+    return type
+        .split('-')
+        .filter(Boolean)
+        .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
+        .join(' ');
+}
+function boolOrExpression(value) {
+    if (typeof value === 'boolean') {
+        return value ? 'yes' : 'no';
+    }
+    if (typeof value === 'string' && value.trim()) {
+        return value.trim();
+    }
+    return undefined;
+}
+function asActions(value) {
+    if (!Array.isArray(value)) {
+        return [];
+    }
+    return value.filter((item) => !!item && typeof item === 'object');
+}
+function layoutActions(layout) {
+    if (!layout || typeof layout !== 'object') {
+        return [];
+    }
+    return asActions(layout.actions);
+}
+function resolveCommand(command) {
+    if (typeof command === 'function') {
+        return { name: 'function', optionsPairs: [], metadataPairs: [] };
+    }
+    if (typeof command === 'string') {
+        return { name: command, optionsPairs: [], metadataPairs: [] };
+    }
+    if (command && typeof command === 'object') {
+        return {
+            name: typeof command.name === 'string' ? command.name : '',
+            optionsPairs: flattenToPairs(command.options),
+            metadataPairs: flattenToPairs(command.metadata),
+        };
+    }
+    return { name: '', optionsPairs: [], metadataPairs: [] };
+}
+function resolveItems(items) {
+    if (Array.isArray(items)) {
+        return { children: asActions(items) };
+    }
+    if (typeof items === 'string' && items.trim()) {
+        return { children: [], expression: items.trim() };
+    }
+    return { children: [] };
+}
+//#endregion
+//#region ----- Actions -----
+function toActionView(action, id, depth) {
+    const command = resolveCommand(action.command);
+    const items = resolveItems(action.items);
+    const hidden = boolOrExpression(action.hidden);
+    const disabled = boolOrExpression(action.disabled);
+    const type = typeof action.type === 'string' ? action.type : undefined;
+    const shortcuts = (action.shortcuts ?? []).filter((item) => typeof item === 'string' && item.trim());
+    const permissions = (action.permissions ?? []).filter((item) => typeof item === 'string' && item.trim());
+    return {
+        id,
+        name: typeof action.name === 'string' ? action.name : undefined,
+        title: typeof action.title === 'string' ? action.title : undefined,
+        commandName: command.name,
+        type,
+        typeLabel: type ? titleCaseType(type) : '',
+        scope: typeof action.scope === 'string' ? action.scope : 'individual',
+        priority: typeof action.priority === 'string' ? action.priority : 'secondary',
+        icon: typeof action.icon === 'string' ? action.icon : undefined,
+        color: typeof action.color === 'string' ? action.color : undefined,
+        shortcuts,
+        permissions,
+        hidden,
+        disabled,
+        isDefault: action.default === true,
+        separated: action.separated === true,
+        order: typeof action.order === 'number' ? action.order : undefined,
+        depth,
+        optionsPairs: command.optionsPairs,
+        metadataPairs: command.metadataPairs,
+        submenuExpression: items.expression,
+    };
+}
+function flattenActions(actions, prefix, depth = 0) {
+    const rows = [];
+    actions.forEach((action, index) => {
+        const id = `${prefix}.${index}`;
+        rows.push(toActionView(action, id, depth));
+        const items = resolveItems(action.items);
+        if (items.children.length) {
+            rows.push(...flattenActions(items.children, id, depth + 1));
+        }
+    });
+    return rows;
+}
+function groupByScope(actions) {
+    const map = new Map();
+    for (const action of actions) {
+        const scope = action.scope || 'individual';
+        const list = map.get(scope) ?? [];
+        list.push(action);
+        map.set(scope, list);
+    }
+    const extra = [...map.keys()].filter((scope) => !SCOPE_ORDER.includes(scope));
+    return [...SCOPE_ORDER, ...extra]
+        .filter((scope) => (map.get(scope)?.length ?? 0) > 0)
+        .map((scope) => ({ scope, actions: map.get(scope) ?? [] }));
+}
+function toSection(id, kind, actions, extra, allowEmpty = false) {
+    const flat = flattenActions(actions, id);
+    if (!flat.length && !allowEmpty) {
+        return null;
+    }
+    return {
+        id,
+        kind,
+        views: extra?.views ?? [],
+        relatedTitle: extra?.relatedTitle,
+        relatedEntity: extra?.relatedEntity,
+        relatedLayoutType: extra?.relatedLayoutType,
+        layoutTitle: extra?.layoutTitle,
+        layoutDescription: extra?.layoutDescription,
+        groups: groupByScope(flat),
+        actionCount: flat.length,
+    };
+}
+function queryViews(views) {
+    return (views ?? []).map((view) => ({
+        name: view.name,
+        title: humanText(view.title),
+    }));
+}
+function relatedLayoutType(related) {
+    const type = related.layout?.type;
+    return typeof type === 'string' ? type : undefined;
+}
+function buildLayoutSections(entity) {
+    const master = entity.interfaces?.master;
+    const sections = [];
+    const list = toSection('list', 'list', layoutActions(master?.list), {
+        layoutTitle: humanText(master?.list?.title),
+        layoutDescription: humanText(master?.list?.description),
+        views: queryViews(master?.list?.views),
+    }, true);
+    if (list) {
+        sections.push(list);
+    }
+    const record = toSection('record', 'record', layoutActions(master?.single), {
+        layoutTitle: humanText(master?.single?.title),
+        layoutDescription: humanText(master?.single?.description),
+    }, true);
+    if (record) {
+        sections.push(record);
+    }
+    const create = toSection('create', 'create', layoutActions(master?.create), {
+        layoutTitle: humanText(master?.create?.title),
+    }, true);
+    if (create) {
+        sections.push(create);
+    }
+    const update = toSection('update', 'update', layoutActions(master?.update), {
+        layoutTitle: humanText(master?.update?.title),
+    }, true);
+    if (update) {
+        sections.push(update);
+    }
+    const detailList = toSection('detail-list', 'detail-list', layoutActions(entity.interfaces?.detail?.list), {
+        layoutTitle: humanText(entity.interfaces?.detail?.list?.title),
+        layoutDescription: humanText(entity.interfaces?.detail?.list?.description),
+    });
+    if (detailList) {
+        sections.push(detailList);
+    }
+    (entity.relatedEntities ?? []).forEach((related, index) => {
+        const relatedActions = asActions(related.actions);
+        const section = toSection(`related:${index}`, 'related', relatedActions, {
+            relatedTitle: humanText(related.title),
+            relatedEntity: related.entity,
+            relatedLayoutType: relatedLayoutType(related),
+        });
+        if (section) {
+            sections.push(section);
+        }
+    });
+    return sections;
+}
+//#endregion
 
+const PROPERTY_SCHEMA_FLAG_KEYS = [
+    'nullable',
+    'unique',
+    'readonly',
+    'visible',
+    'searchable',
+    'full-text',
+    'filterable',
+    'auditable',
+];
+const PROPERTY_SCHEMA_PAIR_KEYS = ['data-type', 'group', 'default-value'];
+const PROPERTY_PRESENTATION_FLAG_KEYS = [
+    'inline-filter',
+    'sortable',
+    'advanced-filter',
+    'preload-filter',
+];
+const PROPERTY_PRESENTATION_PAIR_KEYS = [
+    'editor',
+    'widget-path',
+    'widget-mode',
+    'widget-id',
+    'filter-widget',
+];
+const PROPERTY_SCHEMA_ORDER = [
+    'data-type',
+    'nullable',
+    'group',
+    'unique',
+    'readonly',
+    'visible',
+    'searchable',
+    'full-text',
+    'filterable',
+    'auditable',
+    'default-value',
+];
+const PROPERTY_PRESENTATION_ORDER = [
+    'editor',
+    'inline-filter',
+    'advanced-filter',
+    'sortable',
+    'widget-path',
+    'widget-mode',
+    'widget-id',
+    'filter-widget',
+    'preload-filter',
+];
 //#endregion
-function isListEntry(p) {
-    return p != null && 'fullName' in p && !('properties' in p);
+//#region ----- JSON / scalar -----
+function formatScalar(value) {
+    if (value === undefined || typeof value === 'function') {
+        return undefined;
+    }
+    if (value === null) {
+        return 'null';
+    }
+    if (typeof value === 'string') {
+        const trimmed = value.trim();
+        return trimmed || undefined;
+    }
+    if (typeof value === 'number' || typeof value === 'boolean') {
+        return String(value);
+    }
+    return undefined;
+}
+function resolvePropertyDataType(schemaDataType, normalizedDataType, editor, widgetDataTypes) {
+    const widgetName = typeof editor === 'string' ? editor.trim() : '';
+    const fromWidget = widgetName ? widgetDataTypes[widgetName] : undefined;
+    if (fromWidget) {
+        return fromWidget;
+    }
+    return formatScalar(schemaDataType) ?? formatScalar(normalizedDataType);
+}
+function pushFlag(flags, labelKey, value, always = false) {
+    if (typeof value !== 'boolean') {
+        return;
+    }
+    if (!always && !value) {
+        return;
+    }
+    if (flags.some((flag) => flag.labelKey === labelKey)) {
+        return;
+    }
+    flags.push({ labelKey, on: value });
+}
+function pushPair(pairs, labelKey, value) {
+    const text = formatScalar(value);
+    if (!text || pairs.some((pair) => pair.labelKey === labelKey)) {
+        return;
+    }
+    pairs.push({ labelKey, value: text });
+}
+function pushJson(blocks, labelKey, value) {
+    const pairs = flattenToPairs(value);
+    if (!pairs.length || blocks.some((block) => block.labelKey === labelKey)) {
+        return;
+    }
+    blocks.push({ labelKey, pairs });
+}
+function formatAction(action) {
+    if (Array.isArray(action)) {
+        return action.filter((item) => typeof item === 'string' && item.trim()).join(', ');
+    }
+    return typeof action === 'string' ? action.trim() : '';
+}
+//#endregion
+//#region ----- Build details -----
+function hasPropertyDetails(details) {
+    return (details.flags.length > 0 ||
+        details.pairs.length > 0 ||
+        details.triggers.length > 0 ||
+        details.validations.length > 0 ||
+        details.jsonBlocks.length > 0);
+}
+function propertyFlag(details, key) {
+    return details.flags.find((flag) => flag.labelKey === key)?.on;
+}
+function propertyFlagsNamed(details, keys) {
+    return keys
+        .map((key) => details.flags.find((flag) => flag.labelKey === key))
+        .filter((flag) => !!flag);
+}
+function propertyPairsNamed(details, keys) {
+    return keys
+        .map((key) => details.pairs.find((pair) => pair.labelKey === key))
+        .filter((pair) => !!pair);
+}
+function propertyEntries(details, pairKeys, flagKeys, order) {
+    const byKey = new Map();
+    for (const pair of propertyPairsNamed(details, pairKeys)) {
+        byKey.set(pair.labelKey, { kind: 'pair', labelKey: pair.labelKey, value: pair.value });
+    }
+    for (const flag of propertyFlagsNamed(details, flagKeys)) {
+        byKey.set(flag.labelKey, { kind: 'flag', labelKey: flag.labelKey, on: flag.on });
+    }
+    return order
+        .map((key) => byKey.get(key))
+        .filter((entry) => !!entry);
+}
+function buildPropertyDetails(layout, normalized, widgetDataTypes = {}) {
+    const flags = [];
+    const pairs = [];
+    const triggers = [];
+    const validations = [];
+    const jsonBlocks = [];
+    const schema = layout?.schema;
+    const widget = schema?.interface;
+    const features = normalized?.features;
+    const list = layout?.options;
+    pushFlag(flags, 'nullable', schema?.nullable ?? normalized?.fieldFeatures?.nullable, true);
+    pushFlag(flags, 'unique', schema?.unique?.enabled);
+    const readonly = schema?.readonly ?? normalized?.fieldFeatures?.readOnly;
+    if (typeof readonly === 'boolean') {
+        pushFlag(flags, 'readonly', readonly);
+    }
+    else {
+        pushPair(pairs, 'readonly', readonly);
+    }
+    const visible = schema?.visible;
+    if (typeof visible === 'boolean') {
+        if (!visible) {
+            pushFlag(flags, 'visible', false, true);
+        }
+    }
+    else {
+        pushPair(pairs, 'visible', visible);
+    }
+    pushFlag(flags, 'searchable', features?.searchable?.enabled);
+    pushFlag(flags, 'full-text', features?.searchable?.fullText);
+    pushFlag(flags, 'filterable', features?.filterable?.enabled);
+    pushFlag(flags, 'inline-filter', features?.filterable?.inline ?? list?.filter?.inline?.enabled, true);
+    pushFlag(flags, 'sortable', features?.sortable?.enabled ?? list?.sort?.enabled, true);
+    pushFlag(flags, 'auditable', features?.auditable?.enabled);
+    pushFlag(flags, 'advanced-filter', list?.filter?.advance?.enabled, true);
+    pushFlag(flags, 'preload-filter', list?.filter?.preload?.enabled);
+    pushPair(pairs, 'group', layout?.groupId);
+    const editor = widget?.type ?? normalized?.interface?.name;
+    pushPair(pairs, 'data-type', resolvePropertyDataType(schema?.dataType, normalized?.dataType, editor, widgetDataTypes));
+    pushPair(pairs, 'editor', editor);
+    pushPair(pairs, 'widget-path', widget?.path);
+    pushPair(pairs, 'widget-mode', widget?.mode);
+    pushPair(pairs, 'widget-id', widget?.id);
+    pushPair(pairs, 'filter-widget', list?.filter?.advance?.widgetType);
+    const defaultValue = schema?.defaultValue ?? normalized?.defaultValue;
+    const defaultText = formatScalar(defaultValue);
+    if (defaultText) {
+        pushPair(pairs, 'default-value', defaultText);
+    }
+    else {
+        pushJson(jsonBlocks, 'default-value', defaultValue);
+    }
+    for (const trigger of widget?.triggers ?? []) {
+        const event = typeof trigger.event === 'string' ? trigger.event.trim() : '';
+        const action = formatAction(trigger.action);
+        if (!event && !action) {
+            continue;
+        }
+        triggers.push({
+            event,
+            action,
+            disabled: !!trigger.disabled,
+        });
+    }
+    const rules = layout?.validations ?? normalized?.validations ?? [];
+    for (const rule of rules) {
+        const name = typeof rule.rule === 'string' ? rule.rule.trim() : '';
+        if (!name) {
+            continue;
+        }
+        validations.push({
+            rule: name,
+            message: typeof rule.message === 'string' ? rule.message.trim() || undefined : undefined,
+            optionsPairs: flattenToPairs(rule.options),
+            disabled: 'disabled' in rule && rule.disabled === true,
+        });
+    }
+    pushJson(jsonBlocks, 'widget-options', widget?.options ?? normalized?.interface?.options);
+    pushJson(jsonBlocks, 'value-transforms', widget?.valueTransforms);
+    pushJson(jsonBlocks, 'widget-children', widget?.children);
+    return { flags, pairs, triggers, validations, jsonBlocks };
 }
+//#endregion
+
+//#region ----- Imports -----
+//#endregion
+//#region ----- Constants -----
+const PRIMARY_ACTION_TABS = ['list', 'record', 'create', 'update'];
+const CODE_PAIR_KEYS = new Set([
+    'editor',
+    'widget-path',
+    'widget-mode',
+    'widget-id',
+    'filter-widget',
+]);
+//#endregion
+//#region ----- Component -----
 class AXPlatformExplorerEntityDetailComponent {
+    //#endregion
     constructor() {
         this.payload = input(/* @ts-ignore */
         ...(ngDevMode ? [undefined, { debugName: "payload" }] : /* istanbul ignore next */ []));
-        this.entity = signal(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "entity" }] : /* istanbul ignore next */ []));
+        //#region ----- Services & Dependencies -----
+        this.dataService = inject(PlatformExplorerDataService);
+        this.destroyRef = inject(DestroyRef);
+        //#endregion
+        //#region ----- State Signals -----
+        this.detail = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "detail" }] : /* istanbul ignore next */ []));
         this.loading = signal(false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
-        this.entityResolver = inject(AXPEntityResolver);
+        this.loadError = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "loadError" }] : /* istanbul ignore next */ []));
+        this.activeSection = this.dataService.activeEntitySection;
+        this.selectedName = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedName" }] : /* istanbul ignore next */ []));
+        this.selectedActionId = linkedSignal({ ...(ngDevMode ? { debugName: "selectedActionId" } : /* istanbul ignore next */ {}), source: () => this.activeSection(),
+            computation: () => null });
+        this.actionQuery = linkedSignal({ ...(ngDevMode ? { debugName: "actionQuery" } : /* istanbul ignore next */ {}), source: () => this.activeSection(),
+            computation: () => '' });
+        //#endregion
+        //#region ----- Computed Properties -----
+        this.properties = computed(() => this.mergeProperties(this.detail()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "properties" }] : /* istanbul ignore next */ []));
+        this.layoutSections = computed(() => {
+            const detail = this.detail();
+            return detail ? buildLayoutSections(detail.layout) : [];
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "layoutSections" }] : /* istanbul ignore next */ []));
+        this.selectedProperty = computed(() => {
+            const name = this.selectedName();
+            if (!name) {
+                return null;
+            }
+            return this.properties().find((row) => row.name === name) ?? null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedProperty" }] : /* istanbul ignore next */ []));
+        this.isFieldSection = computed(() => this.activeSection() === 'properties', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isFieldSection" }] : /* istanbul ignore next */ []));
+        this.inspectorOpen = computed(() => this.isFieldSection() ? this.selectedProperty() != null : this.selectedAction() != null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "inspectorOpen" }] : /* istanbul ignore next */ []));
+        this.inspectorAriaKey = computed(() => this.isFieldSection()
+            ? '@platform-dev-tools:module.property-details.field-definition'
+            : '@platform-dev-tools:module.action-details.action-definition', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "inspectorAriaKey" }] : /* istanbul ignore next */ []));
+        this.activeLayout = computed(() => {
+            const section = this.activeSection();
+            if (section === 'properties') {
+                return null;
+            }
+            return this.layoutSections().find((item) => item.id === section || item.kind === section) ?? null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "activeLayout" }] : /* istanbul ignore next */ []));
+        this.activeActions = computed(() => {
+            const layout = this.activeLayout();
+            if (!layout) {
+                return [];
+            }
+            return layout.groups.flatMap((group) => group.actions);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "activeActions" }] : /* istanbul ignore next */ []));
+        this.filteredActions = computed(() => {
+            const query = this.actionQuery().trim().toLowerCase();
+            const rows = this.activeActions();
+            if (!query) {
+                return rows;
+            }
+            return rows.filter((row) => this.matchesActionQuery(row, query));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "filteredActions" }] : /* istanbul ignore next */ []));
+        this.selectedAction = computed(() => {
+            const id = this.selectedActionId();
+            const rows = this.activeActions();
+            if (id) {
+                const match = rows.find((row) => row.id === id);
+                if (match) {
+                    return match;
+                }
+            }
+            return rows[0] ?? null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedAction" }] : /* istanbul ignore next */ []));
+        this.selectedSchemaEntries = computed(() => {
+            const field = this.selectedProperty();
+            return field ? this.schemaEntries(field.details) : [];
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedSchemaEntries" }] : /* istanbul ignore next */ []));
+        this.selectedPresentationEntries = computed(() => {
+            const field = this.selectedProperty();
+            return field ? this.presentationEntries(field.details) : [];
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedPresentationEntries" }] : /* istanbul ignore next */ []));
+        this.destroyRef.onDestroy(() => this.dataService.clearEntityTabs());
         effect(() => {
-            const p = this.payload();
-            if (!p) {
-                this.entity.set(null);
-                this.loading.set(false);
-                return;
+            const summary = this.payload();
+            void this.loadDetail(summary);
+        });
+    }
+    //#region ----- Event Handlers -----
+    selectProperty(name) {
+        this.selectedName.set(name);
+    }
+    selectAction(id) {
+        this.selectedActionId.set(id);
+    }
+    isSelected(name) {
+        return this.selectedName() === name;
+    }
+    isActionSelected(id) {
+        return this.selectedAction()?.id === id;
+    }
+    onActionSearchChanged(event) {
+        this.actionQuery.set(event.value ?? '');
+    }
+    flagValue(details, key) {
+        return propertyFlag(details, key);
+    }
+    isCodePair(key) {
+        return CODE_PAIR_KEYS.has(key);
+    }
+    isTypePair(key) {
+        return key === 'data-type';
+    }
+    hiddenFlag(action) {
+        return this.yesNoFlag(action.hidden);
+    }
+    disabledFlag(action) {
+        return this.yesNoFlag(action.disabled);
+    }
+    hiddenExpression(action) {
+        return this.expressionValue(action.hidden);
+    }
+    disabledExpression(action) {
+        return this.expressionValue(action.disabled);
+    }
+    //#endregion
+    //#region ----- Property Details -----
+    schemaEntries(details) {
+        return propertyEntries(details, PROPERTY_SCHEMA_PAIR_KEYS, PROPERTY_SCHEMA_FLAG_KEYS, PROPERTY_SCHEMA_ORDER);
+    }
+    presentationEntries(details) {
+        return propertyEntries(details, PROPERTY_PRESENTATION_PAIR_KEYS, PROPERTY_PRESENTATION_FLAG_KEYS, PROPERTY_PRESENTATION_ORDER);
+    }
+    //#endregion
+    //#region ----- Data Loading -----
+    async loadDetail(summary) {
+        this.actionQuery.set('');
+        this.selectedName.set(null);
+        this.selectedActionId.set(null);
+        if (!summary) {
+            this.detail.set(null);
+            this.loading.set(false);
+            this.loadError.set(false);
+            this.dataService.clearEntityTabs();
+            return;
+        }
+        this.loading.set(true);
+        this.loadError.set(false);
+        this.detail.set(null);
+        try {
+            const detail = await this.dataService.getEntity(summary.module, summary.name);
+            if (this.payload() === summary) {
+                this.detail.set(detail);
+                this.selectedName.set(this.mergeProperties(detail)[0]?.name ?? null);
+                this.dataService.setEntityTabs(this.buildTabs(detail));
             }
-            if (isListEntry(p)) {
-                this.loading.set(true);
-                this.entity.set(null);
-                this.entityResolver.get(p.module, p.name).then((e) => {
-                    if (this.payload() === p) {
-                        this.entity.set(e ?? null);
-                    }
-                    this.loading.set(false);
-                });
+        }
+        catch {
+            if (this.payload() === summary) {
+                this.loadError.set(true);
             }
-            else {
-                this.entity.set(p);
+        }
+        finally {
+            if (this.payload() === summary) {
                 this.loading.set(false);
             }
-        });
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerEntityDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerEntityDetailComponent, isStandalone: true, selector: "axp-platform-explorer-entity-detail", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: `
-    <div class="flex flex-col flex-1 min-h-0 pt-0 overflow-auto">
-      @if (entity(); as e) {
-        <dl class="grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 mb-3 m-0">
-          <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.module' | translate | async }}</dt><dd class="m-0">{{ e.module }}</dd>
-          <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt><dd class="m-0">{{ e.name }}</dd>
-          @if (e.title) {
-            <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.title' | translate | async }}</dt><dd class="m-0">{{ e.title  | translate | async}}</dd>
-          }
-          @if (e.formats.plural) {
-            <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.plural' | translate | async }}</dt><dd class="m-0">{{ e.formats.plural  | translate | async}}</dd>
-          }
-        </dl>
-        @if (e.properties && e.properties.length > 0) {
-          <p class="mb-2 mt-3 font-bold">{{ '@platform-dev-tools:module.terms.properties' | translate | async }} ({{ e.properties.length }})</p>
-          <div class="flex-1 min-h-0 overflow-auto border border-lightest rounded-md">
-            <table class="w-full border-collapse text-[13px]">
-              <thead>
-                <tr>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</th>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.title' | translate | async }}</th>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.type' | translate | async }}</th>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.description' | translate | async }}</th>
-                </tr>
-              </thead>
-              <tbody class="axp-entity-detail-tbody">
-                @for (p of e.properties; track p.name) {
-                  <tr>
-                    <td class="p-2 px-3 border-b border-lightest"><code class="text-xs bg-lighter px-1.5 py-0.5 rounded">{{ p.name }}</code></td>
-                    <td class="p-2 px-3 border-b border-lightest">{{ p.title | translate | async }}</td>
-                    <td class="p-2 px-3 border-b border-lightest">{{ p.schema.dataType }}</td>
-                    <td class="p-2 px-3 border-b border-lightest">@if (p.description) { {{ p.description | translate | async }} } @else { – }</td>
-                  </tr>
-                }
-              </tbody>
-            </table>
-          </div>
+    buildTabs(detail) {
+        if (!detail) {
+            return [];
         }
-      } @else if (loading()) {
-        <p class="m-0 text-muted">{{ '@platform-dev-tools:module.terms.loading-entity' | translate | async }}</p>
-      }
-    </div>
-  `, isInline: true, styles: [".axp-entity-detail-tbody tr:last-child td{border-bottom:none}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        const extra = buildLayoutSections(detail.layout).filter((section) => !PRIMARY_ACTION_TABS.includes(section.kind));
+        const tabs = [
+            { id: 'properties', textKey: '@platform-dev-tools:module.terms.properties' },
+        ];
+        for (const kind of PRIMARY_ACTION_TABS) {
+            tabs.push({ id: kind, textKey: `@platform-dev-tools:module.layouts.${kind}` });
+        }
+        for (const layout of extra) {
+            tabs.push({
+                id: layout.id,
+                textKey: layout.kind === 'related'
+                    ? '@platform-dev-tools:module.layouts.related'
+                    : `@platform-dev-tools:module.layouts.${layout.kind}`,
+                extraText: layout.kind === 'related' ? layout.relatedTitle || layout.relatedEntity : undefined,
+            });
+        }
+        return tabs;
+    }
+    mergeProperties(detail) {
+        if (!detail) {
+            return [];
+        }
+        const pluginByField = pluginSourceByFieldName(detail.plugins);
+        const widgetDataTypes = detail.widgetDataTypes ?? {};
+        const normalizedByName = new Map((detail.normalized?.fields ?? []).map((field) => [field.name, field]));
+        const rows = [];
+        const seen = new Set();
+        for (const property of detail.layout.properties ?? []) {
+            seen.add(property.name);
+            rows.push(this.toRow(property.name, pluginByField, widgetDataTypes, property, normalizedByName.get(property.name)));
+        }
+        for (const field of detail.normalized?.fields ?? []) {
+            if (seen.has(field.name)) {
+                continue;
+            }
+            seen.add(field.name);
+            rows.push(this.toRow(field.name, pluginByField, widgetDataTypes, undefined, field));
+        }
+        return rows;
+    }
+    toRow(name, pluginByField, widgetDataTypes, layout, normalized) {
+        const plugin = pluginByField.get(name);
+        const details = buildPropertyDetails(layout, normalized, widgetDataTypes);
+        const title = this.asText(layout?.title) ?? this.asText(normalized?.title);
+        const description = this.asText(layout?.description) ?? this.asText(normalized?.description);
+        return {
+            name,
+            title,
+            dataType: propertyPairsNamed(details, ['data-type'])[0]?.value ?? '',
+            editor: propertyPairsNamed(details, ['editor'])[0]?.value ?? '',
+            description,
+            pluginName: plugin?.name,
+            pluginTitle: plugin?.title,
+            details,
+        };
+    }
+    asText(value) {
+        return typeof value === 'string' && value.trim() ? value : undefined;
+    }
+    matchesActionQuery(row, query) {
+        return (row.commandName.toLowerCase().includes(query) ||
+            (row.name?.toLowerCase().includes(query) ?? false) ||
+            (row.title?.toLowerCase().includes(query) ?? false) ||
+            (row.typeLabel?.toLowerCase().includes(query) ?? false) ||
+            row.scope.toLowerCase().includes(query));
+    }
+    yesNoFlag(value) {
+        if (value === 'yes') {
+            return true;
+        }
+        if (value === 'no') {
+            return false;
+        }
+        return undefined;
+    }
+    expressionValue(value) {
+        if (!value || value === 'yes' || value === 'no') {
+            return undefined;
+        }
+        return value;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerEntityDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerEntityDetailComponent, isStandalone: true, selector: "axp-platform-explorer-entity-detail", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: "<div class=\"flex flex-col flex-1 min-h-0\">\n  <!-- ----- Loading entity layout ----- -->\n  @if (loading()) {\n    <div class=\"flex flex-1 items-center justify-center p-6\">\n      <ax-loading></ax-loading>\n    </div>\n  }\n  <!-- ----- Entity catalog query failed ----- -->\n  @else if (loadError()) {\n    <axp-state-message\n      icon=\"fa-light fa-triangle-exclamation\"\n      [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n      [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n    />\n  }\n  <!-- ----- Entity documentation with field or action inspector ----- -->\n  @else if (detail(); as d) {\n    <ax-drawer-container class=\"axp-platform-explorer__docs\">\n      <ax-content class=\"axp-platform-explorer__docs-main\">\n      <div class=\"axp-platform-explorer__docs-shell\">\n      <div class=\"axp-platform-explorer__docs-chrome\">\n      <!--->\n      <!-- ----- Attached plugins as chips ----- -->\n      @if (d.plugins.length) {\n        <div class=\"axp-platform-explorer__docs-plugins\">\n          @for (plugin of d.plugins; track plugin.name) {\n            <span class=\"axp-platform-explorer__docs-chip\">\n              <i class=\"fa-light fa-plug\" aria-hidden=\"true\"></i>\n              {{ (plugin.title || plugin.name) | translate | async }}\n            </span>\n          }\n        </div>\n      }\n      <!--->\n      <!-- ----- Field column headers stay outside the scrolling rows ----- -->\n      @if (isFieldSection() && properties().length) {\n        <div class=\"axp-platform-explorer__docs-table-head\" role=\"row\">\n          <span role=\"columnheader\">{{ '@platform-dev-tools:module.terms.field' | translate | async }}</span>\n          <span role=\"columnheader\">\n            {{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}\n          </span>\n          <span role=\"columnheader\">\n            {{ '@platform-dev-tools:module.property-details.nullable' | translate | async }}\n          </span>\n        </div>\n      }\n      </div>\n\n      <!--->\n      <!-- ----- Field table ----- -->\n      @if (isFieldSection()) {\n        <div class=\"axp-platform-explorer__docs-list\">\n            <!--->\n            <!-- ----- Empty property list ----- -->\n            @if (properties().length === 0) {\n              <p class=\"axp-platform-explorer__docs-empty\">\n                {{ '@platform-dev-tools:module.messages.no-properties' | translate | async }}\n              </p>\n            }\n            <!-- ----- Field rows ----- -->\n            @else {\n              <div class=\"axp-platform-explorer__table-wrap axp-platform-explorer__table-wrap--fields\">\n                <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n                  <thead class=\"sr-only\">\n                    <tr>\n                      <th>{{ '@platform-dev-tools:module.terms.field' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.property-details.nullable' | translate | async }}</th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    @for (row of properties(); track row.name) {\n                      <tr\n                        class=\"axp-platform-explorer__table-row\"\n                        [class.axp-platform-explorer__table-row--selected]=\"isSelected(row.name)\"\n                        (click)=\"selectProperty(row.name)\"\n                      >\n                        <td>\n                          <button\n                            type=\"button\"\n                            class=\"axp-platform-explorer__field-button\"\n                            [attr.aria-pressed]=\"isSelected(row.name)\"\n                            (click)=\"selectProperty(row.name); $event.stopPropagation()\"\n                          >\n                            <code dir=\"ltr\">{{ row.name }}</code>\n                          </button>\n                          <!--->\n                          <!-- ----- Translated property title under the field name ----- -->\n                          @if (row.title) {\n                            <div class=\"axp-platform-explorer__field-title\">\n                              {{ row.title | translate | async }}\n                            </div>\n                          }\n                        </td>\n                        <td>\n                          <!--->\n                          <!-- ----- Stored data type chip ----- -->\n                          @if (row.dataType) {\n                            <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ row.dataType }}</span>\n                          }\n                          <!-- ----- Missing data type ----- -->\n                          @else {\n                            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n                          }\n                        </td>\n                        <td>\n                          <ng-container\n                            *ngTemplateOutlet=\"boolCell; context: { value: flagValue(row.details, 'nullable') }\"\n                          />\n                        </td>\n                      </tr>\n                    }\n                  </tbody>\n                </table>\n              </div>\n            }\n\n            <p class=\"axp-platform-explorer__docs-footnote\">\n              {{ '@platform-dev-tools:module.property-details.select-field' | translate | async }}\n            </p>\n          </div>\n      }\n      <!-- ----- Action table ----- -->\n      @else if (activeLayout(); as layout) {\n        <div class=\"axp-platform-explorer__docs-list axp-platform-explorer__docs-list--padded\">\n            <div class=\"axp-platform-explorer__docs-toolbar\">\n              <div>\n                <h2 class=\"axp-platform-explorer__docs-heading\">\n                  {{ ('@platform-dev-tools:module.layouts.' + layout.kind) | translate | async }}\n                </h2>\n                <p class=\"axp-platform-explorer__docs-count\">\n                  {{ ('@platform-dev-tools:module.layouts.' + layout.kind + '-hint') | translate | async }}\n                </p>\n                <p class=\"axp-platform-explorer__docs-count\">\n                  <!--->\n                  <!-- ----- Filtered action count ----- -->\n                  @if (actionQuery().trim()) {\n                    {{\n                      '@platform-dev-tools:module.action-details.action-count-filtered'\n                        | translate: { params: { shown: filteredActions().length, count: layout.actionCount } }\n                        | async\n                    }}\n                  }\n                  <!-- ----- Full action count ----- -->\n                  @else {\n                    {{\n                      '@platform-dev-tools:module.layouts.action-count'\n                        | translate: { params: { count: layout.actionCount } }\n                        | async\n                    }}\n                  }\n                </p>\n              </div>\n              <ax-search-box\n                class=\"axp-platform-explorer__docs-search\"\n                look=\"fill\"\n                [delayTime]=\"200\"\n                [value]=\"actionQuery()\"\n                [placeholder]=\"\n                  ('@platform-dev-tools:module.action-details.search-actions' | translate | async) ?? ''\n                \"\n                (onValueChanged)=\"onActionSearchChanged($event)\"\n              >\n                <ax-clear-button></ax-clear-button>\n              </ax-search-box>\n            </div>\n            <div class=\"flex flex-wrap items-center gap-1.5 mb-4\">\n              <!--->\n              <!-- ----- Related entity identity ----- -->\n              @if (layout.relatedEntity) {\n                <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ layout.relatedEntity }}</code>\n              }\n              <!--->\n              <!-- ----- Related layout type ----- -->\n              @if (layout.relatedLayoutType) {\n                <span class=\"inline-flex items-center rounded-full bg-lighter px-2 py-0.5 text-xs text-muted\">\n                  {{\n                    ('@platform-dev-tools:module.layouts.related-types.' + layout.relatedLayoutType)\n                      | translate | async\n                  }}\n                </span>\n              }\n              <!--->\n              <!-- ----- List query views ----- -->\n              @for (view of layout.views; track view.name) {\n                <span class=\"inline-flex items-center rounded-full bg-lighter px-2 py-0.5 text-xs text-muted\">\n                  {{ (view.title || view.name) | translate | async }}\n                </span>\n              }\n            </div>\n            <!--->\n            <!-- ----- Optional stored layout title ----- -->\n            @if (layout.layoutTitle) {\n              <p class=\"m-0 mb-2 text-sm\">{{ layout.layoutTitle | translate | async }}</p>\n            }\n            <!--->\n            <!-- ----- Optional stored layout description ----- -->\n            @if (layout.layoutDescription) {\n              <p class=\"m-0 mb-3 text-sm text-muted\">{{ layout.layoutDescription | translate | async }}</p>\n            }\n\n            <!--->\n            <!-- ----- Empty action list ----- -->\n            @if (layout.actionCount === 0) {\n              <p class=\"axp-platform-explorer__docs-empty\">\n                {{ '@platform-dev-tools:module.messages.no-actions' | translate | async }}\n              </p>\n            }\n            <!-- ----- Search matched no actions ----- -->\n            @else if (filteredActions().length === 0) {\n              <p class=\"axp-platform-explorer__docs-empty\">\n                {{ '@platform-dev-tools:module.action-details.no-matching-actions' | translate | async }}\n              </p>\n            }\n            <!-- ----- Action rows ----- -->\n            @else {\n              <div class=\"axp-platform-explorer__table-wrap axp-platform-explorer__table-wrap--fields\">\n                <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n                  <thead>\n                    <tr>\n                      <th>{{ '@platform-dev-tools:module.action-details.item' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.action-details.type' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.action-details.priority' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.action-details.scope' | translate | async }}</th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    @for (action of filteredActions(); track action.id) {\n                      <tr\n                        class=\"axp-platform-explorer__table-row\"\n                        [class.axp-platform-explorer__table-row--selected]=\"isActionSelected(action.id)\"\n                        (click)=\"selectAction(action.id)\"\n                      >\n                        <td>\n                          <div [style.padding-inline-start.rem]=\"action.depth\">\n                            <button\n                              type=\"button\"\n                              class=\"axp-platform-explorer__field-button\"\n                              [attr.aria-pressed]=\"isActionSelected(action.id)\"\n                              (click)=\"selectAction(action.id); $event.stopPropagation()\"\n                            >\n                              <!--->\n                              <!-- ----- Action icon from the layout ----- -->\n                              @if (action.icon) {\n                                <i class=\"text-muted me-1\" [ngClass]=\"action.icon\" aria-hidden=\"true\"></i>\n                              }\n                              <code dir=\"ltr\">{{ action.commandName || action.name || '\u2013' }}</code>\n                            </button>\n                            <!--->\n                            <!-- ----- Translated action title ----- -->\n                            @if (action.title) {\n                              <div class=\"axp-platform-explorer__field-title\">\n                                {{ action.title | translate | async }}\n                              </div>\n                            }\n                          </div>\n                        </td>\n                        <td>\n                          <!--->\n                          <!-- ----- Action type chip ----- -->\n                          @if (action.typeLabel) {\n                            <span class=\"axp-platform-explorer__type-chip\">{{ action.typeLabel }}</span>\n                          }\n                          <!-- ----- Missing action type ----- -->\n                          @else {\n                            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n                          }\n                        </td>\n                        <td>\n                          <span\n                            class=\"axp-platform-explorer__priority\"\n                            [class.is-primary]=\"action.priority === 'primary'\"\n                          >\n                            {{\n                              ('@platform-dev-tools:module.action-details.priorities.' + action.priority)\n                                | translate | async\n                            }}\n                          </span>\n                        </td>\n                        <td class=\"text-muted\">\n                          {{\n                            ('@platform-dev-tools:module.action-details.scopes.' + action.scope) | translate | async\n                          }}\n                        </td>\n                      </tr>\n                    }\n                  </tbody>\n                </table>\n              </div>\n            }\n\n            <p class=\"axp-platform-explorer__docs-footnote\">\n              {{ '@platform-dev-tools:module.action-details.select-action' | translate | async }}\n            </p>\n          </div>\n      }\n      </div>\n      </ax-content>\n      <ax-drawer\n        class=\"axp-platform-explorer__docs-side\"\n        [location]=\"'end'\"\n        [mode]=\"'push'\"\n        [collapsed]=\"!inspectorOpen()\"\n      >\n        <ax-content\n          class=\"axp-platform-explorer__docs-detail\"\n          [attr.aria-label]=\"inspectorAriaKey() | translate | async\"\n        >\n          <!--->\n          <!-- ----- Selected field definition ----- -->\n          @if (isFieldSection()) {\n            <ng-container *ngTemplateOutlet=\"fieldDetail\" />\n          }\n          <!-- ----- Selected action definition ----- -->\n          @else {\n            <ng-container *ngTemplateOutlet=\"actionDetail\" />\n          }\n        </ax-content>\n      </ax-drawer>\n    </ax-drawer-container>\n  }\n</div>\n\n<ng-template #boolCell let-value=\"value\">\n  <!-- ----- Affirmative flag ----- -->\n  @if (value === true) {\n    <span class=\"axp-platform-explorer__yes\">\n      <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n      {{ '@platform-dev-tools:module.property-details.yes' | translate | async }}\n    </span>\n  }\n  <!-- ----- Negative flag ----- -->\n  @else if (value === false) {\n    {{ '@platform-dev-tools:module.property-details.no' | translate | async }}\n  }\n  <!-- ----- Unknown flag ----- -->\n  @else {\n    <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n  }\n</ng-template>\n\n<ng-template #kvList let-pairs=\"pairs\">\n  <dl class=\"axp-platform-explorer__docs-dl axp-platform-explorer__docs-dl--json\">\n    @for (pair of pairs; track pair.path) {\n      <dt>\n        <code dir=\"ltr\">{{ pair.path || '\u2013' }}</code>\n      </dt>\n      <dd>\n        <code dir=\"ltr\">{{ pair.value }}</code>\n      </dd>\n    }\n  </dl>\n</ng-template>\n\n<ng-template #fieldDetail>\n  <!-- ----- Selected field definition ----- -->\n  @if (selectedProperty(); as field) {\n    <div class=\"axp-platform-explorer__docs-detail-header\">\n      <div class=\"axp-platform-explorer__docs-eyebrow\">\n        {{ '@platform-dev-tools:module.property-details.field-definition' | translate | async }}\n      </div>\n      <h2 class=\"axp-platform-explorer__docs-detail-title\">\n        {{ (field.title || field.name) | translate | async }}\n      </h2>\n      <code class=\"axp-platform-explorer__docs-key\" dir=\"ltr\">{{ field.name }}</code>\n      <!--->\n      <!-- ----- Plugin source of the selected field ----- -->\n      @if (field.pluginTitle) {\n        <span class=\"axp-platform-explorer__docs-chip axp-platform-explorer__docs-chip--field\">\n          <i class=\"fa-light fa-plug\" aria-hidden=\"true\"></i>\n          {{ field.pluginTitle | translate | async }}\n        </span>\n      }\n    </div>\n    <section class=\"axp-platform-explorer__docs-detail-block\">\n      <h3>{{ '@platform-dev-tools:module.terms.description' | translate | async }}</h3>\n      <p class=\"axp-platform-explorer__docs-description\">\n        <!--->\n        <!-- ----- Translated field description ----- -->\n        @if (field.description) {\n          {{ field.description | translate | async }}\n        }\n        <!-- ----- Missing field description ----- -->\n        @else {\n          {{ '@platform-dev-tools:module.property-details.no-description' | translate | async }}\n        }\n      </p>\n    </section>\n    <!--->\n    <!-- ----- Schema flags and scalar pairs ----- -->\n    @if (selectedSchemaEntries(); as schema) {\n      <!--->\n      <!-- ----- Render schema when at least one entry exists ----- -->\n      @if (schema.length) {\n        <section class=\"axp-platform-explorer__docs-detail-block\">\n          <h3>{{ '@platform-dev-tools:module.property-details.schema' | translate | async }}</h3>\n          <dl class=\"axp-platform-explorer__docs-dl\">\n            @for (entry of schema; track entry.labelKey) {\n              <dt>{{ ('@platform-dev-tools:module.property-details.' + entry.labelKey) | translate | async }}</dt>\n              <dd>\n                <!--->\n                <!-- ----- Boolean schema flags ----- -->\n                @if (entry.kind === 'flag') {\n                  <ng-container *ngTemplateOutlet=\"boolCell; context: { value: entry.on }\" />\n                }\n                <!-- ----- Schema scalar values ----- -->\n                @else {\n                  <!--->\n                  <!-- ----- Data type shown as a chip ----- -->\n                  @if (isTypePair(entry.labelKey)) {\n                    <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ entry.value }}</span>\n                  }\n                  <!-- ----- Code-like schema values ----- -->\n                  @else if (isCodePair(entry.labelKey)) {\n                    <code dir=\"ltr\">{{ entry.value }}</code>\n                  }\n                  <!-- ----- Plain schema values ----- -->\n                  @else {\n                    {{ entry.value }}\n                  }\n                }\n              </dd>\n            }\n          </dl>\n        </section>\n      }\n    }\n    <!--->\n    <!-- ----- Presentation flags and widget pairs ----- -->\n    @if (selectedPresentationEntries(); as presentation) {\n      <!--->\n      <!-- ----- Render presentation when at least one entry exists ----- -->\n      @if (presentation.length) {\n        <section class=\"axp-platform-explorer__docs-detail-block\">\n          <h3>{{ '@platform-dev-tools:module.property-details.presentation' | translate | async }}</h3>\n          <dl class=\"axp-platform-explorer__docs-dl\">\n            @for (entry of presentation; track entry.labelKey) {\n              <dt>{{ ('@platform-dev-tools:module.property-details.' + entry.labelKey) | translate | async }}</dt>\n              <dd>\n                <!--->\n                <!-- ----- Boolean presentation flags ----- -->\n                @if (entry.kind === 'flag') {\n                  <ng-container *ngTemplateOutlet=\"boolCell; context: { value: entry.on }\" />\n                }\n                <!-- ----- Presentation scalar values ----- -->\n                @else {\n                  <!--->\n                  <!-- ----- Widget identifiers as code ----- -->\n                  @if (isCodePair(entry.labelKey) || isTypePair(entry.labelKey)) {\n                    <code dir=\"ltr\">{{ entry.value }}</code>\n                  }\n                  <!-- ----- Plain presentation values ----- -->\n                  @else {\n                    {{ entry.value }}\n                  }\n                }\n              </dd>\n            }\n          </dl>\n        </section>\n      }\n    }\n    <!--->\n    <!-- ----- Widget triggers ----- -->\n    @if (field.details.triggers.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.property-details.triggers' | translate | async }}</h3>\n        <div class=\"axp-platform-explorer__prop-stack\">\n          @for (trigger of field.details.triggers; track $index) {\n            <div class=\"axp-platform-explorer__prop-card\">\n              <div class=\"axp-platform-explorer__prop-trigger\">\n                <span class=\"text-muted text-xs\">\n                  {{ '@platform-dev-tools:module.property-details.event' | translate | async }}\n                </span>\n                <code>{{ trigger.event || '\u2013' }}</code>\n                <i class=\"fa-light fa-arrow-right text-muted\" aria-hidden=\"true\"></i>\n                <span class=\"text-muted text-xs\">\n                  {{ '@platform-dev-tools:module.property-details.action' | translate | async }}\n                </span>\n                <code>{{ trigger.action || '\u2013' }}</code>\n              </div>\n              <!--->\n              <!-- ----- Disabled trigger badge ----- -->\n              @if (trigger.disabled) {\n                <span class=\"axp-platform-explorer__prop-flag\">\n                  {{ '@platform-dev-tools:module.property-details.disabled' | translate | async }}\n                </span>\n              }\n            </div>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Validation rules ----- -->\n    @if (field.details.validations.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.property-details.validations' | translate | async }}</h3>\n        <div class=\"axp-platform-explorer__prop-stack\">\n          @for (rule of field.details.validations; track $index) {\n            <div class=\"axp-platform-explorer__prop-card\">\n              <div class=\"flex flex-wrap items-center gap-2\">\n                <code>{{ rule.rule }}</code>\n                <!--->\n                <!-- ----- Disabled validation badge ----- -->\n                @if (rule.disabled) {\n                  <span class=\"axp-platform-explorer__prop-flag\">\n                    {{ '@platform-dev-tools:module.property-details.disabled' | translate | async }}\n                  </span>\n                }\n              </div>\n              <!--->\n              <!-- ----- Validation message ----- -->\n              @if (rule.message) {\n                <p class=\"m-0 text-xs text-muted\">{{ rule.message | translate | async }}</p>\n              }\n              <!--->\n              <!-- ----- Flattened validation options ----- -->\n              @if (rule.optionsPairs.length) {\n                <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: rule.optionsPairs }\" />\n              }\n            </div>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Flattened nested JSON (widget options, transforms, children) ----- -->\n    @if (field.details.jsonBlocks.length) {\n      @for (block of field.details.jsonBlocks; track block.labelKey) {\n        <section class=\"axp-platform-explorer__docs-detail-block\">\n          <h3>{{ ('@platform-dev-tools:module.property-details.' + block.labelKey) | translate | async }}</h3>\n          <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: block.pairs }\" />\n        </section>\n      }\n    }\n  }\n  <!-- ----- No field selected ----- -->\n  @else {\n    <p class=\"axp-platform-explorer__docs-empty\">\n      {{ '@platform-dev-tools:module.property-details.select-field' | translate | async }}\n    </p>\n  }\n</ng-template>\n\n<ng-template #actionDetail>\n  <!-- ----- Selected action definition ----- -->\n  @if (selectedAction(); as action) {\n    <div class=\"axp-platform-explorer__docs-detail-header\">\n      <div class=\"axp-platform-explorer__docs-eyebrow\">\n        {{ '@platform-dev-tools:module.action-details.action-definition' | translate | async }}\n      </div>\n      <h2 class=\"axp-platform-explorer__docs-detail-title\">\n        {{ (action.title || action.commandName || action.name || '\u2013') | translate | async }}\n      </h2>\n      <code class=\"axp-platform-explorer__docs-key\" dir=\"ltr\">{{ action.commandName || action.name || '\u2013' }}</code>\n    </div>\n    <section class=\"axp-platform-explorer__docs-detail-block\">\n      <h3>{{ '@platform-dev-tools:module.action-details.behavior' | translate | async }}</h3>\n      <dl class=\"axp-platform-explorer__docs-dl\">\n        <dt>{{ '@platform-dev-tools:module.action-details.type' | translate | async }}</dt>\n        <dd>\n          <!--->\n          <!-- ----- Action type ----- -->\n          @if (action.typeLabel) {\n            <span class=\"axp-platform-explorer__type-chip\">{{ action.typeLabel }}</span>\n          }\n          <!-- ----- Missing action type ----- -->\n          @else {\n            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n          }\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.priority' | translate | async }}</dt>\n        <dd>\n          {{ ('@platform-dev-tools:module.action-details.priorities.' + action.priority) | translate | async }}\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.scope' | translate | async }}</dt>\n        <dd>{{ ('@platform-dev-tools:module.action-details.scopes.' + action.scope) | translate | async }}</dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.default' | translate | async }}</dt>\n        <dd>\n          <ng-container *ngTemplateOutlet=\"boolCell; context: { value: action.isDefault }\" />\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.separated' | translate | async }}</dt>\n        <dd>\n          <ng-container *ngTemplateOutlet=\"boolCell; context: { value: action.separated }\" />\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.hidden' | translate | async }}</dt>\n        <dd>\n          <!--->\n          <!-- ----- Hidden yes/no ----- -->\n          @if (hiddenFlag(action) !== undefined) {\n            <ng-container *ngTemplateOutlet=\"boolCell; context: { value: hiddenFlag(action) }\" />\n          }\n          <!-- ----- Hidden expression ----- -->\n          @else if (hiddenExpression(action); as expression) {\n            <code dir=\"ltr\">{{ expression }}</code>\n          }\n          <!-- ----- Hidden unknown ----- -->\n          @else {\n            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n          }\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.disabled' | translate | async }}</dt>\n        <dd>\n          <!--->\n          <!-- ----- Disabled yes/no ----- -->\n          @if (disabledFlag(action) !== undefined) {\n            <ng-container *ngTemplateOutlet=\"boolCell; context: { value: disabledFlag(action) }\" />\n          }\n          <!-- ----- Disabled expression ----- -->\n          @else if (disabledExpression(action); as expression) {\n            <code dir=\"ltr\">{{ expression }}</code>\n          }\n          <!-- ----- Disabled unknown ----- -->\n          @else {\n            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n          }\n        </dd>\n        <!--->\n        <!-- ----- Named action key ----- -->\n        @if (action.name) {\n          <dt>{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n          <dd>\n            <code dir=\"ltr\">{{ action.name }}</code>\n          </dd>\n        }\n        <!--->\n        <!-- ----- Color token ----- -->\n        @if (action.color) {\n          <dt>{{ '@platform-dev-tools:module.action-details.color' | translate | async }}</dt>\n          <dd>\n            <code dir=\"ltr\">{{ action.color }}</code>\n          </dd>\n        }\n        <!--->\n        <!-- ----- Sort order ----- -->\n        @if (action.order != null) {\n          <dt>{{ '@platform-dev-tools:module.action-details.order' | translate | async }}</dt>\n          <dd>{{ action.order }}</dd>\n        }\n      </dl>\n    </section>\n    <!--->\n    <!-- ----- Keyboard shortcuts ----- -->\n    @if (action.shortcuts.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.shortcuts' | translate | async }}</h3>\n        <div class=\"flex flex-wrap gap-1.5\">\n          @for (shortcut of action.shortcuts; track shortcut) {\n            <code>{{ shortcut }}</code>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Permission keys ----- -->\n    @if (action.permissions.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.terms.permissions' | translate | async }}</h3>\n        <div class=\"flex flex-wrap gap-1.5\">\n          @for (permission of action.permissions; track permission) {\n            <code>{{ permission }}</code>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Dynamic submenu expression ----- -->\n    @if (action.submenuExpression) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.submenu' | translate | async }}</h3>\n        <code dir=\"ltr\">{{ action.submenuExpression }}</code>\n      </section>\n    }\n    <!--->\n    <!-- ----- Flattened command options ----- -->\n    @if (action.optionsPairs.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.options' | translate | async }}</h3>\n        <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: action.optionsPairs }\" />\n      </section>\n    }\n    <!--->\n    <!-- ----- Flattened command metadata ----- -->\n    @if (action.metadataPairs.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.metadata' | translate | async }}</h3>\n        <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: action.metadataPairs }\" />\n      </section>\n    }\n  }\n  <!-- ----- No action selected ----- -->\n  @else {\n    <p class=\"axp-platform-explorer__docs-empty\">\n      {{ '@platform-dev-tools:module.action-details.select-action' | translate | async }}\n    </p>\n  }\n</ng-template>\n", styles: ["@layer properties;ax-drawer-container.axp-platform-explorer__docs,ax-content.axp-platform-explorer__docs-main{height:100%;min-height:0}.axp-platform-explorer__docs-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1;flex-direction:column;overflow:hidden;display:flex!important;overflow:hidden!important}.axp-platform-explorer__docs-shell{display:grid;grid-template-rows:auto minmax(0,1fr);height:100%;min-height:0;overflow:hidden}.axp-platform-explorer__docs-chrome{z-index:20;flex-shrink:0;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);scrollbar-gutter:stable}.axp-platform-explorer__docs-chrome:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-dark);color:var(--color-on-dark);border-color:var(--color-border-dark)}.axp-platform-explorer__docs-plugins{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);padding-inline:calc(var(--spacing, .25rem) * 6);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-platform-explorer__docs-table-head{display:grid;grid-template-columns:46% minmax(0,1fr) minmax(0,1fr);margin-inline:calc(var(--spacing, .25rem) * 6);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));background-color:rgba(var(--ax-sys-color-lighter-surface));text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-table-head{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-table-head>*{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}.axp-platform-explorer__docs-chip{display:inline-flex;align-items:center;gap:var(--spacing, .25rem);border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface));border:1px solid rgb(var(--ax-sys-color-border-warning-lightest-surface))}.axp-platform-explorer__docs-chip--field{margin-top:calc(var(--spacing, .25rem) * 1.5)}.axp-platform-explorer__docs-list{min-height:0px;min-width:0px;overflow:auto;padding-inline:calc(var(--spacing, .25rem) * 6);padding-top:0;padding-bottom:calc(var(--spacing, .25rem) * 5);scrollbar-gutter:stable}.axp-platform-explorer__docs-list--padded{padding-top:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-toolbar{margin-bottom:calc(var(--spacing, .25rem) * 5);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-platform-explorer__docs-heading{margin:0;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-platform-explorer__docs-count{margin:0;margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-count{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-search{width:calc(var(--spacing, .25rem) * 52);max-width:100%}.axp-platform-explorer__docs-empty,.axp-platform-explorer__docs-footnote{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-empty,.axp-platform-explorer__docs-footnote{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-empty{padding-block:calc(var(--spacing, .25rem) * 8);text-align:center}.axp-platform-explorer__docs-footnote{margin:0;padding-top:calc(var(--spacing, .25rem) * 4)}.axp-platform-explorer__docs-side{width:calc(var(--spacing, .25rem) * 80);border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface))}.axp-platform-explorer__docs-detail{display:flex;height:100%;min-width:0px;flex-direction:column;overflow:auto;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-eyebrow{margin-bottom:calc(var(--spacing, .25rem) * 2.5);font-size:11px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-widest, .1em);letter-spacing:var(--tracking-widest, .1em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-eyebrow{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-detail-title{margin:0;margin-bottom:var(--spacing, .25rem);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.axp-platform-explorer__docs-key{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__docs-detail-block{margin-top:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-top:calc(var(--spacing, .25rem) * 4)}.axp-platform-explorer__docs-detail-block h3{margin:0;margin-bottom:calc(var(--spacing, .25rem) * 2.5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-platform-explorer__docs-description{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-description{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-dl{margin:0;display:grid;column-gap:calc(var(--spacing, .25rem) * 3);row-gap:calc(var(--spacing, .25rem) * 2.5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));grid-template-columns:minmax(0,1fr) auto}.axp-platform-explorer__docs-dl dt{color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-dl dt{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-dl dd{margin:0;max-width:calc(var(--spacing, .25rem) * 40);text-align:end;overflow-wrap:break-word}.axp-platform-explorer__docs-actions{display:flex;min-height:0px;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);overflow:auto;padding-inline:calc(var(--spacing, .25rem) * 6);padding-block:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-layout{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);padding-inline:0px}.axp-platform-explorer__docs-actions .axp-platform-explorer__docs-layout{margin-top:0}.axp-platform-explorer__table-wrap{overflow-x:auto;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface))}.axp-platform-explorer__table-wrap--fields{overflow:visible;border-radius:0;border-style:var(--tw-border-style);border-width:0px}.axp-platform-explorer__table{width:100%;min-width:36rem;border-collapse:collapse;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-platform-explorer__table--fields{min-width:0px;table-layout:fixed}.axp-platform-explorer__table--fields th:first-child{width:46%}.axp-platform-explorer__table th{background-color:rgba(var(--ax-sys-color-lighter-surface));text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-text-default));border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__table th{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__table--fields thead.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.axp-platform-explorer__table td{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 4);vertical-align:middle;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__table--fields tbody tr{cursor:pointer}.axp-platform-explorer__table-row--alt td{background-color:rgba(var(--ax-sys-color-lighter-surface))}.axp-platform-explorer__table-row:hover td,.axp-platform-explorer__table-row--selected td{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axp-platform-explorer__table-row--selected td:first-child{box-shadow:inset 3px 0 0 var(--ax-color-primary, currentColor)}:dir(rtl) .axp-platform-explorer__table-row--selected td:first-child{box-shadow:inset -3px 0 0 var(--ax-color-primary, currentColor)}.axp-platform-explorer__table tbody tr:last-child td{border-bottom-style:var(--tw-border-style);border-bottom-width:0px}.axp-platform-explorer__table-detail td{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-platform-explorer__docs-dl--json{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.axp-platform-explorer__docs-dl--json dd{max-width:none}.axp-platform-explorer__docs-dl--json dt code,.axp-platform-explorer__docs-dl--json dd code{background-color:transparent;padding:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));word-break:break-all}.axp-platform-explorer__field-button{margin:0;display:inline-flex;appearance:none;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;text-align:start;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-platform-explorer__field-button code{background-color:transparent;padding:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-platform-explorer__table-row--selected .axp-platform-explorer__field-button{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__field-button:hover{text-decoration:underline;text-underline-offset:3px}.axp-platform-explorer__field-title{margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__field-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__type-chip{display:inline-block;border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__unknown{color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__unknown{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__yes{display:inline-flex;align-items:center;gap:var(--spacing, .25rem);color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__yes i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__prop-toggle,.axp-platform-explorer__prop-toggle-spacer{display:inline-flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);flex-shrink:0;align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem)}.axp-platform-explorer__prop-toggle{cursor:pointer;appearance:none;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__prop-toggle{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__prop-toggle:hover{background-color:rgba(var(--ax-sys-color-lighter-surface));color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__prop-toggle i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-platform-explorer__prop-toggle.is-open i{rotate:90deg}.axp-platform-explorer__prop-details{margin-inline-start:calc(var(--spacing, .25rem) * 9);display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding:calc(var(--spacing, .25rem) * 4)}.axp-platform-explorer__prop-flags{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-flag{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__prop-pairs{margin:0;display:grid;column-gap:calc(var(--spacing, .25rem) * 6);row-gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:minmax(7rem,11rem) minmax(0,1fr)}.axp-platform-explorer__prop-pairs dt{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__prop-pairs dt{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__prop-pairs dd{margin:0;min-width:0px}.axp-platform-explorer__prop-pairs code,.axp-platform-explorer__prop-card code,.axp-platform-explorer__prop-trigger code{border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));word-break:break-all}.axp-platform-explorer__prop-section{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-section-title{margin:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__prop-section-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__prop-stack{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-card{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}.axp-platform-explorer__prop-trigger{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-json{margin:0;max-height:calc(var(--spacing, .25rem) * 48);overflow:auto;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding:calc(var(--spacing, .25rem) * 3);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.axp-platform-explorer__table--actions{min-width:36rem}.axp-platform-explorer__priority{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__priority{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__priority.is-primary{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-surface))}@media(max-width:760px){.axp-platform-explorer__docs-side{width:calc(var(--spacing, .25rem) * 72)}.axp-platform-explorer__docs-plugins,.axp-platform-explorer__docs-list,.axp-platform-explorer__docs-actions{padding-inline:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-table-head{margin-inline:calc(var(--spacing, .25rem) * 5)}}@media(max-width:440px){.axp-platform-explorer__docs-toolbar{display:block}.axp-platform-explorer__docs-search{margin-top:calc(var(--spacing, .25rem) * 3);width:100%}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-duration: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i2$1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i3$1.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: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4.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: AXDrawerModule }, { kind: "component", type: i5.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "transition", "closeOnBackdropClick", "backdropClass", "collapsed", "singleOpenMode"], outputs: ["onBackdropClick", "collapsedStateChanged"] }, { kind: "component", type: i5.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "pipe", type: i1.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: "22.0.8", ngImport: i0, type: AXPlatformExplorerEntityDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axp-platform-explorer-entity-detail', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, AXTranslationModule], host: { class: 'flex flex-col flex-1 min-h-0' }, template: `
-    <div class="flex flex-col flex-1 min-h-0 pt-0 overflow-auto">
-      @if (entity(); as e) {
-        <dl class="grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 mb-3 m-0">
-          <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.module' | translate | async }}</dt><dd class="m-0">{{ e.module }}</dd>
-          <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt><dd class="m-0">{{ e.name }}</dd>
-          @if (e.title) {
-            <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.title' | translate | async }}</dt><dd class="m-0">{{ e.title  | translate | async}}</dd>
-          }
-          @if (e.formats.plural) {
-            <dt class="font-semibold text-muted">{{ '@platform-dev-tools:module.terms.plural' | translate | async }}</dt><dd class="m-0">{{ e.formats.plural  | translate | async}}</dd>
-          }
-        </dl>
-        @if (e.properties && e.properties.length > 0) {
-          <p class="mb-2 mt-3 font-bold">{{ '@platform-dev-tools:module.terms.properties' | translate | async }} ({{ e.properties.length }})</p>
-          <div class="flex-1 min-h-0 overflow-auto border border-lightest rounded-md">
-            <table class="w-full border-collapse text-[13px]">
-              <thead>
-                <tr>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</th>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.title' | translate | async }}</th>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.type' | translate | async }}</th>
-                  <th class="text-start p-2 px-3 bg-lighter font-semibold border-b border-lightest">{{ '@platform-dev-tools:module.terms.description' | translate | async }}</th>
-                </tr>
-              </thead>
-              <tbody class="axp-entity-detail-tbody">
-                @for (p of e.properties; track p.name) {
-                  <tr>
-                    <td class="p-2 px-3 border-b border-lightest"><code class="text-xs bg-lighter px-1.5 py-0.5 rounded">{{ p.name }}</code></td>
-                    <td class="p-2 px-3 border-b border-lightest">{{ p.title | translate | async }}</td>
-                    <td class="p-2 px-3 border-b border-lightest">{{ p.schema.dataType }}</td>
-                    <td class="p-2 px-3 border-b border-lightest">@if (p.description) { {{ p.description | translate | async }} } @else { – }</td>
-                  </tr>
-                }
-              </tbody>
-            </table>
-          </div>
-        }
-      } @else if (loading()) {
-        <p class="m-0 text-muted">{{ '@platform-dev-tools:module.terms.loading-entity' | translate | async }}</p>
-      }
-    </div>
-  `, styles: [".axp-entity-detail-tbody tr:last-child td{border-bottom:none}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+            args: [{ selector: 'axp-platform-explorer-entity-detail', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'flex flex-col flex-1 min-h-0' }, imports: [
+                        CommonModule,
+                        NgTemplateOutlet,
+                        AXTranslationModule,
+                        AXLoadingModule,
+                        AXSearchBoxModule,
+                        AXDecoratorModule,
+                        AXDrawerModule,
+                        AXPStateMessageComponent,
+                    ], template: "<div class=\"flex flex-col flex-1 min-h-0\">\n  <!-- ----- Loading entity layout ----- -->\n  @if (loading()) {\n    <div class=\"flex flex-1 items-center justify-center p-6\">\n      <ax-loading></ax-loading>\n    </div>\n  }\n  <!-- ----- Entity catalog query failed ----- -->\n  @else if (loadError()) {\n    <axp-state-message\n      icon=\"fa-light fa-triangle-exclamation\"\n      [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n      [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n    />\n  }\n  <!-- ----- Entity documentation with field or action inspector ----- -->\n  @else if (detail(); as d) {\n    <ax-drawer-container class=\"axp-platform-explorer__docs\">\n      <ax-content class=\"axp-platform-explorer__docs-main\">\n      <div class=\"axp-platform-explorer__docs-shell\">\n      <div class=\"axp-platform-explorer__docs-chrome\">\n      <!--->\n      <!-- ----- Attached plugins as chips ----- -->\n      @if (d.plugins.length) {\n        <div class=\"axp-platform-explorer__docs-plugins\">\n          @for (plugin of d.plugins; track plugin.name) {\n            <span class=\"axp-platform-explorer__docs-chip\">\n              <i class=\"fa-light fa-plug\" aria-hidden=\"true\"></i>\n              {{ (plugin.title || plugin.name) | translate | async }}\n            </span>\n          }\n        </div>\n      }\n      <!--->\n      <!-- ----- Field column headers stay outside the scrolling rows ----- -->\n      @if (isFieldSection() && properties().length) {\n        <div class=\"axp-platform-explorer__docs-table-head\" role=\"row\">\n          <span role=\"columnheader\">{{ '@platform-dev-tools:module.terms.field' | translate | async }}</span>\n          <span role=\"columnheader\">\n            {{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}\n          </span>\n          <span role=\"columnheader\">\n            {{ '@platform-dev-tools:module.property-details.nullable' | translate | async }}\n          </span>\n        </div>\n      }\n      </div>\n\n      <!--->\n      <!-- ----- Field table ----- -->\n      @if (isFieldSection()) {\n        <div class=\"axp-platform-explorer__docs-list\">\n            <!--->\n            <!-- ----- Empty property list ----- -->\n            @if (properties().length === 0) {\n              <p class=\"axp-platform-explorer__docs-empty\">\n                {{ '@platform-dev-tools:module.messages.no-properties' | translate | async }}\n              </p>\n            }\n            <!-- ----- Field rows ----- -->\n            @else {\n              <div class=\"axp-platform-explorer__table-wrap axp-platform-explorer__table-wrap--fields\">\n                <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n                  <thead class=\"sr-only\">\n                    <tr>\n                      <th>{{ '@platform-dev-tools:module.terms.field' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.property-details.nullable' | translate | async }}</th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    @for (row of properties(); track row.name) {\n                      <tr\n                        class=\"axp-platform-explorer__table-row\"\n                        [class.axp-platform-explorer__table-row--selected]=\"isSelected(row.name)\"\n                        (click)=\"selectProperty(row.name)\"\n                      >\n                        <td>\n                          <button\n                            type=\"button\"\n                            class=\"axp-platform-explorer__field-button\"\n                            [attr.aria-pressed]=\"isSelected(row.name)\"\n                            (click)=\"selectProperty(row.name); $event.stopPropagation()\"\n                          >\n                            <code dir=\"ltr\">{{ row.name }}</code>\n                          </button>\n                          <!--->\n                          <!-- ----- Translated property title under the field name ----- -->\n                          @if (row.title) {\n                            <div class=\"axp-platform-explorer__field-title\">\n                              {{ row.title | translate | async }}\n                            </div>\n                          }\n                        </td>\n                        <td>\n                          <!--->\n                          <!-- ----- Stored data type chip ----- -->\n                          @if (row.dataType) {\n                            <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ row.dataType }}</span>\n                          }\n                          <!-- ----- Missing data type ----- -->\n                          @else {\n                            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n                          }\n                        </td>\n                        <td>\n                          <ng-container\n                            *ngTemplateOutlet=\"boolCell; context: { value: flagValue(row.details, 'nullable') }\"\n                          />\n                        </td>\n                      </tr>\n                    }\n                  </tbody>\n                </table>\n              </div>\n            }\n\n            <p class=\"axp-platform-explorer__docs-footnote\">\n              {{ '@platform-dev-tools:module.property-details.select-field' | translate | async }}\n            </p>\n          </div>\n      }\n      <!-- ----- Action table ----- -->\n      @else if (activeLayout(); as layout) {\n        <div class=\"axp-platform-explorer__docs-list axp-platform-explorer__docs-list--padded\">\n            <div class=\"axp-platform-explorer__docs-toolbar\">\n              <div>\n                <h2 class=\"axp-platform-explorer__docs-heading\">\n                  {{ ('@platform-dev-tools:module.layouts.' + layout.kind) | translate | async }}\n                </h2>\n                <p class=\"axp-platform-explorer__docs-count\">\n                  {{ ('@platform-dev-tools:module.layouts.' + layout.kind + '-hint') | translate | async }}\n                </p>\n                <p class=\"axp-platform-explorer__docs-count\">\n                  <!--->\n                  <!-- ----- Filtered action count ----- -->\n                  @if (actionQuery().trim()) {\n                    {{\n                      '@platform-dev-tools:module.action-details.action-count-filtered'\n                        | translate: { params: { shown: filteredActions().length, count: layout.actionCount } }\n                        | async\n                    }}\n                  }\n                  <!-- ----- Full action count ----- -->\n                  @else {\n                    {{\n                      '@platform-dev-tools:module.layouts.action-count'\n                        | translate: { params: { count: layout.actionCount } }\n                        | async\n                    }}\n                  }\n                </p>\n              </div>\n              <ax-search-box\n                class=\"axp-platform-explorer__docs-search\"\n                look=\"fill\"\n                [delayTime]=\"200\"\n                [value]=\"actionQuery()\"\n                [placeholder]=\"\n                  ('@platform-dev-tools:module.action-details.search-actions' | translate | async) ?? ''\n                \"\n                (onValueChanged)=\"onActionSearchChanged($event)\"\n              >\n                <ax-clear-button></ax-clear-button>\n              </ax-search-box>\n            </div>\n            <div class=\"flex flex-wrap items-center gap-1.5 mb-4\">\n              <!--->\n              <!-- ----- Related entity identity ----- -->\n              @if (layout.relatedEntity) {\n                <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ layout.relatedEntity }}</code>\n              }\n              <!--->\n              <!-- ----- Related layout type ----- -->\n              @if (layout.relatedLayoutType) {\n                <span class=\"inline-flex items-center rounded-full bg-lighter px-2 py-0.5 text-xs text-muted\">\n                  {{\n                    ('@platform-dev-tools:module.layouts.related-types.' + layout.relatedLayoutType)\n                      | translate | async\n                  }}\n                </span>\n              }\n              <!--->\n              <!-- ----- List query views ----- -->\n              @for (view of layout.views; track view.name) {\n                <span class=\"inline-flex items-center rounded-full bg-lighter px-2 py-0.5 text-xs text-muted\">\n                  {{ (view.title || view.name) | translate | async }}\n                </span>\n              }\n            </div>\n            <!--->\n            <!-- ----- Optional stored layout title ----- -->\n            @if (layout.layoutTitle) {\n              <p class=\"m-0 mb-2 text-sm\">{{ layout.layoutTitle | translate | async }}</p>\n            }\n            <!--->\n            <!-- ----- Optional stored layout description ----- -->\n            @if (layout.layoutDescription) {\n              <p class=\"m-0 mb-3 text-sm text-muted\">{{ layout.layoutDescription | translate | async }}</p>\n            }\n\n            <!--->\n            <!-- ----- Empty action list ----- -->\n            @if (layout.actionCount === 0) {\n              <p class=\"axp-platform-explorer__docs-empty\">\n                {{ '@platform-dev-tools:module.messages.no-actions' | translate | async }}\n              </p>\n            }\n            <!-- ----- Search matched no actions ----- -->\n            @else if (filteredActions().length === 0) {\n              <p class=\"axp-platform-explorer__docs-empty\">\n                {{ '@platform-dev-tools:module.action-details.no-matching-actions' | translate | async }}\n              </p>\n            }\n            <!-- ----- Action rows ----- -->\n            @else {\n              <div class=\"axp-platform-explorer__table-wrap axp-platform-explorer__table-wrap--fields\">\n                <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n                  <thead>\n                    <tr>\n                      <th>{{ '@platform-dev-tools:module.action-details.item' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.action-details.type' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.action-details.priority' | translate | async }}</th>\n                      <th>{{ '@platform-dev-tools:module.action-details.scope' | translate | async }}</th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    @for (action of filteredActions(); track action.id) {\n                      <tr\n                        class=\"axp-platform-explorer__table-row\"\n                        [class.axp-platform-explorer__table-row--selected]=\"isActionSelected(action.id)\"\n                        (click)=\"selectAction(action.id)\"\n                      >\n                        <td>\n                          <div [style.padding-inline-start.rem]=\"action.depth\">\n                            <button\n                              type=\"button\"\n                              class=\"axp-platform-explorer__field-button\"\n                              [attr.aria-pressed]=\"isActionSelected(action.id)\"\n                              (click)=\"selectAction(action.id); $event.stopPropagation()\"\n                            >\n                              <!--->\n                              <!-- ----- Action icon from the layout ----- -->\n                              @if (action.icon) {\n                                <i class=\"text-muted me-1\" [ngClass]=\"action.icon\" aria-hidden=\"true\"></i>\n                              }\n                              <code dir=\"ltr\">{{ action.commandName || action.name || '\u2013' }}</code>\n                            </button>\n                            <!--->\n                            <!-- ----- Translated action title ----- -->\n                            @if (action.title) {\n                              <div class=\"axp-platform-explorer__field-title\">\n                                {{ action.title | translate | async }}\n                              </div>\n                            }\n                          </div>\n                        </td>\n                        <td>\n                          <!--->\n                          <!-- ----- Action type chip ----- -->\n                          @if (action.typeLabel) {\n                            <span class=\"axp-platform-explorer__type-chip\">{{ action.typeLabel }}</span>\n                          }\n                          <!-- ----- Missing action type ----- -->\n                          @else {\n                            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n                          }\n                        </td>\n                        <td>\n                          <span\n                            class=\"axp-platform-explorer__priority\"\n                            [class.is-primary]=\"action.priority === 'primary'\"\n                          >\n                            {{\n                              ('@platform-dev-tools:module.action-details.priorities.' + action.priority)\n                                | translate | async\n                            }}\n                          </span>\n                        </td>\n                        <td class=\"text-muted\">\n                          {{\n                            ('@platform-dev-tools:module.action-details.scopes.' + action.scope) | translate | async\n                          }}\n                        </td>\n                      </tr>\n                    }\n                  </tbody>\n                </table>\n              </div>\n            }\n\n            <p class=\"axp-platform-explorer__docs-footnote\">\n              {{ '@platform-dev-tools:module.action-details.select-action' | translate | async }}\n            </p>\n          </div>\n      }\n      </div>\n      </ax-content>\n      <ax-drawer\n        class=\"axp-platform-explorer__docs-side\"\n        [location]=\"'end'\"\n        [mode]=\"'push'\"\n        [collapsed]=\"!inspectorOpen()\"\n      >\n        <ax-content\n          class=\"axp-platform-explorer__docs-detail\"\n          [attr.aria-label]=\"inspectorAriaKey() | translate | async\"\n        >\n          <!--->\n          <!-- ----- Selected field definition ----- -->\n          @if (isFieldSection()) {\n            <ng-container *ngTemplateOutlet=\"fieldDetail\" />\n          }\n          <!-- ----- Selected action definition ----- -->\n          @else {\n            <ng-container *ngTemplateOutlet=\"actionDetail\" />\n          }\n        </ax-content>\n      </ax-drawer>\n    </ax-drawer-container>\n  }\n</div>\n\n<ng-template #boolCell let-value=\"value\">\n  <!-- ----- Affirmative flag ----- -->\n  @if (value === true) {\n    <span class=\"axp-platform-explorer__yes\">\n      <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n      {{ '@platform-dev-tools:module.property-details.yes' | translate | async }}\n    </span>\n  }\n  <!-- ----- Negative flag ----- -->\n  @else if (value === false) {\n    {{ '@platform-dev-tools:module.property-details.no' | translate | async }}\n  }\n  <!-- ----- Unknown flag ----- -->\n  @else {\n    <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n  }\n</ng-template>\n\n<ng-template #kvList let-pairs=\"pairs\">\n  <dl class=\"axp-platform-explorer__docs-dl axp-platform-explorer__docs-dl--json\">\n    @for (pair of pairs; track pair.path) {\n      <dt>\n        <code dir=\"ltr\">{{ pair.path || '\u2013' }}</code>\n      </dt>\n      <dd>\n        <code dir=\"ltr\">{{ pair.value }}</code>\n      </dd>\n    }\n  </dl>\n</ng-template>\n\n<ng-template #fieldDetail>\n  <!-- ----- Selected field definition ----- -->\n  @if (selectedProperty(); as field) {\n    <div class=\"axp-platform-explorer__docs-detail-header\">\n      <div class=\"axp-platform-explorer__docs-eyebrow\">\n        {{ '@platform-dev-tools:module.property-details.field-definition' | translate | async }}\n      </div>\n      <h2 class=\"axp-platform-explorer__docs-detail-title\">\n        {{ (field.title || field.name) | translate | async }}\n      </h2>\n      <code class=\"axp-platform-explorer__docs-key\" dir=\"ltr\">{{ field.name }}</code>\n      <!--->\n      <!-- ----- Plugin source of the selected field ----- -->\n      @if (field.pluginTitle) {\n        <span class=\"axp-platform-explorer__docs-chip axp-platform-explorer__docs-chip--field\">\n          <i class=\"fa-light fa-plug\" aria-hidden=\"true\"></i>\n          {{ field.pluginTitle | translate | async }}\n        </span>\n      }\n    </div>\n    <section class=\"axp-platform-explorer__docs-detail-block\">\n      <h3>{{ '@platform-dev-tools:module.terms.description' | translate | async }}</h3>\n      <p class=\"axp-platform-explorer__docs-description\">\n        <!--->\n        <!-- ----- Translated field description ----- -->\n        @if (field.description) {\n          {{ field.description | translate | async }}\n        }\n        <!-- ----- Missing field description ----- -->\n        @else {\n          {{ '@platform-dev-tools:module.property-details.no-description' | translate | async }}\n        }\n      </p>\n    </section>\n    <!--->\n    <!-- ----- Schema flags and scalar pairs ----- -->\n    @if (selectedSchemaEntries(); as schema) {\n      <!--->\n      <!-- ----- Render schema when at least one entry exists ----- -->\n      @if (schema.length) {\n        <section class=\"axp-platform-explorer__docs-detail-block\">\n          <h3>{{ '@platform-dev-tools:module.property-details.schema' | translate | async }}</h3>\n          <dl class=\"axp-platform-explorer__docs-dl\">\n            @for (entry of schema; track entry.labelKey) {\n              <dt>{{ ('@platform-dev-tools:module.property-details.' + entry.labelKey) | translate | async }}</dt>\n              <dd>\n                <!--->\n                <!-- ----- Boolean schema flags ----- -->\n                @if (entry.kind === 'flag') {\n                  <ng-container *ngTemplateOutlet=\"boolCell; context: { value: entry.on }\" />\n                }\n                <!-- ----- Schema scalar values ----- -->\n                @else {\n                  <!--->\n                  <!-- ----- Data type shown as a chip ----- -->\n                  @if (isTypePair(entry.labelKey)) {\n                    <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ entry.value }}</span>\n                  }\n                  <!-- ----- Code-like schema values ----- -->\n                  @else if (isCodePair(entry.labelKey)) {\n                    <code dir=\"ltr\">{{ entry.value }}</code>\n                  }\n                  <!-- ----- Plain schema values ----- -->\n                  @else {\n                    {{ entry.value }}\n                  }\n                }\n              </dd>\n            }\n          </dl>\n        </section>\n      }\n    }\n    <!--->\n    <!-- ----- Presentation flags and widget pairs ----- -->\n    @if (selectedPresentationEntries(); as presentation) {\n      <!--->\n      <!-- ----- Render presentation when at least one entry exists ----- -->\n      @if (presentation.length) {\n        <section class=\"axp-platform-explorer__docs-detail-block\">\n          <h3>{{ '@platform-dev-tools:module.property-details.presentation' | translate | async }}</h3>\n          <dl class=\"axp-platform-explorer__docs-dl\">\n            @for (entry of presentation; track entry.labelKey) {\n              <dt>{{ ('@platform-dev-tools:module.property-details.' + entry.labelKey) | translate | async }}</dt>\n              <dd>\n                <!--->\n                <!-- ----- Boolean presentation flags ----- -->\n                @if (entry.kind === 'flag') {\n                  <ng-container *ngTemplateOutlet=\"boolCell; context: { value: entry.on }\" />\n                }\n                <!-- ----- Presentation scalar values ----- -->\n                @else {\n                  <!--->\n                  <!-- ----- Widget identifiers as code ----- -->\n                  @if (isCodePair(entry.labelKey) || isTypePair(entry.labelKey)) {\n                    <code dir=\"ltr\">{{ entry.value }}</code>\n                  }\n                  <!-- ----- Plain presentation values ----- -->\n                  @else {\n                    {{ entry.value }}\n                  }\n                }\n              </dd>\n            }\n          </dl>\n        </section>\n      }\n    }\n    <!--->\n    <!-- ----- Widget triggers ----- -->\n    @if (field.details.triggers.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.property-details.triggers' | translate | async }}</h3>\n        <div class=\"axp-platform-explorer__prop-stack\">\n          @for (trigger of field.details.triggers; track $index) {\n            <div class=\"axp-platform-explorer__prop-card\">\n              <div class=\"axp-platform-explorer__prop-trigger\">\n                <span class=\"text-muted text-xs\">\n                  {{ '@platform-dev-tools:module.property-details.event' | translate | async }}\n                </span>\n                <code>{{ trigger.event || '\u2013' }}</code>\n                <i class=\"fa-light fa-arrow-right text-muted\" aria-hidden=\"true\"></i>\n                <span class=\"text-muted text-xs\">\n                  {{ '@platform-dev-tools:module.property-details.action' | translate | async }}\n                </span>\n                <code>{{ trigger.action || '\u2013' }}</code>\n              </div>\n              <!--->\n              <!-- ----- Disabled trigger badge ----- -->\n              @if (trigger.disabled) {\n                <span class=\"axp-platform-explorer__prop-flag\">\n                  {{ '@platform-dev-tools:module.property-details.disabled' | translate | async }}\n                </span>\n              }\n            </div>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Validation rules ----- -->\n    @if (field.details.validations.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.property-details.validations' | translate | async }}</h3>\n        <div class=\"axp-platform-explorer__prop-stack\">\n          @for (rule of field.details.validations; track $index) {\n            <div class=\"axp-platform-explorer__prop-card\">\n              <div class=\"flex flex-wrap items-center gap-2\">\n                <code>{{ rule.rule }}</code>\n                <!--->\n                <!-- ----- Disabled validation badge ----- -->\n                @if (rule.disabled) {\n                  <span class=\"axp-platform-explorer__prop-flag\">\n                    {{ '@platform-dev-tools:module.property-details.disabled' | translate | async }}\n                  </span>\n                }\n              </div>\n              <!--->\n              <!-- ----- Validation message ----- -->\n              @if (rule.message) {\n                <p class=\"m-0 text-xs text-muted\">{{ rule.message | translate | async }}</p>\n              }\n              <!--->\n              <!-- ----- Flattened validation options ----- -->\n              @if (rule.optionsPairs.length) {\n                <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: rule.optionsPairs }\" />\n              }\n            </div>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Flattened nested JSON (widget options, transforms, children) ----- -->\n    @if (field.details.jsonBlocks.length) {\n      @for (block of field.details.jsonBlocks; track block.labelKey) {\n        <section class=\"axp-platform-explorer__docs-detail-block\">\n          <h3>{{ ('@platform-dev-tools:module.property-details.' + block.labelKey) | translate | async }}</h3>\n          <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: block.pairs }\" />\n        </section>\n      }\n    }\n  }\n  <!-- ----- No field selected ----- -->\n  @else {\n    <p class=\"axp-platform-explorer__docs-empty\">\n      {{ '@platform-dev-tools:module.property-details.select-field' | translate | async }}\n    </p>\n  }\n</ng-template>\n\n<ng-template #actionDetail>\n  <!-- ----- Selected action definition ----- -->\n  @if (selectedAction(); as action) {\n    <div class=\"axp-platform-explorer__docs-detail-header\">\n      <div class=\"axp-platform-explorer__docs-eyebrow\">\n        {{ '@platform-dev-tools:module.action-details.action-definition' | translate | async }}\n      </div>\n      <h2 class=\"axp-platform-explorer__docs-detail-title\">\n        {{ (action.title || action.commandName || action.name || '\u2013') | translate | async }}\n      </h2>\n      <code class=\"axp-platform-explorer__docs-key\" dir=\"ltr\">{{ action.commandName || action.name || '\u2013' }}</code>\n    </div>\n    <section class=\"axp-platform-explorer__docs-detail-block\">\n      <h3>{{ '@platform-dev-tools:module.action-details.behavior' | translate | async }}</h3>\n      <dl class=\"axp-platform-explorer__docs-dl\">\n        <dt>{{ '@platform-dev-tools:module.action-details.type' | translate | async }}</dt>\n        <dd>\n          <!--->\n          <!-- ----- Action type ----- -->\n          @if (action.typeLabel) {\n            <span class=\"axp-platform-explorer__type-chip\">{{ action.typeLabel }}</span>\n          }\n          <!-- ----- Missing action type ----- -->\n          @else {\n            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n          }\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.priority' | translate | async }}</dt>\n        <dd>\n          {{ ('@platform-dev-tools:module.action-details.priorities.' + action.priority) | translate | async }}\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.scope' | translate | async }}</dt>\n        <dd>{{ ('@platform-dev-tools:module.action-details.scopes.' + action.scope) | translate | async }}</dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.default' | translate | async }}</dt>\n        <dd>\n          <ng-container *ngTemplateOutlet=\"boolCell; context: { value: action.isDefault }\" />\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.separated' | translate | async }}</dt>\n        <dd>\n          <ng-container *ngTemplateOutlet=\"boolCell; context: { value: action.separated }\" />\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.hidden' | translate | async }}</dt>\n        <dd>\n          <!--->\n          <!-- ----- Hidden yes/no ----- -->\n          @if (hiddenFlag(action) !== undefined) {\n            <ng-container *ngTemplateOutlet=\"boolCell; context: { value: hiddenFlag(action) }\" />\n          }\n          <!-- ----- Hidden expression ----- -->\n          @else if (hiddenExpression(action); as expression) {\n            <code dir=\"ltr\">{{ expression }}</code>\n          }\n          <!-- ----- Hidden unknown ----- -->\n          @else {\n            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n          }\n        </dd>\n        <dt>{{ '@platform-dev-tools:module.action-details.disabled' | translate | async }}</dt>\n        <dd>\n          <!--->\n          <!-- ----- Disabled yes/no ----- -->\n          @if (disabledFlag(action) !== undefined) {\n            <ng-container *ngTemplateOutlet=\"boolCell; context: { value: disabledFlag(action) }\" />\n          }\n          <!-- ----- Disabled expression ----- -->\n          @else if (disabledExpression(action); as expression) {\n            <code dir=\"ltr\">{{ expression }}</code>\n          }\n          <!-- ----- Disabled unknown ----- -->\n          @else {\n            <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n          }\n        </dd>\n        <!--->\n        <!-- ----- Named action key ----- -->\n        @if (action.name) {\n          <dt>{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n          <dd>\n            <code dir=\"ltr\">{{ action.name }}</code>\n          </dd>\n        }\n        <!--->\n        <!-- ----- Color token ----- -->\n        @if (action.color) {\n          <dt>{{ '@platform-dev-tools:module.action-details.color' | translate | async }}</dt>\n          <dd>\n            <code dir=\"ltr\">{{ action.color }}</code>\n          </dd>\n        }\n        <!--->\n        <!-- ----- Sort order ----- -->\n        @if (action.order != null) {\n          <dt>{{ '@platform-dev-tools:module.action-details.order' | translate | async }}</dt>\n          <dd>{{ action.order }}</dd>\n        }\n      </dl>\n    </section>\n    <!--->\n    <!-- ----- Keyboard shortcuts ----- -->\n    @if (action.shortcuts.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.shortcuts' | translate | async }}</h3>\n        <div class=\"flex flex-wrap gap-1.5\">\n          @for (shortcut of action.shortcuts; track shortcut) {\n            <code>{{ shortcut }}</code>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Permission keys ----- -->\n    @if (action.permissions.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.terms.permissions' | translate | async }}</h3>\n        <div class=\"flex flex-wrap gap-1.5\">\n          @for (permission of action.permissions; track permission) {\n            <code>{{ permission }}</code>\n          }\n        </div>\n      </section>\n    }\n    <!--->\n    <!-- ----- Dynamic submenu expression ----- -->\n    @if (action.submenuExpression) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.submenu' | translate | async }}</h3>\n        <code dir=\"ltr\">{{ action.submenuExpression }}</code>\n      </section>\n    }\n    <!--->\n    <!-- ----- Flattened command options ----- -->\n    @if (action.optionsPairs.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.options' | translate | async }}</h3>\n        <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: action.optionsPairs }\" />\n      </section>\n    }\n    <!--->\n    <!-- ----- Flattened command metadata ----- -->\n    @if (action.metadataPairs.length) {\n      <section class=\"axp-platform-explorer__docs-detail-block\">\n        <h3>{{ '@platform-dev-tools:module.action-details.metadata' | translate | async }}</h3>\n        <ng-container *ngTemplateOutlet=\"kvList; context: { pairs: action.metadataPairs }\" />\n      </section>\n    }\n  }\n  <!-- ----- No action selected ----- -->\n  @else {\n    <p class=\"axp-platform-explorer__docs-empty\">\n      {{ '@platform-dev-tools:module.action-details.select-action' | translate | async }}\n    </p>\n  }\n</ng-template>\n", styles: ["@layer properties;ax-drawer-container.axp-platform-explorer__docs,ax-content.axp-platform-explorer__docs-main{height:100%;min-height:0}.axp-platform-explorer__docs-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1;flex-direction:column;overflow:hidden;display:flex!important;overflow:hidden!important}.axp-platform-explorer__docs-shell{display:grid;grid-template-rows:auto minmax(0,1fr);height:100%;min-height:0;overflow:hidden}.axp-platform-explorer__docs-chrome{z-index:20;flex-shrink:0;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);scrollbar-gutter:stable}.axp-platform-explorer__docs-chrome:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-dark);color:var(--color-on-dark);border-color:var(--color-border-dark)}.axp-platform-explorer__docs-plugins{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);padding-inline:calc(var(--spacing, .25rem) * 6);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-platform-explorer__docs-table-head{display:grid;grid-template-columns:46% minmax(0,1fr) minmax(0,1fr);margin-inline:calc(var(--spacing, .25rem) * 6);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));background-color:rgba(var(--ax-sys-color-lighter-surface));text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-table-head{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-table-head>*{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}.axp-platform-explorer__docs-chip{display:inline-flex;align-items:center;gap:var(--spacing, .25rem);border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface));border:1px solid rgb(var(--ax-sys-color-border-warning-lightest-surface))}.axp-platform-explorer__docs-chip--field{margin-top:calc(var(--spacing, .25rem) * 1.5)}.axp-platform-explorer__docs-list{min-height:0px;min-width:0px;overflow:auto;padding-inline:calc(var(--spacing, .25rem) * 6);padding-top:0;padding-bottom:calc(var(--spacing, .25rem) * 5);scrollbar-gutter:stable}.axp-platform-explorer__docs-list--padded{padding-top:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-toolbar{margin-bottom:calc(var(--spacing, .25rem) * 5);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-platform-explorer__docs-heading{margin:0;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-platform-explorer__docs-count{margin:0;margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-count{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-search{width:calc(var(--spacing, .25rem) * 52);max-width:100%}.axp-platform-explorer__docs-empty,.axp-platform-explorer__docs-footnote{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-empty,.axp-platform-explorer__docs-footnote{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-empty{padding-block:calc(var(--spacing, .25rem) * 8);text-align:center}.axp-platform-explorer__docs-footnote{margin:0;padding-top:calc(var(--spacing, .25rem) * 4)}.axp-platform-explorer__docs-side{width:calc(var(--spacing, .25rem) * 80);border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface))}.axp-platform-explorer__docs-detail{display:flex;height:100%;min-width:0px;flex-direction:column;overflow:auto;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-eyebrow{margin-bottom:calc(var(--spacing, .25rem) * 2.5);font-size:11px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-widest, .1em);letter-spacing:var(--tracking-widest, .1em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-eyebrow{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-detail-title{margin:0;margin-bottom:var(--spacing, .25rem);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.axp-platform-explorer__docs-key{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__docs-detail-block{margin-top:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-top:calc(var(--spacing, .25rem) * 4)}.axp-platform-explorer__docs-detail-block h3{margin:0;margin-bottom:calc(var(--spacing, .25rem) * 2.5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-platform-explorer__docs-description{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-description{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-dl{margin:0;display:grid;column-gap:calc(var(--spacing, .25rem) * 3);row-gap:calc(var(--spacing, .25rem) * 2.5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));grid-template-columns:minmax(0,1fr) auto}.axp-platform-explorer__docs-dl dt{color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-dl dt{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__docs-dl dd{margin:0;max-width:calc(var(--spacing, .25rem) * 40);text-align:end;overflow-wrap:break-word}.axp-platform-explorer__docs-actions{display:flex;min-height:0px;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);overflow:auto;padding-inline:calc(var(--spacing, .25rem) * 6);padding-block:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-layout{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);padding-inline:0px}.axp-platform-explorer__docs-actions .axp-platform-explorer__docs-layout{margin-top:0}.axp-platform-explorer__table-wrap{overflow-x:auto;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface))}.axp-platform-explorer__table-wrap--fields{overflow:visible;border-radius:0;border-style:var(--tw-border-style);border-width:0px}.axp-platform-explorer__table{width:100%;min-width:36rem;border-collapse:collapse;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-platform-explorer__table--fields{min-width:0px;table-layout:fixed}.axp-platform-explorer__table--fields th:first-child{width:46%}.axp-platform-explorer__table th{background-color:rgba(var(--ax-sys-color-lighter-surface));text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-text-default));border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__table th{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__table--fields thead.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.axp-platform-explorer__table td{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 4);vertical-align:middle;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__table--fields tbody tr{cursor:pointer}.axp-platform-explorer__table-row--alt td{background-color:rgba(var(--ax-sys-color-lighter-surface))}.axp-platform-explorer__table-row:hover td,.axp-platform-explorer__table-row--selected td{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axp-platform-explorer__table-row--selected td:first-child{box-shadow:inset 3px 0 0 var(--ax-color-primary, currentColor)}:dir(rtl) .axp-platform-explorer__table-row--selected td:first-child{box-shadow:inset -3px 0 0 var(--ax-color-primary, currentColor)}.axp-platform-explorer__table tbody tr:last-child td{border-bottom-style:var(--tw-border-style);border-bottom-width:0px}.axp-platform-explorer__table-detail td{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-platform-explorer__docs-dl--json{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.axp-platform-explorer__docs-dl--json dd{max-width:none}.axp-platform-explorer__docs-dl--json dt code,.axp-platform-explorer__docs-dl--json dd code{background-color:transparent;padding:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));word-break:break-all}.axp-platform-explorer__field-button{margin:0;display:inline-flex;appearance:none;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;text-align:start;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-platform-explorer__field-button code{background-color:transparent;padding:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-platform-explorer__table-row--selected .axp-platform-explorer__field-button{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__field-button:hover{text-decoration:underline;text-underline-offset:3px}.axp-platform-explorer__field-title{margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__field-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__type-chip{display:inline-block;border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__unknown{color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__unknown{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__yes{display:inline-flex;align-items:center;gap:var(--spacing, .25rem);color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__yes i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__prop-toggle,.axp-platform-explorer__prop-toggle-spacer{display:inline-flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);flex-shrink:0;align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem)}.axp-platform-explorer__prop-toggle{cursor:pointer;appearance:none;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__prop-toggle{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__prop-toggle:hover{background-color:rgba(var(--ax-sys-color-lighter-surface));color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__prop-toggle i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-platform-explorer__prop-toggle.is-open i{rotate:90deg}.axp-platform-explorer__prop-details{margin-inline-start:calc(var(--spacing, .25rem) * 9);display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding:calc(var(--spacing, .25rem) * 4)}.axp-platform-explorer__prop-flags{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-flag{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__prop-pairs{margin:0;display:grid;column-gap:calc(var(--spacing, .25rem) * 6);row-gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:minmax(7rem,11rem) minmax(0,1fr)}.axp-platform-explorer__prop-pairs dt{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__prop-pairs dt{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__prop-pairs dd{margin:0;min-width:0px}.axp-platform-explorer__prop-pairs code,.axp-platform-explorer__prop-card code,.axp-platform-explorer__prop-trigger code{border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));word-break:break-all}.axp-platform-explorer__prop-section{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-section-title{margin:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__prop-section-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__prop-stack{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-card{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}.axp-platform-explorer__prop-trigger{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__prop-json{margin:0;max-height:calc(var(--spacing, .25rem) * 48);overflow:auto;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding:calc(var(--spacing, .25rem) * 3);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.axp-platform-explorer__table--actions{min-width:36rem}.axp-platform-explorer__priority{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__priority{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__priority.is-primary{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-surface))}@media(max-width:760px){.axp-platform-explorer__docs-side{width:calc(var(--spacing, .25rem) * 72)}.axp-platform-explorer__docs-plugins,.axp-platform-explorer__docs-list,.axp-platform-explorer__docs-actions{padding-inline:calc(var(--spacing, .25rem) * 5)}.axp-platform-explorer__docs-table-head{margin-inline:calc(var(--spacing, .25rem) * 5)}}@media(max-width:440px){.axp-platform-explorer__docs-toolbar{display:block}.axp-platform-explorer__docs-search{margin-top:calc(var(--spacing, .25rem) * 3);width:100%}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-duration: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { payload: [{ type: i0.Input, args: [{ isSignal: true, alias: "payload", required: false }] }] } });
 
-//#region ----   Imports   ----
 //#endregion
-class AXPlatformExplorerPermissionsListDetailComponent {
+//#region ----- Property rows -----
+function asRecord(value) {
+    if (!value || typeof value !== 'object' || Array.isArray(value)) {
+        return null;
+    }
+    return value;
+}
+function asText(value) {
+    return typeof value === 'string' ? value.trim() : '';
+}
+function hasRequired(def) {
+    if (def['required'] === true) {
+        return true;
+    }
+    const validations = def['validations'];
+    if (!Array.isArray(validations)) {
+        return false;
+    }
+    return validations.some((rule) => asRecord(rule)?.['rule'] === 'required');
+}
+function dataTypeOf(def) {
+    const dataType = def['dataType'];
+    if (typeof dataType === 'string' && dataType.trim()) {
+        return dataType.trim();
+    }
+    const iface = asRecord(def['interface']);
+    const name = iface?.['name'];
+    if (typeof name === 'string' && name.trim()) {
+        return name.trim();
+    }
+    return undefined;
+}
+function joinNotes(def, extra, omitCondition = false) {
+    const parts = [
+        ...extra,
+        omitCondition ? '' : asText(def['condition']),
+        asText(def['notes']),
+    ].filter(Boolean);
+    return parts.length ? parts.join(' · ') : undefined;
+}
+function toIoRows(defs) {
+    if (!Array.isArray(defs)) {
+        return [];
+    }
+    const rows = [];
+    const seen = new Set();
+    for (const item of defs) {
+        const def = asRecord(item);
+        if (!def) {
+            continue;
+        }
+        const name = asText(def['name']);
+        if (!name || seen.has(name)) {
+            continue;
+        }
+        seen.add(name);
+        const title = asText(def['title']) || undefined;
+        const dataType = dataTypeOf(def);
+        const note = joinNotes(def, []);
+        rows.push({
+            name,
+            ...(title ? { title } : {}),
+            ...(dataType ? { dataType } : {}),
+            required: hasRequired(def),
+            ...(note ? { note } : {}),
+        });
+    }
+    return rows;
+}
+function capabilityProperties(section) {
+    const row = asRecord(section);
+    if (!row || row['enabled'] !== true) {
+        return [];
+    }
+    return toIoRows(row['definition']);
+}
+function queryOutputRows(query) {
+    const columns = toIoRows(query['columns']);
+    if (columns.length) {
+        return columns;
+    }
+    const valueType = asText(query['valueType']);
+    if (valueType) {
+        return [{ name: 'value', dataType: valueType, required: false }];
+    }
+    return [];
+}
+function queryInputRows(query) {
+    const args = capabilityProperties(query['args']);
+    const filter = capabilityProperties(query['filter']);
+    if (!args.length) {
+        return filter;
+    }
+    if (!filter.length) {
+        return args;
+    }
+    const seen = new Set(args.map((row) => row.name));
+    return [...args, ...filter.filter((row) => !seen.has(row.name))];
+}
+function emptyTables(showOutput) {
+    return {
+        input: [],
+        output: [],
+        showOutput,
+        contributions: [],
+        extensionKeys: [],
+    };
+}
+//#endregion
+//#region ----- Plugin contributions -----
+function parseJsonObject(value) {
+    if (typeof value === 'string') {
+        const trimmed = value.trim();
+        if (!trimmed) {
+            return null;
+        }
+        try {
+            return asRecord(JSON.parse(trimmed));
+        }
+        catch {
+            return null;
+        }
+    }
+    return asRecord(value);
+}
+function namedRows(list, nameKeys, extraKind) {
+    if (!Array.isArray(list)) {
+        return [];
+    }
+    const rows = [];
+    for (const item of list) {
+        const def = asRecord(item);
+        if (!def) {
+            continue;
+        }
+        let name = '';
+        for (const key of nameKeys) {
+            name = asText(def[key]);
+            if (name) {
+                break;
+            }
+        }
+        if (!name) {
+            continue;
+        }
+        const title = asText(def['title']) || undefined;
+        const fromOption = asText(def['nameFromOption'] || def['idFromOption']);
+        const extra = extraKind === 'scope'
+            ? asText(def['scope']) || undefined
+            : extraKind === 'condition'
+                ? asText(def['condition']) || undefined
+                : undefined;
+        const note = joinNotes(def, fromOption ? [`options.${fromOption}`] : [], extraKind === 'condition');
+        const dataType = dataTypeOf(def);
+        rows.push({
+            name,
+            ...(title ? { title } : {}),
+            ...(dataType ? { dataType } : {}),
+            required: hasRequired(def),
+            ...(extra && extraKind ? { extra, extraKind } : {}),
+            ...(note ? { note } : {}),
+        });
+    }
+    return rows;
+}
+function contributionSections(json) {
+    const parsed = parseJsonObject(json);
+    if (!parsed) {
+        return { contributions: [], extensionKeys: [] };
+    }
+    const contributions = [];
+    const add = (kind, rows, extraKey) => {
+        if (!rows.length) {
+            return;
+        }
+        contributions.push({ kind, rows, ...(extraKey ? { extraKey } : {}) });
+    };
+    add('properties', namedRows(parsed['properties'], ['name']));
+    add('columns', namedRows(parsed['columns'], ['name'], 'condition'), 'condition');
+    add('actions', namedRows(parsed['actions'], ['name'], 'scope'), 'scope');
+    add('groups', namedRows(parsed['groups'], ['id', 'name']));
+    add('pages', namedRows(parsed['pages'], ['name'], 'condition'), 'condition');
+    add('related-entities', namedRows(parsed['relatedEntities'], ['entity', 'name']));
+    const extensionKeys = Array.isArray(parsed['extensionKeys'])
+        ? parsed['extensionKeys'].filter((key) => typeof key === 'string' && key.trim().length > 0)
+        : [];
+    return { contributions, extensionKeys };
+}
+//#endregion
+//#region ----- Catalog I/O -----
+function catalogIoFromDetail(kind, detail) {
+    if (!detail) {
+        return null;
+    }
+    if (kind === 'command' && detail.command) {
+        return {
+            ...emptyTables(true),
+            input: toIoRows(detail.command.inputOptionDefinitions),
+            output: toIoRows(detail.command.outputOptionDefinitions),
+        };
+    }
+    if (kind === 'query' && detail.query) {
+        const query = detail.query;
+        return {
+            ...emptyTables(true),
+            input: queryInputRows(query),
+            output: queryOutputRows(query),
+        };
+    }
+    if (kind === 'widget' && detail.widget) {
+        return {
+            ...emptyTables(true),
+            input: toIoRows(detail.widget.inputOptionDefinitions),
+            output: toIoRows(detail.widget.outputOptionDefinitions),
+        };
+    }
+    if (kind === 'plugin' && detail.plugin) {
+        const contributed = contributionSections(detail.plugin.contributionsJson);
+        return {
+            ...emptyTables(false),
+            input: toIoRows(detail.plugin.optionDefinitions),
+            contributions: contributed.contributions,
+            extensionKeys: contributed.extensionKeys,
+        };
+    }
+    return null;
+}
+function stringList(value) {
+    if (!Array.isArray(value)) {
+        return [];
+    }
+    const items = [];
+    const seen = new Set();
+    for (const item of value) {
+        const text = asText(item);
+        if (!text || seen.has(text)) {
+            continue;
+        }
+        seen.add(text);
+        items.push(text);
+    }
+    return items;
+}
+function categoryLabels(value) {
+    if (!Array.isArray(value)) {
+        return [];
+    }
+    const items = [];
+    const seen = new Set();
+    for (const item of value) {
+        const text = asText(item) || asText(asRecord(item)?.['title']) || asText(asRecord(item)?.['name']);
+        if (!text || seen.has(text)) {
+            continue;
+        }
+        seen.add(text);
+        items.push(text);
+    }
+    return items;
+}
+//#endregion
+
+//#region ----- Imports -----
+//#endregion
+//#region ----- Component -----
+class AXPlatformExplorerCatalogDetailComponent {
+    //#endregion
     constructor() {
-        this.moduleName = input.required(/* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "moduleName" }] : /* istanbul ignore next */ []));
+        this.kind = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "kind" }] : /* istanbul ignore next */ []));
+        this.item = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "item" }] : /* istanbul ignore next */ []));
+        //#region ----- Services & Dependencies -----
         this.dataService = inject(PlatformExplorerDataService);
-        this.dataSource = new AXDataSource({
-            key: 'name',
-            pageSize: 20,
-            load: async (e) => {
-                const name = this.moduleName();
-                if (!name)
-                    return { items: [], total: 0 };
-                const list = await this.dataService.getPermissionsForModule(name);
-                const skip = e?.skip ?? 0;
-                const take = e?.take ?? 20;
-                const items = list.slice(skip, skip + take);
-                return { items, total: list.length };
-            },
-        });
+        //#endregion
+        //#region ----- State Signals -----
+        this.detail = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "detail" }] : /* istanbul ignore next */ []));
+        this.loading = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+        this.loadError = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "loadError" }] : /* istanbul ignore next */ []));
+        //#endregion
+        //#region ----- Computed Properties -----
+        this.ioTables = computed(() => catalogIoFromDetail(this.kind(), this.detail()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "ioTables" }] : /* istanbul ignore next */ []));
         effect(() => {
-            this.moduleName();
-            this.dataSource.refresh();
+            const kind = this.kind();
+            const item = this.item();
+            void this.load(kind, item?.name);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerPermissionsListDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerPermissionsListDetailComponent, isStandalone: true, selector: "axp-platform-explorer-permissions-list-detail", inputs: { moduleName: { classPropertyName: "moduleName", publicName: "moduleName", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: `
-    <div class="flex flex-1 min-h-0 pt-0 overflow-auto">
-      <ax-data-table
-        class="flex-1 border border-lightest rounded-md overflow-hidden"
-        [paging]="true"
-        [allowReordering]="true"
-        [dataSource]="dataSource"
-      >
-        <ax-text-column [dataField]="'name'"  [caption]="'@platform-dev-tools:module.terms.name' | translate | async" [width]="'420px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column [dataField]="'title'" [caption]="'@platform-dev-tools:module.terms.title' | translate | async" [cellTemplate]="titleTpl" [width]="'260px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column [dataField]="'description'" [caption]="'@platform-dev-tools:module.terms.description' | translate | async" [cellTemplate]="descTpl" [width]="'380px'" [allowResizing]="true"></ax-text-column>
-      </ax-data-table>
-    </div>
-    <ng-template #titleTpl let-item>
-      {{  $safeNavigationMigration(item.data?.title) | translate | async  }}</ng-template>
-    <ng-template #descTpl let-item>
-       @if (item.data?.description) { {{ item.data.description | translate | async }} } @else { – }
-    </ng-template>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1$1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i1$1.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "hasTitle", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "translate", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    record() {
+        const detail = this.detail();
+        if (!detail) {
+            return null;
+        }
+        return (detail.command ?? detail.query ?? detail.plugin ?? detail.widget ?? null);
+    }
+    displayTitle(record) {
+        return String(record['catalogTitle'] ?? record['title'] ?? record['name'] ?? '');
+    }
+    //#region ----- Helpers -----
+    asText(value) {
+        return typeof value === 'string' ? value : '';
+    }
+    asStringList(value) {
+        return stringList(value);
+    }
+    asCategoryLabels(value) {
+        return categoryLabels(value);
+    }
+    isNumber(value) {
+        return typeof value === 'number' && Number.isFinite(value);
+    }
+    //#endregion
+    //#region ----- Data Loading -----
+    async load(kind, name) {
+        if (!name) {
+            this.detail.set(null);
+            this.loading.set(false);
+            this.loadError.set(false);
+            return;
+        }
+        this.loading.set(true);
+        this.loadError.set(false);
+        this.detail.set(null);
+        try {
+            const detail = await this.dataService.getCatalogItem(kind, name);
+            if (this.item()?.name === name && this.kind() === kind) {
+                this.detail.set(detail);
+            }
+        }
+        catch {
+            if (this.item()?.name === name && this.kind() === kind) {
+                this.loadError.set(true);
+            }
+        }
+        finally {
+            if (this.item()?.name === name && this.kind() === kind) {
+                this.loading.set(false);
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerCatalogDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerCatalogDetailComponent, isStandalone: true, selector: "axp-platform-explorer-catalog-detail", inputs: { kind: { classPropertyName: "kind", publicName: "kind", isSignal: true, isRequired: true, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: "<div class=\"flex flex-col flex-1 min-h-0\">\n  <!-- ----- Loading catalog row ----- -->\n  @if (loading()) {\n    <div class=\"flex flex-1 items-center justify-center p-6\">\n      <ax-loading></ax-loading>\n    </div>\n  }\n  <!-- ----- Catalog query failed ----- -->\n  @else if (loadError()) {\n    <axp-state-message\n      icon=\"fa-light fa-triangle-exclamation\"\n      [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n      [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n    />\n  }\n  <!-- ----- Catalog row fields ----- -->\n  @else if (record(); as row) {\n    <section class=\"flex flex-col gap-6 p-4 overflow-auto\">\n      <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-2 m-0\">\n        <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n        <dd class=\"m-0\"><code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ row['name'] }}</code></dd>\n        <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.title' | translate | async }}</dt>\n        <dd class=\"m-0\">{{ displayTitle(row) | translate | async }}</dd>\n        @if (row['description']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.description' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ asText(row['description']) | translate | async }}</dd>\n        }\n        @if (row['executionMode']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.execution-mode' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['executionMode'] }}</dd>\n        }\n        @if (row['sourceModule']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.source-module' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['sourceModule'] }}</dd>\n        }\n        @if (row['type']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.type' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['type'] }}</dd>\n        }\n        @if (row['dataType']) {\n          <dt class=\"font-semibold text-muted\">\n            {{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}\n          </dt>\n          <dd class=\"m-0\">\n            <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ row['dataType'] }}</span>\n          </dd>\n        }\n        @if (asText(row['icon']); as icon) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.icon' | translate | async }}</dt>\n          <dd class=\"m-0 flex items-center gap-2\">\n            <i [ngClass]=\"icon\" aria-hidden=\"true\"></i>\n            <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\" dir=\"ltr\">{{ icon }}</code>\n          </dd>\n        }\n        @if (isNumber(row['order'])) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.order' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['order'] }}</dd>\n        }\n        @if (row['defaultFilterWidgetName']) {\n          <dt class=\"font-semibold text-muted\">\n            {{ '@platform-dev-tools:module.terms.default-filter-widget' | translate | async }}\n          </dt>\n          <dd class=\"m-0\">\n            <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\" dir=\"ltr\">{{ row['defaultFilterWidgetName'] }}</code>\n          </dd>\n        }\n        @if (asStringList(row['groups']); as groups) {\n          <!--->\n          <!-- ----- Widget group tags ----- -->\n          @if (groups.length) {\n            <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.groups' | translate | async }}</dt>\n            <dd class=\"m-0\">\n              <div class=\"axp-platform-explorer__catalog-chips\">\n                @for (group of groups; track group) {\n                  <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ group }}</span>\n                }\n              </div>\n            </dd>\n          }\n        }\n        @if (asCategoryLabels(row['categories']); as categories) {\n          <!--->\n          <!-- ----- Catalog categories ----- -->\n          @if (categories.length) {\n            <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.categories' | translate | async }}</dt>\n            <dd class=\"m-0\">\n              <div class=\"axp-platform-explorer__catalog-chips\">\n                @for (category of categories; track category) {\n                  <span class=\"axp-platform-explorer__type-chip\">{{ category | translate | async }}</span>\n                }\n              </div>\n            </dd>\n          }\n        }\n      </dl>\n\n      <!--->\n      <!-- ----- Input, output, and plugin contribution tables ----- -->\n      @if (ioTables(); as io) {\n        <div class=\"axp-platform-explorer__catalog-io\">\n          <section>\n            <h2>{{ '@platform-dev-tools:module.terms.input' | translate | async }}</h2>\n            <!--->\n            <!-- ----- Empty input list ----- -->\n            @if (io.input.length === 0) {\n              <p class=\"axp-platform-explorer__docs-empty axp-platform-explorer__catalog-io-empty\">\n                {{ '@platform-dev-tools:module.messages.no-input' | translate | async }}\n              </p>\n            }\n            <!-- ----- Input rows ----- -->\n            @else {\n              <ng-container *ngTemplateOutlet=\"schemaTable; context: { rows: io.input }\" />\n            }\n          </section>\n          <!--->\n          <!-- ----- Output contract for commands, queries, and widgets ----- -->\n          @if (io.showOutput) {\n            <section>\n              <h2>{{ '@platform-dev-tools:module.terms.output' | translate | async }}</h2>\n              <!--->\n              <!-- ----- Empty output list ----- -->\n              @if (io.output.length === 0) {\n                <p class=\"axp-platform-explorer__docs-empty axp-platform-explorer__catalog-io-empty\">\n                  {{ '@platform-dev-tools:module.messages.no-output' | translate | async }}\n                </p>\n              }\n              <!-- ----- Output rows ----- -->\n              @else {\n                <ng-container *ngTemplateOutlet=\"schemaTable; context: { rows: io.output }\" />\n              }\n            </section>\n          }\n          <!--->\n          <!-- ----- Plugin host contributions from the catalog definition ----- -->\n          @if (io.contributions.length) {\n            @for (section of io.contributions; track section.kind) {\n              <section>\n                <h2>{{ ('@platform-dev-tools:module.contributions.' + section.kind) | translate | async }}</h2>\n                <!--->\n                <!-- ----- Contributed properties use the schema table ----- -->\n                @if (section.kind === 'properties') {\n                  <ng-container *ngTemplateOutlet=\"schemaTable; context: { rows: section.rows }\" />\n                }\n                <!-- ----- Columns, actions, groups, pages, related entities ----- -->\n                @else {\n                  <ng-container\n                    *ngTemplateOutlet=\"itemTable; context: { rows: section.rows, extraKey: section.extraKey }\"\n                  />\n                }\n              </section>\n            }\n          }\n          <!-- ----- Plugin declared no host contributions ----- -->\n          @else if (!io.showOutput) {\n            <p class=\"axp-platform-explorer__docs-empty axp-platform-explorer__catalog-io-empty\">\n              {{ '@platform-dev-tools:module.messages.no-contributions' | translate | async }}\n            </p>\n          }\n          <!--->\n          <!-- ----- Middleware extension keys ----- -->\n          @if (io.extensionKeys.length) {\n            <section>\n              <h2>{{ '@platform-dev-tools:module.contributions.extension-keys' | translate | async }}</h2>\n              <div class=\"axp-platform-explorer__catalog-chips\">\n                @for (key of io.extensionKeys; track key) {\n                  <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\" dir=\"ltr\">{{ key }}</code>\n                }\n              </div>\n            </section>\n          }\n        </div>\n      }\n    </section>\n  }\n</div>\n\n<ng-template #schemaTable let-rows=\"rows\">\n  <div class=\"axp-platform-explorer__table-wrap\">\n    <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n      <thead>\n        <tr>\n          <th>{{ '@platform-dev-tools:module.terms.field' | translate | async }}</th>\n          <th>{{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}</th>\n          <th>{{ '@platform-dev-tools:module.terms.required' | translate | async }}</th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (row of rows; track row.name) {\n          <tr>\n            <td>\n              <ng-container *ngTemplateOutlet=\"nameCell; context: { row: row }\" />\n            </td>\n            <td>\n              <!--->\n              <!-- ----- Stored data type chip ----- -->\n              @if (row.dataType) {\n                <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ row.dataType }}</span>\n              }\n              <!-- ----- Missing data type ----- -->\n              @else {\n                <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n              }\n            </td>\n            <td>\n              <ng-container *ngTemplateOutlet=\"boolCell; context: { value: row.required }\" />\n            </td>\n          </tr>\n        }\n      </tbody>\n    </table>\n  </div>\n</ng-template>\n\n<ng-template #itemTable let-rows=\"rows\" let-extraKey=\"extraKey\">\n  <div class=\"axp-platform-explorer__table-wrap\">\n    <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n      <thead>\n        <tr>\n          <th>{{ '@platform-dev-tools:module.terms.field' | translate | async }}</th>\n          <!--->\n          <!-- ----- Extra column for scope or condition ----- -->\n          @if (extraKey) {\n            <th>{{ ('@platform-dev-tools:module.contributions.' + extraKey) | translate | async }}</th>\n          }\n        </tr>\n      </thead>\n      <tbody>\n        @for (row of rows; track row.name) {\n          <tr>\n            <td>\n              <ng-container *ngTemplateOutlet=\"nameCell; context: { row: row }\" />\n            </td>\n            <!--->\n            <!-- ----- Extra cell when the section declares one ----- -->\n            @if (extraKey) {\n              <td>\n                <!--->\n                <!-- ----- Action scope ----- -->\n                @if (row.extraKind === 'scope' && row.extra) {\n                  {{ ('@platform-dev-tools:module.contributions.scopes.' + row.extra) | translate | async }}\n                }\n                <!-- ----- Condition expression ----- -->\n                @else if (row.extra) {\n                  <code dir=\"ltr\">{{ row.extra }}</code>\n                }\n                <!-- ----- Missing extra ----- -->\n                @else {\n                  <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n                }\n              </td>\n            }\n          </tr>\n        }\n      </tbody>\n    </table>\n  </div>\n</ng-template>\n\n<ng-template #nameCell let-row=\"row\">\n  <code dir=\"ltr\">{{ row.name }}</code>\n  <!--->\n  <!-- ----- Translated title under the field name ----- -->\n  @if (row.title) {\n    <div class=\"axp-platform-explorer__field-title\">\n      {{ row.title | translate | async }}\n    </div>\n  }\n  <!--->\n  <!-- ----- Definition notes and option-sourced names ----- -->\n  @if (row.note) {\n    <div class=\"axp-platform-explorer__field-note\" dir=\"ltr\">{{ row.note }}</div>\n  }\n</ng-template>\n\n<ng-template #boolCell let-value=\"value\">\n  <!-- ----- Affirmative flag ----- -->\n  @if (value === true) {\n    <span class=\"axp-platform-explorer__yes\">\n      <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n      {{ '@platform-dev-tools:module.property-details.yes' | translate | async }}\n    </span>\n  }\n  <!-- ----- Negative flag ----- -->\n  @else {\n    {{ '@platform-dev-tools:module.property-details.no' | translate | async }}\n  }\n</ng-template>\n", styles: ["@layer properties;.axp-platform-explorer__catalog-io{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 6)}.axp-platform-explorer__catalog-io h2{margin:0;margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-platform-explorer__catalog-io-empty{padding-block:calc(var(--spacing, .25rem) * 4);text-align:start}.axp-platform-explorer__table-wrap{overflow-x:auto;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface))}.axp-platform-explorer__table{width:100%;min-width:36rem;border-collapse:collapse;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-platform-explorer__table--fields{min-width:0px;table-layout:fixed}.axp-platform-explorer__table--fields th:first-child{width:46%}.axp-platform-explorer__table th{background-color:rgba(var(--ax-sys-color-lighter-surface));text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-text-default));border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__table th{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__table td{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 4);vertical-align:middle;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__table tbody tr:last-child td{border-bottom-style:var(--tw-border-style);border-bottom-width:0px}.axp-platform-explorer__field-title{margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__field-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__field-note{margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));word-break:break-all;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__field-note{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__catalog-chips{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-platform-explorer__type-chip{display:inline-block;border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__unknown{color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__unknown{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__yes{display:inline-flex;align-items:center;gap:var(--spacing, .25rem);color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__yes i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__docs-empty{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i2$1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "pipe", type: i1.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: "22.0.8", ngImport: i0, type: AXPlatformExplorerCatalogDetailComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'axp-platform-explorer-catalog-detail', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'flex flex-col flex-1 min-h-0' }, imports: [CommonModule, AXTranslationModule, AXLoadingModule, AXPStateMessageComponent], template: "<div class=\"flex flex-col flex-1 min-h-0\">\n  <!-- ----- Loading catalog row ----- -->\n  @if (loading()) {\n    <div class=\"flex flex-1 items-center justify-center p-6\">\n      <ax-loading></ax-loading>\n    </div>\n  }\n  <!-- ----- Catalog query failed ----- -->\n  @else if (loadError()) {\n    <axp-state-message\n      icon=\"fa-light fa-triangle-exclamation\"\n      [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n      [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n    />\n  }\n  <!-- ----- Catalog row fields ----- -->\n  @else if (record(); as row) {\n    <section class=\"flex flex-col gap-6 p-4 overflow-auto\">\n      <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-2 m-0\">\n        <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.name' | translate | async }}</dt>\n        <dd class=\"m-0\"><code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\">{{ row['name'] }}</code></dd>\n        <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.title' | translate | async }}</dt>\n        <dd class=\"m-0\">{{ displayTitle(row) | translate | async }}</dd>\n        @if (row['description']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.description' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ asText(row['description']) | translate | async }}</dd>\n        }\n        @if (row['executionMode']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.execution-mode' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['executionMode'] }}</dd>\n        }\n        @if (row['sourceModule']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.source-module' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['sourceModule'] }}</dd>\n        }\n        @if (row['type']) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.type' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['type'] }}</dd>\n        }\n        @if (row['dataType']) {\n          <dt class=\"font-semibold text-muted\">\n            {{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}\n          </dt>\n          <dd class=\"m-0\">\n            <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ row['dataType'] }}</span>\n          </dd>\n        }\n        @if (asText(row['icon']); as icon) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.icon' | translate | async }}</dt>\n          <dd class=\"m-0 flex items-center gap-2\">\n            <i [ngClass]=\"icon\" aria-hidden=\"true\"></i>\n            <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\" dir=\"ltr\">{{ icon }}</code>\n          </dd>\n        }\n        @if (isNumber(row['order'])) {\n          <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.order' | translate | async }}</dt>\n          <dd class=\"m-0\">{{ row['order'] }}</dd>\n        }\n        @if (row['defaultFilterWidgetName']) {\n          <dt class=\"font-semibold text-muted\">\n            {{ '@platform-dev-tools:module.terms.default-filter-widget' | translate | async }}\n          </dt>\n          <dd class=\"m-0\">\n            <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\" dir=\"ltr\">{{ row['defaultFilterWidgetName'] }}</code>\n          </dd>\n        }\n        @if (asStringList(row['groups']); as groups) {\n          <!--->\n          <!-- ----- Widget group tags ----- -->\n          @if (groups.length) {\n            <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.groups' | translate | async }}</dt>\n            <dd class=\"m-0\">\n              <div class=\"axp-platform-explorer__catalog-chips\">\n                @for (group of groups; track group) {\n                  <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ group }}</span>\n                }\n              </div>\n            </dd>\n          }\n        }\n        @if (asCategoryLabels(row['categories']); as categories) {\n          <!--->\n          <!-- ----- Catalog categories ----- -->\n          @if (categories.length) {\n            <dt class=\"font-semibold text-muted\">{{ '@platform-dev-tools:module.terms.categories' | translate | async }}</dt>\n            <dd class=\"m-0\">\n              <div class=\"axp-platform-explorer__catalog-chips\">\n                @for (category of categories; track category) {\n                  <span class=\"axp-platform-explorer__type-chip\">{{ category | translate | async }}</span>\n                }\n              </div>\n            </dd>\n          }\n        }\n      </dl>\n\n      <!--->\n      <!-- ----- Input, output, and plugin contribution tables ----- -->\n      @if (ioTables(); as io) {\n        <div class=\"axp-platform-explorer__catalog-io\">\n          <section>\n            <h2>{{ '@platform-dev-tools:module.terms.input' | translate | async }}</h2>\n            <!--->\n            <!-- ----- Empty input list ----- -->\n            @if (io.input.length === 0) {\n              <p class=\"axp-platform-explorer__docs-empty axp-platform-explorer__catalog-io-empty\">\n                {{ '@platform-dev-tools:module.messages.no-input' | translate | async }}\n              </p>\n            }\n            <!-- ----- Input rows ----- -->\n            @else {\n              <ng-container *ngTemplateOutlet=\"schemaTable; context: { rows: io.input }\" />\n            }\n          </section>\n          <!--->\n          <!-- ----- Output contract for commands, queries, and widgets ----- -->\n          @if (io.showOutput) {\n            <section>\n              <h2>{{ '@platform-dev-tools:module.terms.output' | translate | async }}</h2>\n              <!--->\n              <!-- ----- Empty output list ----- -->\n              @if (io.output.length === 0) {\n                <p class=\"axp-platform-explorer__docs-empty axp-platform-explorer__catalog-io-empty\">\n                  {{ '@platform-dev-tools:module.messages.no-output' | translate | async }}\n                </p>\n              }\n              <!-- ----- Output rows ----- -->\n              @else {\n                <ng-container *ngTemplateOutlet=\"schemaTable; context: { rows: io.output }\" />\n              }\n            </section>\n          }\n          <!--->\n          <!-- ----- Plugin host contributions from the catalog definition ----- -->\n          @if (io.contributions.length) {\n            @for (section of io.contributions; track section.kind) {\n              <section>\n                <h2>{{ ('@platform-dev-tools:module.contributions.' + section.kind) | translate | async }}</h2>\n                <!--->\n                <!-- ----- Contributed properties use the schema table ----- -->\n                @if (section.kind === 'properties') {\n                  <ng-container *ngTemplateOutlet=\"schemaTable; context: { rows: section.rows }\" />\n                }\n                <!-- ----- Columns, actions, groups, pages, related entities ----- -->\n                @else {\n                  <ng-container\n                    *ngTemplateOutlet=\"itemTable; context: { rows: section.rows, extraKey: section.extraKey }\"\n                  />\n                }\n              </section>\n            }\n          }\n          <!-- ----- Plugin declared no host contributions ----- -->\n          @else if (!io.showOutput) {\n            <p class=\"axp-platform-explorer__docs-empty axp-platform-explorer__catalog-io-empty\">\n              {{ '@platform-dev-tools:module.messages.no-contributions' | translate | async }}\n            </p>\n          }\n          <!--->\n          <!-- ----- Middleware extension keys ----- -->\n          @if (io.extensionKeys.length) {\n            <section>\n              <h2>{{ '@platform-dev-tools:module.contributions.extension-keys' | translate | async }}</h2>\n              <div class=\"axp-platform-explorer__catalog-chips\">\n                @for (key of io.extensionKeys; track key) {\n                  <code class=\"text-xs bg-lighter px-1.5 py-0.5 rounded\" dir=\"ltr\">{{ key }}</code>\n                }\n              </div>\n            </section>\n          }\n        </div>\n      }\n    </section>\n  }\n</div>\n\n<ng-template #schemaTable let-rows=\"rows\">\n  <div class=\"axp-platform-explorer__table-wrap\">\n    <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n      <thead>\n        <tr>\n          <th>{{ '@platform-dev-tools:module.terms.field' | translate | async }}</th>\n          <th>{{ '@platform-dev-tools:module.property-details.data-type' | translate | async }}</th>\n          <th>{{ '@platform-dev-tools:module.terms.required' | translate | async }}</th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (row of rows; track row.name) {\n          <tr>\n            <td>\n              <ng-container *ngTemplateOutlet=\"nameCell; context: { row: row }\" />\n            </td>\n            <td>\n              <!--->\n              <!-- ----- Stored data type chip ----- -->\n              @if (row.dataType) {\n                <span class=\"axp-platform-explorer__type-chip\" dir=\"ltr\">{{ row.dataType }}</span>\n              }\n              <!-- ----- Missing data type ----- -->\n              @else {\n                <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n              }\n            </td>\n            <td>\n              <ng-container *ngTemplateOutlet=\"boolCell; context: { value: row.required }\" />\n            </td>\n          </tr>\n        }\n      </tbody>\n    </table>\n  </div>\n</ng-template>\n\n<ng-template #itemTable let-rows=\"rows\" let-extraKey=\"extraKey\">\n  <div class=\"axp-platform-explorer__table-wrap\">\n    <table class=\"axp-platform-explorer__table axp-platform-explorer__table--fields\">\n      <thead>\n        <tr>\n          <th>{{ '@platform-dev-tools:module.terms.field' | translate | async }}</th>\n          <!--->\n          <!-- ----- Extra column for scope or condition ----- -->\n          @if (extraKey) {\n            <th>{{ ('@platform-dev-tools:module.contributions.' + extraKey) | translate | async }}</th>\n          }\n        </tr>\n      </thead>\n      <tbody>\n        @for (row of rows; track row.name) {\n          <tr>\n            <td>\n              <ng-container *ngTemplateOutlet=\"nameCell; context: { row: row }\" />\n            </td>\n            <!--->\n            <!-- ----- Extra cell when the section declares one ----- -->\n            @if (extraKey) {\n              <td>\n                <!--->\n                <!-- ----- Action scope ----- -->\n                @if (row.extraKind === 'scope' && row.extra) {\n                  {{ ('@platform-dev-tools:module.contributions.scopes.' + row.extra) | translate | async }}\n                }\n                <!-- ----- Condition expression ----- -->\n                @else if (row.extra) {\n                  <code dir=\"ltr\">{{ row.extra }}</code>\n                }\n                <!-- ----- Missing extra ----- -->\n                @else {\n                  <span class=\"axp-platform-explorer__unknown\">\u2013</span>\n                }\n              </td>\n            }\n          </tr>\n        }\n      </tbody>\n    </table>\n  </div>\n</ng-template>\n\n<ng-template #nameCell let-row=\"row\">\n  <code dir=\"ltr\">{{ row.name }}</code>\n  <!--->\n  <!-- ----- Translated title under the field name ----- -->\n  @if (row.title) {\n    <div class=\"axp-platform-explorer__field-title\">\n      {{ row.title | translate | async }}\n    </div>\n  }\n  <!--->\n  <!-- ----- Definition notes and option-sourced names ----- -->\n  @if (row.note) {\n    <div class=\"axp-platform-explorer__field-note\" dir=\"ltr\">{{ row.note }}</div>\n  }\n</ng-template>\n\n<ng-template #boolCell let-value=\"value\">\n  <!-- ----- Affirmative flag ----- -->\n  @if (value === true) {\n    <span class=\"axp-platform-explorer__yes\">\n      <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n      {{ '@platform-dev-tools:module.property-details.yes' | translate | async }}\n    </span>\n  }\n  <!-- ----- Negative flag ----- -->\n  @else {\n    {{ '@platform-dev-tools:module.property-details.no' | translate | async }}\n  }\n</ng-template>\n", styles: ["@layer properties;.axp-platform-explorer__catalog-io{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 6)}.axp-platform-explorer__catalog-io h2{margin:0;margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-platform-explorer__catalog-io-empty{padding-block:calc(var(--spacing, .25rem) * 4);text-align:start}.axp-platform-explorer__table-wrap{overflow-x:auto;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface))}.axp-platform-explorer__table{width:100%;min-width:36rem;border-collapse:collapse;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-platform-explorer__table--fields{min-width:0px;table-layout:fixed}.axp-platform-explorer__table--fields th:first-child{width:46%}.axp-platform-explorer__table th{background-color:rgba(var(--ax-sys-color-lighter-surface));text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-text-default));border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5)}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__table th{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__table td{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 4);vertical-align:middle;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__table tbody tr:last-child td{border-bottom-style:var(--tw-border-style);border-bottom-width:0px}.axp-platform-explorer__field-title{margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__field-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__field-note{margin-top:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));word-break:break-all;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__field-note{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__catalog-chips{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-platform-explorer__type-chip{display:inline-block;border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lighter-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__unknown{color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__unknown{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__yes{display:inline-flex;align-items:center;gap:var(--spacing, .25rem);color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__yes i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-platform-explorer__docs-empty{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__docs-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+        }], ctorParameters: () => [], propDecorators: { kind: [{ type: i0.Input, args: [{ isSignal: true, alias: "kind", required: true }] }], item: [{ type: i0.Input, args: [{ isSignal: true, alias: "item", required: false }] }] } });
+
+//#region ----- Constants -----
+const EXPLORER_ENTITY_NODE_TYPE = 'explorer-entity';
+/** Crow's-foot / UML multiplicity shown on ERD ports (not i18n). */
+const ERD_CARDINALITY_ONE = '1..1';
+const ERD_CARDINALITY_MANY = '0..*';
+const NODE_W = 280;
+const NODE_HEAD_H = 52;
+/** Room per connector so relation names on parallel edges do not touch. */
+const PORT_SLOT_H = 24;
+const PORT_BAND_PAD = 28;
+const NODE_GAP_Y = 40;
+const EXTERNAL_GAP_X = 160;
+/** Grid spacing for entities that have no relations. */
+const ISOLATED_GAP_X = 48;
+const ISOLATED_GAP_Y = 88;
+const INTERNAL_ORIGIN = { x: 48, y: 48 };
+//#endregion
+//#region ----- Node helpers -----
+function isExplorerEntityNode(node) {
+    return node.type === EXPLORER_ENTITY_NODE_TYPE;
+}
+function explorerEntityData(node) {
+    const data = node.data;
+    return data?.kind === 'entity' ? data : null;
+}
+//#endregion
+//#region ----- Build diagram -----
+function relationName(edge) {
+    const labeled = edge.label?.trim();
+    if (labeled) {
+        return labeled;
+    }
+    const dot = edge.to.lastIndexOf('.');
+    return dot > 0 ? edge.to.slice(dot + 1) : edge.to;
+}
+function sourceCardinality(kind) {
+    return kind === 'lookup' ? ERD_CARDINALITY_MANY : ERD_CARDINALITY_ONE;
+}
+function targetCardinality(kind) {
+    return kind === 'lookup' ? ERD_CARDINALITY_ONE : ERD_CARDINALITY_MANY;
+}
+function outboundPortId(edge) {
+    return `${edge.from}:out:${edge.kind}:${edge.to}:${edge.label ?? ''}`;
+}
+function inboundPortId(edge) {
+    return `${edge.to}:in:${edge.kind}:${edge.from}:${edge.label ?? ''}`;
+}
+function portRatio(index, count) {
+    if (count <= 1) {
+        return 0.5;
+    }
+    return (index + 1) / (count + 1);
+}
+function inboundPorts(incoming) {
+    return incoming.map((edge, index) => ({
+        id: inboundPortId(edge),
+        kind: 'inbound',
+        side: 'left',
+        ratio: portRatio(index, incoming.length),
+        label: targetCardinality(edge.kind),
+        allowMultiple: false,
+        readonly: true,
+    }));
+}
+function outboundPorts(outgoing) {
+    return outgoing.map((edge, index) => ({
+        id: outboundPortId(edge),
+        kind: 'outbound',
+        side: 'right',
+        ratio: portRatio(index, outgoing.length),
+        label: sourceCardinality(edge.kind),
+        readonly: true,
+    }));
+}
+function lookupFieldKeys(edges) {
+    const keys = new Set();
+    for (const edge of edges) {
+        if (edge.kind === 'lookup' && edge.label) {
+            keys.add(`${edge.from}\0${edge.label}`);
+        }
+    }
+    return keys;
+}
+function cardHeight(incoming, outgoing) {
+    const slots = Math.max(incoming, outgoing);
+    return slots <= 1 ? NODE_HEAD_H : Math.max(NODE_HEAD_H, PORT_BAND_PAD + slots * PORT_SLOT_H);
+}
+function toEntityData(item, moduleTitle, skipLookupFields) {
+    return {
+        kind: 'entity',
+        fullName: item.fullName,
+        name: item.name,
+        title: item.title,
+        module: item.module,
+        moduleTitle,
+        external: item.external,
+        icon: item.icon || 'fa-light fa-table',
+        properties: (item.properties ?? []).filter((property) => !skipLookupFields.has(`${item.fullName}\0${property.name}`)),
+    };
+}
+function entityNode(data, outgoing, incoming) {
+    const color = data.external ? 'warning' : 'primary';
+    return {
+        id: data.fullName,
+        type: EXPLORER_ENTITY_NODE_TYPE,
+        title: data.fullName,
+        icon: data.icon,
+        shape: 'rectangle',
+        position: { x: 0, y: 0 },
+        size: { width: NODE_W, height: cardHeight(incoming.length, outgoing.length) },
+        inboundPorts: inboundPorts(incoming),
+        outboundPorts: outboundPorts(outgoing),
+        readonly: true,
+        color,
+        borderColor: color,
+        data: { ...data },
+    };
+}
+function connectors(edges) {
+    return edges.map((edge) => ({
+        id: outboundPortId(edge),
+        sourceNodeId: edge.from,
+        sourcePortId: outboundPortId(edge),
+        targetNodeId: edge.to,
+        targetPortId: inboundPortId(edge),
+        readonly: true,
+        color: (edge.kind === 'related' ? 'success' : 'primary'),
+        borderColor: (edge.kind === 'related' ? 'success' : 'primary'),
+        label: relationName(edge),
+        data: { kind: edge.kind },
+    }));
+}
+function nodesBBox(nodes) {
+    if (nodes.length === 0) {
+        return { minX: INTERNAL_ORIGIN.x, minY: INTERNAL_ORIGIN.y, maxX: INTERNAL_ORIGIN.x, maxY: INTERNAL_ORIGIN.y };
+    }
+    let minX = Number.POSITIVE_INFINITY;
+    let minY = Number.POSITIVE_INFINITY;
+    let maxX = Number.NEGATIVE_INFINITY;
+    let maxY = Number.NEGATIVE_INFINITY;
+    for (const node of nodes) {
+        minX = Math.min(minX, node.position.x);
+        minY = Math.min(minY, node.position.y);
+        maxX = Math.max(maxX, node.position.x + node.size.width);
+        maxY = Math.max(maxY, node.position.y + node.size.height);
+    }
+    return { minX, minY, maxX, maxY };
+}
+function groupEdgesBy(edges, keyOf) {
+    const map = new Map();
+    for (const edge of edges) {
+        const key = keyOf(edge);
+        const list = map.get(key);
+        if (list) {
+            list.push(edge);
+        }
+        else {
+            map.set(key, [edge]);
+        }
+    }
+    for (const list of map.values()) {
+        list.sort((a, b) => relationName(a).localeCompare(relationName(b)) || a.from.localeCompare(b.from));
+    }
+    return map;
+}
+/**
+ * Tiles unrelated entities in rows under the related cluster. A single column
+ * would make the canvas very tall, which forces fit-to-content to a tiny zoom.
+ */
+function tileIsolatedNodes(nodes, startY, availableWidth) {
+    const placed = new Map();
+    const columns = Math.max(1, Math.floor((availableWidth + ISOLATED_GAP_X) / (NODE_W + ISOLATED_GAP_X)));
+    let rowY = startY;
+    let rowHeight = 0;
+    nodes.forEach((node, index) => {
+        const column = index % columns;
+        if (column === 0 && index > 0) {
+            rowY += rowHeight + NODE_GAP_Y;
+            rowHeight = 0;
+        }
+        placed.set(node.id, {
+            ...node,
+            position: { x: INTERNAL_ORIGIN.x + column * (NODE_W + ISOLATED_GAP_X), y: rowY },
+        });
+        rowHeight = Math.max(rowHeight, node.size.height);
+    });
+    return placed;
+}
+/**
+ * Converts the explorer entity graph into a readonly ERD. Related entities are
+ * arranged left to right, external targets cluster on the right with a yellow
+ * header, and unrelated entities tile in a grid underneath. Cards stay
+ * header-sized; the property list is shown/hidden without changing layout.
+ */
+function buildExplorerEntityDiagram(graph, resolveModuleTitle) {
+    if (!graph?.nodes.length) {
+        return null;
+    }
+    const nodeIds = new Set(graph.nodes.map((item) => item.fullName));
+    const validEdges = graph.edges.filter((edge) => nodeIds.has(edge.from) && nodeIds.has(edge.to));
+    const outgoing = groupEdgesBy(validEdges, (edge) => edge.from);
+    const incoming = groupEdgesBy(validEdges, (edge) => edge.to);
+    const skipLookupFields = lookupFieldKeys(validEdges);
+    const relatedIds = new Set(validEdges.flatMap((edge) => [edge.from, edge.to]));
+    const entityNodes = graph.nodes.map((item) => {
+        const data = toEntityData(item, resolveModuleTitle(item.module), skipLookupFields);
+        return entityNode(data, outgoing.get(item.fullName) ?? [], incoming.get(item.fullName) ?? []);
+    });
+    const internalRelatedIds = entityNodes
+        .filter((node) => !explorerEntityData(node)?.external && relatedIds.has(node.id))
+        .map((node) => node.id);
+    const arranged = arrangeWorkflowDiagram({
+        nodes: entityNodes,
+        connectors: connectors(validEdges),
+    }, {
+        nodeIds: internalRelatedIds,
+        origin: INTERNAL_ORIGIN,
+        direction: 'horizontal',
+        horizontalGap: 220,
+        verticalGap: 72,
+        margin: 48,
+        groupDisconnected: true,
+    });
+    const internals = arranged.nodes.filter((node) => !explorerEntityData(node)?.external && relatedIds.has(node.id));
+    const box = nodesBBox(internals);
+    const externals = arranged.nodes
+        .filter((node) => explorerEntityData(node)?.external)
+        .sort((a, b) => {
+        const moduleCmp = (explorerEntityData(a)?.module ?? '').localeCompare(explorerEntityData(b)?.module ?? '');
+        return moduleCmp !== 0 ? moduleCmp : a.title.localeCompare(b.title);
+    });
+    const externalX = box.maxX + EXTERNAL_GAP_X;
+    let externalY = INTERNAL_ORIGIN.y;
+    const positioned = new Map();
+    for (const node of externals) {
+        positioned.set(node.id, {
+            ...node,
+            position: { x: externalX, y: externalY },
+        });
+        externalY += node.size.height + NODE_GAP_Y;
+    }
+    const isolated = arranged.nodes
+        .filter((node) => !explorerEntityData(node)?.external && !relatedIds.has(node.id))
+        .sort((a, b) => a.id.localeCompare(b.id));
+    if (isolated.length) {
+        const clusterBottom = Math.max(box.maxY, externalY - NODE_GAP_Y, INTERNAL_ORIGIN.y);
+        const clusterWidth = Math.max(NODE_W, (externals.length ? externalX + NODE_W : box.maxX) - INTERNAL_ORIGIN.x);
+        const startY = internals.length || externals.length ? clusterBottom + ISOLATED_GAP_Y : INTERNAL_ORIGIN.y;
+        for (const [id, node] of tileIsolatedNodes(isolated, startY, clusterWidth)) {
+            positioned.set(id, node);
+        }
+    }
+    return {
+        nodes: arranged.nodes.map((node) => positioned.get(node.id) ?? node),
+        connectors: arranged.connectors,
+    };
+}
+function connectedNodeIds(model, nodeId) {
+    const ids = new Set([nodeId]);
+    for (const connector of model.connectors) {
+        if (connector.sourceNodeId === nodeId) {
+            ids.add(connector.targetNodeId);
+        }
+        if (connector.targetNodeId === nodeId) {
+            ids.add(connector.sourceNodeId);
+        }
+    }
+    return [...ids];
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerPermissionsListDetailComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'axp-platform-explorer-permissions-list-detail',
-                    standalone: true,
-                    encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule, AXDataTableModule, AXTranslationModule],
-                    host: { class: 'flex flex-col flex-1 min-h-0' },
-                    template: `
-    <div class="flex flex-1 min-h-0 pt-0 overflow-auto">
-      <ax-data-table
-        class="flex-1 border border-lightest rounded-md overflow-hidden"
-        [paging]="true"
-        [allowReordering]="true"
-        [dataSource]="dataSource"
-      >
-        <ax-text-column [dataField]="'name'"  [caption]="'@platform-dev-tools:module.terms.name' | translate | async" [width]="'420px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column [dataField]="'title'" [caption]="'@platform-dev-tools:module.terms.title' | translate | async" [cellTemplate]="titleTpl" [width]="'260px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column [dataField]="'description'" [caption]="'@platform-dev-tools:module.terms.description' | translate | async" [cellTemplate]="descTpl" [width]="'380px'" [allowResizing]="true"></ax-text-column>
-      </ax-data-table>
-    </div>
-    <ng-template #titleTpl let-item>
-      {{  $safeNavigationMigration(item.data?.title) | translate | async  }}</ng-template>
-    <ng-template #descTpl let-item>
-       @if (item.data?.description) { {{ item.data.description | translate | async }} } @else { – }
-    </ng-template>
-  `,
-                }]
-        }], ctorParameters: () => [], propDecorators: { moduleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "moduleName", required: true }] }] } });
+//#endregion
 
-//#region ----   Imports   ----
+//#region ----- Imports -----
 //#endregion
-class AXPlatformExplorerFeaturesListDetailComponent {
+//#region ----- Component -----
+class AXPlatformExplorerEntitiesGraphComponent {
+    //#endregion
     constructor() {
         this.moduleName = input.required(/* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "moduleName" }] : /* istanbul ignore next */ []));
+        //#region ----- Services & Dependencies -----
         this.dataService = inject(PlatformExplorerDataService);
-        this.dataSource = new AXDataSource({
-            key: 'name',
-            pageSize: 20,
-            load: (e) => {
-                const name = this.moduleName();
-                if (!name)
-                    return Promise.resolve({ items: [], total: 0 });
-                const list = this.dataService.getFeaturesForModule(name);
-                const skip = e?.skip ?? 0;
-                const take = e?.take ?? 20;
-                const items = list.slice(skip, skip + take);
-                return Promise.resolve({ items, total: list.length });
-            },
-        });
+        //#endregion
+        //#region ----- Constants -----
+        /** Readonly diagram: no spare drawing area, so fit-to-content keeps cards readable. */
+        this.canvasMinSize = { width: 0, height: 0 };
+        //#endregion
+        //#region ----- State Signals -----
+        this.loading = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+        this.loadError = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "loadError" }] : /* istanbul ignore next */ []));
+        this.diagram = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "diagram" }] : /* istanbul ignore next */ []));
+        this.highlightedNodeIds = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "highlightedNodeIds" }] : /* istanbul ignore next */ []));
+        this.expandedNodeIds = signal(new Set(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "expandedNodeIds" }] : /* istanbul ignore next */ []));
         effect(() => {
-            this.moduleName();
-            this.dataSource.refresh();
+            const moduleName = this.moduleName();
+            void this.load(moduleName);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerFeaturesListDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerFeaturesListDetailComponent, isStandalone: true, selector: "axp-platform-explorer-features-list-detail", inputs: { moduleName: { classPropertyName: "moduleName", publicName: "moduleName", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: `
-    <div class="flex flex-1 min-h-0 pt-0 overflow-auto">
-      <ax-data-table
-        class="flex-1 border border-lightest rounded-md overflow-hidden"
-        [paging]="true"
-         [allowReordering]="true"
-        [dataSource]="dataSource"
-      >
-        <ax-text-column dataField="key" [caption]="'@platform-dev-tools:module.terms.key' | translate | async" [width]="'240px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="title" [caption]="'@platform-dev-tools:module.terms.title' | translate | async" [cellTemplate]="titleTpl" [width]="'280px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="type" caption="Type" [width]="'100px'" [cellTemplate]="typeTpl" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="description" [caption]="'@platform-dev-tools:module.terms.description' | translate | async" [cellTemplate]="descTpl" [width]="'340px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="defaultValue" [caption]="'@platform-dev-tools:module.terms.default-value' | translate | async" [width]="'140px'" [allowResizing]="true"></ax-text-column>
-      </ax-data-table>
-    </div>
-    <ng-template #titleTpl let-item>{{ $safeNavigationMigration(item.data?.title) | translate | async }}</ng-template>
-    <ng-template #typeTpl let-item>{{ item.data?.type ?? '–' }}</ng-template>
-    <ng-template #descTpl let-item>@if (item.data?.description) { {{ item.data.description | translate | async }} } @else { – }</ng-template>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1$1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i1$1.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "hasTitle", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "translate", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    //#region ----- Event Handlers -----
+    entityOf(node) {
+        return explorerEntityData(node);
+    }
+    entityLabel(entity) {
+        return entity.fullName || `${entity.module}.${entity.name}`;
+    }
+    isExpanded(id) {
+        return this.expandedNodeIds().has(id);
+    }
+    propertyToggleLabel(expanded) {
+        return expanded
+            ? '@platform-dev-tools:module.graph.hide-properties'
+            : '@platform-dev-tools:module.graph.show-properties';
+    }
+    onToggleProperties(event, id) {
+        event.preventDefault();
+        event.stopPropagation();
+        const next = new Set(this.expandedNodeIds());
+        if (next.has(id)) {
+            next.delete(id);
+        }
+        else {
+            next.add(id);
+        }
+        this.expandedNodeIds.set(next);
+    }
+    onNodeClick(event) {
+        const model = this.diagram();
+        if (!model) {
+            return;
+        }
+        this.highlightedNodeIds.set(connectedNodeIds(model, event.node.id));
+    }
+    onCanvasClick() {
+        this.highlightedNodeIds.set([]);
+        this.expandedNodeIds.set(new Set());
+    }
+    //#endregion
+    //#region ----- Data Loading -----
+    async load(moduleName) {
+        this.loading.set(true);
+        this.loadError.set(false);
+        this.diagram.set(null);
+        this.highlightedNodeIds.set([]);
+        this.expandedNodeIds.set(new Set());
+        try {
+            const catalog = await this.dataService.getModule(moduleName);
+            if (this.moduleName() !== moduleName) {
+                return;
+            }
+            const graph = catalog?.entityGraph ?? {
+                nodes: (catalog?.entities ?? []).map((item) => ({
+                    fullName: item.fullName,
+                    module: item.module,
+                    name: item.name,
+                    title: item.title,
+                    icon: item.icon,
+                    external: false,
+                })),
+                edges: [],
+            };
+            this.diagram.set(buildExplorerEntityDiagram(graph, (name) => this.dataService.moduleTitle(name)));
+        }
+        catch {
+            if (this.moduleName() === moduleName) {
+                this.loadError.set(true);
+            }
+        }
+        finally {
+            if (this.moduleName() === moduleName) {
+                this.loading.set(false);
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerEntitiesGraphComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerEntitiesGraphComponent, isStandalone: true, selector: "axp-platform-explorer-entities-graph", inputs: { moduleName: { classPropertyName: "moduleName", publicName: "moduleName", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "axp-explorer-graph-host flex flex-col flex-1 min-h-0" }, ngImport: i0, template: "<div class=\"axp-explorer-graph flex flex-col flex-1 min-h-0\">\n  <!-- ----- Loading module entity graph ----- -->\n  @if (loading()) {\n    <div class=\"flex flex-1 items-center justify-center p-6\">\n      <ax-loading></ax-loading>\n    </div>\n  }\n  <!-- ----- Catalog query failed ----- -->\n  @else if (loadError()) {\n    <axp-state-message\n      icon=\"fa-light fa-triangle-exclamation\"\n      [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n      [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n    />\n  }\n  <!-- ----- Module has no entities ----- -->\n  @else if (!diagram()) {\n    <axp-state-message\n      icon=\"fa-light fa-diagram-project\"\n      [title]=\"'@platform-dev-tools:module.messages.no-entities'\"\n      [description]=\"'@platform-dev-tools:module.messages.no-entities-hint'\"\n    />\n  }\n  <!-- ----- Entity-relationship diagram ----- -->\n  @else {\n    <div class=\"axp-explorer-graph__canvas\">\n      <axp-workflow-designer\n        [model]=\"diagram()!\"\n        [readonly]=\"true\"\n        [showPortLabels]=\"true\"\n        [showPorts]=\"false\"\n        [connectorStub]=\"56\"\n        [canvasPadding]=\"80\"\n        [minCanvasSize]=\"canvasMinSize\"\n        [highlightedNodeIds]=\"highlightedNodeIds()\"\n        [nodeBodyTemplate]=\"nodeBodyTpl\"\n        (nodeClick)=\"onNodeClick($event)\"\n        (designerClick)=\"onCanvasClick()\"\n      />\n    </div>\n    <div class=\"axp-explorer-graph__footer\">\n      <p class=\"axp-explorer-graph__hint\">\n        {{ '@platform-dev-tools:module.descriptions.entities' | translate | async }}\n      </p>\n      <div class=\"axp-explorer-graph__legend\">\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__swatch axp-explorer-graph__swatch--internal\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.local-entity' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__swatch axp-explorer-graph__swatch--external\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.external-entity' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-sep\" aria-hidden=\"true\"></span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          {{ '@platform-dev-tools:module.graph.pk' | translate | async }}\n          =\n          {{ '@platform-dev-tools:module.graph.pk-hint' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-sep\" aria-hidden=\"true\"></span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          {{ '@platform-dev-tools:module.graph.cardinality-one' | translate | async }}\n          =\n          {{ '@platform-dev-tools:module.graph.cardinality-one-hint' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          {{ '@platform-dev-tools:module.graph.cardinality-many' | translate | async }}\n          =\n          {{ '@platform-dev-tools:module.graph.cardinality-many-hint' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-sep\" aria-hidden=\"true\"></span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__line axp-explorer-graph__line--lookup\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.lookup' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__line axp-explorer-graph__line--related\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.related' | translate | async }}\n        </span>\n      </div>\n    </div>\n  }\n</div>\n\n<ng-template #nodeBodyTpl let-node=\"node\">\n  <!-- ----- Entity table ----- -->\n  @if (entityOf(node); as entity) {\n    <div\n      class=\"axp-explorer-graph__entity\"\n      [class.axp-explorer-graph__entity--external]=\"entity.external\"\n      [class.axp-explorer-graph__entity--expanded]=\"isExpanded(entity.fullName)\"\n    >\n      <div class=\"axp-explorer-graph__entity-head\">\n        <div class=\"axp-explorer-graph__entity-head-main\">\n          <span class=\"axp-explorer-graph__entity-name\">{{ entityLabel(entity) }}</span>\n          <!--------------------------------------------------------------->\n          <!-- ----- Translated catalog title when it differs from the entity name ----- -->\n          @if (entity.title && entity.title !== entity.name && entity.title !== entity.fullName) {\n            <span class=\"axp-explorer-graph__entity-title\">{{ entity.title | translate | async }}</span>\n          }\n        </div>\n        <!--------------------------------------------------------------->\n        <!-- ----- Expand non-lookup properties under the header ----- -->\n        @if (entity.properties.length) {\n          <button\n            type=\"button\"\n            class=\"axp-explorer-graph__entity-toggle\"\n            [attr.aria-expanded]=\"isExpanded(entity.fullName)\"\n            [attr.aria-label]=\"(propertyToggleLabel(isExpanded(entity.fullName)) | translate | async) ?? ''\"\n            (pointerdown)=\"$event.stopPropagation()\"\n            (click)=\"onToggleProperties($event, entity.fullName)\"\n          >\n            <i\n              class=\"fa-light\"\n              [class.fa-chevron-down]=\"!isExpanded(entity.fullName)\"\n              [class.fa-chevron-up]=\"isExpanded(entity.fullName)\"\n              aria-hidden=\"true\"\n            ></i>\n          </button>\n        }\n      </div>\n      <!--------------------------------------------------------------->\n      <!-- ----- Same-card property list; visibility is toggled from the header ----- -->\n      @if (entity.properties.length) {\n        <div class=\"axp-explorer-graph__entity-props\" (pointerdown)=\"$event.stopPropagation()\">\n          @for (prop of entity.properties; track prop.name) {\n            <div class=\"axp-explorer-graph__entity-prop\">\n              <!--------------------------------------------------------------->\n              <!-- ----- Primary-key badge when the field is id ----- -->\n              @if (prop.kind === 'pk') {\n                <span class=\"axp-explorer-graph__entity-prop-kind\">\n                  {{ '@platform-dev-tools:module.graph.pk' | translate | async }}\n                </span>\n              }\n              <span class=\"axp-explorer-graph__entity-prop-name\">{{ prop.name }}</span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n</ng-template>\n", styles: ["@layer properties;.axp-explorer-graph__footer{display:flex;flex-shrink:0;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 3)}.axp-explorer-graph__hint{margin:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-explorer-graph__hint{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-explorer-graph__legend{display:flex;flex-wrap:wrap;align-items:center;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-explorer-graph__legend{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-explorer-graph__legend-item{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-explorer-graph__legend-sep{display:none;height:calc(var(--spacing, .25rem) * 3);width:1px;flex-shrink:0;background-color:rgba(var(--ax-sys-color-lightest-surface))}@media(width>=40rem){.axp-explorer-graph__legend-sep{display:inline-block}}.axp-explorer-graph__swatch{display:inline-block;height:calc(var(--spacing, .25rem) * 2.5);width:calc(var(--spacing, .25rem) * 2.5);flex-shrink:0;border-radius:var(--radius-sm, .25rem)}.axp-explorer-graph__swatch--internal{background:rgb(var(--ax-sys-color-primary-500))}.axp-explorer-graph__swatch--external{background:rgb(var(--ax-sys-color-warning-500))}.axp-explorer-graph__line{display:inline-block;height:calc(var(--spacing, .25rem) * .5);width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;border-radius:calc(infinity * 1px)}.axp-explorer-graph__line--lookup{background:rgb(var(--ax-sys-color-primary-500))}.axp-explorer-graph__line--related{background:rgb(var(--ax-sys-color-success-500))}.axp-explorer-graph__canvas{margin:calc(var(--spacing, .25rem) * 3);margin-bottom:0;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));min-height:360px}.axp-explorer-graph__canvas .axp-workflow-designer__edge.axp-primary-surface{stroke:rgb(var(--ax-sys-color-primary-500))}.axp-explorer-graph__canvas .axp-workflow-designer__edge.axp-success-surface{stroke:rgb(var(--ax-sys-color-success-500))}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity){overflow:visible}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape,.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape.axp-primary-surface,.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape.axp-warning-surface{background:rgb(var(--ax-sys-color-primary-lightest-surface));color:rgb(var(--ax-sys-color-on-primary-lightest-surface));overflow:visible;border-radius:8px}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape.axp-warning-surface{background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface))}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-body{padding:0;align-items:stretch;justify-content:stretch;overflow:visible}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity--expanded){z-index:8}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity--expanded) .axp-workflow-designer__node-shape{border-radius:8px 8px 0 0;border-bottom-width:0}.axp-explorer-graph__canvas .axp-workflow-designer__port{width:7px;height:7px;background:rgb(var(--ax-sys-color-neutral-400));pointer-events:none}.axp-explorer-graph__canvas .axp-workflow-designer__port-label-svg,.axp-explorer-graph__canvas .axp-workflow-designer__edge-label-svg{fill:rgb(var(--ax-sys-color-on-surface));stroke:rgb(var(--ax-sys-color-lightest-surface));font-size:11px;font-weight:700;letter-spacing:.02em}.axp-explorer-graph__entity{display:flex;height:100%;width:100%;min-width:0px;flex-direction:column;position:relative;overflow:visible}.axp-explorer-graph__entity-head{display:flex;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2);flex:1 1 auto;min-height:100%;padding:8px 10px;box-sizing:border-box;background:rgb(var(--ax-sys-color-primary-lightest-surface));color:rgb(var(--ax-sys-color-on-primary-lightest-surface));border-radius:8px}.axp-explorer-graph__entity--expanded .axp-explorer-graph__entity-head{border-radius:8px 8px 0 0}.axp-explorer-graph__entity--external .axp-explorer-graph__entity-head{background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface))}.axp-explorer-graph__entity-head-main{display:flex;min-width:0px;flex:1;flex-direction:column;justify-content:center;gap:calc(var(--spacing, .25rem) * .5)}.axp-explorer-graph__entity-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-explorer-graph__entity-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);opacity:.85}.axp-explorer-graph__entity-toggle{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:28px;height:28px;margin:0;padding:0;border:0;border-radius:6px;background:transparent;color:inherit;cursor:pointer}.axp-explorer-graph__entity-toggle:hover{background:rgb(var(--ax-sys-color-on-primary-lightest-surface) / .08)}.axp-explorer-graph__entity--external .axp-explorer-graph__entity-toggle:hover{background:rgb(var(--ax-sys-color-on-warning-lightest-surface) / .08)}.axp-explorer-graph__entity-props{display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;z-index:6;margin:0;padding:6px 8px 8px;box-sizing:border-box;background:rgb(var(--ax-sys-color-primary-lightest-surface));color:rgb(var(--ax-sys-color-on-primary-lightest-surface));border:2px solid rgb(var(--ax-sys-color-border-primary-lightest-surface));border-top:1px solid rgb(var(--ax-sys-color-on-primary-lightest-surface) / .16);border-radius:0 0 8px 8px;max-height:320px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgb(var(--ax-sys-color-on-primary-lightest-surface) / .3) transparent}.axp-explorer-graph__entity--expanded .axp-explorer-graph__entity-props{display:flex}.axp-explorer-graph__entity--external .axp-explorer-graph__entity-props{background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface));border-color:rgb(var(--ax-sys-color-border-warning-lightest-surface));border-top-color:rgb(var(--ax-sys-color-on-warning-lightest-surface) / .16)}.axp-explorer-graph__entity-prop{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:11px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);min-height:22px;margin:0;padding:3px 6px;border-radius:4px;box-sizing:border-box}.axp-explorer-graph__entity-prop-kind{flex-shrink:0;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);min-width:1.75rem;opacity:.85}.axp-explorer-graph__entity-prop-name{min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:inherit}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial;--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i2$1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "component", type: AXPWorkflowDesignerComponent, selector: "axp-workflow-designer", inputs: ["model", "readonly", "highlightedNodeIds", "gridSize", "snapToGrid", "connectionPreviewStyle", "connectorStub", "backgroundPattern", "canConnect", "paletteItems", "showPortLabels", "showPorts", "showConnectorLabels", "canvasPadding", "minCanvasSize", "nodeBodyTemplate"], outputs: ["modelChange", "zoomChange", "designerPointerDown", "designerClick", "designerDoubleClick", "nodePointerDown", "nodeClick", "nodeDoubleClick", "nodeContextMenu", "nodeDragStart", "nodeDragEnd", "portPointerDown", "linkDragStart", "linkDragMove", "linkDragEnd", "connectorClick", "connectorDoubleClick", "connectionCreated", "connectionRejected", "activationChange"] }, { kind: "pipe", type: i1.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: "22.0.8", ngImport: i0, type: AXPlatformExplorerFeaturesListDetailComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerEntitiesGraphComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: 'axp-platform-explorer-features-list-detail',
-                    standalone: true,
-                    encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule, AXDataTableModule, AXTranslationModule],
-                    host: { class: 'flex flex-col flex-1 min-h-0' },
-                    template: `
-    <div class="flex flex-1 min-h-0 pt-0 overflow-auto">
-      <ax-data-table
-        class="flex-1 border border-lightest rounded-md overflow-hidden"
-        [paging]="true"
-         [allowReordering]="true"
-        [dataSource]="dataSource"
-      >
-        <ax-text-column dataField="key" [caption]="'@platform-dev-tools:module.terms.key' | translate | async" [width]="'240px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="title" [caption]="'@platform-dev-tools:module.terms.title' | translate | async" [cellTemplate]="titleTpl" [width]="'280px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="type" caption="Type" [width]="'100px'" [cellTemplate]="typeTpl" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="description" [caption]="'@platform-dev-tools:module.terms.description' | translate | async" [cellTemplate]="descTpl" [width]="'340px'" [allowResizing]="true"></ax-text-column>
-        <ax-text-column dataField="defaultValue" [caption]="'@platform-dev-tools:module.terms.default-value' | translate | async" [width]="'140px'" [allowResizing]="true"></ax-text-column>
-      </ax-data-table>
-    </div>
-    <ng-template #titleTpl let-item>{{ $safeNavigationMigration(item.data?.title) | translate | async }}</ng-template>
-    <ng-template #typeTpl let-item>{{ item.data?.type ?? '–' }}</ng-template>
-    <ng-template #descTpl let-item>@if (item.data?.description) { {{ item.data.description | translate | async }} } @else { – }</ng-template>
-  `,
-                }]
+            args: [{ selector: 'axp-platform-explorer-entities-graph', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'axp-explorer-graph-host flex flex-col flex-1 min-h-0' }, imports: [CommonModule, AXTranslationModule, AXLoadingModule, AXPStateMessageComponent, AXPWorkflowDesignerComponent], template: "<div class=\"axp-explorer-graph flex flex-col flex-1 min-h-0\">\n  <!-- ----- Loading module entity graph ----- -->\n  @if (loading()) {\n    <div class=\"flex flex-1 items-center justify-center p-6\">\n      <ax-loading></ax-loading>\n    </div>\n  }\n  <!-- ----- Catalog query failed ----- -->\n  @else if (loadError()) {\n    <axp-state-message\n      icon=\"fa-light fa-triangle-exclamation\"\n      [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n      [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n    />\n  }\n  <!-- ----- Module has no entities ----- -->\n  @else if (!diagram()) {\n    <axp-state-message\n      icon=\"fa-light fa-diagram-project\"\n      [title]=\"'@platform-dev-tools:module.messages.no-entities'\"\n      [description]=\"'@platform-dev-tools:module.messages.no-entities-hint'\"\n    />\n  }\n  <!-- ----- Entity-relationship diagram ----- -->\n  @else {\n    <div class=\"axp-explorer-graph__canvas\">\n      <axp-workflow-designer\n        [model]=\"diagram()!\"\n        [readonly]=\"true\"\n        [showPortLabels]=\"true\"\n        [showPorts]=\"false\"\n        [connectorStub]=\"56\"\n        [canvasPadding]=\"80\"\n        [minCanvasSize]=\"canvasMinSize\"\n        [highlightedNodeIds]=\"highlightedNodeIds()\"\n        [nodeBodyTemplate]=\"nodeBodyTpl\"\n        (nodeClick)=\"onNodeClick($event)\"\n        (designerClick)=\"onCanvasClick()\"\n      />\n    </div>\n    <div class=\"axp-explorer-graph__footer\">\n      <p class=\"axp-explorer-graph__hint\">\n        {{ '@platform-dev-tools:module.descriptions.entities' | translate | async }}\n      </p>\n      <div class=\"axp-explorer-graph__legend\">\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__swatch axp-explorer-graph__swatch--internal\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.local-entity' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__swatch axp-explorer-graph__swatch--external\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.external-entity' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-sep\" aria-hidden=\"true\"></span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          {{ '@platform-dev-tools:module.graph.pk' | translate | async }}\n          =\n          {{ '@platform-dev-tools:module.graph.pk-hint' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-sep\" aria-hidden=\"true\"></span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          {{ '@platform-dev-tools:module.graph.cardinality-one' | translate | async }}\n          =\n          {{ '@platform-dev-tools:module.graph.cardinality-one-hint' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          {{ '@platform-dev-tools:module.graph.cardinality-many' | translate | async }}\n          =\n          {{ '@platform-dev-tools:module.graph.cardinality-many-hint' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-sep\" aria-hidden=\"true\"></span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__line axp-explorer-graph__line--lookup\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.lookup' | translate | async }}\n        </span>\n        <span class=\"axp-explorer-graph__legend-item\">\n          <span class=\"axp-explorer-graph__line axp-explorer-graph__line--related\" aria-hidden=\"true\"></span>\n          {{ '@platform-dev-tools:module.graph.related' | translate | async }}\n        </span>\n      </div>\n    </div>\n  }\n</div>\n\n<ng-template #nodeBodyTpl let-node=\"node\">\n  <!-- ----- Entity table ----- -->\n  @if (entityOf(node); as entity) {\n    <div\n      class=\"axp-explorer-graph__entity\"\n      [class.axp-explorer-graph__entity--external]=\"entity.external\"\n      [class.axp-explorer-graph__entity--expanded]=\"isExpanded(entity.fullName)\"\n    >\n      <div class=\"axp-explorer-graph__entity-head\">\n        <div class=\"axp-explorer-graph__entity-head-main\">\n          <span class=\"axp-explorer-graph__entity-name\">{{ entityLabel(entity) }}</span>\n          <!--------------------------------------------------------------->\n          <!-- ----- Translated catalog title when it differs from the entity name ----- -->\n          @if (entity.title && entity.title !== entity.name && entity.title !== entity.fullName) {\n            <span class=\"axp-explorer-graph__entity-title\">{{ entity.title | translate | async }}</span>\n          }\n        </div>\n        <!--------------------------------------------------------------->\n        <!-- ----- Expand non-lookup properties under the header ----- -->\n        @if (entity.properties.length) {\n          <button\n            type=\"button\"\n            class=\"axp-explorer-graph__entity-toggle\"\n            [attr.aria-expanded]=\"isExpanded(entity.fullName)\"\n            [attr.aria-label]=\"(propertyToggleLabel(isExpanded(entity.fullName)) | translate | async) ?? ''\"\n            (pointerdown)=\"$event.stopPropagation()\"\n            (click)=\"onToggleProperties($event, entity.fullName)\"\n          >\n            <i\n              class=\"fa-light\"\n              [class.fa-chevron-down]=\"!isExpanded(entity.fullName)\"\n              [class.fa-chevron-up]=\"isExpanded(entity.fullName)\"\n              aria-hidden=\"true\"\n            ></i>\n          </button>\n        }\n      </div>\n      <!--------------------------------------------------------------->\n      <!-- ----- Same-card property list; visibility is toggled from the header ----- -->\n      @if (entity.properties.length) {\n        <div class=\"axp-explorer-graph__entity-props\" (pointerdown)=\"$event.stopPropagation()\">\n          @for (prop of entity.properties; track prop.name) {\n            <div class=\"axp-explorer-graph__entity-prop\">\n              <!--------------------------------------------------------------->\n              <!-- ----- Primary-key badge when the field is id ----- -->\n              @if (prop.kind === 'pk') {\n                <span class=\"axp-explorer-graph__entity-prop-kind\">\n                  {{ '@platform-dev-tools:module.graph.pk' | translate | async }}\n                </span>\n              }\n              <span class=\"axp-explorer-graph__entity-prop-name\">{{ prop.name }}</span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n</ng-template>\n", styles: ["@layer properties;.axp-explorer-graph__footer{display:flex;flex-shrink:0;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 3)}.axp-explorer-graph__hint{margin:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-explorer-graph__hint{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-explorer-graph__legend{display:flex;flex-wrap:wrap;align-items:center;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-explorer-graph__legend{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-explorer-graph__legend-item{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-explorer-graph__legend-sep{display:none;height:calc(var(--spacing, .25rem) * 3);width:1px;flex-shrink:0;background-color:rgba(var(--ax-sys-color-lightest-surface))}@media(width>=40rem){.axp-explorer-graph__legend-sep{display:inline-block}}.axp-explorer-graph__swatch{display:inline-block;height:calc(var(--spacing, .25rem) * 2.5);width:calc(var(--spacing, .25rem) * 2.5);flex-shrink:0;border-radius:var(--radius-sm, .25rem)}.axp-explorer-graph__swatch--internal{background:rgb(var(--ax-sys-color-primary-500))}.axp-explorer-graph__swatch--external{background:rgb(var(--ax-sys-color-warning-500))}.axp-explorer-graph__line{display:inline-block;height:calc(var(--spacing, .25rem) * .5);width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;border-radius:calc(infinity * 1px)}.axp-explorer-graph__line--lookup{background:rgb(var(--ax-sys-color-primary-500))}.axp-explorer-graph__line--related{background:rgb(var(--ax-sys-color-success-500))}.axp-explorer-graph__canvas{margin:calc(var(--spacing, .25rem) * 3);margin-bottom:0;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-lightest-surface));min-height:360px}.axp-explorer-graph__canvas .axp-workflow-designer__edge.axp-primary-surface{stroke:rgb(var(--ax-sys-color-primary-500))}.axp-explorer-graph__canvas .axp-workflow-designer__edge.axp-success-surface{stroke:rgb(var(--ax-sys-color-success-500))}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity){overflow:visible}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape,.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape.axp-primary-surface,.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape.axp-warning-surface{background:rgb(var(--ax-sys-color-primary-lightest-surface));color:rgb(var(--ax-sys-color-on-primary-lightest-surface));overflow:visible;border-radius:8px}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-shape.axp-warning-surface{background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface))}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity) .axp-workflow-designer__node-body{padding:0;align-items:stretch;justify-content:stretch;overflow:visible}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity--expanded){z-index:8}.axp-explorer-graph__canvas .axp-workflow-designer__node:has(.axp-explorer-graph__entity--expanded) .axp-workflow-designer__node-shape{border-radius:8px 8px 0 0;border-bottom-width:0}.axp-explorer-graph__canvas .axp-workflow-designer__port{width:7px;height:7px;background:rgb(var(--ax-sys-color-neutral-400));pointer-events:none}.axp-explorer-graph__canvas .axp-workflow-designer__port-label-svg,.axp-explorer-graph__canvas .axp-workflow-designer__edge-label-svg{fill:rgb(var(--ax-sys-color-on-surface));stroke:rgb(var(--ax-sys-color-lightest-surface));font-size:11px;font-weight:700;letter-spacing:.02em}.axp-explorer-graph__entity{display:flex;height:100%;width:100%;min-width:0px;flex-direction:column;position:relative;overflow:visible}.axp-explorer-graph__entity-head{display:flex;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2);flex:1 1 auto;min-height:100%;padding:8px 10px;box-sizing:border-box;background:rgb(var(--ax-sys-color-primary-lightest-surface));color:rgb(var(--ax-sys-color-on-primary-lightest-surface));border-radius:8px}.axp-explorer-graph__entity--expanded .axp-explorer-graph__entity-head{border-radius:8px 8px 0 0}.axp-explorer-graph__entity--external .axp-explorer-graph__entity-head{background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface))}.axp-explorer-graph__entity-head-main{display:flex;min-width:0px;flex:1;flex-direction:column;justify-content:center;gap:calc(var(--spacing, .25rem) * .5)}.axp-explorer-graph__entity-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-explorer-graph__entity-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);opacity:.85}.axp-explorer-graph__entity-toggle{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:28px;height:28px;margin:0;padding:0;border:0;border-radius:6px;background:transparent;color:inherit;cursor:pointer}.axp-explorer-graph__entity-toggle:hover{background:rgb(var(--ax-sys-color-on-primary-lightest-surface) / .08)}.axp-explorer-graph__entity--external .axp-explorer-graph__entity-toggle:hover{background:rgb(var(--ax-sys-color-on-warning-lightest-surface) / .08)}.axp-explorer-graph__entity-props{display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;z-index:6;margin:0;padding:6px 8px 8px;box-sizing:border-box;background:rgb(var(--ax-sys-color-primary-lightest-surface));color:rgb(var(--ax-sys-color-on-primary-lightest-surface));border:2px solid rgb(var(--ax-sys-color-border-primary-lightest-surface));border-top:1px solid rgb(var(--ax-sys-color-on-primary-lightest-surface) / .16);border-radius:0 0 8px 8px;max-height:320px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgb(var(--ax-sys-color-on-primary-lightest-surface) / .3) transparent}.axp-explorer-graph__entity--expanded .axp-explorer-graph__entity-props{display:flex}.axp-explorer-graph__entity--external .axp-explorer-graph__entity-props{background:rgb(var(--ax-sys-color-warning-lightest-surface));color:rgb(var(--ax-sys-color-on-warning-lightest-surface));border-color:rgb(var(--ax-sys-color-border-warning-lightest-surface));border-top-color:rgb(var(--ax-sys-color-on-warning-lightest-surface) / .16)}.axp-explorer-graph__entity-prop{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:11px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);min-height:22px;margin:0;padding:3px 6px;border-radius:4px;box-sizing:border-box}.axp-explorer-graph__entity-prop-kind{flex-shrink:0;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);min-width:1.75rem;opacity:.85}.axp-explorer-graph__entity-prop-name{min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:inherit}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial;--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { moduleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "moduleName", required: true }] }] } });
 
-//#region ----   Imports   ----
+//#region ----- Imports -----
 //#endregion
-//#region ----   Component   ----
+//#region ----- Component -----
 class AXPlatformExplorerDetailComponent {
     constructor() {
         this.node = input.required(/* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
     }
+    asModule(payload) {
+        return payload;
+    }
+    asEntity(payload) {
+        return payload;
+    }
+    asNamed(payload) {
+        return payload;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerDetailComponent, isStandalone: true, selector: "axp-platform-explorer-detail", inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: `
     <div class="flex flex-col flex-1 min-h-0">
       @switch (node().kind) {
         @case ('module') {
-          <axp-platform-explorer-module-detail [payload]="$any(node().payload)" />
+          <axp-platform-explorer-module-detail [payload]="asModule(node().payload)" />
         }
         @case ('entity') {
-          <axp-platform-explorer-entity-detail [payload]="$any(node().payload)" />
+          <axp-platform-explorer-entity-detail [payload]="asEntity(node().payload)" />
+        }
+        @case ('command') {
+          <axp-platform-explorer-catalog-detail kind="command" [item]="asNamed(node().payload)" />
         }
-        @case ('permissions') {
-          <axp-platform-explorer-permissions-list-detail [moduleName]="node().moduleName!" />
+        @case ('query') {
+          <axp-platform-explorer-catalog-detail kind="query" [item]="asNamed(node().payload)" />
         }
-        @case ('features') {
-          <axp-platform-explorer-features-list-detail [moduleName]="node().moduleName!" />
+        @case ('plugin') {
+          <axp-platform-explorer-catalog-detail kind="plugin" [item]="asNamed(node().payload)" />
         }
-        @default {
-          <p class="axp-detail__hint">{{ node().children?.length ?? 0 }} items.</p>
+        @case ('widget') {
+          <axp-platform-explorer-catalog-detail kind="widget" [item]="asNamed(node().payload)" />
+        }
+        @case ('diagram') {
+          <axp-platform-explorer-entities-graph [moduleName]="node().moduleName!" />
         }
       }
     </div>
-  `, isInline: true, styles: [".axp-detail__hint{margin:0;color:var(--ax-neutral-text-secondary, #666)}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPlatformExplorerModuleDetailComponent, selector: "axp-platform-explorer-module-detail", inputs: ["payload"] }, { kind: "component", type: AXPlatformExplorerEntityDetailComponent, selector: "axp-platform-explorer-entity-detail", inputs: ["payload"] }, { kind: "component", type: AXPlatformExplorerPermissionsListDetailComponent, selector: "axp-platform-explorer-permissions-list-detail", inputs: ["moduleName"] }, { kind: "component", type: AXPlatformExplorerFeaturesListDetailComponent, selector: "axp-platform-explorer-features-list-detail", inputs: ["moduleName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPlatformExplorerModuleDetailComponent, selector: "axp-platform-explorer-module-detail", inputs: ["payload"] }, { kind: "component", type: AXPlatformExplorerEntityDetailComponent, selector: "axp-platform-explorer-entity-detail", inputs: ["payload"] }, { kind: "component", type: AXPlatformExplorerCatalogDetailComponent, selector: "axp-platform-explorer-catalog-detail", inputs: ["kind", "item"] }, { kind: "component", type: AXPlatformExplorerEntitiesGraphComponent, selector: "axp-platform-explorer-entities-graph", inputs: ["moduleName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axp-platform-explorer-detail', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'flex flex-col flex-1 min-h-0' }, imports: [
+            args: [{
+                    selector: 'axp-platform-explorer-detail',
+                    standalone: true,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'flex flex-col flex-1 min-h-0' },
+                    imports: [
                         AXTranslationModule,
                         AXPlatformExplorerModuleDetailComponent,
                         AXPlatformExplorerEntityDetailComponent,
-                        AXPlatformExplorerPermissionsListDetailComponent,
-                        AXPlatformExplorerFeaturesListDetailComponent
-                    ], template: `
+                        AXPlatformExplorerCatalogDetailComponent,
+                        AXPlatformExplorerEntitiesGraphComponent,
+                    ],
+                    template: `
     <div class="flex flex-col flex-1 min-h-0">
       @switch (node().kind) {
         @case ('module') {
-          <axp-platform-explorer-module-detail [payload]="$any(node().payload)" />
+          <axp-platform-explorer-module-detail [payload]="asModule(node().payload)" />
         }
         @case ('entity') {
-          <axp-platform-explorer-entity-detail [payload]="$any(node().payload)" />
+          <axp-platform-explorer-entity-detail [payload]="asEntity(node().payload)" />
         }
-        @case ('permissions') {
-          <axp-platform-explorer-permissions-list-detail [moduleName]="node().moduleName!" />
+        @case ('command') {
+          <axp-platform-explorer-catalog-detail kind="command" [item]="asNamed(node().payload)" />
         }
-        @case ('features') {
-          <axp-platform-explorer-features-list-detail [moduleName]="node().moduleName!" />
+        @case ('query') {
+          <axp-platform-explorer-catalog-detail kind="query" [item]="asNamed(node().payload)" />
         }
-        @default {
-          <p class="axp-detail__hint">{{ node().children?.length ?? 0 }} items.</p>
+        @case ('plugin') {
+          <axp-platform-explorer-catalog-detail kind="plugin" [item]="asNamed(node().payload)" />
+        }
+        @case ('widget') {
+          <axp-platform-explorer-catalog-detail kind="widget" [item]="asNamed(node().payload)" />
+        }
+        @case ('diagram') {
+          <axp-platform-explorer-entities-graph [moduleName]="node().moduleName!" />
         }
       }
     </div>
-  `, styles: [".axp-detail__hint{margin:0;color:var(--ax-neutral-text-secondary, #666)}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+  `,
+                }]
         }], propDecorators: { node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: true }] }] } });
 
-//#region ----   Imports   ----
+//#region ----- Imports -----
 //#endregion
-//#region ----   Convert tree to AXTreeViewNode   ----
-function toTreeViewNodes(nodes, markModuleExpandable = false) {
-    return nodes.map((n) => {
-        const children = n.children ?? [];
-        const hasChildren = children.length > 0;
-        const axNode = {
-            id: n.id,
-            title: n.label,
-            children: hasChildren ? toTreeViewNodes(children, false) : undefined,
-            data: { treeNode: n },
-        };
-        if (markModuleExpandable && n.kind === 'module' && !hasChildren) {
-            axNode['childrenCount'] = 3;
+//#region ----- Constants -----
+const CATEGORY_SUFFIXES = ['entities', 'commands', 'queries', 'plugins', 'widgets'];
+const MODULE_LIST_MIN_WIDTH = 256;
+const MODULE_LIST_DEFAULT_WIDTH = 288;
+const MODULE_LIST_MAX_WIDTH = 560;
+const MODULE_LIST_WIDTH_KEY = 'axp.platform-explorer.module-list-width';
+function readStoredModuleListWidth() {
+    try {
+        const parsed = Number(localStorage.getItem(MODULE_LIST_WIDTH_KEY));
+        if (Number.isFinite(parsed) &&
+            parsed >= MODULE_LIST_MIN_WIDTH &&
+            parsed <= MODULE_LIST_MAX_WIDTH) {
+            return parsed;
         }
-        return axNode;
-    });
+    }
+    catch {
+        // ignore missing storage
+    }
+    return MODULE_LIST_DEFAULT_WIDTH;
+}
+//#endregion
+//#region ----- Tree mapping -----
+function toTreeViewNode(node, childrenCount) {
+    const count = childrenCount ?? node.itemCount;
+    return {
+        id: node.id,
+        title: node.label,
+        childrenCount: count && count > 0 ? count : undefined,
+        data: { treeNode: node },
+    };
+}
+function parseCategoryParent(parentId) {
+    for (const suffix of CATEGORY_SUFFIXES) {
+        const token = `-${suffix}`;
+        if (parentId.startsWith('module-') && parentId.endsWith(token)) {
+            return {
+                moduleName: parentId.slice('module-'.length, parentId.length - token.length),
+                kind: suffix,
+            };
+        }
+    }
+    return null;
 }
 //#endregion
-//#region ----   Component   ----
+//#region ----- Component -----
 class AXPlatformExplorerPageComponent extends AXPPageLayoutBaseComponent {
     constructor() {
         super();
         this.dataService = inject(PlatformExplorerDataService);
+        this.deviceService = inject(AXPDeviceService);
+        this.route = inject(ActivatedRoute);
         this.loading = signal(true, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+        this.loadError = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "loadError" }] : /* istanbul ignore next */ []));
         this.selectedNode = signal(null, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "selectedNode" }] : /* istanbul ignore next */ []));
         this.moduleNodes = signal([], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "moduleNodes" }] : /* istanbul ignore next */ []));
+        this.hasCatalogModules = computed(() => this.moduleNodes().some((node) => node.kind === 'module'), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasCatalogModules" }] : /* istanbul ignore next */ []));
+        this.search = signal('', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "search" }] : /* istanbul ignore next */ []));
         this.tree = viewChild('tree', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "tree" }] : /* istanbul ignore next */ []));
-        /** Datasource for tree: root = modules only; children loaded when module is expanded. */
+        this.entityTabs = this.dataService.entityTabs;
+        this.activeEntitySection = this.dataService.activeEntitySection;
+        this.moduleListMinWidth = MODULE_LIST_MIN_WIDTH;
+        this.moduleListDefaultWidth = MODULE_LIST_DEFAULT_WIDTH;
+        this.moduleListMaxWidth = MODULE_LIST_MAX_WIDTH;
+        this.moduleListWidth = signal(readStoredModuleListWidth(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "moduleListWidth" }] : /* istanbul ignore next */ []));
+        this.catalogReady = false;
+        this.syncingFromUrl = false;
         this.datasource = async (parentId) => {
             if (!parentId) {
-                const nodes = this.moduleNodes();
-                return toTreeViewNodes(nodes, true);
+                return this.moduleNodes().map((node) => toTreeViewNode(node, node.itemCount));
+            }
+            const category = parseCategoryParent(parentId);
+            if (category) {
+                const children = await this.dataService.getCategoryChildren(category.moduleName, category.kind);
+                return children.map((node) => toTreeViewNode(node));
+            }
+            if (parentId.startsWith('module-')) {
+                const moduleName = parentId.slice('module-'.length);
+                const children = await this.dataService.getModuleChildren(moduleName);
+                return children.map((node) => toTreeViewNode(node, node.itemCount));
             }
-            const children = await this.dataService.getModuleChildren(parentId);
-            return toTreeViewNodes(children, false);
+            return [];
         };
-        this.initializeModules();
+        this.route.queryParamMap.pipe(takeUntilDestroyed()).subscribe((params) => {
+            void this.onQueryChanged(params);
+        });
+        void this.boot();
     }
-    async initializeModules() {
-        this.loading.set(true);
-        try {
-            const nodes = await this.dataService.buildModulesOnlyFiltered();
-            this.moduleNodes.set(nodes);
-        }
-        finally {
-            this.loading.set(false);
-        }
+    async onSearchChanged(event) {
+        const text = typeof event.value === 'string' ? event.value : '';
+        this.search.set(text);
+        this.dataService.clearCache();
+        await this.initializeModules(text);
+        await this.tree()?.reloadData();
+        this.writeQuery(this.selectedNode());
+        await this.revealSelection();
     }
     async getPageTitle() {
         const node = this.selectedNode();
         if (!node) {
-            return this.translateService.translateAsync('@platform-dev-tools:module.title');
+            return this.translateService.translateAsync('@platform-dev-tools:module.menus.platform-explorer.title');
         }
         const moduleTitleKey = node.moduleTitle ?? node.label;
         const moduleTitle = await this.translateService.translateAsync(moduleTitleKey);
-        const contextParts = [];
         switch (node.kind) {
+            case 'type-group':
+                return this.translateService.translateAsync('@platform-dev-tools:module.menus.platform-explorer.title');
             case 'module':
                 return moduleTitle;
-            case 'entities':
-                contextParts.push(await this.translateService.translateAsync('@platform-dev-tools:module.terms.entities'));
-                break;
             case 'entity':
-                contextParts.push(await this.translateService.translateAsync('@platform-dev-tools:module.terms.entities'));
-                contextParts.push(node.label);
-                break;
-            case 'permissions':
-                contextParts.push(await this.translateService.translateAsync('@platform-dev-tools:module.terms.permissions'));
-                break;
-            case 'features':
-                contextParts.push(await this.translateService.translateAsync('@platform-dev-tools:module.terms.features'));
-                break;
-            default:
-                return moduleTitle;
+            case 'command':
+            case 'query':
+            case 'plugin':
+            case 'widget':
+                return [moduleTitle, node.label].join(' · ');
+            default: {
+                const folder = await this.translateService.translateAsync(node.label);
+                return [moduleTitle, folder].join(' · ');
+            }
         }
-        return [moduleTitle, ...contextParts].join(' - ');
     }
     getPageDescription() {
         const node = this.selectedNode();
-        if (!node)
-            return null;
+        if (!node) {
+            return this.translateService.translateAsync('@platform-dev-tools:module.description');
+        }
+        if (node.kind === 'entity') {
+            const entity = node.payload;
+            return entity?.fullName ?? null;
+        }
         const key = this.descriptionKeyForKind(node.kind);
         return key ? this.translateService.translateAsync(key) : null;
     }
@@ -796,182 +2342,335 @@ class AXPlatformExplorerPageComponent extends AXPPageLayoutBaseComponent {
         }
         return items;
     }
+    onModuleListResized(event) {
+        if (!event.isUserInteraction || event.value == null) {
+            return;
+        }
+        const width = Math.min(MODULE_LIST_MAX_WIDTH, Math.max(MODULE_LIST_MIN_WIDTH, event.value));
+        this.moduleListWidth.set(width);
+        try {
+            localStorage.setItem(MODULE_LIST_WIDTH_KEY, String(width));
+        }
+        catch {
+            // ignore quota / private mode
+        }
+    }
+    async onNodeClick(event) {
+        const data = event.node?.['data'];
+        const treeNode = data?.treeNode;
+        if (!treeNode || treeNode.kind === 'type-group') {
+            return;
+        }
+        if (isExplorerFolderKind(treeNode.kind)) {
+            const tree = this.tree();
+            if (tree) {
+                await tree.toggleNodeExpansion(treeNode.id);
+                const current = this.selectedNode();
+                if (current) {
+                    tree.selectNode(current.id);
+                }
+                else {
+                    tree.deselectNode(treeNode.id);
+                }
+            }
+            return;
+        }
+        this.selectPageNode(treeNode);
+    }
+    onEntityTabChanged(event) {
+        const key = event.tab?.key || this.entityTabs()[event.index]?.id;
+        if (!key || key === this.dataService.activeEntitySection()) {
+            return;
+        }
+        this.dataService.selectEntitySection(key);
+    }
     descriptionKeyForKind(kind) {
         switch (kind) {
             case 'module':
                 return '@platform-dev-tools:module.descriptions.module';
-            case 'entities':
-                return '@platform-dev-tools:module.descriptions.entities';
-            case 'entity':
-                return '@platform-dev-tools:module.descriptions.entity';
-            case 'permissions':
-                return '@platform-dev-tools:module.descriptions.permissions';
-            case 'features':
-                return '@platform-dev-tools:module.descriptions.features';
+            case 'diagram':
+                return '@platform-dev-tools:module.descriptions.diagram';
+            case 'commands':
+            case 'command':
+                return '@platform-dev-tools:module.descriptions.command';
+            case 'queries':
+            case 'query':
+                return '@platform-dev-tools:module.descriptions.query';
+            case 'plugins':
+            case 'plugin':
+                return '@platform-dev-tools:module.descriptions.plugin';
+            case 'widgets':
+            case 'widget':
+                return '@platform-dev-tools:module.descriptions.widget';
             default:
                 return null;
         }
     }
-    onNodeClick(event) {
-        const node = event.node;
-        const data = node?.['data'];
-        const treeNode = data?.treeNode;
-        if (treeNode) {
-            this.selectedNode.set(treeNode);
+    async onQueryChanged(params) {
+        const state = explorerStateFromQuery(params);
+        const nextSearch = state.search ?? '';
+        const searchChanged = nextSearch !== this.search();
+        if (searchChanged) {
+            this.search.set(nextSearch);
+        }
+        if (!this.catalogReady) {
+            return;
+        }
+        if (searchChanged) {
+            this.dataService.clearCache();
+            await this.initializeModules(nextSearch);
+            await this.tree()?.reloadData();
+        }
+        await this.applyRouteState(state);
+    }
+    async boot() {
+        const state = explorerStateFromQuery(this.route.snapshot.queryParamMap);
+        if (state.search) {
+            this.search.set(state.search);
+        }
+        await this.initializeModules(this.search());
+        this.catalogReady = true;
+        await this.applyRouteState(state);
+    }
+    selectPageNode(treeNode) {
+        this.dataService.clearEntityTabs();
+        this.selectedNode.set(treeNode);
+        this.recompute();
+        this.writeQuery(treeNode);
+    }
+    writeQuery(node) {
+        if (this.syncingFromUrl) {
+            return;
+        }
+        void this.router.navigate([], {
+            relativeTo: this.route,
+            queryParams: queryParamsFromExplorer(node, this.search()),
+            replaceUrl: true,
+        });
+    }
+    async applyRouteState(state) {
+        this.syncingFromUrl = true;
+        try {
+            const node = await this.dataService.resolveExplorerSelection(state, this.moduleNodes());
+            if (sameExplorerNode(this.selectedNode(), node)) {
+                await this.revealSelection();
+                return;
+            }
+            this.dataService.clearEntityTabs();
+            this.selectedNode.set(node);
             this.recompute();
-            // When a module node is clicked, expand it so the tree loads its children (entities, permissions, features)
-            if (treeNode.kind === 'module') {
-                const treeRef = this.tree();
-                if (treeRef && typeof treeRef.expandNode === 'function') {
-                    treeRef.expandNode(treeNode.id);
-                }
+            await this.revealSelection();
+        }
+        finally {
+            this.syncingFromUrl = false;
+        }
+    }
+    async revealSelection() {
+        const node = this.selectedNode();
+        if (!node) {
+            return;
+        }
+        const tree = await this.waitForTree();
+        if (!tree) {
+            return;
+        }
+        const ids = explorerRevealIds(node);
+        for (const id of ids.slice(0, -1)) {
+            try {
+                await tree.expandNode(id);
+            }
+            catch {
+                // node may not be in the filtered tree
+            }
+        }
+        try {
+            tree.selectNode(node.id);
+        }
+        catch {
+            // ignore missing tree node
+        }
+    }
+    async waitForTree() {
+        for (let attempt = 0; attempt < 12; attempt++) {
+            const tree = this.tree();
+            if (tree) {
+                return tree;
             }
+            await new Promise((resolve) => setTimeout(resolve, 16));
         }
+        return this.tree();
     }
-    onNodeToggle(_event) {
-        // Tree loads children via datasource(parentId) when a node is expanded; no extra work needed.
+    async initializeModules(search) {
+        this.loading.set(true);
+        this.loadError.set(false);
+        try {
+            const modules = await this.dataService.listModules(search);
+            this.moduleNodes.set(this.dataService.toModuleTreeNodes(modules));
+        }
+        catch {
+            this.loadError.set(true);
+            this.moduleNodes.set([]);
+        }
+        finally {
+            this.loading.set(false);
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerPageComponent, isStandalone: true, selector: "axp-platform-explorer-page", providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerPageComponent, isStandalone: true, selector: "axp-platform-explorer-page", host: { classAttribute: "axp-platform-explorer" }, providers: [
             PlatformExplorerDataService,
             {
                 provide: AXPPageLayoutBase,
                 useExisting: AXPlatformExplorerPageComponent,
             },
-        ], viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout>\n  <axp-layout-start-side>\n    <axp-layout-header>\n      <axp-layout-title>{{ '@platform-dev-tools:module.menus.platform-explorer.title' | translate | async\n        }}</axp-layout-title>\n    </axp-layout-header>\n    <axp-layout-content class=\"axp-platform-explorer__tree-wrap\">\n      @if (loading()) {\n      <p class=\"axp-platform-explorer__loading\">Loading...</p>\n      } @else if (moduleNodes().length === 0) {\n      <p class=\"axp-platform-explorer__empty\">{{ '@platform-dev-tools:module.messages.no-modules' | translate | async }}\n      </p>\n      } @else {\n      <ax-tree-view #tree [datasource]=\"datasource\" [selectMode]=\"'single'\" [showIcons]=\"false\"\n        [showChildrenBadge]=\"true\" [dragBehavior]=\"'none'\" look=\"default\" [nodeTemplate]=\"nodeTemplate\"\n        (onNodeClick)=\"onNodeClick($event)\" (onNodeToggle)=\"onNodeToggle($event)\" />\n      }\n    </axp-layout-content>\n  </axp-layout-start-side>\n\n  <axp-page-content class=\"min-h-0 pt-0\">\n    @if (selectedNode()) {\n    <axp-platform-explorer-detail [node]=\"selectedNode()!\" />\n    } @else {\n    <p class=\"axp-platform-explorer__hint\">{{ '@platform-dev-tools:module.messages.select-node' | translate | async }}\n    </p>\n    }\n  </axp-page-content>\n</axp-page-layout>\n\n<!-- Node template: icon per kind (with color) + label (translated) + badge -->\n<ng-template #nodeTemplate let-node=\"node\">\n  @let data = node['data'];\n  @let treeNode = $safeNavigationMigration(data?.treeNode);\n  @let kind = $safeNavigationMigration(treeNode?.kind);\n  @let count = node['childrenCount'] ?? treeNode?.itemCount;\n  <span class=\"axp-platform-explorer__node\">\n    @switch (kind) {\n    @case ('module') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--module fa-light fa-cube\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('entities') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entities fa-light fa-table-list\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('entity') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entity fa-light fa-table\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('permissions') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--permissions fa-light fa-shield-halved\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('features') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--features fa-light fa-sliders\"\n      aria-hidden=\"true\"></i>\n    }\n    @default {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--default fa-light fa-circle-dot\"\n      aria-hidden=\"true\"></i>\n    }\n    }\n    <span class=\"axp-platform-explorer__node-label\">{{ node['title'] | translate | async }}</span>\n    @if (count != null && count > 0) {\n    <span class=\"axp-platform-explorer__node-badge\">{{ count }}</span>\n    }\n  </span>\n</ng-template>", styles: ["@layer properties;.axp-platform-explorer .axp-platform-explorer__tree-wrap{display:flex;min-height:0px;min-width:calc(var(--spacing, .25rem) * 64);flex-direction:column;overflow-x:auto;overflow-y:auto;padding:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);max-height:calc(100vh - 180px)}.axp-platform-explorer .axp-platform-explorer__loading,.axp-platform-explorer .axp-platform-explorer__empty{margin:0;padding:calc(var(--spacing, .25rem) * 4);color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__hint{padding:calc(var(--spacing, .25rem) * 6);color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__node{display:flex;width:100%;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer .axp-platform-explorer__node-icon{width:1em;flex-shrink:0}.axp-platform-explorer .axp-platform-explorer__node-icon--module{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--entities{color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__node-icon--entity{color:rgba(var(--ax-sys-color-accent1-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--permissions{color:rgba(var(--ax-sys-color-success-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--features{color:rgba(var(--ax-sys-color-warning-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--default{color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__node-label{min-width:0px;flex:1;white-space:nowrap}.axp-platform-explorer .axp-platform-explorer__node-badge{margin-left:auto;min-width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 1.5);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);background-color:rgba(var(--ax-sys-color-primary-lightest-surface));color:rgba(var(--ax-sys-color-primary-surface))}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPThemeLayoutStartSideComponent, selector: "axp-layout-page-start-side, axp-layout-start-side" }, { kind: "component", type: AXPThemeLayoutHeaderComponent, selector: "axp-layout-header" }, { 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: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "alternate", "nodeTemplate", "idField", "titleField", "highlightText", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "component", type: AXPlatformExplorerDetailComponent, selector: "axp-platform-explorer-detail", inputs: ["node"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout>\n  <axp-layout-start-side\n    class=\"axp-platform-explorer__start-side\"\n    [axResizable]=\"!deviceService.isSmall()\"\n    [minWidth]=\"moduleListMinWidth\"\n    [maxWidth]=\"moduleListMaxWidth\"\n    [width]=\"moduleListWidth()\"\n    [defaultWidth]=\"moduleListDefaultWidth\"\n    [dblClickAction]=\"'reset'\"\n    (onResizingEnded)=\"onModuleListResized($event)\"\n    (onResizingDblClick)=\"onModuleListResized($event)\"\n  >\n    <axp-layout-header>\n      <axp-layout-title>\n        {{ '@platform-dev-tools:module.menus.platform-explorer.title' | translate | async }}\n      </axp-layout-title>\n    </axp-layout-header>\n    <axp-layout-content class=\"axp-platform-explorer__tree-wrap\">\n      <ax-search-box\n        class=\"axp-platform-explorer__search\"\n        look=\"fill\"\n        [delayTime]=\"300\"\n        [value]=\"search()\"\n        [placeholder]=\"('@platform-dev-tools:module.messages.search-modules' | translate | async) ?? ''\"\n        (onValueChanged)=\"onSearchChanged($event)\"\n      >\n        <ax-clear-button></ax-clear-button>\n      </ax-search-box>\n      <!-- ----- Loading catalog modules ----- -->\n      @if (loading()) {\n        <div class=\"axp-platform-explorer__loading\">\n          <ax-loading></ax-loading>\n        </div>\n      }\n      <!-- ----- Catalog query failed ----- -->\n      @else if (loadError()) {\n        <axp-state-message\n          icon=\"fa-light fa-triangle-exclamation\"\n          [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n          [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n        />\n      }\n      <!-- ----- No modules in catalog ----- -->\n      @else if (!hasCatalogModules()) {\n        <axp-state-message\n          icon=\"fa-light fa-cubes\"\n          [title]=\"'@platform-dev-tools:module.messages.no-modules'\"\n          [description]=\"'@platform-dev-tools:module.messages.no-modules-hint'\"\n        />\n      }\n      <!-- ----- Module tree ----- -->\n      @else {\n        <ax-tree-view\n          #tree\n          [datasource]=\"datasource\"\n          [selectMode]=\"'single'\"\n          [showIcons]=\"false\"\n          [showChildrenBadge]=\"false\"\n          [dragBehavior]=\"'none'\"\n          look=\"default\"\n          [nodeTemplate]=\"nodeTemplate\"\n          (onNodeClick)=\"onNodeClick($event)\"\n        />\n      }\n    </axp-layout-content>\n  </axp-layout-start-side>\n\n  <!-- ----- Entity layout tabs stay in the sticky page header ----- -->\n  @if (entityTabs().length) {\n    <axp-page-toolbar class=\"axp-platform-explorer__entity-toolbar\">\n      <ax-tabs\n        class=\"axp-platform-explorer__entity-tabs\"\n        [look]=\"'with-line'\"\n        [location]=\"'bottom'\"\n        [fitParent]=\"false\"\n        (onActiveTabChanged)=\"onEntityTabChanged($event)\"\n      >\n        @for (tab of entityTabs(); track tab.id) {\n          <ax-tab-item\n            [key]=\"tab.id\"\n            [text]=\"\n              ((tab.textKey | translate | async) ?? '') +\n              (tab.extraText ? ' \u00B7 ' + ((tab.extraText | translate | async) ?? '') : '')\n            \"\n            [active]=\"activeEntitySection() === tab.id\"\n          />\n        }\n      </ax-tabs>\n    </axp-page-toolbar>\n  }\n\n  <axp-page-content class=\"axp-platform-explorer__page-content min-h-0 pt-0\">\n    <!-- ----- Selected catalog node ----- -->\n    @if (selectedNode(); as node) {\n      <axp-platform-explorer-detail [node]=\"node\" />\n    }\n    <!-- ----- Empty selection ----- -->\n    @else {\n      <axp-state-message\n        icon=\"fa-light fa-sitemap\"\n        [title]=\"'@platform-dev-tools:module.messages.select-node'\"\n        [description]=\"'@platform-dev-tools:module.messages.select-node-hint'\"\n      />\n    }\n  </axp-page-content>\n</axp-page-layout>\n\n<ng-template #nodeTemplate let-node=\"node\">\n  @let data = node['data'];\n  @let treeNode = data?.treeNode;\n  @let kind = treeNode?.kind;\n  @let count = node['childrenCount'] ?? treeNode?.itemCount;\n  <!-- ----- Manifest type group header ----- -->\n  @if (kind === 'type-group') {\n    <span\n      class=\"axp-platform-explorer__node axp-platform-explorer__node--group\"\n      [class.axp-platform-explorer__node--group-divided]=\"treeNode?.divided\"\n    >\n      <!--->\n      <!-- ----- Divider after the previous type group ----- -->\n      @if (treeNode?.divided) {\n        <span class=\"axp-platform-explorer__group-rule\" aria-hidden=\"true\"></span>\n      }\n      <span class=\"axp-platform-explorer__group-title\">{{ node['title'] | translate | async }}</span>\n    </span>\n  }\n  <!-- ----- Catalog node ----- -->\n  @else {\n    <span class=\"axp-platform-explorer__node\">\n      @switch (kind) {\n        @case ('module') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--module\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-cube'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('entities') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entities fa-light fa-table\" aria-hidden=\"true\"></i>\n        }\n        @case ('diagram') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--diagram fa-light fa-diagram-project\" aria-hidden=\"true\"></i>\n        }\n        @case ('entity') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entity\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-table'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('commands') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--commands fa-light fa-terminal\" aria-hidden=\"true\"></i>\n        }\n        @case ('command') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--command\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-play'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('queries') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--queries fa-light fa-database\" aria-hidden=\"true\"></i>\n        }\n        @case ('query') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--query\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-magnifying-glass'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('plugins') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--plugins fa-light fa-puzzle-piece\" aria-hidden=\"true\"></i>\n        }\n        @case ('plugin') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--plugin\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-plug'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('widgets') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--widgets fa-light fa-cubes\" aria-hidden=\"true\"></i>\n        }\n        @case ('widget') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--widget\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-cube'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @default {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--default fa-light fa-circle-dot\" aria-hidden=\"true\"></i>\n        }\n      }\n      <span class=\"axp-platform-explorer__node-label\">{{ node['title'] | translate | async }}</span>\n      <!--->\n      <!-- ----- Child count badge when the folder has items ----- -->\n      @if (count != null && count > 0) {\n        <span class=\"axp-platform-explorer__node-badge\">{{ count }}</span>\n      }\n    </span>\n  }\n</ng-template>\n", styles: ["@layer properties;.axp-platform-explorer axp-layout-container{overflow:hidden}.axp-platform-explorer__page-content{display:flex;min-height:0px;flex:1;flex-direction:column;overflow:hidden}axp-platform-explorer-detail,axp-platform-explorer-entity-detail{display:flex;height:100%;min-height:0px;flex:1;flex-direction:column;overflow:hidden}.axp-platform-explorer__tree-wrap{display:flex;min-height:0px;width:100%;min-width:0px;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto;padding:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);max-height:calc(100vh - 180px)}.axp-platform-explorer__start-side{position:relative;height:100%;flex-shrink:0;overflow:visible}.axp-platform-explorer #axp-drawer-start{overflow:visible}.axp-platform-explorer__search{flex-shrink:0}.axp-platform-explorer__loading{display:flex;flex:1;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 6)}.axp-platform-explorer__node{display:flex;width:100%;min-width:0px;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__node--group{pointer-events:none;width:100%;min-width:0px;flex-direction:column;align-items:stretch;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-platform-explorer__node--group-divided{margin-top:var(--spacing, .25rem);padding-top:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__group-rule{display:block;width:100%;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-light-surface))}.axp-platform-explorer__group-title{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__group-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__tree-wrap .ax-tree-view-node:has(.axp-platform-explorer__node--group){pointer-events:none;cursor:default;background:transparent!important;min-height:0!important;padding-block:.25rem;padding-inline-start:0!important}.axp-platform-explorer__tree-wrap .ax-tree-view-node:has(.axp-platform-explorer__node--group) .ax-tree-view-node-content{padding-inline-start:0!important;margin-inline-start:0!important}.axp-platform-explorer__tree-wrap .ax-tree-view-node:has(.axp-platform-explorer__node--group) .ax-tree-view-expand-toggle{display:none!important;width:0!important;min-width:0!important;margin:0!important;padding:0!important}.axp-platform-explorer__node-icon{width:1em;flex-shrink:0;text-align:center}.axp-platform-explorer__node-icon--module{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__node-icon--diagram,.axp-platform-explorer__node-icon--entities,.axp-platform-explorer__node-icon--entity{color:rgba(var(--ax-sys-color-accent1-surface))}.axp-platform-explorer__node-icon--commands,.axp-platform-explorer__node-icon--command{color:rgba(var(--ax-sys-color-success-surface))}.axp-platform-explorer__node-icon--queries,.axp-platform-explorer__node-icon--query{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__node-icon--plugins,.axp-platform-explorer__node-icon--plugin{color:rgba(var(--ax-sys-color-warning-surface))}.axp-platform-explorer__node-icon--widgets,.axp-platform-explorer__node-icon--widget,.axp-platform-explorer__node-icon--default{color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer__node-label{min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-platform-explorer__node-badge{margin-left:auto;min-width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 1.5);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);background-color:rgba(var(--ax-sys-color-primary-lightest-surface));color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__entity-toolbar{width:100%}.axp-platform-explorer__entity-tabs{width:100%;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i2$1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i3$1.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: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i5$1.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "reorderable", "reorderDelay", "renderMode", "stacked", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged", "onTabsReordered"] }, { kind: "component", type: i5$1.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPThemeLayoutStartSideComponent, selector: "axp-layout-page-start-side, axp-layout-start-side" }, { kind: "component", type: AXPThemeLayoutHeaderComponent, selector: "axp-layout-header" }, { 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: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "component", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "alternate", "nodeTemplate", "idField", "titleField", "highlightText", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "component", type: AXPlatformExplorerDetailComponent, selector: "axp-platform-explorer-detail", inputs: ["node"] }, { kind: "directive", type: AXResizableDirective, selector: "[axResizable]", inputs: ["axResizable", "handles", "minWidth", "maxWidth", "minHeight", "maxHeight", "dblClickAction", "width", "defaultWidth", "height", "defaultHeight", "lockAspectRatio"], outputs: ["axResizableChange", "handlesChange", "minWidthChange", "maxWidthChange", "minHeightChange", "maxHeightChange", "dblClickActionChange", "widthChange", "defaultWidthChange", "heightChange", "defaultHeightChange", "lockAspectRatioChange", "onResizingStarted", "onResizingEnded", "onResizingDblClick"] }, { kind: "pipe", type: i1.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: "22.0.8", ngImport: i0, type: AXPlatformExplorerPageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axp-platform-explorer-page', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+            args: [{ selector: 'axp-platform-explorer-page', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'axp-platform-explorer' }, imports: [
                         CommonModule,
                         AXTranslationModule,
+                        AXLoadingModule,
+                        AXSearchBoxModule,
+                        AXDecoratorModule,
+                        AXTabsModule,
                         AXPPageLayoutComponent,
                         AXPThemeLayoutStartSideComponent,
                         AXPThemeLayoutHeaderComponent,
                         AXPThemeLayoutBlockComponent,
+                        AXPStateMessageComponent,
                         AXTreeViewComponent,
                         AXPlatformExplorerDetailComponent,
+                        AXResizableDirective,
                     ], providers: [
                         PlatformExplorerDataService,
                         {
                             provide: AXPPageLayoutBase,
                             useExisting: AXPlatformExplorerPageComponent,
                         },
-                    ], template: "<axp-page-layout>\n  <axp-layout-start-side>\n    <axp-layout-header>\n      <axp-layout-title>{{ '@platform-dev-tools:module.menus.platform-explorer.title' | translate | async\n        }}</axp-layout-title>\n    </axp-layout-header>\n    <axp-layout-content class=\"axp-platform-explorer__tree-wrap\">\n      @if (loading()) {\n      <p class=\"axp-platform-explorer__loading\">Loading...</p>\n      } @else if (moduleNodes().length === 0) {\n      <p class=\"axp-platform-explorer__empty\">{{ '@platform-dev-tools:module.messages.no-modules' | translate | async }}\n      </p>\n      } @else {\n      <ax-tree-view #tree [datasource]=\"datasource\" [selectMode]=\"'single'\" [showIcons]=\"false\"\n        [showChildrenBadge]=\"true\" [dragBehavior]=\"'none'\" look=\"default\" [nodeTemplate]=\"nodeTemplate\"\n        (onNodeClick)=\"onNodeClick($event)\" (onNodeToggle)=\"onNodeToggle($event)\" />\n      }\n    </axp-layout-content>\n  </axp-layout-start-side>\n\n  <axp-page-content class=\"min-h-0 pt-0\">\n    @if (selectedNode()) {\n    <axp-platform-explorer-detail [node]=\"selectedNode()!\" />\n    } @else {\n    <p class=\"axp-platform-explorer__hint\">{{ '@platform-dev-tools:module.messages.select-node' | translate | async }}\n    </p>\n    }\n  </axp-page-content>\n</axp-page-layout>\n\n<!-- Node template: icon per kind (with color) + label (translated) + badge -->\n<ng-template #nodeTemplate let-node=\"node\">\n  @let data = node['data'];\n  @let treeNode = $safeNavigationMigration(data?.treeNode);\n  @let kind = $safeNavigationMigration(treeNode?.kind);\n  @let count = node['childrenCount'] ?? treeNode?.itemCount;\n  <span class=\"axp-platform-explorer__node\">\n    @switch (kind) {\n    @case ('module') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--module fa-light fa-cube\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('entities') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entities fa-light fa-table-list\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('entity') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entity fa-light fa-table\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('permissions') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--permissions fa-light fa-shield-halved\"\n      aria-hidden=\"true\"></i>\n    }\n    @case ('features') {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--features fa-light fa-sliders\"\n      aria-hidden=\"true\"></i>\n    }\n    @default {\n    <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--default fa-light fa-circle-dot\"\n      aria-hidden=\"true\"></i>\n    }\n    }\n    <span class=\"axp-platform-explorer__node-label\">{{ node['title'] | translate | async }}</span>\n    @if (count != null && count > 0) {\n    <span class=\"axp-platform-explorer__node-badge\">{{ count }}</span>\n    }\n  </span>\n</ng-template>", styles: ["@layer properties;.axp-platform-explorer .axp-platform-explorer__tree-wrap{display:flex;min-height:0px;min-width:calc(var(--spacing, .25rem) * 64);flex-direction:column;overflow-x:auto;overflow-y:auto;padding:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);max-height:calc(100vh - 180px)}.axp-platform-explorer .axp-platform-explorer__loading,.axp-platform-explorer .axp-platform-explorer__empty{margin:0;padding:calc(var(--spacing, .25rem) * 4);color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__hint{padding:calc(var(--spacing, .25rem) * 6);color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__node{display:flex;width:100%;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer .axp-platform-explorer__node-icon{width:1em;flex-shrink:0}.axp-platform-explorer .axp-platform-explorer__node-icon--module{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--entities{color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__node-icon--entity{color:rgba(var(--ax-sys-color-accent1-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--permissions{color:rgba(var(--ax-sys-color-success-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--features{color:rgba(var(--ax-sys-color-warning-surface))}.axp-platform-explorer .axp-platform-explorer__node-icon--default{color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer .axp-platform-explorer__node-label{min-width:0px;flex:1;white-space:nowrap}.axp-platform-explorer .axp-platform-explorer__node-badge{margin-left:auto;min-width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 1.5);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);background-color:rgba(var(--ax-sys-color-primary-lightest-surface));color:rgba(var(--ax-sys-color-primary-surface))}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+                    ], template: "<axp-page-layout>\n  <axp-layout-start-side\n    class=\"axp-platform-explorer__start-side\"\n    [axResizable]=\"!deviceService.isSmall()\"\n    [minWidth]=\"moduleListMinWidth\"\n    [maxWidth]=\"moduleListMaxWidth\"\n    [width]=\"moduleListWidth()\"\n    [defaultWidth]=\"moduleListDefaultWidth\"\n    [dblClickAction]=\"'reset'\"\n    (onResizingEnded)=\"onModuleListResized($event)\"\n    (onResizingDblClick)=\"onModuleListResized($event)\"\n  >\n    <axp-layout-header>\n      <axp-layout-title>\n        {{ '@platform-dev-tools:module.menus.platform-explorer.title' | translate | async }}\n      </axp-layout-title>\n    </axp-layout-header>\n    <axp-layout-content class=\"axp-platform-explorer__tree-wrap\">\n      <ax-search-box\n        class=\"axp-platform-explorer__search\"\n        look=\"fill\"\n        [delayTime]=\"300\"\n        [value]=\"search()\"\n        [placeholder]=\"('@platform-dev-tools:module.messages.search-modules' | translate | async) ?? ''\"\n        (onValueChanged)=\"onSearchChanged($event)\"\n      >\n        <ax-clear-button></ax-clear-button>\n      </ax-search-box>\n      <!-- ----- Loading catalog modules ----- -->\n      @if (loading()) {\n        <div class=\"axp-platform-explorer__loading\">\n          <ax-loading></ax-loading>\n        </div>\n      }\n      <!-- ----- Catalog query failed ----- -->\n      @else if (loadError()) {\n        <axp-state-message\n          icon=\"fa-light fa-triangle-exclamation\"\n          [title]=\"'@platform-dev-tools:module.messages.load-error-title'\"\n          [description]=\"'@platform-dev-tools:module.messages.load-error'\"\n        />\n      }\n      <!-- ----- No modules in catalog ----- -->\n      @else if (!hasCatalogModules()) {\n        <axp-state-message\n          icon=\"fa-light fa-cubes\"\n          [title]=\"'@platform-dev-tools:module.messages.no-modules'\"\n          [description]=\"'@platform-dev-tools:module.messages.no-modules-hint'\"\n        />\n      }\n      <!-- ----- Module tree ----- -->\n      @else {\n        <ax-tree-view\n          #tree\n          [datasource]=\"datasource\"\n          [selectMode]=\"'single'\"\n          [showIcons]=\"false\"\n          [showChildrenBadge]=\"false\"\n          [dragBehavior]=\"'none'\"\n          look=\"default\"\n          [nodeTemplate]=\"nodeTemplate\"\n          (onNodeClick)=\"onNodeClick($event)\"\n        />\n      }\n    </axp-layout-content>\n  </axp-layout-start-side>\n\n  <!-- ----- Entity layout tabs stay in the sticky page header ----- -->\n  @if (entityTabs().length) {\n    <axp-page-toolbar class=\"axp-platform-explorer__entity-toolbar\">\n      <ax-tabs\n        class=\"axp-platform-explorer__entity-tabs\"\n        [look]=\"'with-line'\"\n        [location]=\"'bottom'\"\n        [fitParent]=\"false\"\n        (onActiveTabChanged)=\"onEntityTabChanged($event)\"\n      >\n        @for (tab of entityTabs(); track tab.id) {\n          <ax-tab-item\n            [key]=\"tab.id\"\n            [text]=\"\n              ((tab.textKey | translate | async) ?? '') +\n              (tab.extraText ? ' \u00B7 ' + ((tab.extraText | translate | async) ?? '') : '')\n            \"\n            [active]=\"activeEntitySection() === tab.id\"\n          />\n        }\n      </ax-tabs>\n    </axp-page-toolbar>\n  }\n\n  <axp-page-content class=\"axp-platform-explorer__page-content min-h-0 pt-0\">\n    <!-- ----- Selected catalog node ----- -->\n    @if (selectedNode(); as node) {\n      <axp-platform-explorer-detail [node]=\"node\" />\n    }\n    <!-- ----- Empty selection ----- -->\n    @else {\n      <axp-state-message\n        icon=\"fa-light fa-sitemap\"\n        [title]=\"'@platform-dev-tools:module.messages.select-node'\"\n        [description]=\"'@platform-dev-tools:module.messages.select-node-hint'\"\n      />\n    }\n  </axp-page-content>\n</axp-page-layout>\n\n<ng-template #nodeTemplate let-node=\"node\">\n  @let data = node['data'];\n  @let treeNode = data?.treeNode;\n  @let kind = treeNode?.kind;\n  @let count = node['childrenCount'] ?? treeNode?.itemCount;\n  <!-- ----- Manifest type group header ----- -->\n  @if (kind === 'type-group') {\n    <span\n      class=\"axp-platform-explorer__node axp-platform-explorer__node--group\"\n      [class.axp-platform-explorer__node--group-divided]=\"treeNode?.divided\"\n    >\n      <!--->\n      <!-- ----- Divider after the previous type group ----- -->\n      @if (treeNode?.divided) {\n        <span class=\"axp-platform-explorer__group-rule\" aria-hidden=\"true\"></span>\n      }\n      <span class=\"axp-platform-explorer__group-title\">{{ node['title'] | translate | async }}</span>\n    </span>\n  }\n  <!-- ----- Catalog node ----- -->\n  @else {\n    <span class=\"axp-platform-explorer__node\">\n      @switch (kind) {\n        @case ('module') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--module\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-cube'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('entities') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entities fa-light fa-table\" aria-hidden=\"true\"></i>\n        }\n        @case ('diagram') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--diagram fa-light fa-diagram-project\" aria-hidden=\"true\"></i>\n        }\n        @case ('entity') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--entity\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-table'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('commands') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--commands fa-light fa-terminal\" aria-hidden=\"true\"></i>\n        }\n        @case ('command') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--command\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-play'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('queries') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--queries fa-light fa-database\" aria-hidden=\"true\"></i>\n        }\n        @case ('query') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--query\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-magnifying-glass'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('plugins') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--plugins fa-light fa-puzzle-piece\" aria-hidden=\"true\"></i>\n        }\n        @case ('plugin') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--plugin\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-plug'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @case ('widgets') {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--widgets fa-light fa-cubes\" aria-hidden=\"true\"></i>\n        }\n        @case ('widget') {\n          <i\n            class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--widget\"\n            [ngClass]=\"treeNode?.icon || 'fa-light fa-cube'\"\n            aria-hidden=\"true\"\n          ></i>\n        }\n        @default {\n          <i class=\"axp-platform-explorer__node-icon axp-platform-explorer__node-icon--default fa-light fa-circle-dot\" aria-hidden=\"true\"></i>\n        }\n      }\n      <span class=\"axp-platform-explorer__node-label\">{{ node['title'] | translate | async }}</span>\n      <!--->\n      <!-- ----- Child count badge when the folder has items ----- -->\n      @if (count != null && count > 0) {\n        <span class=\"axp-platform-explorer__node-badge\">{{ count }}</span>\n      }\n    </span>\n  }\n</ng-template>\n", styles: ["@layer properties;.axp-platform-explorer axp-layout-container{overflow:hidden}.axp-platform-explorer__page-content{display:flex;min-height:0px;flex:1;flex-direction:column;overflow:hidden}axp-platform-explorer-detail,axp-platform-explorer-entity-detail{display:flex;height:100%;min-height:0px;flex:1;flex-direction:column;overflow:hidden}.axp-platform-explorer__tree-wrap{display:flex;min-height:0px;width:100%;min-width:0px;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto;padding:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);max-height:calc(100vh - 180px)}.axp-platform-explorer__start-side{position:relative;height:100%;flex-shrink:0;overflow:visible}.axp-platform-explorer #axp-drawer-start{overflow:visible}.axp-platform-explorer__search{flex-shrink:0}.axp-platform-explorer__loading{display:flex;flex:1;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 6)}.axp-platform-explorer__node{display:flex;width:100%;min-width:0px;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__node--group{pointer-events:none;width:100%;min-width:0px;flex-direction:column;align-items:stretch;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-platform-explorer__node--group-divided{margin-top:var(--spacing, .25rem);padding-top:calc(var(--spacing, .25rem) * 2)}.axp-platform-explorer__group-rule{display:block;width:100%;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-light-surface))}.axp-platform-explorer__group-title{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-platform-explorer__group-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-platform-explorer__tree-wrap .ax-tree-view-node:has(.axp-platform-explorer__node--group){pointer-events:none;cursor:default;background:transparent!important;min-height:0!important;padding-block:.25rem;padding-inline-start:0!important}.axp-platform-explorer__tree-wrap .ax-tree-view-node:has(.axp-platform-explorer__node--group) .ax-tree-view-node-content{padding-inline-start:0!important;margin-inline-start:0!important}.axp-platform-explorer__tree-wrap .ax-tree-view-node:has(.axp-platform-explorer__node--group) .ax-tree-view-expand-toggle{display:none!important;width:0!important;min-width:0!important;margin:0!important;padding:0!important}.axp-platform-explorer__node-icon{width:1em;flex-shrink:0;text-align:center}.axp-platform-explorer__node-icon--module{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__node-icon--diagram,.axp-platform-explorer__node-icon--entities,.axp-platform-explorer__node-icon--entity{color:rgba(var(--ax-sys-color-accent1-surface))}.axp-platform-explorer__node-icon--commands,.axp-platform-explorer__node-icon--command{color:rgba(var(--ax-sys-color-success-surface))}.axp-platform-explorer__node-icon--queries,.axp-platform-explorer__node-icon--query{color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__node-icon--plugins,.axp-platform-explorer__node-icon--plugin{color:rgba(var(--ax-sys-color-warning-surface))}.axp-platform-explorer__node-icon--widgets,.axp-platform-explorer__node-icon--widget,.axp-platform-explorer__node-icon--default{color:var(--color-neutral-500, oklch(55.6% 0 none))}.axp-platform-explorer__node-label{min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-platform-explorer__node-badge{margin-left:auto;min-width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 1.5);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);background-color:rgba(var(--ax-sys-color-primary-lightest-surface));color:rgba(var(--ax-sys-color-primary-surface))}.axp-platform-explorer__entity-toolbar{width:100%}.axp-platform-explorer__entity-tabs{width:100%;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { tree: [{ type: i0.ViewChild, args: ['tree', { isSignal: true }] }] } });
 
-//#region ----   Imports   ----
+//#region ----- Imports -----
 //#endregion
-//#region ----   Component   ----
-class AXPlatformExplorerTreeNodeComponent {
+//#region ----- Component -----
+class AXPlatformExplorerListDetailComponent {
     constructor() {
-        this.node = input.required(/* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
-        this.selectedId = input(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "selectedId" }] : /* istanbul ignore next */ []));
-        this.nodeSelect = output();
-        this.expanded = signal(true, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
-    }
-    childrenLength() {
-        return this.node().children?.length ?? 0;
-    }
-    hasChildren() {
-        const children = this.node().children;
-        return !!children && children.length > 0;
-    }
-    isSelected() {
-        return this.selectedId() === this.node().id;
-    }
-    toggle() {
-        if (this.hasChildren()) {
-            this.expanded.update((v) => !v);
-        }
-    }
-    select() {
-        this.nodeSelect.emit(this.node());
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerTreeNodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerTreeNodeComponent, isStandalone: true, selector: "axp-platform-explorer-tree-node", inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: true, transformFunction: null }, selectedId: { classPropertyName: "selectedId", publicName: "selectedId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { nodeSelect: "nodeSelect" }, ngImport: i0, template: `
-    <div class="axp-tree-node" [class.axp-tree-node--selected]="isSelected()">
-      <button
-        type="button"
-        class="axp-tree-node__toggler"
-        [class.axp-tree-node__toggler--open]="expanded()"
-        [attr.aria-expanded]="expanded()"
-        (click)="toggle()"
-      >
-        @if (hasChildren()) {
-          <span class="axp-tree-node__icon" aria-hidden="true">{{ expanded() ? '▼' : '▶' }}</span>
-        } @else {
-          <span class="axp-tree-node__icon axp-tree-node__icon--empty"></span>
-        }
-      </button>
-      <button
-        type="button"
-        class="axp-tree-node__label"
-        (click)="select()"
-      >
-        {{ node().label }}
-        @if (childrenLength() > 0) {
-          <span class="axp-tree-node__badge">({{ childrenLength() }})</span>
+        this.moduleName = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "moduleName" }] : /* istanbul ignore next */ []));
+        this.kind = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "kind" }] : /* istanbul ignore next */ []));
+        this.dataService = inject(PlatformExplorerDataService);
+        this.dataSource = new AXDataSource({
+            key: 'name',
+            pageSize: 20,
+            load: async (e) => {
+                const rows = await this.loadRows();
+                const skip = e?.skip ?? 0;
+                const take = e?.take ?? 20;
+                return { items: rows.slice(skip, skip + take), total: rows.length };
+            },
+        });
+        effect(() => {
+            this.moduleName();
+            this.kind();
+            this.dataSource.refresh();
+        });
+    }
+    async loadRows() {
+        const catalog = await this.dataService.getModule(this.moduleName());
+        if (!catalog) {
+            return [];
         }
-      </button>
-    </div>
-    @if (hasChildren() && expanded()) {
-      <div class="axp-tree-node__children">
-        @for (child of node().children ?? []; track child.id) {
-          <axp-platform-explorer-tree-node
-            [node]="child"
-            [selectedId]="selectedId()"
-            (nodeSelect)="nodeSelect.emit($event)"
-          />
+        switch (this.kind()) {
+            case 'entities':
+                return catalog.entities.map((item) => ({
+                    name: item.name,
+                    title: item.title ?? item.name,
+                    module: item.module,
+                }));
+            case 'commands':
+                return catalog.commands;
+            case 'queries':
+                return catalog.queries;
+            case 'plugins':
+                return catalog.plugins;
+            case 'widgets':
+                return catalog.widgets;
+            default:
+                return [];
         }
-      </div>
     }
-  `, isInline: true, styles: [":host{display:block}.axp-tree-node{display:flex;align-items:center;min-height:28px}.axp-tree-node--selected .axp-tree-node__label{font-weight:600;background:var(--ax-neutral-surface-hover, rgba(0, 0, 0, .04))}.axp-tree-node__toggler{width:24px;height:28px;padding:0;border:none;background:none;cursor:pointer;color:var(--ax-neutral-text-secondary, #666);flex-shrink:0}.axp-tree-node__toggler--open .axp-tree-node__icon{transform:rotate(0)}.axp-tree-node__icon{font-size:10px;display:inline-block}.axp-tree-node__icon--empty{width:10px}.axp-tree-node__label{flex:1;text-align:start;padding:4px 8px;border:none;background:none;cursor:pointer;font-size:13px;border-radius:4px}.axp-tree-node__label:hover{background:var(--ax-neutral-surface-hover, rgba(0, 0, 0, .04))}.axp-tree-node__badge{margin-inline-start:4px;font-size:11px;color:var(--ax-neutral-text-secondary, #666);font-weight:400}.axp-tree-node__children{padding-inline-start:16px}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXPlatformExplorerTreeNodeComponent, selector: "axp-platform-explorer-tree-node", inputs: ["node", "selectedId"], outputs: ["nodeSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerListDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPlatformExplorerListDetailComponent, isStandalone: true, selector: "axp-platform-explorer-list-detail", inputs: { moduleName: { classPropertyName: "moduleName", publicName: "moduleName", isSignal: true, isRequired: true, transformFunction: null }, kind: { classPropertyName: "kind", publicName: "kind", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "flex flex-col flex-1 min-h-0" }, ngImport: i0, template: `
+    <div class="flex flex-1 min-h-0 p-3 overflow-auto">
+      <ax-data-table
+        class="flex-1 border border-lightest rounded-md overflow-hidden"
+        [paging]="true"
+        [dataSource]="dataSource"
+      >
+        <ax-text-column [dataField]="'name'" [caption]="'@platform-dev-tools:module.terms.name' | translate | async" [width]="'280px'" [allowResizing]="true"></ax-text-column>
+        <ax-text-column [dataField]="'title'" [caption]="'@platform-dev-tools:module.terms.title' | translate | async" [cellTemplate]="titleTpl" [width]="'280px'" [allowResizing]="true"></ax-text-column>
+        <ax-text-column [dataField]="'description'" [caption]="'@platform-dev-tools:module.terms.description' | translate | async" [cellTemplate]="descTpl" [allowResizing]="true"></ax-text-column>
+      </ax-data-table>
+    </div>
+    <ng-template #titleTpl let-item>
+      @if (item.data?.title) {
+        {{ item.data.title | translate | async }}
+      }
+      @else {
+        –
+      }
+    </ng-template>
+    <ng-template #descTpl let-item>
+      @if (item.data?.description) {
+        {{ item.data.description | translate | async }}
+      }
+      @else {
+        –
+      }
+    </ng-template>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1$1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i1$1.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "hasTitle", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "translate", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.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: "22.0.8", ngImport: i0, type: AXPlatformExplorerTreeNodeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPlatformExplorerListDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axp-platform-explorer-tree-node', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXPlatformExplorerTreeNodeComponent], template: `
-    <div class="axp-tree-node" [class.axp-tree-node--selected]="isSelected()">
-      <button
-        type="button"
-        class="axp-tree-node__toggler"
-        [class.axp-tree-node__toggler--open]="expanded()"
-        [attr.aria-expanded]="expanded()"
-        (click)="toggle()"
-      >
-        @if (hasChildren()) {
-          <span class="axp-tree-node__icon" aria-hidden="true">{{ expanded() ? '▼' : '▶' }}</span>
-        } @else {
-          <span class="axp-tree-node__icon axp-tree-node__icon--empty"></span>
-        }
-      </button>
-      <button
-        type="button"
-        class="axp-tree-node__label"
-        (click)="select()"
+            args: [{
+                    selector: 'axp-platform-explorer-list-detail',
+                    standalone: true,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'flex flex-col flex-1 min-h-0' },
+                    imports: [CommonModule, AXDataTableModule, AXTranslationModule],
+                    template: `
+    <div class="flex flex-1 min-h-0 p-3 overflow-auto">
+      <ax-data-table
+        class="flex-1 border border-lightest rounded-md overflow-hidden"
+        [paging]="true"
+        [dataSource]="dataSource"
       >
-        {{ node().label }}
-        @if (childrenLength() > 0) {
-          <span class="axp-tree-node__badge">({{ childrenLength() }})</span>
-        }
-      </button>
+        <ax-text-column [dataField]="'name'" [caption]="'@platform-dev-tools:module.terms.name' | translate | async" [width]="'280px'" [allowResizing]="true"></ax-text-column>
+        <ax-text-column [dataField]="'title'" [caption]="'@platform-dev-tools:module.terms.title' | translate | async" [cellTemplate]="titleTpl" [width]="'280px'" [allowResizing]="true"></ax-text-column>
+        <ax-text-column [dataField]="'description'" [caption]="'@platform-dev-tools:module.terms.description' | translate | async" [cellTemplate]="descTpl" [allowResizing]="true"></ax-text-column>
+      </ax-data-table>
     </div>
-    @if (hasChildren() && expanded()) {
-      <div class="axp-tree-node__children">
-        @for (child of node().children ?? []; track child.id) {
-          <axp-platform-explorer-tree-node
-            [node]="child"
-            [selectedId]="selectedId()"
-            (nodeSelect)="nodeSelect.emit($event)"
-          />
-        }
-      </div>
-    }
-  `, styles: [":host{display:block}.axp-tree-node{display:flex;align-items:center;min-height:28px}.axp-tree-node--selected .axp-tree-node__label{font-weight:600;background:var(--ax-neutral-surface-hover, rgba(0, 0, 0, .04))}.axp-tree-node__toggler{width:24px;height:28px;padding:0;border:none;background:none;cursor:pointer;color:var(--ax-neutral-text-secondary, #666);flex-shrink:0}.axp-tree-node__toggler--open .axp-tree-node__icon{transform:rotate(0)}.axp-tree-node__icon{font-size:10px;display:inline-block}.axp-tree-node__icon--empty{width:10px}.axp-tree-node__label{flex:1;text-align:start;padding:4px 8px;border:none;background:none;cursor:pointer;font-size:13px;border-radius:4px}.axp-tree-node__label:hover{background:var(--ax-neutral-surface-hover, rgba(0, 0, 0, .04))}.axp-tree-node__badge{margin-inline-start:4px;font-size:11px;color:var(--ax-neutral-text-secondary, #666);font-weight:400}.axp-tree-node__children{padding-inline-start:16px}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
-        }], propDecorators: { node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: true }] }], selectedId: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedId", required: false }] }], nodeSelect: [{ type: i0.Output, args: ["nodeSelect"] }] } });
+    <ng-template #titleTpl let-item>
+      @if (item.data?.title) {
+        {{ item.data.title | translate | async }}
+      }
+      @else {
+        –
+      }
+    </ng-template>
+    <ng-template #descTpl let-item>
+      @if (item.data?.description) {
+        {{ item.data.description | translate | async }}
+      }
+      @else {
+        –
+      }
+    </ng-template>
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { moduleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "moduleName", required: true }] }], kind: [{ type: i0.Input, args: [{ isSignal: true, alias: "kind", required: true }] }] } });
 
 //#region ----   Imports   ----
 //#endregion
@@ -999,11 +2698,6 @@ class AXMPlatformDevToolsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMPlatformDevToolsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXMPlatformDevToolsModule }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMPlatformDevToolsModule, providers: [
-            {
-                provide: AXP_MODULE_MANIFEST_PROVIDER,
-                useValue: PlatformDevToolsManifest,
-                multi: true,
-            },
             {
                 provide: AXP_PERMISSION_DEFINITION_PROVIDER,
                 useClass: AXMPermissionDefinitionProvider,
@@ -1029,11 +2723,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                     exports: [],
                     declarations: [],
                     providers: [
-                        {
-                            provide: AXP_MODULE_MANIFEST_PROVIDER,
-                            useValue: PlatformDevToolsManifest,
-                            multi: true,
-                        },
                         {
                             provide: AXP_PERMISSION_DEFINITION_PROVIDER,
                             useClass: AXMPermissionDefinitionProvider,
@@ -1058,5 +2747,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AXMPermissionDefinitionProvider, AXMPlatformDevToolsModule, AXPlatformExplorerDetailComponent, AXPlatformExplorerEntityDetailComponent, AXPlatformExplorerFeaturesListDetailComponent, AXPlatformExplorerModuleDetailComponent, AXPlatformExplorerPageComponent, AXPlatformExplorerPermissionsListDetailComponent, AXPlatformExplorerTreeNodeComponent, PlatformDevToolsManifest, PlatformExplorerDataService };
+export { AXMPermissionDefinitionProvider, AXMPlatformDevToolsModule, AXPlatformExplorerCatalogDetailComponent, AXPlatformExplorerDetailComponent, AXPlatformExplorerEntitiesGraphComponent, AXPlatformExplorerEntityDetailComponent, AXPlatformExplorerListDetailComponent, AXPlatformExplorerModuleDetailComponent, AXPlatformExplorerPageComponent, PlatformExplorerDataService };
 //# sourceMappingURL=acorex-platform-module-platform-dev-tools-client.mjs.map