@design-factory/design-factory 19.1.1 → 19.1.2
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.
|
@@ -539,11 +539,11 @@ class DfDatepickerRangeService {
|
|
|
539
539
|
return parsed && this.calendar.isValid(NgbDate.from(parsed)) ? NgbDate.from(parsed) : previous;
|
|
540
540
|
}
|
|
541
541
|
updateFrom(typed) {
|
|
542
|
-
this.fromDate = this.
|
|
542
|
+
this.fromDate = this.parseInput(this.fromDate, typed);
|
|
543
543
|
this.fromDateAsStr = this.formatter.format(this.fromDate);
|
|
544
544
|
}
|
|
545
545
|
updateTo(typed) {
|
|
546
|
-
this.toDate = this.
|
|
546
|
+
this.toDate = this.parseInput(this.toDate, typed);
|
|
547
547
|
this.toDateAsStr = this.formatter.format(this.toDate);
|
|
548
548
|
}
|
|
549
549
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerRangeService, deps: [{ token: i1.NgbCalendar }, { token: i1.NgbDateParserFormatter }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
@@ -4995,7 +4995,7 @@ class DfSideNavListComponent {
|
|
|
4995
4995
|
return `df-sidenav-id-${uniqueId};`;
|
|
4996
4996
|
}
|
|
4997
4997
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4998
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DfSideNavListComponent, isStandalone: true, selector: "df-sidenavlist", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, tplIcon: { classPropertyName: "tplIcon", publicName: "tplIcon", isSignal: true, isRequired: false, transformFunction: null }, tplItem: { classPropertyName: "tplItem", publicName: "tplItem", isSignal: true, isRequired: false, transformFunction: null }, currentItem: { classPropertyName: "currentItem", publicName: "currentItem", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ul class=\"df-sidenav-list\" [ngbCollapse]=\"currentItem()?.isCollapsed ?? false\" [attr.id]=\"id()\">\n @for (item of items(); track item; let i = $index) {\n <li dfManageSideNav>\n <ng-template #dfSideNavItemContent>\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n </ng-template>\n @switch (item.type) {\n @case (sideNavService.type.subMenus) {\n <ng-template #subMenus>\n <button\n class=\"df-sidenav-item d-flex align-items-center\"\n (click)=\"sideNavService.toggle(item)\"\n type=\"button\"\n [attr.aria-expanded]=\"!item.isCollapsed\"\n [attr.aria-controls]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n [class.df-sidenav-item-withicon]=\"item.icon\"\n >\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n <span\n class=\"ms-3 df-sidenav-collapse-icon fa-light\"\n [class.fa-chevron-down]=\"item.isCollapsed\"\n [class.fa-chevron-up]=\"!item.isCollapsed\"\n ></span>\n <!-- put the chevron as icon directly in the menu -->\n <!-- todo the icon and the minimized -->\n </button>\n <!-- we don't pass the icons as they are not suppose to have ones ??-->\n <df-sidenavlist\n [items]=\"item.subMenus ?? []\"\n [tplItem]=\"tplItem()\"\n [currentItem]=\"item\"\n [id]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n ></df-sidenavlist>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.actionButton) {\n <ng-template #dfSideNavItemButton>\n <button\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n (click)=\"sideNavService.activeItem(item)\"\n [class.active]=\"item.isActive\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </button>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.routerLink) {\n <ng-template #dfRouterTemplate>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n routerLinkActive=\"active\"\n routerLink=\"{{ item.value }}\"\n ariaCurrentWhenActive=\"page\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.separator) {\n <ng-template #dfSeparatorTmp>\n <hr class=\"spacing-01\" />\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.template) {\n @let tItem = tplItem();\n @if (tItem) {\n <ng-template\n [ngTemplateOutlet]=\"tItem.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n }\n }\n @case (sideNavService.type.title) {\n <ng-template #dfTitleTmp>\n <div class=\"df-sidenav-item df-sidenav-title d-flex align-items-center flex-grow-1\">\n <span class=\"text-nowrap text-uppercase text-muted\" dfTitleTruncate>{{ item.title }}</span>\n </div>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n </ng-container>\n }\n }\n @default {\n <ng-template #dfLinkDefaultTmp>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n href=\"{{ item.value }}\"\n [class.active]=\"item.isActive && item.type === sideNavService.type.link\"\n [attr.target]=\"item.type === sideNavService.type.externalLink ? '_blank' : ''\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n </ng-container>\n }\n }\n }\n </li>\n }\n</ul>\n", dependencies: [{ kind: "component", type: DfSideNavListComponent, selector: "df-sidenavlist", inputs: ["items", "tplIcon", "tplItem", "currentItem", "id"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: NgbCollapseModule }, { kind: "directive", type: i1.NgbCollapse, selector: "[ngbCollapse]", inputs: ["animation", "ngbCollapse", "horizontal"], outputs: ["ngbCollapseChange", "shown", "hidden"], exportAs: ["ngbCollapse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: DfMediaModule }, { kind: "directive", type: DfIfMediaDirective, selector: "[dfIfMedia]", inputs: ["dfIfMedia"] }, { kind: "ngmodule", type: DfSideNavCollapseModule }, { kind: "directive", type: DfManageSideNavDirective, selector: "[dfManageSideNav]" }, { kind: "directive", type: DfTitleTruncateDirective, selector: "[dfTitleTruncate]", exportAs: ["dfTitleTruncate"] }] }); }
|
|
4998
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DfSideNavListComponent, isStandalone: true, selector: "df-sidenavlist", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, tplIcon: { classPropertyName: "tplIcon", publicName: "tplIcon", isSignal: true, isRequired: false, transformFunction: null }, tplItem: { classPropertyName: "tplItem", publicName: "tplItem", isSignal: true, isRequired: false, transformFunction: null }, currentItem: { classPropertyName: "currentItem", publicName: "currentItem", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ul class=\"df-sidenav-list\" [ngbCollapse]=\"currentItem()?.isCollapsed ?? false\" [attr.id]=\"id()\">\n @for (item of items(); track item; let i = $index) {\n <li [class]=\"item.class\" dfManageSideNav>\n <ng-template #dfSideNavItemContent>\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n </ng-template>\n @switch (item.type) {\n @case (sideNavService.type.subMenus) {\n <ng-template #subMenus>\n <button\n class=\"df-sidenav-item d-flex align-items-center\"\n (click)=\"sideNavService.toggle(item)\"\n type=\"button\"\n [attr.aria-expanded]=\"!item.isCollapsed\"\n [attr.aria-controls]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n [class.df-sidenav-item-withicon]=\"item.icon\"\n >\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n <span\n class=\"ms-3 df-sidenav-collapse-icon fa-light\"\n [class.fa-chevron-down]=\"item.isCollapsed\"\n [class.fa-chevron-up]=\"!item.isCollapsed\"\n ></span>\n <!-- put the chevron as icon directly in the menu -->\n <!-- todo the icon and the minimized -->\n </button>\n <!-- we don't pass the icons as they are not suppose to have ones ??-->\n <df-sidenavlist\n [items]=\"item.subMenus ?? []\"\n [tplItem]=\"tplItem()\"\n [currentItem]=\"item\"\n [id]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n ></df-sidenavlist>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.actionButton) {\n <ng-template #dfSideNavItemButton>\n <button\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n (click)=\"sideNavService.activeItem(item)\"\n [class.active]=\"item.isActive\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </button>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.routerLink) {\n <ng-template #dfRouterTemplate>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n routerLinkActive=\"active\"\n routerLink=\"{{ item.value }}\"\n ariaCurrentWhenActive=\"page\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.separator) {\n <ng-template #dfSeparatorTmp>\n <hr class=\"spacing-01\" />\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.template) {\n @let tItem = tplItem();\n @if (tItem) {\n <ng-template\n [ngTemplateOutlet]=\"tItem.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n }\n }\n @case (sideNavService.type.title) {\n <ng-template #dfTitleTmp>\n <div class=\"df-sidenav-item df-sidenav-title d-flex align-items-center flex-grow-1\">\n <span class=\"text-nowrap text-uppercase text-muted\" dfTitleTruncate>{{ item.title }}</span>\n </div>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n </ng-container>\n }\n }\n @default {\n <ng-template #dfLinkDefaultTmp>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n href=\"{{ item.value }}\"\n [class.active]=\"item.isActive && item.type === sideNavService.type.link\"\n [attr.target]=\"item.type === sideNavService.type.externalLink ? '_blank' : ''\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n </ng-container>\n }\n }\n }\n </li>\n }\n</ul>\n", dependencies: [{ kind: "component", type: DfSideNavListComponent, selector: "df-sidenavlist", inputs: ["items", "tplIcon", "tplItem", "currentItem", "id"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: NgbCollapseModule }, { kind: "directive", type: i1.NgbCollapse, selector: "[ngbCollapse]", inputs: ["animation", "ngbCollapse", "horizontal"], outputs: ["ngbCollapseChange", "shown", "hidden"], exportAs: ["ngbCollapse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: DfMediaModule }, { kind: "directive", type: DfIfMediaDirective, selector: "[dfIfMedia]", inputs: ["dfIfMedia"] }, { kind: "ngmodule", type: DfSideNavCollapseModule }, { kind: "directive", type: DfManageSideNavDirective, selector: "[dfManageSideNav]" }, { kind: "directive", type: DfTitleTruncateDirective, selector: "[dfTitleTruncate]", exportAs: ["dfTitleTruncate"] }] }); }
|
|
4999
4999
|
}
|
|
5000
5000
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavListComponent, decorators: [{
|
|
5001
5001
|
type: Component,
|
|
@@ -5007,7 +5007,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
|
|
|
5007
5007
|
DfSideNavCollapseModule,
|
|
5008
5008
|
DfManageSideNavDirective,
|
|
5009
5009
|
DfTitleTruncateDirective
|
|
5010
|
-
], template: "<ul class=\"df-sidenav-list\" [ngbCollapse]=\"currentItem()?.isCollapsed ?? false\" [attr.id]=\"id()\">\n @for (item of items(); track item; let i = $index) {\n <li dfManageSideNav>\n <ng-template #dfSideNavItemContent>\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n </ng-template>\n @switch (item.type) {\n @case (sideNavService.type.subMenus) {\n <ng-template #subMenus>\n <button\n class=\"df-sidenav-item d-flex align-items-center\"\n (click)=\"sideNavService.toggle(item)\"\n type=\"button\"\n [attr.aria-expanded]=\"!item.isCollapsed\"\n [attr.aria-controls]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n [class.df-sidenav-item-withicon]=\"item.icon\"\n >\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n <span\n class=\"ms-3 df-sidenav-collapse-icon fa-light\"\n [class.fa-chevron-down]=\"item.isCollapsed\"\n [class.fa-chevron-up]=\"!item.isCollapsed\"\n ></span>\n <!-- put the chevron as icon directly in the menu -->\n <!-- todo the icon and the minimized -->\n </button>\n <!-- we don't pass the icons as they are not suppose to have ones ??-->\n <df-sidenavlist\n [items]=\"item.subMenus ?? []\"\n [tplItem]=\"tplItem()\"\n [currentItem]=\"item\"\n [id]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n ></df-sidenavlist>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.actionButton) {\n <ng-template #dfSideNavItemButton>\n <button\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n (click)=\"sideNavService.activeItem(item)\"\n [class.active]=\"item.isActive\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </button>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.routerLink) {\n <ng-template #dfRouterTemplate>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n routerLinkActive=\"active\"\n routerLink=\"{{ item.value }}\"\n ariaCurrentWhenActive=\"page\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.separator) {\n <ng-template #dfSeparatorTmp>\n <hr class=\"spacing-01\" />\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.template) {\n @let tItem = tplItem();\n @if (tItem) {\n <ng-template\n [ngTemplateOutlet]=\"tItem.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n }\n }\n @case (sideNavService.type.title) {\n <ng-template #dfTitleTmp>\n <div class=\"df-sidenav-item df-sidenav-title d-flex align-items-center flex-grow-1\">\n <span class=\"text-nowrap text-uppercase text-muted\" dfTitleTruncate>{{ item.title }}</span>\n </div>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n </ng-container>\n }\n }\n @default {\n <ng-template #dfLinkDefaultTmp>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n href=\"{{ item.value }}\"\n [class.active]=\"item.isActive && item.type === sideNavService.type.link\"\n [attr.target]=\"item.type === sideNavService.type.externalLink ? '_blank' : ''\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n </ng-container>\n }\n }\n }\n </li>\n }\n</ul>\n" }]
|
|
5010
|
+
], template: "<ul class=\"df-sidenav-list\" [ngbCollapse]=\"currentItem()?.isCollapsed ?? false\" [attr.id]=\"id()\">\n @for (item of items(); track item; let i = $index) {\n <li [class]=\"item.class\" dfManageSideNav>\n <ng-template #dfSideNavItemContent>\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n </ng-template>\n @switch (item.type) {\n @case (sideNavService.type.subMenus) {\n <ng-template #subMenus>\n <button\n class=\"df-sidenav-item d-flex align-items-center\"\n (click)=\"sideNavService.toggle(item)\"\n type=\"button\"\n [attr.aria-expanded]=\"!item.isCollapsed\"\n [attr.aria-controls]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n [class.df-sidenav-item-withicon]=\"item.icon\"\n >\n @let tIcon = tplIcon();\n @if (tIcon && item.icon) {\n <ng-template\n [ngTemplateOutlet]=\"tIcon.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n } @else if (item.icon) {\n <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n }\n <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n <span\n class=\"ms-3 df-sidenav-collapse-icon fa-light\"\n [class.fa-chevron-down]=\"item.isCollapsed\"\n [class.fa-chevron-up]=\"!item.isCollapsed\"\n ></span>\n <!-- put the chevron as icon directly in the menu -->\n <!-- todo the icon and the minimized -->\n </button>\n <!-- we don't pass the icons as they are not suppose to have ones ??-->\n <df-sidenavlist\n [items]=\"item.subMenus ?? []\"\n [tplItem]=\"tplItem()\"\n [currentItem]=\"item\"\n [id]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n ></df-sidenavlist>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.actionButton) {\n <ng-template #dfSideNavItemButton>\n <button\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n (click)=\"sideNavService.activeItem(item)\"\n [class.active]=\"item.isActive\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </button>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.routerLink) {\n <ng-template #dfRouterTemplate>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n routerLinkActive=\"active\"\n routerLink=\"{{ item.value }}\"\n ariaCurrentWhenActive=\"page\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.separator) {\n <ng-template #dfSeparatorTmp>\n <hr class=\"spacing-01\" />\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n </ng-container>\n }\n }\n @case (sideNavService.type.template) {\n @let tItem = tplItem();\n @if (tItem) {\n <ng-template\n [ngTemplateOutlet]=\"tItem.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n }\n }\n @case (sideNavService.type.title) {\n <ng-template #dfTitleTmp>\n <div class=\"df-sidenav-item df-sidenav-title d-flex align-items-center flex-grow-1\">\n <span class=\"text-nowrap text-uppercase text-muted\" dfTitleTruncate>{{ item.title }}</span>\n </div>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n </ng-container>\n }\n }\n @default {\n <ng-template #dfLinkDefaultTmp>\n <a\n class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n href=\"{{ item.value }}\"\n [class.active]=\"item.isActive && item.type === sideNavService.type.link\"\n [attr.target]=\"item.type === sideNavService.type.externalLink ? '_blank' : ''\"\n >\n <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n </a>\n </ng-template>\n @if (!item.breakpoints) {\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n } @else {\n <ng-container *dfIfMedia=\"item.breakpoints!\">\n <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n </ng-container>\n }\n }\n }\n </li>\n }\n</ul>\n" }]
|
|
5011
5011
|
}] });
|
|
5012
5012
|
|
|
5013
5013
|
class DfSideNavHeaderDirective {
|
|
@@ -5067,7 +5067,7 @@ class DfSideNavComponent {
|
|
|
5067
5067
|
this.sideNavService.isInMenuOverlay$.pipe(takeUntilDestroyed()).subscribe((value) => {
|
|
5068
5068
|
this.overlayClass.set(value);
|
|
5069
5069
|
});
|
|
5070
|
-
|
|
5070
|
+
this.sideNavService.setSideNav();
|
|
5071
5071
|
}
|
|
5072
5072
|
ngOnDestroy() {
|
|
5073
5073
|
this.sideNavService.removeSideBar();
|