@acorex/platform 20.7.17 → 20.7.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/acorex-platform-common.mjs +5 -4
- package/fesm2022/acorex-platform-common.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-entity.mjs +10 -10
- package/fesm2022/acorex-platform-layout-entity.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-widget-core.mjs +15 -2
- package/fesm2022/acorex-platform-layout-widget-core.mjs.map +1 -1
- package/fesm2022/{acorex-platform-themes-default-entity-master-list-view.component-BQODc73e.mjs → acorex-platform-themes-default-entity-master-list-view.component-DDd7YryZ.mjs} +41 -2
- package/fesm2022/{acorex-platform-themes-default-entity-master-list-view.component-BQODc73e.mjs.map → acorex-platform-themes-default-entity-master-list-view.component-DDd7YryZ.mjs.map} +1 -1
- package/fesm2022/acorex-platform-themes-default.mjs +54 -6
- package/fesm2022/acorex-platform-themes-default.mjs.map +1 -1
- package/layout/widget-core/index.d.ts +7 -0
- package/package.json +1 -1
- package/themes/default/index.d.ts +9 -0
|
@@ -279,6 +279,30 @@ class AXPRootLayoutMenuComponent {
|
|
|
279
279
|
shouldRenderMenuItem(item) {
|
|
280
280
|
return this.visibilityService.shouldRenderMenuItem(item, (item) => this.getRouterLink(item));
|
|
281
281
|
}
|
|
282
|
+
/**
|
|
283
|
+
* Checks if an item takes up visual space in the menu (group title or rendered menu item).
|
|
284
|
+
*/
|
|
285
|
+
isItemRendered(item) {
|
|
286
|
+
if (item.type === 'break') {
|
|
287
|
+
return false;
|
|
288
|
+
}
|
|
289
|
+
if (item.type === 'group') {
|
|
290
|
+
return this.isItemVisible(item);
|
|
291
|
+
}
|
|
292
|
+
return this.shouldRenderMenuItem(item);
|
|
293
|
+
}
|
|
294
|
+
/**
|
|
295
|
+
* Determines if a divider should be shown. A divider is only shown when there is
|
|
296
|
+
* visible content on both sides; if before or after is blank, the divider is hidden.
|
|
297
|
+
*/
|
|
298
|
+
shouldShowDivider(item, items, index) {
|
|
299
|
+
if (item.type !== 'break' || !items || index < 0) {
|
|
300
|
+
return false;
|
|
301
|
+
}
|
|
302
|
+
const hasVisibleBefore = items.slice(0, index).some((i) => this.isItemRendered(i));
|
|
303
|
+
const hasVisibleAfter = items.slice(index + 1).some((i) => this.isItemRendered(i));
|
|
304
|
+
return hasVisibleBefore && hasVisibleAfter;
|
|
305
|
+
}
|
|
282
306
|
//#endregion
|
|
283
307
|
//#region ---- Menu Navigation Helpers ----
|
|
284
308
|
/**
|
|
@@ -381,7 +405,7 @@ class AXPRootLayoutMenuComponent {
|
|
|
381
405
|
return lowerPath.startsWith('http://') || lowerPath.startsWith('https://');
|
|
382
406
|
}
|
|
383
407
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXPRootLayoutMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
384
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXPRootLayoutMenuComponent, isStandalone: true, selector: "axp-side-menu", ngImport: i0, template: "<ax-side-menu look=\"pills\">\n @
|
|
408
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXPRootLayoutMenuComponent, isStandalone: true, selector: "axp-side-menu", ngImport: i0, template: "<ax-side-menu look=\"pills\">\n @let sortedItems = sort(menuStore.items());\n @for (item of sortedItems; track item; let i = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: item, items: sortedItems, index: i }\"> </ng-container>\n }\n</ax-side-menu>\n<ng-template #recursiveMenu let-item=\"item\" let-items=\"items\" let-index=\"index\">\n @if (item.type == 'group') {\n @if (isItemVisible(item)) {\n <ax-title>{{ item.text | translate | async }}</ax-title>\n }\n } @else if (item.type == 'break') {\n @if (shouldShowDivider(item, items, index)) {\n <ax-divider></ax-divider>\n }\n } @else {\n @if (shouldRenderMenuItem(item)) {\n @let routerLinkValue = getRouterLink(item);\n @if (routerLinkValue) {\n <ax-side-menu-item [attr.id]=\"'axp-menu-item-' + (item.name || item.text)\" (onClick)=\"onMenuItemClick(item, true)\"\n [routerLink]=\"routerLinkValue\" [active]=\"item === menuStore.selectedMenuItem().item\"\n [isCollapsed]=\"!menuStore.isItemOpen(item)\">\n <ax-prefix>\n <ax-icon [class]=\"item.icon\" class=\"fa-fw\"></ax-icon>\n </ax-prefix>\n <span>{{ item.text | translate | async }}</span>\n @if (item.children?.length) {\n <ng-container>\n @let sortedChildren = sort(item.children);\n @for (child of sortedChildren; track child; let childIndex = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: child, items: sortedChildren, index: childIndex }\">\n </ng-container>\n }\n </ng-container>\n }\n <ax-suffix>\n @if (badgeVisible()) {\n <ax-badge [axp-task-badge]=\"getMenuBadge(item)()\" color=\"secondary\"></ax-badge>\n }\n </ax-suffix>\n </ax-side-menu-item>\n } @else {\n <ax-side-menu-item [attr.id]=\"'axp-menu-item-' + (item.name || item.text)\" (onClick)=\"onMenuItemClick(item)\"\n [active]=\"item === menuStore.selectedMenuItem().item\" [isCollapsed]=\"!menuStore.isItemOpen(item)\">\n <ax-prefix>\n <ax-icon [class]=\"item.icon\" class=\"fa-fw\"></ax-icon>\n </ax-prefix>\n <span>{{ item.text | translate | async }}</span>\n @if (item.children?.length) {\n <ng-container>\n @let sortedChildren = sort(item.children);\n @for (child of sortedChildren; track child; let childIndex = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: child, items: sortedChildren, index: childIndex }\">\n </ng-container>\n }\n </ng-container>\n }\n <ax-suffix>\n @if (badgeVisible()) {\n <ax-badge [axp-task-badge]=\"getMenuBadge(item)()\" color=\"secondary\"></ax-badge>\n }\n </ax-suffix>\n </ax-side-menu-item>\n }\n }\n }\n</ng-template>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXSideMenuModule }, { kind: "component", type: i2$2.AXSideMenuComponent, selector: "ax-side-menu", inputs: ["items", "look", "location"], outputs: ["itemsChange"] }, { kind: "component", type: i2$2.AXSideMenuItemComponent, selector: "ax-side-menu-item", inputs: ["disabled", "text", "active", "isLoading", "isCollapsed", "toggleOnClick", "href", "routerLink", "routerLinkActive", "routerLinkActiveOptions", "target"], outputs: ["textChange", "activeChange", "isLoadingChange", "isCollapsedChange", "onClick"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: AXPTaskBadgeDirective, selector: "[axp-task-badge]", inputs: ["badgeKey", "axp-task-badge"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i4.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
385
409
|
}
|
|
386
410
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXPRootLayoutMenuComponent, decorators: [{
|
|
387
411
|
type: Component,
|
|
@@ -392,7 +416,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
392
416
|
AXPTaskBadgeDirective,
|
|
393
417
|
AXDecoratorModule,
|
|
394
418
|
AXBadgeModule,
|
|
395
|
-
], template: "<ax-side-menu look=\"pills\">\n @
|
|
419
|
+
], template: "<ax-side-menu look=\"pills\">\n @let sortedItems = sort(menuStore.items());\n @for (item of sortedItems; track item; let i = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: item, items: sortedItems, index: i }\"> </ng-container>\n }\n</ax-side-menu>\n<ng-template #recursiveMenu let-item=\"item\" let-items=\"items\" let-index=\"index\">\n @if (item.type == 'group') {\n @if (isItemVisible(item)) {\n <ax-title>{{ item.text | translate | async }}</ax-title>\n }\n } @else if (item.type == 'break') {\n @if (shouldShowDivider(item, items, index)) {\n <ax-divider></ax-divider>\n }\n } @else {\n @if (shouldRenderMenuItem(item)) {\n @let routerLinkValue = getRouterLink(item);\n @if (routerLinkValue) {\n <ax-side-menu-item [attr.id]=\"'axp-menu-item-' + (item.name || item.text)\" (onClick)=\"onMenuItemClick(item, true)\"\n [routerLink]=\"routerLinkValue\" [active]=\"item === menuStore.selectedMenuItem().item\"\n [isCollapsed]=\"!menuStore.isItemOpen(item)\">\n <ax-prefix>\n <ax-icon [class]=\"item.icon\" class=\"fa-fw\"></ax-icon>\n </ax-prefix>\n <span>{{ item.text | translate | async }}</span>\n @if (item.children?.length) {\n <ng-container>\n @let sortedChildren = sort(item.children);\n @for (child of sortedChildren; track child; let childIndex = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: child, items: sortedChildren, index: childIndex }\">\n </ng-container>\n }\n </ng-container>\n }\n <ax-suffix>\n @if (badgeVisible()) {\n <ax-badge [axp-task-badge]=\"getMenuBadge(item)()\" color=\"secondary\"></ax-badge>\n }\n </ax-suffix>\n </ax-side-menu-item>\n } @else {\n <ax-side-menu-item [attr.id]=\"'axp-menu-item-' + (item.name || item.text)\" (onClick)=\"onMenuItemClick(item)\"\n [active]=\"item === menuStore.selectedMenuItem().item\" [isCollapsed]=\"!menuStore.isItemOpen(item)\">\n <ax-prefix>\n <ax-icon [class]=\"item.icon\" class=\"fa-fw\"></ax-icon>\n </ax-prefix>\n <span>{{ item.text | translate | async }}</span>\n @if (item.children?.length) {\n <ng-container>\n @let sortedChildren = sort(item.children);\n @for (child of sortedChildren; track child; let childIndex = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: child, items: sortedChildren, index: childIndex }\">\n </ng-container>\n }\n </ng-container>\n }\n <ax-suffix>\n @if (badgeVisible()) {\n <ax-badge [axp-task-badge]=\"getMenuBadge(item)()\" color=\"secondary\"></ax-badge>\n }\n </ax-suffix>\n </ax-side-menu-item>\n }\n }\n }\n</ng-template>" }]
|
|
396
420
|
}], ctorParameters: () => [] });
|
|
397
421
|
|
|
398
422
|
class AXPHorizontalMenuComponent {
|
|
@@ -443,6 +467,30 @@ class AXPHorizontalMenuComponent {
|
|
|
443
467
|
shouldRenderMenuItem(item) {
|
|
444
468
|
return this.visibilityService.shouldRenderMenuItem(item, (item) => this.getRouterLink(item));
|
|
445
469
|
}
|
|
470
|
+
/**
|
|
471
|
+
* Checks if an item takes up visual space in the menu (group title or rendered menu item).
|
|
472
|
+
*/
|
|
473
|
+
isItemRendered(item) {
|
|
474
|
+
if (item.type === 'break') {
|
|
475
|
+
return false;
|
|
476
|
+
}
|
|
477
|
+
if (item.type === 'group') {
|
|
478
|
+
return this.isItemVisible(item);
|
|
479
|
+
}
|
|
480
|
+
return this.shouldRenderMenuItem(item);
|
|
481
|
+
}
|
|
482
|
+
/**
|
|
483
|
+
* Determines if a divider should be shown. A divider is only shown when there is
|
|
484
|
+
* visible content on both sides; if before or after is blank, the divider is hidden.
|
|
485
|
+
*/
|
|
486
|
+
shouldShowDivider(item, items, index) {
|
|
487
|
+
if (item.type !== 'break' || !items || index < 0) {
|
|
488
|
+
return false;
|
|
489
|
+
}
|
|
490
|
+
const hasVisibleBefore = items.slice(0, index).some((i) => this.isItemRendered(i));
|
|
491
|
+
const hasVisibleAfter = items.slice(index + 1).some((i) => this.isItemRendered(i));
|
|
492
|
+
return hasVisibleBefore && hasVisibleAfter;
|
|
493
|
+
}
|
|
446
494
|
//#endregion
|
|
447
495
|
//#region ---- Menu Navigation Helpers ----
|
|
448
496
|
/**
|
|
@@ -545,7 +593,7 @@ class AXPHorizontalMenuComponent {
|
|
|
545
593
|
return lowerPath.startsWith('http://') || lowerPath.startsWith('https://');
|
|
546
594
|
}
|
|
547
595
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXPHorizontalMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
548
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXPHorizontalMenuComponent, isStandalone: true, selector: "axp-horizontal-menu", host: { classAttribute: "ax-light" }, ngImport: i0, template: "<div\n class=\"ax-w-full ax-flex ax-items-center ax-justify-between ax-gap-1 ax-bg-primary-surface ax-text-primary-on-surface ax-h-14 ax-px-4\"\n>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-logo\n [source]=\"platformConfig.logo?.full?.dark\"\n [attr.alt]=\"platformConfig.title\"\n class=\"ax-mx-auto ax-text-2xl\"\n ></axp-logo>\n </div>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-component-slot name=\"root-header-start\"></axp-component-slot>\n <axp-component-slot name=\"root-header-end\"></axp-component-slot>\n </div>\n</div>\n\n<div class=\"__menu-bar\">\n <ax-menu [orientation]=\"'horizontal'\" [class.ax-dark]=\"layoutService.isDarkMode()\" [hasArrow]=\"true\">\n @
|
|
596
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXPHorizontalMenuComponent, isStandalone: true, selector: "axp-horizontal-menu", host: { classAttribute: "ax-light" }, ngImport: i0, template: "<div\n class=\"ax-w-full ax-flex ax-items-center ax-justify-between ax-gap-1 ax-bg-primary-surface ax-text-primary-on-surface ax-h-14 ax-px-4\"\n>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-logo\n [source]=\"platformConfig.logo?.full?.dark\"\n [attr.alt]=\"platformConfig.title\"\n class=\"ax-mx-auto ax-text-2xl\"\n ></axp-logo>\n </div>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-component-slot name=\"root-header-start\"></axp-component-slot>\n <axp-component-slot name=\"root-header-end\"></axp-component-slot>\n </div>\n</div>\n\n<div class=\"__menu-bar\">\n <ax-menu [orientation]=\"'horizontal'\" [class.ax-dark]=\"layoutService.isDarkMode()\" [hasArrow]=\"true\">\n @let sortedItems = sort(menuStore.items());\n @for (item of sortedItems; track item; let i = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: item, items: sortedItems, index: i }\"> </ng-container>\n }\n <!-- Item Templates -->\n <ng-template #recursiveMenu let-item=\"item\" let-items=\"items\" let-index=\"index\">\n @if (item.type == 'group') {\n @if (isItemVisible(item)) {\n <ax-title>{{ item.text | translate | async }}</ax-title>\n }\n } @else if (item.type == 'break') {\n @if (shouldShowDivider(item, items, index)) {\n <ax-divider></ax-divider>\n }\n } @else {\n @if (shouldRenderMenuItem(item)) {\n <ax-menu-item (onClick)=\"onMenuItemClick(item)\">\n @if (!item.meta?.isRoot) {\n <ax-prefix>\n <ax-icon [class]=\"item.icon\" class=\"fa-fw\"></ax-icon>\n </ax-prefix>\n }\n <ax-text> {{ item.text | translate | async }}</ax-text>\n @if (item.children?.length) {\n <ng-container>\n @let sortedChildren = sort(item.children);\n @for (child of sortedChildren; track child; let childIndex = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: child, items: sortedChildren, index: childIndex }\">\n </ng-container>\n }\n </ng-container>\n }\n <ax-suffix>\n @if (badgeVisible()) {\n <ax-badge [axp-task-badge]=\"getMenuBadge(item)()\" color=\"secondary\"></ax-badge>\n }\n </ax-suffix>\n </ax-menu-item>\n }\n }\n </ng-template>\n </ax-menu>\n</div>\n<!-- <div class=\"__tab-bar\">\n<div class=\"axp-tabs-item axp-state-active\">\n <span class=\"ax-font-medium\">Account</span>\n <i class=\"fa-light fa-times ax-text-sm\"></i>\n</div>\n<div class=\"axp-tabs-item\">\n <span class=\"ax-font-medium\">Projects</span>\n\n</div>\n</div> -->\n", styles: [".__tab-bar{display:flex;height:3rem;width:100%;align-items:flex-end;gap:.5rem;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-primary-darker-surface),var(--tw-bg-opacity, 1));padding-left:1rem;padding-right:1rem;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-primary-darker-surface),var(--tw-text-opacity, 1))}.__tab-bar .axp-tabs-item{display:flex;height:2.5rem;cursor:pointer;align-items:center;justify-content:space-between;gap:.5rem;border-top-left-radius:.5rem;border-top-right-radius:.5rem;padding-left:1rem;padding-right:1rem;font-size:.875rem;line-height:1.25rem;line-height:1}.__tab-bar .axp-tabs-item:hover,.__tab-bar .axp-tabs-item.axp-state-active{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-lightest-surface),var(--tw-text-opacity, 1))}.__menu-bar{display:flex;width:100%;align-items:flex-end;gap:.5rem;overflow-x:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-primary-dark-surface),var(--tw-bg-opacity, 1));padding:.375rem 1rem;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-primary-dark-surface),var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXPComponentSlotModule }, { kind: "directive", type: i1$2.AXPComponentSlotDirective, selector: "axp-component-slot", inputs: ["name", "host", "context"], exportAs: ["slot"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXPLogoComponent, selector: "axp-logo", inputs: ["source"] }, { kind: "ngmodule", type: AXMenuModule }, { kind: "component", type: i4$1.AXMenuItemComponent, selector: "ax-menu-item", inputs: ["name", "data", "disabled", "color"], outputs: ["onClick"] }, { kind: "component", type: i4$1.AXMenuComponent, selector: "ax-menu", inputs: ["orientation", "openOn", "closeOn", "items", "hasArrow"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: AXPTaskBadgeDirective, selector: "[axp-task-badge]", inputs: ["badgeKey", "axp-task-badge"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i4.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
549
597
|
}
|
|
550
598
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXPHorizontalMenuComponent, decorators: [{
|
|
551
599
|
type: Component,
|
|
@@ -558,7 +606,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
558
606
|
AXTranslationModule,
|
|
559
607
|
AXPTaskBadgeDirective,
|
|
560
608
|
AXBadgeModule,
|
|
561
|
-
], template: "<div\n class=\"ax-w-full ax-flex ax-items-center ax-justify-between ax-gap-1 ax-bg-primary-surface ax-text-primary-on-surface ax-h-14 ax-px-4\"\n>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-logo\n [source]=\"platformConfig.logo?.full?.dark\"\n [attr.alt]=\"platformConfig.title\"\n class=\"ax-mx-auto ax-text-2xl\"\n ></axp-logo>\n </div>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-component-slot name=\"root-header-start\"></axp-component-slot>\n <axp-component-slot name=\"root-header-end\"></axp-component-slot>\n </div>\n</div>\n\n<div class=\"__menu-bar\">\n <ax-menu [orientation]=\"'horizontal'\" [class.ax-dark]=\"layoutService.isDarkMode()\" [hasArrow]=\"true\">\n @
|
|
609
|
+
], template: "<div\n class=\"ax-w-full ax-flex ax-items-center ax-justify-between ax-gap-1 ax-bg-primary-surface ax-text-primary-on-surface ax-h-14 ax-px-4\"\n>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-logo\n [source]=\"platformConfig.logo?.full?.dark\"\n [attr.alt]=\"platformConfig.title\"\n class=\"ax-mx-auto ax-text-2xl\"\n ></axp-logo>\n </div>\n <div class=\"ax-flex ax-items-center ax-gap-1\">\n <axp-component-slot name=\"root-header-start\"></axp-component-slot>\n <axp-component-slot name=\"root-header-end\"></axp-component-slot>\n </div>\n</div>\n\n<div class=\"__menu-bar\">\n <ax-menu [orientation]=\"'horizontal'\" [class.ax-dark]=\"layoutService.isDarkMode()\" [hasArrow]=\"true\">\n @let sortedItems = sort(menuStore.items());\n @for (item of sortedItems; track item; let i = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: item, items: sortedItems, index: i }\"> </ng-container>\n }\n <!-- Item Templates -->\n <ng-template #recursiveMenu let-item=\"item\" let-items=\"items\" let-index=\"index\">\n @if (item.type == 'group') {\n @if (isItemVisible(item)) {\n <ax-title>{{ item.text | translate | async }}</ax-title>\n }\n } @else if (item.type == 'break') {\n @if (shouldShowDivider(item, items, index)) {\n <ax-divider></ax-divider>\n }\n } @else {\n @if (shouldRenderMenuItem(item)) {\n <ax-menu-item (onClick)=\"onMenuItemClick(item)\">\n @if (!item.meta?.isRoot) {\n <ax-prefix>\n <ax-icon [class]=\"item.icon\" class=\"fa-fw\"></ax-icon>\n </ax-prefix>\n }\n <ax-text> {{ item.text | translate | async }}</ax-text>\n @if (item.children?.length) {\n <ng-container>\n @let sortedChildren = sort(item.children);\n @for (child of sortedChildren; track child; let childIndex = $index) {\n <ng-container [ngTemplateOutlet]=\"recursiveMenu\" [ngTemplateOutletContext]=\"{ item: child, items: sortedChildren, index: childIndex }\">\n </ng-container>\n }\n </ng-container>\n }\n <ax-suffix>\n @if (badgeVisible()) {\n <ax-badge [axp-task-badge]=\"getMenuBadge(item)()\" color=\"secondary\"></ax-badge>\n }\n </ax-suffix>\n </ax-menu-item>\n }\n }\n </ng-template>\n </ax-menu>\n</div>\n<!-- <div class=\"__tab-bar\">\n<div class=\"axp-tabs-item axp-state-active\">\n <span class=\"ax-font-medium\">Account</span>\n <i class=\"fa-light fa-times ax-text-sm\"></i>\n</div>\n<div class=\"axp-tabs-item\">\n <span class=\"ax-font-medium\">Projects</span>\n\n</div>\n</div> -->\n", styles: [".__tab-bar{display:flex;height:3rem;width:100%;align-items:flex-end;gap:.5rem;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-primary-darker-surface),var(--tw-bg-opacity, 1));padding-left:1rem;padding-right:1rem;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-primary-darker-surface),var(--tw-text-opacity, 1))}.__tab-bar .axp-tabs-item{display:flex;height:2.5rem;cursor:pointer;align-items:center;justify-content:space-between;gap:.5rem;border-top-left-radius:.5rem;border-top-right-radius:.5rem;padding-left:1rem;padding-right:1rem;font-size:.875rem;line-height:1.25rem;line-height:1}.__tab-bar .axp-tabs-item:hover,.__tab-bar .axp-tabs-item.axp-state-active{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-lightest-surface),var(--tw-text-opacity, 1))}.__menu-bar{display:flex;width:100%;align-items:flex-end;gap:.5rem;overflow-x:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-primary-dark-surface),var(--tw-bg-opacity, 1));padding:.375rem 1rem;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-primary-dark-surface),var(--tw-text-opacity, 1))}\n"] }]
|
|
562
610
|
}] });
|
|
563
611
|
|
|
564
612
|
class AXPRootHorizontalLayoutComponent {
|
|
@@ -874,7 +922,7 @@ class AXPDefaultThemeModule {
|
|
|
874
922
|
///
|
|
875
923
|
modify: () => import('./acorex-platform-themes-default-entity-master-modify-view.component-CgLUnYRq.mjs').then((c) => c.AXPEntityMasterModifyViewComponent),
|
|
876
924
|
//
|
|
877
|
-
list: () => import('./acorex-platform-themes-default-entity-master-list-view.component-
|
|
925
|
+
list: () => import('./acorex-platform-themes-default-entity-master-list-view.component-DDd7YryZ.mjs').then((c) => c.AXPEntityMasterListViewComponent),
|
|
878
926
|
},
|
|
879
927
|
},
|
|
880
928
|
};
|
|
@@ -910,7 +958,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
910
958
|
///
|
|
911
959
|
modify: () => import('./acorex-platform-themes-default-entity-master-modify-view.component-CgLUnYRq.mjs').then((c) => c.AXPEntityMasterModifyViewComponent),
|
|
912
960
|
//
|
|
913
|
-
list: () => import('./acorex-platform-themes-default-entity-master-list-view.component-
|
|
961
|
+
list: () => import('./acorex-platform-themes-default-entity-master-list-view.component-DDd7YryZ.mjs').then((c) => c.AXPEntityMasterListViewComponent),
|
|
914
962
|
},
|
|
915
963
|
},
|
|
916
964
|
};
|