@open-rlb/ng-app 3.1.72 → 3.1.74

package/fesm2022/open-rlb-ng-app.mjs

@@ -2025,7 +2025,10 @@ class SettingsDropdownSelectorComponent {
         if (appId) {
             return this.appsService.isAppSelected(appId);
         }
-        throw new Error(`${appId} is not defined`);
+        else {
+            console.error('AppId is not defined');
+            return false;
+        }
     }
     get languages() {
         return this.store
@@ -2087,7 +2090,10 @@ class AppDropdownSelectorComponent {
         if (appId) {
             return this.appsService.isAppSelected(appId);
         }
-        throw new Error(`${appId} is not defined`);
+        else {
+            console.error('AppId is not defined');
+            return false;
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AppDropdownSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: AppDropdownSelectorComponent, isStandalone: false, selector: "rlb-app-dropdown-selector", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, apps: { classPropertyName: "apps", publicName: "apps", isSignal: true, isRequired: true, transformFunction: null }, isAuthenticated: { classPropertyName: "isAuthenticated", publicName: "isAuthenticated", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { appSelected: "appSelected" }, ngImport: i0, template: "@if (mode() === 'desktop') {\n  <rlb-navbar-dropdown-item dropdown>\n    <span tooltip-placement=\"bottom\" [tooltip]=\"('core.apps.button') | translate\">\n      <i class=\"bi bi-grid-3x3-gap-fill fs-5\"></i>\n    </span>\n    <rlb-dropdown-container placement=\"right\">\n\n      <div style=\"width: 320px;\">\n        <ng-container *ngTemplateOutlet=\"appGrid\"></ng-container>\n      </div>\n\n    </rlb-dropdown-container>\n  </rlb-navbar-dropdown-item>\n} @else {\n  <ng-container *ngTemplateOutlet=\"appGrid\"></ng-container>\n}\n\n<ng-template #appGrid>\n  <div class=\"row row-cols-3 g-2 p-3\">\n    @for (app of apps(); track app.id) {\n      @if (app.core) {\n        <div class=\"col\">\n          <button\n            rlb-button\n            outline\n            class=\"w-100 h-100 d-flex flex-column align-items-center justify-content-center p-2 text-center\"\n            [class.active]=\"isAppSelected(app.id)\"\n            [disabled]=\"!app.enabled && (app.core.auth && !(isAuthenticated()))\"\n            (click)=\"selectApp(app)\"\n          >\n            <i [ngClass]=\"['fs-3', 'mb-1', app.core.icon || 'bi bi-app']\"></i>\n            <span class=\"small text-truncate w-100\" [title]=\"app.data.friendlyName ? app.data.friendlyName : app.core.title | translate\">\n              {{ app.data.friendlyName ? app.data.friendlyName : app.core.title | translate }}\n            </span>\n          </button>\n        </div>\n      }\n    }\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[rlb-button], a[rlb-button]", inputs: ["color", "size", "disabled", "outline", "isLink"] }, { kind: "directive", type: i2$1.TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltip-placement", "tooltip-class", "tooltip-html"] }, { kind: "component", type: i2$1.DropdownContainerComponent, selector: "ul[rlb-dropdown-menu], rlb-dropdown-container", inputs: ["placement", "placement-sm", "placement-md", "placement-lg", "placement-xl", "placement-xxl"] }, { kind: "component", type: i2$1.NavbarDropdownItemComponent, selector: "rlb-navbar-dropdown-item", inputs: ["disabled", "dropdown", "href", "class", "toggle", "auto-close"], outputs: ["click", "status-changed"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] }); }
@@ -2286,11 +2292,11 @@ class AppTemplateComponent {
         this.mobileOffcanvas()?.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AppTemplateComponent, deps: [{ token: RLB_CFG_ENV }, { token: i1$1.Store }, { token: AppsService }, { token: AuthenticationService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: AppTemplateComponent, isStandalone: false, selector: "rlb-app-template", inputs: { modalContainerId: ["modal-container-id", "modalContainerId"], toastContainerIds: ["toast-container-ids", "toastContainerIds"] }, viewQueries: [{ propertyName: "mobileOffcanvas", first: true, predicate: ["mobileOffcanvas"], descendants: true, isSignal: true }, { propertyName: "mobileSettingsMenu", first: true, predicate: ["mobileSettingsMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"rlb-app\">\n  @if (navVisible$ | async) {\n    <rlb-navbar [dark]=\"theme === 'dark'\" [showSideBarToggler]=\"(sidebarVisible$ | async)\"  expand=\"lg\" class=\"border-bottom py-1 rlb-navbar\">\n      @if (navHeader$ | async; as header) {\n        <a rlb-navbar-brand href=\"#\">\n\n          @if (header.type === 'text') {\n            {{ header.text }}\n          }\n\n          @if (header.type === 'image') {\n            <img\n              [src]=\"header.src\"\n              [alt]=\"header.alt ?? 'Brand'\"\n              [height]=\"header.height ?? 40\"\n            />\n          }\n        </a>\n      }\n      @if (navSearchVisible$ | async) {\n        <rlb-navbar-form>\n          <rlb-input-group class=\"my-1 mx-3\" validate>\n            <rlb-input type=\"search\" class=\"search-input\" placeholder=\"Search\" [(ngModel)]=\"navSearchText\"\n                       (keyup.enter)=\"setNavbarSearchText(navSearchText)\" name=\"search\" size=\"small\">\n              <button after rlb-button outline type=\"submit\" (click)=\"setNavbarSearchText(navSearchText)\" size=\"sm\">\n                <i class=\"bi bi-search\"></i>\n              </button>\n            </rlb-input>\n          </rlb-input-group>\n        </rlb-navbar-form>\n      }\n\n      <!-- MOBILE VIEWS -->\n      <div rlb-custom-navbar-items class=\"d-flex d-lg-none\">\n        <rlb-fab size=\"sm\" outline toggle=\"offcanvas\" toggle-target=\"mobileMenuOffcanvas\">\n          <i class=\"bi bi-three-dots-vertical\"></i>\n        </rlb-fab>\n\n        <rlb-offcanvas\n          #mobileOffcanvas\n          id=\"mobileMenuOffcanvas\"\n          [placement]=\"'end'\"\n          (statusChange)=\"onMobileMenuStatusChange($event)\"\n        >\n          <rlb-offcanvas-header class=\"border-bottom\">\n            <h5 rlb-offcanvas-title class=\"fw-bold mb-0\">Menu</h5>\n          </rlb-offcanvas-header>\n\n          <rlb-offcanvas-body class=\"p-0 overflow-x-hidden\">\n\n            <!-- Mobile Apps Grid -->\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <div class=\"border-bottom pb-2\">\n                <rlb-app-dropdown-selector\n                  mode=\"mobile\"\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  (appSelected)=\"selectApp($event, 'app')\"\n                />\n              </div>\n            }\n\n            <!-- Mobile Settings Carousel -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async)) || (navbarHasSettings$ | async)) {\n              <div class=\"pt-2\">\n                <rlb-settings-dropdown-selector\n                  mode=\"mobile\"\n                  #mobileSettingsMenu\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                  [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                  (appSelected)=\"selectApp($event, 'settings')\"\n                />\n              </div>\n            }\n\n          </rlb-offcanvas-body>\n        </rlb-offcanvas>\n      </div>\n\n      <rlb-navbar-items>\n        @for (navComponent of navLeftItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | leftComponent\"></ng-container>\n          </ng-container>\n        }\n      </rlb-navbar-items>\n\n      <rlb-navbar-items class=\"ms-auto align-items-center\">\n        @for (navComponent of navRightItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | rightComponent\"></ng-container>\n          </ng-container>\n        }\n        @if ((separatorVisible$ | async)) {\n          <rlb-navbar-separator />\n        }\n\n        <ng-container ngProjectAs=\"rlb-navbar-item\">\n          @if ((navbarLayout$ | async) == 'default') {\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') |translate\">\n                  <i class=\" bi bi-box-arrow-in-left\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.login' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ( (navbarHasLogin$ | async) && (isAuthenticated$ | async)) {\n              <rlb-navbar-item [router-link]=\"'/profile'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.title') |translate\">\n                <i class=\"bi bi-person\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if (navbarHasSettings$ | async) {\n              <rlb-navbar-item [router-link]=\"'/settings'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.settings.title') |translate\">\n                <i class=\"bi bi-gear\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.settings.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <rlb-navbar-item [router-link]=\"'/apps'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.apps.button') |translate\">\n                <i class=\"bi bi-grid-3x3-gap-fill\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.apps.button' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n          } @else if ((navbarLayout$ | async) == 'dropdown') {\n            <!-- MODERN DROPDOWN MODE -->\n\n            <!--Unauthenticated Login -->\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') | translate\">\n                  <i class=\"bi bi-box-arrow-in-left fs-5\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{ 'core.account.login' | translate }}</span>\n              </rlb-navbar-item>\n            }\n\n            <!-- Profile & Settings Account Card -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async)) || (navbarHasSettings$ | async)) {\n              <rlb-settings-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                (appSelected)=\"selectApp($event, 'settings')\"\n              />\n            }\n\n            <!-- Apps Launcher -->\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <rlb-app-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                (appSelected)=\"selectApp($event, 'app')\"\n              />\n            }\n          }\n        </ng-container>\n      </rlb-navbar-items>\n    </rlb-navbar>\n  }\n  <div class=\"rlb-main-wrapper\">\n    @if ((sidebarVisible$ | async)) {\n      <rlb-sidebar [dark]=\"theme === 'dark'\" id=\"sidebar\" class=\"rlb-sidebar\">\n        @for (item of  (sidebarItems$ | async); track $index) {\n          <rlb-sidebar-item\n            *roles=\"item.action\"\n            [icon]=\"item.icon\" [link]=\"item.url\"\n            [title]=\"item.title\" [label]=\"item.label\"\n            [badgeCounter]=\"item.badgeCounter\"\n            (click)=\"onSideBarItemClick(item)\"\n            >\n            {{item.label}}\n            @for (subitem of item.items || []; track $index) {\n              <rlb-sidebar-item\n                [icon]=\"subitem.icon\"\n                [link]=\"subitem.url\"\n                [title]=\"subitem.title\"\n                [label]=\"subitem.label\"\n                [badgeCounter]=\"subitem.badgeCounter\"\n                (click)=\"onSideBarItemClick(subitem)\"\n                >\n                {{subitem.label}}\n              </rlb-sidebar-item>\n            }\n          </rlb-sidebar-item>\n        }\n      </rlb-sidebar>\n    }\n    <div class=\"rlb-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n@if (modalContainerId) {\n  <rlb-modal-container [id]=\"modalContainerId\" />\n}\n\n@if (toastContainerIds) {\n  @if (toastContainerIds.constructor.name === 'Array') {\n    @for (toastContainerId of toastContainerIds | asMulti; track toastContainerId) {\n      <rlb-toast-container [id]=\"toastContainerId\" />\n    }\n  } @else {\n    <rlb-toast-container class=\"position-fixed bottom-0 end-0 p-3\" [id]=\"toastContainerIds | asSingle\" />\n  }\n}\n", styles: [".separator{border-left:1px solid;padding:0 2px}\n"], dependencies: [{ kind: "directive", type: i1$6.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.InputGroupComponent, selector: "rlb-input-group", inputs: ["text", "validate", "size"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[rlb-button], a[rlb-button]", inputs: ["color", "size", "disabled", "outline", "isLink"] }, { kind: "component", type: i2$1.RlbFabComponent, selector: "rlb-fab", inputs: ["color", "size", "disabled", "outline", "position"] }, { kind: "directive", type: i2$1.TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltip-placement", "tooltip-class", "tooltip-html"] }, { kind: "directive", type: i2$1.NavbarBrandDirective, selector: "[rlb-navbar-brand]" }, { kind: "directive", type: i2$1.NavbarCustomItemsDirective, selector: "[rlb-custom-navbar-items]" }, { kind: "component", type: i2$1.NavbarComponent, selector: "rlb-navbar", inputs: ["dark", "showSideBarToggler", "color", "placement", "expand", "class", "enable-dropdown-toggler"] }, { kind: "component", type: i2$1.NavbarFormComponent, selector: "rlb-navbar-form", inputs: ["role", "class"] }, { kind: "component", type: i2$1.NavbarItemsComponent, selector: "rlb-navbar-items", inputs: ["scroll", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarItemComponent, selector: "rlb-navbar-item", inputs: ["disabled", "router-link", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarSeparatorComponent, selector: "rlb-navbar-separator", inputs: ["class"] }, { kind: "component", type: i2$1.OffcanvasComponent, selector: "rlb-offcanvas", inputs: ["id", "body-scroll", "scroll-backup", "close-manual", "placement", "responsive"], outputs: ["statusChange"] }, { kind: "component", type: i2$1.OffcanvasHeaderComponent, selector: "rlb-offcanvas-header", inputs: ["offcanvasId"] }, { kind: "component", type: i2$1.OffcanvasBodyComponent, selector: "rlb-offcanvas-body" }, { kind: "directive", type: i2$1.ToggleDirective, selector: "    button[toggle],    a[toggle],    rlb-navbar-item[toggle],    rlb-button-toolbar[toggle],    rlb-fab[toggle],", inputs: ["toggle", "toggle-target", "collapsed", "auto-close"] }, { kind: "component", type: i2$1.SidebarComponent, selector: "rlb-sidebar", inputs: ["dark", "rounded"] }, { kind: "component", type: i2$1.SidebarItemComponent, selector: "rlb-sidebar-item", inputs: ["title", "icon", "label", "link", "badgeCounter"], outputs: ["click"] }, { kind: "component", type: i2$1.ModalContainerComponent, selector: "rlb-modal-container", inputs: ["id"] }, { kind: "component", type: i2$1.ToastContainerComponent, selector: "rlb-toast-container", inputs: ["id"] }, { kind: "component", type: SettingsDropdownSelectorComponent, selector: "rlb-settings-dropdown-selector", inputs: ["mode", "apps", "navbarHasSettings", "navbarHasLogin", "isAuthenticated"], outputs: ["appSelected"] }, { kind: "component", type: AppDropdownSelectorComponent, selector: "rlb-app-dropdown-selector", inputs: ["mode", "apps", "isAuthenticated"], outputs: ["appSelected"] }, { kind: "directive", type: RlbRole, selector: "[roles]", inputs: ["roles"] }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsMultiPipe, name: "asMulti" }, { kind: "pipe", type: AsSinglePipe, name: "asSingle" }, { kind: "pipe", type: LeftComponentPipe, name: "leftComponent" }, { kind: "pipe", type: RightComponentPipe, name: "rightComponent" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: AppTemplateComponent, isStandalone: false, selector: "rlb-app-template", inputs: { modalContainerId: ["modal-container-id", "modalContainerId"], toastContainerIds: ["toast-container-ids", "toastContainerIds"] }, viewQueries: [{ propertyName: "mobileOffcanvas", first: true, predicate: ["mobileOffcanvas"], descendants: true, isSignal: true }, { propertyName: "mobileSettingsMenu", first: true, predicate: ["mobileSettingsMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"rlb-app\">\n  @if (navVisible$ | async) {\n    <rlb-navbar [dark]=\"theme === 'dark'\" [showSideBarToggler]=\"(sidebarVisible$ | async)\"  expand=\"lg\" class=\"border-bottom py-1 rlb-navbar\">\n      @if (navHeader$ | async; as header) {\n        <a rlb-navbar-brand href=\"#\">\n\n          @if (header.type === 'text') {\n            {{ header.text }}\n          }\n\n          @if (header.type === 'image') {\n            <img\n              [src]=\"header.src\"\n              [alt]=\"header.alt ?? 'Brand'\"\n              [height]=\"header.height ?? 40\"\n            />\n          }\n        </a>\n      }\n      @if (navSearchVisible$ | async) {\n        <rlb-navbar-form>\n          <rlb-input-group class=\"my-1 mx-3\" validate>\n            <rlb-input type=\"search\" class=\"search-input\" placeholder=\"Search\" [(ngModel)]=\"navSearchText\"\n                       (keyup.enter)=\"setNavbarSearchText(navSearchText)\" name=\"search\" size=\"small\">\n              <button after rlb-button outline type=\"submit\" (click)=\"setNavbarSearchText(navSearchText)\" size=\"sm\">\n                <i class=\"bi bi-search\"></i>\n              </button>\n            </rlb-input>\n          </rlb-input-group>\n        </rlb-navbar-form>\n      }\n\n      <!-- MOBILE VIEWS -->\n      <div rlb-custom-navbar-items class=\"d-flex d-lg-none\">\n        <rlb-fab size=\"sm\" outline toggle=\"offcanvas\" toggle-target=\"mobileMenuOffcanvas\">\n          <i class=\"bi bi-three-dots-vertical\"></i>\n        </rlb-fab>\n\n        <rlb-offcanvas\n          #mobileOffcanvas\n          id=\"mobileMenuOffcanvas\"\n          [placement]=\"'end'\"\n          (statusChange)=\"onMobileMenuStatusChange($event)\"\n        >\n          <rlb-offcanvas-header class=\"border-bottom\">\n            <h5 rlb-offcanvas-title class=\"fw-bold mb-0\">Menu</h5>\n          </rlb-offcanvas-header>\n\n          <rlb-offcanvas-body class=\"p-0 overflow-x-hidden\">\n\n            <!-- Mobile Apps Grid -->\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <div class=\"border-bottom pb-2\">\n                <rlb-app-dropdown-selector\n                  mode=\"mobile\"\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  (appSelected)=\"selectApp($event, 'app')\"\n                />\n              </div>\n            }\n\n            <!-- Mobile Settings Carousel -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async)) || (navbarHasSettings$ | async)) {\n              <div class=\"pt-2\">\n                <rlb-settings-dropdown-selector\n                  mode=\"mobile\"\n                  #mobileSettingsMenu\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                  [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                  (appSelected)=\"selectApp($event, 'settings')\"\n                />\n              </div>\n            }\n\n          </rlb-offcanvas-body>\n        </rlb-offcanvas>\n      </div>\n\n      <rlb-navbar-items>\n        @for (navComponent of navLeftItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | leftComponent\"></ng-container>\n          </ng-container>\n        }\n      </rlb-navbar-items>\n\n      <rlb-navbar-items class=\"ms-auto align-items-center\">\n        @for (navComponent of navRightItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | rightComponent\"></ng-container>\n          </ng-container>\n        }\n        @if ((separatorVisible$ | async) && (isAuthenticated$ | async)) {\n          <rlb-navbar-separator />\n        }\n\n        <ng-container ngProjectAs=\"rlb-navbar-item\">\n          @if ((navbarLayout$ | async) == 'default') {\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') |translate\">\n                  <i class=\" bi bi-box-arrow-in-left\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.login' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ((navbarHasLogin$ | async) && (isAuthenticated$ | async)) {\n              <rlb-navbar-item [router-link]=\"'/profile'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.title') |translate\">\n                <i class=\"bi bi-person\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if (navbarHasSettings$ | async) {\n              <rlb-navbar-item [router-link]=\"'/settings'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.settings.title') |translate\">\n                <i class=\"bi bi-gear\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.settings.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <rlb-navbar-item [router-link]=\"'/apps'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.apps.button') |translate\">\n                <i class=\"bi bi-grid-3x3-gap-fill\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.apps.button' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n          } @else if ((navbarLayout$ | async) == 'dropdown') {\n            <!-- MODERN DROPDOWN MODE -->\n\n            <!--Unauthenticated Login -->\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') | translate\">\n                  <i class=\"bi bi-box-arrow-in-left fs-5\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{ 'core.account.login' | translate }}</span>\n              </rlb-navbar-item>\n            }\n\n            <!-- Profile & Settings Account Card -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async))) {\n              <rlb-settings-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                (appSelected)=\"selectApp($event, 'settings')\"\n              />\n            }\n\n            <!-- Apps Launcher -->\n            @if ((navbarHasApps$ | async) && (isAuthenticated$ | async) && apps.length > 1) {\n              <rlb-app-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                (appSelected)=\"selectApp($event, 'app')\"\n              />\n            }\n          }\n        </ng-container>\n      </rlb-navbar-items>\n    </rlb-navbar>\n  }\n  <div class=\"rlb-main-wrapper\">\n    @if ((sidebarVisible$ | async)) {\n      <rlb-sidebar [dark]=\"theme === 'dark'\" id=\"sidebar\" class=\"rlb-sidebar\">\n        @for (item of  (sidebarItems$ | async); track $index) {\n          <rlb-sidebar-item\n            *roles=\"item.action\"\n            [icon]=\"item.icon\" [link]=\"item.url\"\n            [title]=\"item.title\" [label]=\"item.label\"\n            [badgeCounter]=\"item.badgeCounter\"\n            (click)=\"onSideBarItemClick(item)\"\n            >\n            {{item.label}}\n            @for (subitem of item.items || []; track $index) {\n              <rlb-sidebar-item\n                [icon]=\"subitem.icon\"\n                [link]=\"subitem.url\"\n                [title]=\"subitem.title\"\n                [label]=\"subitem.label\"\n                [badgeCounter]=\"subitem.badgeCounter\"\n                (click)=\"onSideBarItemClick(subitem)\"\n                >\n                {{subitem.label}}\n              </rlb-sidebar-item>\n            }\n          </rlb-sidebar-item>\n        }\n      </rlb-sidebar>\n    }\n    <div class=\"rlb-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n@if (modalContainerId) {\n  <rlb-modal-container [id]=\"modalContainerId\" />\n}\n\n@if (toastContainerIds) {\n  @if (toastContainerIds.constructor.name === 'Array') {\n    @for (toastContainerId of toastContainerIds | asMulti; track toastContainerId) {\n      <rlb-toast-container [id]=\"toastContainerId\" />\n    }\n  } @else {\n    <rlb-toast-container class=\"position-fixed bottom-0 end-0 p-3\" [id]=\"toastContainerIds | asSingle\" />\n  }\n}\n", styles: [".separator{border-left:1px solid;padding:0 2px}\n"], dependencies: [{ kind: "directive", type: i1$6.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.InputGroupComponent, selector: "rlb-input-group", inputs: ["text", "validate", "size"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[rlb-button], a[rlb-button]", inputs: ["color", "size", "disabled", "outline", "isLink"] }, { kind: "component", type: i2$1.RlbFabComponent, selector: "rlb-fab", inputs: ["color", "size", "disabled", "outline", "position"] }, { kind: "directive", type: i2$1.TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltip-placement", "tooltip-class", "tooltip-html"] }, { kind: "directive", type: i2$1.NavbarBrandDirective, selector: "[rlb-navbar-brand]" }, { kind: "directive", type: i2$1.NavbarCustomItemsDirective, selector: "[rlb-custom-navbar-items]" }, { kind: "component", type: i2$1.NavbarComponent, selector: "rlb-navbar", inputs: ["dark", "showSideBarToggler", "color", "placement", "expand", "class", "enable-dropdown-toggler"] }, { kind: "component", type: i2$1.NavbarFormComponent, selector: "rlb-navbar-form", inputs: ["role", "class"] }, { kind: "component", type: i2$1.NavbarItemsComponent, selector: "rlb-navbar-items", inputs: ["scroll", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarItemComponent, selector: "rlb-navbar-item", inputs: ["disabled", "router-link", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarSeparatorComponent, selector: "rlb-navbar-separator", inputs: ["class"] }, { kind: "component", type: i2$1.OffcanvasComponent, selector: "rlb-offcanvas", inputs: ["id", "body-scroll", "scroll-backup", "close-manual", "placement", "responsive"], outputs: ["statusChange"] }, { kind: "component", type: i2$1.OffcanvasHeaderComponent, selector: "rlb-offcanvas-header", inputs: ["offcanvasId"] }, { kind: "component", type: i2$1.OffcanvasBodyComponent, selector: "rlb-offcanvas-body" }, { kind: "directive", type: i2$1.ToggleDirective, selector: "    button[toggle],    a[toggle],    rlb-navbar-item[toggle],    rlb-button-toolbar[toggle],    rlb-fab[toggle],", inputs: ["toggle", "toggle-target", "collapsed", "auto-close"] }, { kind: "component", type: i2$1.SidebarComponent, selector: "rlb-sidebar", inputs: ["dark", "rounded"] }, { kind: "component", type: i2$1.SidebarItemComponent, selector: "rlb-sidebar-item", inputs: ["title", "icon", "label", "link", "badgeCounter"], outputs: ["click"] }, { kind: "component", type: i2$1.ModalContainerComponent, selector: "rlb-modal-container", inputs: ["id"] }, { kind: "component", type: i2$1.ToastContainerComponent, selector: "rlb-toast-container", inputs: ["id"] }, { kind: "component", type: SettingsDropdownSelectorComponent, selector: "rlb-settings-dropdown-selector", inputs: ["mode", "apps", "navbarHasSettings", "navbarHasLogin", "isAuthenticated"], outputs: ["appSelected"] }, { kind: "component", type: AppDropdownSelectorComponent, selector: "rlb-app-dropdown-selector", inputs: ["mode", "apps", "isAuthenticated"], outputs: ["appSelected"] }, { kind: "directive", type: RlbRole, selector: "[roles]", inputs: ["roles"] }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsMultiPipe, name: "asMulti" }, { kind: "pipe", type: AsSinglePipe, name: "asSingle" }, { kind: "pipe", type: LeftComponentPipe, name: "leftComponent" }, { kind: "pipe", type: RightComponentPipe, name: "rightComponent" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AppTemplateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'rlb-app-template', standalone: false, template: "<div class=\"rlb-app\">\n  @if (navVisible$ | async) {\n    <rlb-navbar [dark]=\"theme === 'dark'\" [showSideBarToggler]=\"(sidebarVisible$ | async)\"  expand=\"lg\" class=\"border-bottom py-1 rlb-navbar\">\n      @if (navHeader$ | async; as header) {\n        <a rlb-navbar-brand href=\"#\">\n\n          @if (header.type === 'text') {\n            {{ header.text }}\n          }\n\n          @if (header.type === 'image') {\n            <img\n              [src]=\"header.src\"\n              [alt]=\"header.alt ?? 'Brand'\"\n              [height]=\"header.height ?? 40\"\n            />\n          }\n        </a>\n      }\n      @if (navSearchVisible$ | async) {\n        <rlb-navbar-form>\n          <rlb-input-group class=\"my-1 mx-3\" validate>\n            <rlb-input type=\"search\" class=\"search-input\" placeholder=\"Search\" [(ngModel)]=\"navSearchText\"\n                       (keyup.enter)=\"setNavbarSearchText(navSearchText)\" name=\"search\" size=\"small\">\n              <button after rlb-button outline type=\"submit\" (click)=\"setNavbarSearchText(navSearchText)\" size=\"sm\">\n                <i class=\"bi bi-search\"></i>\n              </button>\n            </rlb-input>\n          </rlb-input-group>\n        </rlb-navbar-form>\n      }\n\n      <!-- MOBILE VIEWS -->\n      <div rlb-custom-navbar-items class=\"d-flex d-lg-none\">\n        <rlb-fab size=\"sm\" outline toggle=\"offcanvas\" toggle-target=\"mobileMenuOffcanvas\">\n          <i class=\"bi bi-three-dots-vertical\"></i>\n        </rlb-fab>\n\n        <rlb-offcanvas\n          #mobileOffcanvas\n          id=\"mobileMenuOffcanvas\"\n          [placement]=\"'end'\"\n          (statusChange)=\"onMobileMenuStatusChange($event)\"\n        >\n          <rlb-offcanvas-header class=\"border-bottom\">\n            <h5 rlb-offcanvas-title class=\"fw-bold mb-0\">Menu</h5>\n          </rlb-offcanvas-header>\n\n          <rlb-offcanvas-body class=\"p-0 overflow-x-hidden\">\n\n            <!-- Mobile Apps Grid -->\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <div class=\"border-bottom pb-2\">\n                <rlb-app-dropdown-selector\n                  mode=\"mobile\"\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  (appSelected)=\"selectApp($event, 'app')\"\n                />\n              </div>\n            }\n\n            <!-- Mobile Settings Carousel -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async)) || (navbarHasSettings$ | async)) {\n              <div class=\"pt-2\">\n                <rlb-settings-dropdown-selector\n                  mode=\"mobile\"\n                  #mobileSettingsMenu\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                  [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                  (appSelected)=\"selectApp($event, 'settings')\"\n                />\n              </div>\n            }\n\n          </rlb-offcanvas-body>\n        </rlb-offcanvas>\n      </div>\n\n      <rlb-navbar-items>\n        @for (navComponent of navLeftItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | leftComponent\"></ng-container>\n          </ng-container>\n        }\n      </rlb-navbar-items>\n\n      <rlb-navbar-items class=\"ms-auto align-items-center\">\n        @for (navComponent of navRightItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | rightComponent\"></ng-container>\n          </ng-container>\n        }\n        @if ((separatorVisible$ | async)) {\n          <rlb-navbar-separator />\n        }\n\n        <ng-container ngProjectAs=\"rlb-navbar-item\">\n          @if ((navbarLayout$ | async) == 'default') {\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') |translate\">\n                  <i class=\" bi bi-box-arrow-in-left\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.login' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ( (navbarHasLogin$ | async) && (isAuthenticated$ | async)) {\n              <rlb-navbar-item [router-link]=\"'/profile'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.title') |translate\">\n                <i class=\"bi bi-person\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if (navbarHasSettings$ | async) {\n              <rlb-navbar-item [router-link]=\"'/settings'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.settings.title') |translate\">\n                <i class=\"bi bi-gear\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.settings.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <rlb-navbar-item [router-link]=\"'/apps'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.apps.button') |translate\">\n                <i class=\"bi bi-grid-3x3-gap-fill\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.apps.button' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n          } @else if ((navbarLayout$ | async) == 'dropdown') {\n            <!-- MODERN DROPDOWN MODE -->\n\n            <!--Unauthenticated Login -->\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') | translate\">\n                  <i class=\"bi bi-box-arrow-in-left fs-5\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{ 'core.account.login' | translate }}</span>\n              </rlb-navbar-item>\n            }\n\n            <!-- Profile & Settings Account Card -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async)) || (navbarHasSettings$ | async)) {\n              <rlb-settings-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                (appSelected)=\"selectApp($event, 'settings')\"\n              />\n            }\n\n            <!-- Apps Launcher -->\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <rlb-app-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                (appSelected)=\"selectApp($event, 'app')\"\n              />\n            }\n          }\n        </ng-container>\n      </rlb-navbar-items>\n    </rlb-navbar>\n  }\n  <div class=\"rlb-main-wrapper\">\n    @if ((sidebarVisible$ | async)) {\n      <rlb-sidebar [dark]=\"theme === 'dark'\" id=\"sidebar\" class=\"rlb-sidebar\">\n        @for (item of  (sidebarItems$ | async); track $index) {\n          <rlb-sidebar-item\n            *roles=\"item.action\"\n            [icon]=\"item.icon\" [link]=\"item.url\"\n            [title]=\"item.title\" [label]=\"item.label\"\n            [badgeCounter]=\"item.badgeCounter\"\n            (click)=\"onSideBarItemClick(item)\"\n            >\n            {{item.label}}\n            @for (subitem of item.items || []; track $index) {\n              <rlb-sidebar-item\n                [icon]=\"subitem.icon\"\n                [link]=\"subitem.url\"\n                [title]=\"subitem.title\"\n                [label]=\"subitem.label\"\n                [badgeCounter]=\"subitem.badgeCounter\"\n                (click)=\"onSideBarItemClick(subitem)\"\n                >\n                {{subitem.label}}\n              </rlb-sidebar-item>\n            }\n          </rlb-sidebar-item>\n        }\n      </rlb-sidebar>\n    }\n    <div class=\"rlb-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n@if (modalContainerId) {\n  <rlb-modal-container [id]=\"modalContainerId\" />\n}\n\n@if (toastContainerIds) {\n  @if (toastContainerIds.constructor.name === 'Array') {\n    @for (toastContainerId of toastContainerIds | asMulti; track toastContainerId) {\n      <rlb-toast-container [id]=\"toastContainerId\" />\n    }\n  } @else {\n    <rlb-toast-container class=\"position-fixed bottom-0 end-0 p-3\" [id]=\"toastContainerIds | asSingle\" />\n  }\n}\n", styles: [".separator{border-left:1px solid;padding:0 2px}\n"] }]
+            args: [{ selector: 'rlb-app-template', standalone: false, template: "<div class=\"rlb-app\">\n  @if (navVisible$ | async) {\n    <rlb-navbar [dark]=\"theme === 'dark'\" [showSideBarToggler]=\"(sidebarVisible$ | async)\"  expand=\"lg\" class=\"border-bottom py-1 rlb-navbar\">\n      @if (navHeader$ | async; as header) {\n        <a rlb-navbar-brand href=\"#\">\n\n          @if (header.type === 'text') {\n            {{ header.text }}\n          }\n\n          @if (header.type === 'image') {\n            <img\n              [src]=\"header.src\"\n              [alt]=\"header.alt ?? 'Brand'\"\n              [height]=\"header.height ?? 40\"\n            />\n          }\n        </a>\n      }\n      @if (navSearchVisible$ | async) {\n        <rlb-navbar-form>\n          <rlb-input-group class=\"my-1 mx-3\" validate>\n            <rlb-input type=\"search\" class=\"search-input\" placeholder=\"Search\" [(ngModel)]=\"navSearchText\"\n                       (keyup.enter)=\"setNavbarSearchText(navSearchText)\" name=\"search\" size=\"small\">\n              <button after rlb-button outline type=\"submit\" (click)=\"setNavbarSearchText(navSearchText)\" size=\"sm\">\n                <i class=\"bi bi-search\"></i>\n              </button>\n            </rlb-input>\n          </rlb-input-group>\n        </rlb-navbar-form>\n      }\n\n      <!-- MOBILE VIEWS -->\n      <div rlb-custom-navbar-items class=\"d-flex d-lg-none\">\n        <rlb-fab size=\"sm\" outline toggle=\"offcanvas\" toggle-target=\"mobileMenuOffcanvas\">\n          <i class=\"bi bi-three-dots-vertical\"></i>\n        </rlb-fab>\n\n        <rlb-offcanvas\n          #mobileOffcanvas\n          id=\"mobileMenuOffcanvas\"\n          [placement]=\"'end'\"\n          (statusChange)=\"onMobileMenuStatusChange($event)\"\n        >\n          <rlb-offcanvas-header class=\"border-bottom\">\n            <h5 rlb-offcanvas-title class=\"fw-bold mb-0\">Menu</h5>\n          </rlb-offcanvas-header>\n\n          <rlb-offcanvas-body class=\"p-0 overflow-x-hidden\">\n\n            <!-- Mobile Apps Grid -->\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <div class=\"border-bottom pb-2\">\n                <rlb-app-dropdown-selector\n                  mode=\"mobile\"\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  (appSelected)=\"selectApp($event, 'app')\"\n                />\n              </div>\n            }\n\n            <!-- Mobile Settings Carousel -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async)) || (navbarHasSettings$ | async)) {\n              <div class=\"pt-2\">\n                <rlb-settings-dropdown-selector\n                  mode=\"mobile\"\n                  #mobileSettingsMenu\n                  [apps]=\"apps\"\n                  [isAuthenticated]=\"isAuthenticated$ | async\"\n                  [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                  [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                  (appSelected)=\"selectApp($event, 'settings')\"\n                />\n              </div>\n            }\n\n          </rlb-offcanvas-body>\n        </rlb-offcanvas>\n      </div>\n\n      <rlb-navbar-items>\n        @for (navComponent of navLeftItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | leftComponent\"></ng-container>\n          </ng-container>\n        }\n      </rlb-navbar-items>\n\n      <rlb-navbar-items class=\"ms-auto align-items-center\">\n        @for (navComponent of navRightItems$ | async; track navComponent) {\n          <ng-container ngProjectAs=\"rlb-navbar-item\">\n            <ng-container *ngComponentOutlet=\"navComponent | rightComponent\"></ng-container>\n          </ng-container>\n        }\n        @if ((separatorVisible$ | async) && (isAuthenticated$ | async)) {\n          <rlb-navbar-separator />\n        }\n\n        <ng-container ngProjectAs=\"rlb-navbar-item\">\n          @if ((navbarLayout$ | async) == 'default') {\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') |translate\">\n                  <i class=\" bi bi-box-arrow-in-left\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.login' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ((navbarHasLogin$ | async) && (isAuthenticated$ | async)) {\n              <rlb-navbar-item [router-link]=\"'/profile'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.title') |translate\">\n                <i class=\"bi bi-person\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.account.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if (navbarHasSettings$ | async) {\n              <rlb-navbar-item [router-link]=\"'/settings'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.settings.title') |translate\">\n                <i class=\"bi bi-gear\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.settings.title' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n            @if ((navbarHasApps$ | async) && apps.length > 1) {\n              <rlb-navbar-item [router-link]=\"'/apps'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.apps.button') |translate\">\n                <i class=\"bi bi-grid-3x3-gap-fill\"></i>\n              </span>\n                <span class=\"ms-1 d-lg-none\">{{'core.apps.button' | translate}}</span>\n              </rlb-navbar-item>\n            }\n\n          } @else if ((navbarLayout$ | async) == 'dropdown') {\n            <!-- MODERN DROPDOWN MODE -->\n\n            <!--Unauthenticated Login -->\n            @if ((navbarHasLogin$ | async) && !(isAuthenticated$ | async)) {\n              <rlb-navbar-item (click)=\"loginNav($event)\">\n                <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') | translate\">\n                  <i class=\"bi bi-box-arrow-in-left fs-5\"></i>\n                </span>\n                <span class=\"ms-1 d-lg-none\">{{ 'core.account.login' | translate }}</span>\n              </rlb-navbar-item>\n            }\n\n            <!-- Profile & Settings Account Card -->\n            @if (((navbarHasLogin$ | async) && (isAuthenticated$ | async))) {\n              <rlb-settings-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                [navbarHasLogin]=\"navbarHasLogin$ | async\"\n                [navbarHasSettings]=\"navbarHasSettings$ | async\"\n                (appSelected)=\"selectApp($event, 'settings')\"\n              />\n            }\n\n            <!-- Apps Launcher -->\n            @if ((navbarHasApps$ | async) && (isAuthenticated$ | async) && apps.length > 1) {\n              <rlb-app-dropdown-selector\n                [apps]=\"apps\"\n                [isAuthenticated]=\"isAuthenticated$ | async\"\n                (appSelected)=\"selectApp($event, 'app')\"\n              />\n            }\n          }\n        </ng-container>\n      </rlb-navbar-items>\n    </rlb-navbar>\n  }\n  <div class=\"rlb-main-wrapper\">\n    @if ((sidebarVisible$ | async)) {\n      <rlb-sidebar [dark]=\"theme === 'dark'\" id=\"sidebar\" class=\"rlb-sidebar\">\n        @for (item of  (sidebarItems$ | async); track $index) {\n          <rlb-sidebar-item\n            *roles=\"item.action\"\n            [icon]=\"item.icon\" [link]=\"item.url\"\n            [title]=\"item.title\" [label]=\"item.label\"\n            [badgeCounter]=\"item.badgeCounter\"\n            (click)=\"onSideBarItemClick(item)\"\n            >\n            {{item.label}}\n            @for (subitem of item.items || []; track $index) {\n              <rlb-sidebar-item\n                [icon]=\"subitem.icon\"\n                [link]=\"subitem.url\"\n                [title]=\"subitem.title\"\n                [label]=\"subitem.label\"\n                [badgeCounter]=\"subitem.badgeCounter\"\n                (click)=\"onSideBarItemClick(subitem)\"\n                >\n                {{subitem.label}}\n              </rlb-sidebar-item>\n            }\n          </rlb-sidebar-item>\n        }\n      </rlb-sidebar>\n    }\n    <div class=\"rlb-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n@if (modalContainerId) {\n  <rlb-modal-container [id]=\"modalContainerId\" />\n}\n\n@if (toastContainerIds) {\n  @if (toastContainerIds.constructor.name === 'Array') {\n    @for (toastContainerId of toastContainerIds | asMulti; track toastContainerId) {\n      <rlb-toast-container [id]=\"toastContainerId\" />\n    }\n  } @else {\n    <rlb-toast-container class=\"position-fixed bottom-0 end-0 p-3\" [id]=\"toastContainerIds | asSingle\" />\n  }\n}\n", styles: [".separator{border-left:1px solid;padding:0 2px}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [RLB_CFG_ENV]