@memberjunction/ng-explorer-core 1.2.2 → 1.3.1

package/dist/app-routing.module.d.ts

@@ -0,0 +1,28 @@
+import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
+import { SharedService } from '@memberjunction/ng-shared';
+import { DetachedRouteHandle, RouteReuseStrategy } from '@angular/router';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/router";
+export declare class CustomReuseStrategy implements RouteReuseStrategy {
+    storedRoutes: {
+        [key: string]: DetachedRouteHandle;
+    };
+    shouldDetach(route: ActivatedRouteSnapshot): boolean;
+    store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void;
+    shouldAttach(route: ActivatedRouteSnapshot): boolean;
+    retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle | null;
+    shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean;
+}
+export declare class ResourceResolver implements Resolve<void> {
+    private sharedService;
+    constructor(sharedService: SharedService);
+    resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ResourceResolver, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ResourceResolver>;
+}
+export declare class AppRoutingModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AppRoutingModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AppRoutingModule, never, [typeof i1.RouterModule], [typeof i1.RouterModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AppRoutingModule>;
+}
+//# sourceMappingURL=app-routing.module.d.ts.map

package/dist/app-routing.module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-routing.module.d.ts","sourceRoot":"","sources":["../src/app-routing.module.ts"],"names":[],"mappings":"AACA,OAAO,EAAwB,OAAO,EAAE,sBAAsB,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAkB7G,OAAO,EAAc,aAAa,EAAgB,MAAM,2BAA2B,CAAC;AAEpF,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;;;AAE1E,qBAAa,mBAAoB,YAAW,kBAAkB;IAC5D,YAAY,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,mBAAmB,CAAA;KAAE,CAAM;IAG1D,YAAY,CAAC,KAAK,EAAE,sBAAsB,GAAG,OAAO;IAMpD,KAAK,CAAC,KAAK,EAAE,sBAAsB,EAAE,MAAM,EAAE,mBAAmB,GAAG,IAAI;IAOvE,YAAY,CAAC,KAAK,EAAE,sBAAsB,GAAG,OAAO;IAOpD,QAAQ,CAAC,KAAK,EAAE,sBAAsB,GAAG,mBAAmB,GAAG,IAAI;IAQnE,gBAAgB,CAAC,MAAM,EAAE,sBAAsB,EAAE,IAAI,EAAE,sBAAsB,GAAG,OAAO;CAGxF;AAED,qBAGa,gBAAiB,YAAW,OAAO,CAAC,IAAI,CAAC;IACxC,OAAO,CAAC,aAAa;gBAAb,aAAa,EAAE,aAAa;IAEhD,OAAO,CAAC,KAAK,EAAE,sBAAsB,EAAE,KAAK,EAAE,mBAAmB,GAAG,IAAI;yCAH7D,gBAAgB;6CAAhB,gBAAgB;CA2D5B;AAgDD,qBAIa,gBAAgB;yCAAhB,gBAAgB;0CAAhB,gBAAgB;0CAAhB,gBAAgB;CAAG"}

package/dist/app-routing.module.js

@@ -0,0 +1,177 @@
+import { Injectable, NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { SingleApplicationComponent, SingleEntityComponent, SingleRecordComponent, HomeComponent, UserNotificationsComponent, DataBrowserComponent, ReportBrowserComponent, DashboardBrowserComponent, AuthGuardService as AuthGuard, FilesComponent, QueryBrowserComponent, } from './public-api';
+import { SettingsComponent } from '@memberjunction/ng-explorer-settings';
+import { LogError } from '@memberjunction/core';
+import { MJEventType, MJGlobal } from '@memberjunction/global';
+import { SkipChatComponent } from '@memberjunction/ng-ask-skip';
+import { EventCodes, ResourceData } from '@memberjunction/ng-shared';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-shared";
+import * as i2 from "@angular/router";
+export class CustomReuseStrategy {
+    constructor() {
+        this.storedRoutes = {};
+    }
+    // Determines if a route should be detached and stored
+    shouldDetach(route) {
+        var _a;
+        // Store the route if it's an "askskip" route
+        return route.routeConfig && ((_a = route.routeConfig.path) === null || _a === void 0 ? void 0 : _a.includes('askskip')) ? true : false;
+    }
+    // Stores the detached route
+    store(route, handle) {
+        if (route.routeConfig && route.routeConfig.path) {
+            this.storedRoutes[route.routeConfig.path] = handle;
+        }
+    }
+    // Determines if a stored route should be reattached
+    shouldAttach(route) {
+        var _a;
+        // Reattach if we have a stored route for the incoming route
+        if ((_a = route.routeConfig) === null || _a === void 0 ? void 0 : _a.path)
+            return !!route.routeConfig && !!this.storedRoutes[route.routeConfig.path];
+        else
+            return false;
+    }
+    // Retrieves the stored route; null means no stored route for this path
+    retrieve(route) {
+        if (!route.routeConfig || (route.routeConfig.path && !this.storedRoutes[route.routeConfig.path])) {
+            return null;
+        }
+        else if (route.routeConfig.path)
+            return this.storedRoutes[route.routeConfig.path];
+        else
+            return null;
+    }
+    // Determines if the route should be reused
+    shouldReuseRoute(future, curr) {
+        return future.routeConfig === curr.routeConfig;
+    }
+}
+export class ResourceResolver {
+    constructor(sharedService) {
+        this.sharedService = sharedService;
+    }
+    resolve(route, state) {
+        var _a;
+        let resourceType = route.params['resourceType'];
+        const resourceRecordId = route.params['resourceRecordId'];
+        if (resourceType !== undefined && resourceRecordId !== undefined) {
+            resourceType = this.sharedService.mapResourceTypeRouteSegmentToName(resourceType);
+            const data = new ResourceData({
+                Name: '',
+                ResourceRecordID: resourceRecordId,
+                ResourceTypeID: (_a = this.sharedService.ResourceTypeByName(resourceType)) === null || _a === void 0 ? void 0 : _a.ID,
+                Configuration: {},
+            });
+            let code = EventCodes.AddDashboard;
+            switch (resourceType.trim().toLowerCase()) {
+                case 'user views':
+                    code = EventCodes.ViewClicked;
+                    break;
+                case 'dashboards':
+                    code = EventCodes.AddDashboard;
+                    break;
+                case 'reports':
+                    code = EventCodes.AddReport;
+                    break;
+                case 'queries':
+                    code = EventCodes.AddQuery;
+                    break;
+                case 'records':
+                    code = EventCodes.EntityRecordClicked;
+                    data.Configuration.Entity = route.queryParams['Entity'] || route.queryParams['entity']; // Entity or entity is specified for this resource type since resource record id isn't good enough
+                    if (data.Configuration.Entity === undefined || data.Configuration.Entity === null) {
+                        LogError('No Entity provided in the URL, must have Entity as a query parameter for this resource type');
+                        return; // should handle the error better - TO-DO
+                    }
+                    break;
+                case 'search results':
+                    code = EventCodes.RunSearch;
+                    data.Configuration.Entity = route.queryParams['Entity'] || route.queryParams['entity'];
+                    data.Configuration.SearchInput = resourceRecordId;
+                    data.ResourceRecordID = 0; /*tell nav to create new tab*/
+                    break;
+                default:
+                    // unsupported resource type
+                    return; // should handle the error better - TO-DO
+            }
+            MJGlobal.Instance.RaiseEvent({
+                component: this,
+                event: MJEventType.ComponentEvent,
+                eventCode: code,
+                args: data,
+            });
+        }
+        else {
+            // to-do - handle error
+        }
+    }
+}
+ResourceResolver.ɵfac = function ResourceResolver_Factory(t) { return new (t || ResourceResolver)(i0.ɵɵinject(i1.SharedService)); };
+ResourceResolver.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: ResourceResolver, factory: ResourceResolver.ɵfac, providedIn: 'root' });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ResourceResolver, [{
+        type: Injectable,
+        args: [{
+                providedIn: 'root',
+            }]
+    }], () => [{ type: i1.SharedService }], null); })();
+const routes = [
+    { path: '', component: HomeComponent, canActivate: [AuthGuard] },
+    { path: 'home', component: HomeComponent, canActivate: [AuthGuard] },
+    { path: 'askskip', component: SkipChatComponent, canActivate: [AuthGuard] },
+    { path: 'askskip/:conversationId', component: SkipChatComponent, canActivate: [AuthGuard] },
+    { path: 'dashboards', component: DashboardBrowserComponent, canActivate: [AuthGuard] },
+    { path: 'dashboards/:folderID', component: DashboardBrowserComponent, canActivate: [AuthGuard] },
+    { path: 'reports', component: ReportBrowserComponent, canActivate: [AuthGuard] },
+    { path: 'reports/:folderID', component: ReportBrowserComponent, canActivate: [AuthGuard] },
+    { path: 'queries', component: QueryBrowserComponent, canActivate: [AuthGuard] },
+    { path: 'queries/:folderID', component: QueryBrowserComponent, canActivate: [AuthGuard] },
+    { path: 'data', component: DataBrowserComponent, canActivate: [AuthGuard] },
+    { path: 'files', component: FilesComponent, canActivate: [AuthGuard] },
+    {
+        path: 'settings',
+        component: SettingsComponent,
+        canActivate: [AuthGuard],
+        children: [
+            {
+                path: '',
+                component: SettingsComponent,
+                pathMatch: 'full',
+            },
+            {
+                path: '**',
+                component: SettingsComponent,
+            },
+        ],
+    },
+    { path: 'notifications', component: UserNotificationsComponent, canActivate: [AuthGuard] },
+    { path: 'app/:appName', component: SingleApplicationComponent, canActivate: [AuthGuard] },
+    { path: 'app/:appName/:entityName', component: SingleApplicationComponent, canActivate: [AuthGuard] },
+    { path: 'app/:appName/:entityName/:folderID', component: SingleApplicationComponent, canActivate: [AuthGuard] },
+    { path: 'entity/:entityName', component: SingleEntityComponent, canActivate: [AuthGuard] },
+    {
+        path: 'resource/:resourceType/:resourceRecordId',
+        resolve: { data: ResourceResolver },
+        canActivate: [AuthGuard],
+        component: SingleRecordComponent,
+    },
+    {
+        path: '**',
+        redirectTo: 'home',
+    },
+];
+export class AppRoutingModule {
+}
+AppRoutingModule.ɵfac = function AppRoutingModule_Factory(t) { return new (t || AppRoutingModule)(); };
+AppRoutingModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: AppRoutingModule });
+AppRoutingModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [RouterModule.forRoot(routes, { initialNavigation: 'disabled' }), RouterModule] });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AppRoutingModule, [{
+        type: NgModule,
+        args: [{
+                imports: [RouterModule.forRoot(routes, { initialNavigation: 'disabled' })],
+                exports: [RouterModule],
+            }]
+    }], null, null); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(AppRoutingModule, { imports: [i2.RouterModule], exports: [RouterModule] }); })();

package/dist/lib/favorites/favorites.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"favorites.component.d.ts","sourceRoot":"","sources":["../../../src/lib/favorites/favorites.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;;AAEnE,qBAKa,kBAAkB;IAIjB,OAAO,CAAC,MAAM;IAHnB,SAAS,EAAE,kBAAkB,EAAE,CAAM;IACrC,WAAW,EAAE,MAAM,CAAM;gBAEZ,MAAM,EAAE,MAAM;IAE5B,QAAQ;IA2Bd,iBAAiB,CAAC,GAAG,EAAE,kBAAkB;IAgCzC,uBAAuB,CAAC,GAAG,EAAE,GAAG;yCAjErB,kBAAkB;2CAAlB,kBAAkB;CA2E9B"}
+{"version":3,"file":"favorites.component.d.ts","sourceRoot":"","sources":["../../../src/lib/favorites/favorites.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;;AAEnE,qBAKa,kBAAkB;IAIjB,OAAO,CAAC,MAAM;IAHnB,SAAS,EAAE,kBAAkB,EAAE,CAAM;IACrC,WAAW,EAAE,MAAM,CAAM;gBAEZ,MAAM,EAAE,MAAM;IAE5B,QAAQ;IA6Bd,iBAAiB,CAAC,GAAG,EAAE,kBAAkB;IAgCzC,uBAAuB,CAAC,GAAG,EAAE,GAAG;yCAnErB,kBAAkB;2CAAlB,kBAAkB;CA6E9B"}

package/dist/lib/favorites/favorites.component.js

@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { Component } from '@angular/core';
-import { Metadata, RunView } from '@memberjunction/core';
+import { Metadata, RunView, CompositeKey } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/router";
 import * as i2 from "@progress/kendo-angular-listview";
@@ -61,12 +61,14 @@ export class FavoritesComponent {
             });
             this.favorites = viewResults.Results; // set the result in the list and let the below happen after async and it will update via data binding when done
             const input = this.favorites.map(fav => {
-                return { EntityName: fav.Entity, PrimaryKeyValues: [{ FieldName: 'ID', Value: fav.RecordID }] };
+                let compositeKey = new CompositeKey([{ FieldName: 'ID', Value: fav.RecordID }]);
+                return { EntityName: fav.Entity, CompositeKey: compositeKey };
             });
             const results = yield md.GetEntityRecordNames(input);
             if (results) {
                 results.forEach((result) => {
-                    const fav = this.favorites.find(f => f.Entity == result.EntityName && f.RecordID == result.PrimaryKeyValues[0].Value);
+                    let compositeKey = new CompositeKey(result.CompositeKey.KeyValuePairs);
+                    const fav = this.favorites.find(f => f.Entity == result.EntityName && f.RecordID == compositeKey.GetValueByIndex(0));
                     if (fav) {
                         // typecast fav to any so we can add the recordname into the object below
                         fav.RecordName = result.Success ? result.RecordName : fav.Entity + ' ' + fav.RecordID;

package/dist/lib/generic-browser-list/generic-browser-list.component.d.ts

@@ -59,7 +59,7 @@ export declare class GenericBrowserListComponent implements OnInit {
     createFolderDialogOpened: boolean;
     private newFolderText;
     private resourceTypes;
-    data: {
+    createButtonDropdownData: {
         text: string;
     }[];
     constructor(sharedService: SharedService);

package/dist/lib/generic-browser-list/generic-browser-list.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"generic-browser-list.component.d.ts","sourceRoot":"","sources":["../../../src/lib/generic-browser-list/generic-browser-list.component.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"generic-browser-list.component.d.ts","sourceRoot":"","sources":["../../../src/lib/generic-browser-list/generic-browser-list.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/generic-browser-list/generic-browser-list.component.js

@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { Folder, Item, ItemType } from '../../generic/Item.types';
-import { Metadata, PrimaryKeyValue, RunView } from '@memberjunction/core';
+import { Metadata, KeyValuePair, RunView, CompositeKey } from '@memberjunction/core';
 import { AfterAddFolderEvent, AfterAddItemEvent, AfterDeleteFolderEvent, AfterDeleteItemEvent, BeforeAddFolderEvent, BeforeAddItemEvent, BeforeDeleteFolderEvent, BeforeDeleteItemEvent, BeforeUpdateFolderEvent, BeforeUpdateItemEvent } from '../../generic/Events.types';
 import { Subject, debounceTime } from 'rxjs';
 import * as i0 from "@angular/core";
@@ -34,7 +34,7 @@ function GenericBrowserListComponent_Conditional_22_Conditional_0_ng_template_6_
     const _r14 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 33);
     i0.ɵɵlistener("click", function GenericBrowserListComponent_Conditional_22_Conditional_0_ng_template_6_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r14); const dataItem_r10 = i0.ɵɵnextContext().$implicit; const ctx_r12 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r12.editItem(dataItem_r10)); });
-    i0.ɵɵelement(1, "i", 35);
+    i0.ɵɵelement(1, "span", 35);
     i0.ɵɵelementEnd();
 } }
 function GenericBrowserListComponent_Conditional_22_Conditional_0_ng_template_6_Template(rf, ctx) { if (rf & 1) {
@@ -43,7 +43,7 @@ function GenericBrowserListComponent_Conditional_22_Conditional_0_ng_template_6_
     i0.ɵɵtemplate(1, GenericBrowserListComponent_Conditional_22_Conditional_0_ng_template_6_Conditional_1_Template, 2, 0, "button", 32);
     i0.ɵɵelementStart(2, "button", 33);
     i0.ɵɵlistener("click", function GenericBrowserListComponent_Conditional_22_Conditional_0_ng_template_6_Template_button_click_2_listener() { const restoredCtx = i0.ɵɵrestoreView(_r16); const dataItem_r10 = restoredCtx.$implicit; const ctx_r15 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r15.deleteItem(dataItem_r10)); });
-    i0.ɵɵelement(3, "i", 34);
+    i0.ɵɵelement(3, "span", 34);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r9 = i0.ɵɵnextContext(3);
@@ -214,7 +214,7 @@ export class GenericBrowserListComponent {
         this.createFolderDialogOpened = false;
         this.newFolderText = "Sample Folder";
         this.resourceTypes = [];
-        this.data = [
+        this.createButtonDropdownData = [
             { text: "Folder" },
         ];
         this.filterItemsSubject
@@ -224,7 +224,7 @@ export class GenericBrowserListComponent {
     ngOnInit() {
         return __awaiter(this, void 0, void 0, function* () {
             if (!this.disableAddButton) {
-                this.data.unshift({ text: this.resourceName });
+                this.createButtonDropdownData.unshift({ text: this.resourceName });
             }
             const md = new Metadata();
             const view = new RunView();
@@ -379,12 +379,13 @@ export class GenericBrowserListComponent {
             this.showLoader = true;
             const md = new Metadata();
             let folderEntity = yield md.GetEntityObject(this.CategoryEntityName);
-            let pkv = new PrimaryKeyValue();
+            let pkv = new KeyValuePair();
             pkv.FieldName = "ID";
             pkv.Value = folder.ID;
+            let compositeKey = new CompositeKey([pkv]);
             //create view browser component - this will be used to display views
             //then create a new component for applications that wraps around the view browser component 
-            let loadResult = yield folderEntity.InnerLoad([pkv]);
+            let loadResult = yield folderEntity.InnerLoad(compositeKey);
             if (!loadResult) {
                 this.sharedService.CreateSimpleNotification(`unable to fetch folder ${folder.Name}`, "error");
                 this.showLoader = false;
@@ -415,10 +416,11 @@ export class GenericBrowserListComponent {
             if (entityID && entityID > 0) {
                 const md = new Metadata();
                 let entityObject = yield md.GetEntityObject(this.ItemEntityName);
-                let pkv = new PrimaryKeyValue();
+                let pkv = new KeyValuePair();
                 pkv.FieldName = "ID";
                 pkv.Value = entityID;
-                let loadResult = yield entityObject.InnerLoad([pkv]);
+                let compositeKey = new CompositeKey([pkv]);
+                let loadResult = yield entityObject.InnerLoad(compositeKey);
                 if (loadResult) {
                     let deleteResult = yield entityObject.Delete();
                     if (deleteResult) {
@@ -491,8 +493,8 @@ export class GenericBrowserListComponent {
             item.Favorite = !item.Favorite;
             const md = new Metadata();
             let entityName = item.Type === ItemType.Folder ? this.CategoryEntityName : this.ItemEntityName;
-            let pkv = [{ FieldName: "ID", Value: item.Data.ID }];
-            yield md.SetRecordFavoriteStatus(md.CurrentUser.ID, entityName, pkv, item.Favorite);
+            let compositeKey = new CompositeKey([{ FieldName: "ID", Value: item.Data.ID }]);
+            yield md.SetRecordFavoriteStatus(md.CurrentUser.ID, entityName, compositeKey, item.Favorite);
         });
     }
     editItem(item) {
@@ -592,7 +594,7 @@ GenericBrowserListComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
         i0.ɵɵadvance(2);
         i0.ɵɵtextInterpolate(ctx.title);
         i0.ɵɵadvance();
-        i0.ɵɵproperty("data", ctx.data);
+        i0.ɵɵproperty("data", ctx.createButtonDropdownData);
         i0.ɵɵadvance(5);
         i0.ɵɵproperty("clearButton", true);
         i0.ɵɵadvance(2);
@@ -608,7 +610,7 @@ GenericBrowserListComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
     } }, dependencies: [i2.NgClass, i2.NgIf, i3.GridComponent, i3.DataBindingDirective, i3.ColumnComponent, i3.CellTemplateDirective, i4.DialogComponent, i4.DialogActionsComponent, i5.LoaderComponent, i6.ButtonComponent, i6.DropDownButtonComponent, i7.TextBoxComponent, i7.TextBoxPrefixTemplateDirective, i8.CardComponent, i8.CardBodyComponent, i8.CardTitleDirective, i8.CardSubtitleDirective], styles: [".card-header-entity .title-wrap h1 {\n    margin: 0 !important;\n    font-size: 36px !important;\n    line-height: 42px !important;\n    color: var(--black) !important;\n}\n   .card-header-entity .add-item .k-button {\n    border: 1px solid var(--border-blue) !important;\n    background: var(--white-color) !important;\n    color: var(--border-blue);\n    font-weight: 500 ;\n    font-size: 16px ;\n    border-radius: 10px;\n    line-height: 34px;\n}\n  .card-header-entity .add-item .k-button:hover {\n    background: var(--border-blue) !important;\n    color: var(--white-color);\n}\n  .card-header-entity .add-item .k-button:hover .k-button-text svg path {\n    fill: var(--white-color) !important;\n}\n .title-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 14px 0;\n    border-bottom: 1px solid var(--med-gray);\n}\n .title-wrapper[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 24px;\n    line-height: 28px;\n }\n .main-fav-wrapper[_ngcontent-%COMP%] {\n    background: #fff;\n    padding: 20px;\n }\n .filter-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: flex-start;\n    gap: 14px;\n    align-items: center;\n}\n .title-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    width: 100%;\n    height: 100%;\n    font-size: 16px;\n    background: transparent;\n    border: none;\n    box-sizing: border-box;\n    padding-left: 40px;\n\n }\n    .title-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%]  {\n    background: var(--light-shade);\n    width: 360px;\n    height: 44px;\n    position: relative;\n    border-radius: 10px;\n }\n .title-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%]   svg[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    left: 12px;\n}\n  .main-fav-wrapper .title-wrapper .k-dropdown-button .k-button {\n    background: var(--border-blue);\n    color: var(--white-color);\n    font-size: 16px;\n    border: none;\n    padding: 8px 25px;\n    border-radius: 10px;\n}\n  .main-fav-wrapper .title-wrapper .k-dropdown-button .k-button .k-button-text,   .card-header-entity .add-item .k-button .k-button-text {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n.btn-cmn[_ngcontent-%COMP%] {\n    width: 44px;\n    height: 44px;\n    min-width: 44px;\n    background: transparent;\n    border-radius: 8px;\n    border: 1px solid var(--gray-color);\n}\n.btn-cmn.active[_ngcontent-%COMP%] {\n    border: 1px solid var(--border-blue);\n}\n  .main-fav-wrapper .title-wrapper .filter-wrapper .k-dropdown-button .k-button {\n    border: 1px solid var(--gray-color);\n    border-radius: 8px;   padding: 10px 25px;\n    background: var(--white-color);\n    color: var(--sideNav);\n}\n  .main-area .card-list .card-wrapper .k-card-body {\n    padding: 16px !important;\n    position: relative;\n}\n  .main-fav-wrapper .main-area .card-list .card-wrapper .list-item-icon {\n    position: absolute;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    top:12px;\n    right: 12px;\n    z-index: 9;\n}\n.grid-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n  .main-fav-wrapper .main-area .card-list .card-wrapper .list-item-icon .common-btn, .list-btn[_ngcontent-%COMP%] {\n    width: 38px;\n    height: 38px;\n    background: #000;\n    min-width: 38px;\n    border: 1px solid var(--gray-color);\n    border-radius: 8px; \n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background: transparent;\n    cursor: pointer;\n}\n  .main-fav-wrapper .main-area .card-list .card-wrapper .k-card-body .list-item-icon:hover, .list-btn[_ngcontent-%COMP%]:hover {\n    border: 1px solid var(--border-active);\n}\n\n\n  .main-area .card-list .card-wrapper:hover {\n    box-shadow: 0px 0px 20px 0px rgba(60, 73, 99, 0.2);\n    border: 1px solid var(--border-active);\n}\n  .main-area .card-list .card-wrapper:hover .k-card-body .view-card-content-list h5 {\n    color: var(--border-blue);\n}\n  .main-area .card-list .card-wrapper .k-card-body .view-card-content-list p {\n    color: var(--sideNav);\n    font-size: 14px;\n    line-height: 16px;\n    height: auto;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n\n}\n  .main-area .card-list .card-wrapper .k-card-body .view-card-content-list h5 {\n    font-size: 18px;\n    line-height: 21px;\n    color: var(--text-darked);\n    font-weight: 600;\n}\n.breadcrumb-wrap[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 0;\n}\n.breadcrumb-wrap[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 16px;\n    line-height: 18px;\n    font-weight: 400;\n    color: var(--black);\n}\n  .k-menu-popup {\n    box-shadow: 0px 0px 20px 0px rgba(60, 73, 99, 0.2);\n    border-radius: 10px;\n    padding: 16px;\n}\n\n  .k-menu-popup kendo-button-list ul li .k-menu-link {\n    box-shadow: none !important;\n} \n  .k-menu-popup kendo-button-list ul li .k-menu-link:active {\n    background: transparent !important;\n}\n  .k-menu-popup kendo-button-list ul li .k-menu-link .k-menu-link-text:hover {\n    color: var(--primary-color);\n    background: transparent !important;\n\n}\n  .dialog-wrapper .popup-actions-btn button {\n    flex: 1;\n}\n  .dialog-wrapper .popup-actions-btn {\n    display: flex;\n}\n  .dialog-wrapper .popup-actions-btn .cancel-btn {\n    background: var(--primary-color);\n    color: var(--white-color);\n    font-size: 16px;\n    font-weight: 700;\n    line-height: 34px;\n    text-align: center;\n    border-radius: 10px;\n    border: 1px solid transparent;\n\n}\n  .dialog-wrapper .popup-actions-btn .yes-btn {\n    border:1px solid var(--primary-color);\n    background: transparent;\n    color: var(--primary-color);\n    font-size: 16px;\n    font-weight: 700;\n    line-height: 34px;\n    text-align: center;\n    border-radius: 10px;\n    box-shadow: none;\n}\n  .dialog-wrapper .popup-actions-btn .yes-btn:focus {\n    box-shadow: none !important;\n}\n  .dialog-wrapper .k-window-title {\n    font-size: 30px;\n    font-weight: 500;\n    line-height: 36px;\n    text-align: left;\n    color: var(--text-darked);\n}\n  .dialog-wrapper p {\n    font-size: 16px;\n    font-weight: 500;\n    line-height: 20px;\n    text-align: left;\n    color: var(--black);\n}\n\n.margin-left-small[_ngcontent-%COMP%] {\n    margin-left: 10px;\n}\n\n.card-wrapper[_ngcontent-%COMP%] {\n    min-width: 230px;\n    height: 150px;\n    min-height: 125px;\n}\n\n.padding-top-small[_ngcontent-%COMP%] {\n    padding-top: 10px;\n}\n\n.cursor-pointer[_ngcontent-%COMP%] {\n    cursor: pointer;\n}\n\n.title-folder[_ngcontent-%COMP%] {\n    padding-right: 20px;\n    margin: auto;\n}\n\n.title-flex-display[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: row;\n}", ".main-area[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  gap: 24px;\n  padding: 24px 0;\n}\n.list-view[_ngcontent-%COMP%] {\n  padding: 16px;\n  min-width: 300px;\n  border-radius: 4px;\n  background:  #FAFAFA;\n  border: none;\n}\n  .list-view .k-listview-header,   .list-view .k-listview-footer {\n  border: none;\n}\n  .list-view .k-listview-content {\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  border-radius: 4px;\n  background: #fff;\n  padding: 16px;\n}\n\n.header[_ngcontent-%COMP%], .footer[_ngcontent-%COMP%] {\n  color: #424242;\n  font-size: 16px;\n  height: auto;\n  margin:0;\n}\n\n.header[_ngcontent-%COMP%] {\n  color: #424242;\n  margin-bottom: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n.header[_ngcontent-%COMP%]   .head-tag[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color:  #424242;\nfont-size: 16px;\nfont-style: normal;\nfont-weight: 400;\nline-height: 20px;\n}\n\n.header[_ngcontent-%COMP%]   .count[_ngcontent-%COMP%] {\n  width: 24px;\n  height: 24px;\n  min-width: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 10px;\n  background: rgba(0, 0, 0, 0.08);\n  border-radius: 50%;\n}\n.footer[_ngcontent-%COMP%] {\n  font-size: 14px;\n  margin-top: 16px;\n}\n\n.list-item[_ngcontent-%COMP%] {\n  color:  #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 4px;\n}\n.card-container[_ngcontent-%COMP%] {\n  margin: 0;\n  padding: 0;\n  box-shadow: none;\n}\n.card-header-entity[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding-bottom: 20px;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.08);\n}\n.card-header-entity[_ngcontent-%COMP%]   .title-wrap[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n  color: #424242;\n  font-size: 28px;\n  font-style: normal;\n  font-weight: 300;\n  line-height: 28px;\n  margin-bottom: 15px;\n}\n.card-header-entity[_ngcontent-%COMP%]   .title-wrap[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n}\n.card-header-entity[_ngcontent-%COMP%]   .title-wrap[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n}\n\n\n\n\n \n.view-card[_ngcontent-%COMP%]   .view-icon[_ngcontent-%COMP%] {\n  color: var(--sideNav);\n}\n.card-wrapper[_ngcontent-%COMP%] {\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  border-radius: 6px;\n  width: 100% !important;\n}\n.card-wrapper[_ngcontent-%COMP%]   .k-card-body[_ngcontent-%COMP%] {\n  background: #fff;\n  padding: 12px 20px;\n}\n.card-wrapper[_ngcontent-%COMP%]   .view-card[_ngcontent-%COMP%] {\n  overflow: auto;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: #fafafa;\n  padding: 4px 15px;\n}\n.view-card[_ngcontent-%COMP%]   .btn-wrapper[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n}\n\n.k-card-body[_ngcontent-%COMP%]   .view-card-content[_ngcontent-%COMP%]   h5[_ngcontent-%COMP%] {\n  color: #424242;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  margin-bottom: 0;\n  letter-spacing: 0.18px;\n}\n.k-card-body[_ngcontent-%COMP%]   .view-card-content[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  color: #666;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  height: 48px;\n  margin-bottom: 0;\n}\n.card-container[_ngcontent-%COMP%] {\n  padding: 0;\n  margin: 0;\n  box-shadow: none;\n}\n.card-header-entity[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding-bottom: 20px;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.08);\n}\n\n.card-header-entity[_ngcontent-%COMP%]   .title-wrap[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n  color: #424242;\n  font-size: 28px;\n  font-style: normal;\n  font-weight: 300;\n  line-height: 28px;\n  margin-bottom: 15px;\n}\n.card-header-entity[_ngcontent-%COMP%]   .title-wrap[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n}\n.card-header-entity[_ngcontent-%COMP%]   .title-wrap[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n}\n.main-area[_ngcontent-%COMP%]   .card-list[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(4, 1fr);\n  gap: 20px;\n}"] });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(GenericBrowserListComponent, [{
         type: Component,
-        args: [{ selector: 'app-generic-browser-list', template: "\n<div class=\"generic-browser-list-container\">\n  <div class=\"main-fav-wrapper\">\n    <div class=\"title-wrapper\">\n      <div class=\"title-flex-display\">\n        @if(selectedFolderID){\n          <span title=\"Folder\" class=\"title-folder fa-regular fa-folder fa-2xl\"></span>\n        }\n        <h4>{{title}}</h4>\n      </div>\n      <kendo-dropdownbutton class=\"custom-dropdwn\" (itemClick)=\"onDropdownItemClick($event)\" [data]=\"data\" themeColor=\"info\">\n        <span class=\"fa-solid fa-plus\"></span>\n        Create New\n      </kendo-dropdownbutton>\n    </div>\n    <div class=\"title-wrapper\">\n      <div class=\"search\">\n        <kendo-textbox \n        type=\"text\" \n        #searchInput \n        placeholder=\"Search\" \n        (keyup)=\"onKeyup(searchInput.value)\"\n        [clearButton]=\"true\"\n        size=\"large\"\n        rounded=\"large\"\n        fillMode=\"solid\"\n        >\n          <ng-template kendoTextBoxPrefixTemplate [showSeparator]=\"true\">\n            <span class=\"fa-solid fa-magnifying-glass margin-left-small\"></span>\n          </ng-template>\n        </kendo-textbox>\n      </div>\n      <div class=\"filter-wrapper\">\n        <!--\n        <kendo-dropdownbutton [data]=\"data\" themeColor=\"primary\">\n          Sort By Recents\n        </kendo-dropdownbutton>\n        -->\n        <button kendobutton (click)=\"changeViewMode('grid')\" class=\"cursor-pointer grid-btn btn-cmn\">\n          <span class=\"fa-solid fa-bars\"></span>\n        </button>\n        <button kendobutton (click)=\"changeViewMode('list')\" class=\"cursor-pointer active btn-cmn\">\n          <span class=\"fa-solid fa-table-cells-large\"></span>\n        </button>\n      </div>\n    </div>\n\n    <div class=\"main-area\">\n      <kendo-loader *ngIf=\"showLoader\" type=\"converging-spinner\"></kendo-loader>\n      @if(!showLoader){\n        @if(displayAsGrid){\n          <kendo-grid (cellClick)=\"onCellItemClicked($event)\" [kendoGridBinding]=\"items\">\n            <kendo-grid-column field=\"Name\" title=\"Name\"></kendo-grid-column>\n            <kendo-grid-column field=\"Size\" title=\"Size\"></kendo-grid-column>\n            <kendo-grid-column field=\"LastOpened\" title=\"Last Opened\"></kendo-grid-column>\n            <kendo-grid-column field=\"ModifiedBy\" title=\"Modified By\"></kendo-grid-column>\n            <kendo-grid-column title=\"\">\n              <ng-template kendoGridCellTemplate let-dataItem>\n                <div class=\"grid-wrapper\">\n                  @if(disableEditButton){\n                    <button class=\"list-btn\" (click)=\"editItem(dataItem)\">\n                      <i class=\"fa-regular fa-pen-to-square\"></i>\n                    </button>\n                  }\n                  <button class=\"list-btn\" (click)=\"deleteItem(dataItem)\">\n                    <i class=\"fa-regular fa-trash-can\"></i>\n                  </button>\n                </div>\n              </ng-template>\n            </kendo-grid-column>\n          </kendo-grid>\n        }\n        @else{\n          <div class=\"card-list k-d-flex k-flex-row k-h-full k-flex-wrap\">\n            @for(item of items; track item){\n              <kendo-card class=\"card-wrapper cursor-pointer\">\n                <div class=\"list-item-icon\">\n                  @if(!disableEditButton){\n                    <button (click)=\"editItem(item)\" class=\"list-btn\">\n                      <span class=\"fa-regular fa-pen-to-square\"></span>\n                    </button>\n                  }\n                  <button (click)=\"deleteItem(item)\" class=\"list-btn\">\n                    <span class=\"fa-regular fa-trash-can\"></span>\n                  </button>\n                </div>\n                <kendo-card-body (click)=\"itemClick(item)\">\n                    <span (title)=\"item.Name\" [ngClass]=\"getIconForResourceType(item)\"></span>\n                    <div class=\"padding-top-small\">\n                      <h5 kendoCardTitle>{{ item.Name }}</h5>\n                      <p kendoCardSubtitle>{{ item.Description }}</p>\n                    </div>\n                </kendo-card-body>\n              </kendo-card>\n            }\n          </div>\n        }\n      }\n    </div>\n  </div>\n\n  <kendo-dialog \n  [minWidth]=\"450\"\n  [width]=\"650\"\n  class=\"dialog-wrapper\" \n  title=\"Confirm\" \n  *ngIf=\"deleteDialogOpened\" \n  (close)=\"onConfirmDeleteItem(false)\">\n    <p class=\"k-m-7.5 k-text-center\">\n      Are you sure you want to delete <b>{{selectedItem?.Name}}?</b>\n    </p>\n    <kendo-dialog-actions class=\"popup-actions-btn\">\n      <button class=\"cancel-btn\" (click)=\"onConfirmDeleteItem(true)\" kendoButton themeColor=\"info\">\n        Yes, Delete\n      </button>\n      <button class=\"yes-btn\" (click)=\"onConfirmDeleteItem(false)\" kendoButton fillMode=\"outline\" themeColor=\"info\">\n        No, Cancel\n      </button>\n    </kendo-dialog-actions>\n  </kendo-dialog>\n  <kendo-dialog \n    title=\"Create new Folder\" \n    *ngIf=\"createFolderDialogOpened\" \n    (close)=\"toggleCreateFolderView()\"\n    [minWidth]=\"250\"\n    [width]=\"450\"\n    class=\"dialog-wrapper\"\n  >\n  <div class=\"search\">\n    <kendo-textbox placeholder=\"Enter a folder name\" (valueChange)=\"onCreateFolderKeyup($event)\"/>\n  </div>\n    <kendo-dialog-actions class=\"popup-actions-btn\">\n      <button class=\"cancel-btn\" (click)=\"createFolder()\" kendoButton themeColor=\"info\">\n        Create\n      </button>\n      <button  class=\"yes-btn\" (click)=\"toggleCreateFolderView()\" kendoButton fillMode=\"outline\" themeColor=\"info\">\n        Cancel\n      </button>\n    </kendo-dialog-actions>\n  </kendo-dialog>\n</div>\n", styles: ["::ng-deep .card-header-entity .title-wrap h1 {\n    margin: 0 !important;\n    font-size: 36px !important;\n    line-height: 42px !important;\n    color: var(--black) !important;\n}\n ::ng-deep .card-header-entity .add-item .k-button {\n    border: 1px solid var(--border-blue) !important;\n    background: var(--white-color) !important;\n    color: var(--border-blue);\n    font-weight: 500 ;\n    font-size: 16px ;\n    border-radius: 10px;\n    line-height: 34px;\n}\n::ng-deep .card-header-entity .add-item .k-button:hover {\n    background: var(--border-blue) !important;\n    color: var(--white-color);\n}\n::ng-deep .card-header-entity .add-item .k-button:hover .k-button-text svg path {\n    fill: var(--white-color) !important;\n}\n .title-wrapper {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 14px 0;\n    border-bottom: 1px solid var(--med-gray);\n}\n .title-wrapper h4 {\n    margin: 0;\n    font-size: 24px;\n    line-height: 28px;\n }\n .main-fav-wrapper {\n    background: #fff;\n    padding: 20px;\n }\n .filter-wrapper {\n    display: flex;\n    justify-content: flex-start;\n    gap: 14px;\n    align-items: center;\n}\n .title-wrapper .search  input {\n    width: 100%;\n    height: 100%;\n    font-size: 16px;\n    background: transparent;\n    border: none;\n    box-sizing: border-box;\n    padding-left: 40px;\n\n }\n    .title-wrapper .search  {\n    background: var(--light-shade);\n    width: 360px;\n    height: 44px;\n    position: relative;\n    border-radius: 10px;\n }\n .title-wrapper .search svg {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    left: 12px;\n}\n::ng-deep .main-fav-wrapper .title-wrapper .k-dropdown-button .k-button {\n    background: var(--border-blue);\n    color: var(--white-color);\n    font-size: 16px;\n    border: none;\n    padding: 8px 25px;\n    border-radius: 10px;\n}\n::ng-deep .main-fav-wrapper .title-wrapper .k-dropdown-button .k-button .k-button-text, ::ng-deep .card-header-entity .add-item .k-button .k-button-text {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n.btn-cmn {\n    width: 44px;\n    height: 44px;\n    min-width: 44px;\n    background: transparent;\n    border-radius: 8px;\n    border: 1px solid var(--gray-color);\n}\n.btn-cmn.active {\n    border: 1px solid var(--border-blue);\n}\n::ng-deep .main-fav-wrapper .title-wrapper .filter-wrapper .k-dropdown-button .k-button {\n    border: 1px solid var(--gray-color);\n    border-radius: 8px;   padding: 10px 25px;\n    background: var(--white-color);\n    color: var(--sideNav);\n}\n::ng-deep .main-area .card-list .card-wrapper .k-card-body {\n    padding: 16px !important;\n    position: relative;\n}\n::ng-deep .main-fav-wrapper .main-area .card-list .card-wrapper .list-item-icon {\n    position: absolute;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    top:12px;\n    right: 12px;\n    z-index: 9;\n}\n.grid-wrapper {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n::ng-deep .main-fav-wrapper .main-area .card-list .card-wrapper .list-item-icon .common-btn, .list-btn {\n    width: 38px;\n    height: 38px;\n    background: #000;\n    min-width: 38px;\n    border: 1px solid var(--gray-color);\n    border-radius: 8px; \n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background: transparent;\n    cursor: pointer;\n}\n::ng-deep .main-fav-wrapper .main-area .card-list .card-wrapper .k-card-body .list-item-icon:hover, .list-btn:hover {\n    border: 1px solid var(--border-active);\n}\n\n\n::ng-deep .main-area .card-list .card-wrapper:hover {\n    box-shadow: 0px 0px 20px 0px rgba(60, 73, 99, 0.2);\n    border: 1px solid var(--border-active);\n}\n::ng-deep .main-area .card-list .card-wrapper:hover .k-card-body .view-card-content-list h5 {\n    color: var(--border-blue);\n}\n::ng-deep .main-area .card-list .card-wrapper .k-card-body .view-card-content-list p {\n    color: var(--sideNav);\n    font-size: 14px;\n    line-height: 16px;\n    height: auto;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n\n}\n::ng-deep .main-area .card-list .card-wrapper .k-card-body .view-card-content-list h5 {\n    font-size: 18px;\n    line-height: 21px;\n    color: var(--text-darked);\n    font-weight: 600;\n}\n.breadcrumb-wrap {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 0;\n}\n.breadcrumb-wrap span {\n    font-size: 16px;\n    line-height: 18px;\n    font-weight: 400;\n    color: var(--black);\n}\n::ng-deep .k-menu-popup {\n    box-shadow: 0px 0px 20px 0px rgba(60, 73, 99, 0.2);\n    border-radius: 10px;\n    padding: 16px;\n}\n\n::ng-deep .k-menu-popup kendo-button-list ul li .k-menu-link {\n    box-shadow: none !important;\n} \n::ng-deep .k-menu-popup kendo-button-list ul li .k-menu-link:active {\n    background: transparent !important;\n}\n::ng-deep .k-menu-popup kendo-button-list ul li .k-menu-link .k-menu-link-text:hover {\n    color: var(--primary-color);\n    background: transparent !important;\n\n}\n::ng-deep .dialog-wrapper .popup-actions-btn button {\n    flex: 1;\n}\n::ng-deep .dialog-wrapper .popup-actions-btn {\n    display: flex;\n}\n::ng-deep .dialog-wrapper .popup-actions-btn .cancel-btn {\n    background: var(--primary-color);\n    color: var(--white-color);\n    font-size: 16px;\n    font-weight: 700;\n    line-height: 34px;\n    text-align: center;\n    border-radius: 10px;\n    border: 1px solid transparent;\n\n}\n::ng-deep .dialog-wrapper .popup-actions-btn .yes-btn {\n    border:1px solid var(--primary-color);\n    background: transparent;\n    color: var(--primary-color);\n    font-size: 16px;\n    font-weight: 700;\n    line-height: 34px;\n    text-align: center;\n    border-radius: 10px;\n    box-shadow: none;\n}\n::ng-deep .dialog-wrapper .popup-actions-btn .yes-btn:focus {\n    box-shadow: none !important;\n}\n::ng-deep .dialog-wrapper .k-window-title {\n    font-size: 30px;\n    font-weight: 500;\n    line-height: 36px;\n    text-align: left;\n    color: var(--text-darked);\n}\n::ng-deep .dialog-wrapper p {\n    font-size: 16px;\n    font-weight: 500;\n    line-height: 20px;\n    text-align: left;\n    color: var(--black);\n}\n\n.margin-left-small {\n    margin-left: 10px;\n}\n\n.card-wrapper {\n    min-width: 230px;\n    height: 150px;\n    min-height: 125px;\n}\n\n.padding-top-small {\n    padding-top: 10px;\n}\n\n.cursor-pointer {\n    cursor: pointer;\n}\n\n.title-folder {\n    padding-right: 20px;\n    margin: auto;\n}\n\n.title-flex-display {\n    display: flex;\n    flex-direction: row;\n}", "\n.main-area {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  gap: 24px;\n  padding: 24px 0;\n}\n.list-view {\n  padding: 16px;\n  min-width: 300px;\n  border-radius: 4px;\n  background:  #FAFAFA;\n  border: none;\n}\n::ng-deep .list-view .k-listview-header, \n::ng-deep .list-view .k-listview-footer {\n  border: none;\n}\n::ng-deep .list-view .k-listview-content {\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  border-radius: 4px;\n  background: #fff;\n  padding: 16px;\n}\n\n.header,\n.footer {\n  color: #424242;\n  font-size: 16px;\n  height: auto;\n  margin:0;\n}\n\n.header {\n  color: #424242;\n  margin-bottom: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n.header .head-tag {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color:  #424242;\nfont-size: 16px;\nfont-style: normal;\nfont-weight: 400;\nline-height: 20px;\n}\n\n.header .count {\n  width: 24px;\n  height: 24px;\n  min-width: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 10px;\n  background: rgba(0, 0, 0, 0.08);\n  border-radius: 50%;\n}\n.footer {\n  font-size: 14px;\n  margin-top: 16px;\n}\n\n.list-item {\n  color:  #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 4px;\n}\n.card-container {\n  margin: 0;\n  padding: 0;\n  box-shadow: none;\n}\n.card-header-entity {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding-bottom: 20px;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.08);\n}\n.card-header-entity .title-wrap h1 {\n  color: #424242;\n  font-size: 28px;\n  font-style: normal;\n  font-weight: 300;\n  line-height: 28px;\n  margin-bottom: 15px;\n}\n.card-header-entity .title-wrap {\n  display: flex;\n  flex-direction: column;\n}\n.card-header-entity .title-wrap p {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n}\n\n\n\n\n \n.view-card .view-icon {\n  color: var(--sideNav);\n}\n.card-wrapper {\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  border-radius: 6px;\n  width: 100% !important;\n}\n.card-wrapper .k-card-body {\n  background: #fff;\n  padding: 12px 20px;\n}\n.card-wrapper .view-card {\n  overflow: auto;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: #fafafa;\n  padding: 4px 15px;\n}\n.view-card .btn-wrapper {\n  display: flex;\n  align-items: center;\n}\n\n.k-card-body .view-card-content h5 {\n  color: #424242;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  margin-bottom: 0;\n  letter-spacing: 0.18px;\n}\n.k-card-body .view-card-content p {\n  color: #666;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  height: 48px;\n  margin-bottom: 0;\n}\n.card-container {\n  padding: 0;\n  margin: 0;\n  box-shadow: none;\n}\n.card-header-entity {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding-bottom: 20px;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.08);\n}\n\n.card-header-entity .title-wrap h1 {\n  color: #424242;\n  font-size: 28px;\n  font-style: normal;\n  font-weight: 300;\n  line-height: 28px;\n  margin-bottom: 15px;\n}\n.card-header-entity .title-wrap {\n  display: flex;\n  flex-direction: column;\n}\n.card-header-entity .title-wrap p {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n}\n.main-area .card-list {\n  display: grid;\n  grid-template-columns: repeat(4, 1fr);\n  gap: 20px;\n}\n"] }]
+        args: [{ selector: 'app-generic-browser-list', template: "\n<div class=\"generic-browser-list-container\">\n  <div class=\"main-fav-wrapper\">\n    <div class=\"title-wrapper\">\n      <div class=\"title-flex-display\">\n        @if(selectedFolderID){\n          <span title=\"Folder\" class=\"title-folder fa-regular fa-folder fa-2xl\"></span>\n        }\n        <h4>{{title}}</h4>\n      </div>\n      <kendo-dropdownbutton class=\"custom-dropdwn\" (itemClick)=\"onDropdownItemClick($event)\" [data]=\"createButtonDropdownData\" themeColor=\"info\">\n        <span class=\"fa-solid fa-plus\"></span>\n        Create New\n      </kendo-dropdownbutton>\n    </div>\n    <div class=\"title-wrapper\">\n      <div class=\"search\">\n        <kendo-textbox \n        type=\"text\" \n        #searchInput \n        placeholder=\"Search\" \n        (keyup)=\"onKeyup(searchInput.value)\"\n        [clearButton]=\"true\"\n        size=\"large\"\n        rounded=\"large\"\n        fillMode=\"solid\"\n        >\n          <ng-template kendoTextBoxPrefixTemplate [showSeparator]=\"true\">\n            <span class=\"fa-solid fa-magnifying-glass margin-left-small\"></span>\n          </ng-template>\n        </kendo-textbox>\n      </div>\n      <div class=\"filter-wrapper\">\n        <!--\n        <kendo-dropdownbutton [data]=\"data\" themeColor=\"primary\">\n          Sort By Recents\n        </kendo-dropdownbutton>\n        -->\n        <button kendobutton (click)=\"changeViewMode('grid')\" class=\"cursor-pointer grid-btn btn-cmn\">\n          <span class=\"fa-solid fa-bars\"></span>\n        </button>\n        <button kendobutton (click)=\"changeViewMode('list')\" class=\"cursor-pointer active btn-cmn\">\n          <span class=\"fa-solid fa-table-cells-large\"></span>\n        </button>\n      </div>\n    </div>\n\n    <div class=\"main-area\">\n      <kendo-loader *ngIf=\"showLoader\" type=\"converging-spinner\"></kendo-loader>\n      @if(!showLoader){\n        @if(displayAsGrid){\n          <kendo-grid (cellClick)=\"onCellItemClicked($event)\" [kendoGridBinding]=\"items\">\n            <kendo-grid-column field=\"Name\" title=\"Name\"></kendo-grid-column>\n            <kendo-grid-column field=\"Size\" title=\"Size\"></kendo-grid-column>\n            <kendo-grid-column field=\"LastOpened\" title=\"Last Opened\"></kendo-grid-column>\n            <kendo-grid-column field=\"ModifiedBy\" title=\"Modified By\"></kendo-grid-column>\n            <kendo-grid-column title=\"\">\n              <ng-template kendoGridCellTemplate let-dataItem>\n                <div class=\"grid-wrapper\">\n                  @if(disableEditButton){\n                    <button class=\"list-btn\" (click)=\"editItem(dataItem)\">\n                      <span class=\"fa-regular fa-pen-to-square\"></span>\n                    </button>\n                  }\n                  <button class=\"list-btn\" (click)=\"deleteItem(dataItem)\">\n                    <span class=\"fa-regular fa-trash-can\"></span>\n                  </button>\n                </div>\n              </ng-template>\n            </kendo-grid-column>\n          </kendo-grid>\n        }\n        @else{\n          <div class=\"card-list k-d-flex k-flex-row k-h-full k-flex-wrap\">\n            @for(item of items; track item){\n              <kendo-card class=\"card-wrapper cursor-pointer\">\n                <div class=\"list-item-icon\">\n                  @if(!disableEditButton){\n                    <button (click)=\"editItem(item)\" class=\"list-btn\">\n                      <span class=\"fa-regular fa-pen-to-square\"></span>\n                    </button>\n                  }\n                  <button (click)=\"deleteItem(item)\" class=\"list-btn\">\n                    <span class=\"fa-regular fa-trash-can\"></span>\n                  </button>\n                </div>\n                <kendo-card-body (click)=\"itemClick(item)\">\n                    <span (title)=\"item.Name\" [ngClass]=\"getIconForResourceType(item)\"></span>\n                    <div class=\"padding-top-small\">\n                      <h5 kendoCardTitle>{{ item.Name }}</h5>\n                      <p kendoCardSubtitle>{{ item.Description }}</p>\n                    </div>\n                </kendo-card-body>\n              </kendo-card>\n            }\n          </div>\n        }\n      }\n    </div>\n  </div>\n\n  <kendo-dialog \n  [minWidth]=\"450\"\n  [width]=\"650\"\n  class=\"dialog-wrapper\" \n  title=\"Confirm\" \n  *ngIf=\"deleteDialogOpened\" \n  (close)=\"onConfirmDeleteItem(false)\">\n    <p class=\"k-m-7.5 k-text-center\">\n      Are you sure you want to delete <b>{{selectedItem?.Name}}?</b>\n    </p>\n    <kendo-dialog-actions class=\"popup-actions-btn\">\n      <button class=\"cancel-btn\" (click)=\"onConfirmDeleteItem(true)\" kendoButton themeColor=\"info\">\n        Yes, Delete\n      </button>\n      <button class=\"yes-btn\" (click)=\"onConfirmDeleteItem(false)\" kendoButton fillMode=\"outline\" themeColor=\"info\">\n        No, Cancel\n      </button>\n    </kendo-dialog-actions>\n  </kendo-dialog>\n  <kendo-dialog \n    title=\"Create new Folder\" \n    *ngIf=\"createFolderDialogOpened\" \n    (close)=\"toggleCreateFolderView()\"\n    [minWidth]=\"250\"\n    [width]=\"450\"\n    class=\"dialog-wrapper\"\n  >\n  <div class=\"search\">\n    <kendo-textbox placeholder=\"Enter a folder name\" (valueChange)=\"onCreateFolderKeyup($event)\"/>\n  </div>\n    <kendo-dialog-actions class=\"popup-actions-btn\">\n      <button class=\"cancel-btn\" (click)=\"createFolder()\" kendoButton themeColor=\"info\">\n        Create\n      </button>\n      <button  class=\"yes-btn\" (click)=\"toggleCreateFolderView()\" kendoButton fillMode=\"outline\" themeColor=\"info\">\n        Cancel\n      </button>\n    </kendo-dialog-actions>\n  </kendo-dialog>\n</div>\n", styles: ["::ng-deep .card-header-entity .title-wrap h1 {\n    margin: 0 !important;\n    font-size: 36px !important;\n    line-height: 42px !important;\n    color: var(--black) !important;\n}\n ::ng-deep .card-header-entity .add-item .k-button {\n    border: 1px solid var(--border-blue) !important;\n    background: var(--white-color) !important;\n    color: var(--border-blue);\n    font-weight: 500 ;\n    font-size: 16px ;\n    border-radius: 10px;\n    line-height: 34px;\n}\n::ng-deep .card-header-entity .add-item .k-button:hover {\n    background: var(--border-blue) !important;\n    color: var(--white-color);\n}\n::ng-deep .card-header-entity .add-item .k-button:hover .k-button-text svg path {\n    fill: var(--white-color) !important;\n}\n .title-wrapper {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 14px 0;\n    border-bottom: 1px solid var(--med-gray);\n}\n .title-wrapper h4 {\n    margin: 0;\n    font-size: 24px;\n    line-height: 28px;\n }\n .main-fav-wrapper {\n    background: #fff;\n    padding: 20px;\n }\n .filter-wrapper {\n    display: flex;\n    justify-content: flex-start;\n    gap: 14px;\n    align-items: center;\n}\n .title-wrapper .search  input {\n    width: 100%;\n    height: 100%;\n    font-size: 16px;\n    background: transparent;\n    border: none;\n    box-sizing: border-box;\n    padding-left: 40px;\n\n }\n    .title-wrapper .search  {\n    background: var(--light-shade);\n    width: 360px;\n    height: 44px;\n    position: relative;\n    border-radius: 10px;\n }\n .title-wrapper .search svg {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    left: 12px;\n}\n::ng-deep .main-fav-wrapper .title-wrapper .k-dropdown-button .k-button {\n    background: var(--border-blue);\n    color: var(--white-color);\n    font-size: 16px;\n    border: none;\n    padding: 8px 25px;\n    border-radius: 10px;\n}\n::ng-deep .main-fav-wrapper .title-wrapper .k-dropdown-button .k-button .k-button-text, ::ng-deep .card-header-entity .add-item .k-button .k-button-text {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n.btn-cmn {\n    width: 44px;\n    height: 44px;\n    min-width: 44px;\n    background: transparent;\n    border-radius: 8px;\n    border: 1px solid var(--gray-color);\n}\n.btn-cmn.active {\n    border: 1px solid var(--border-blue);\n}\n::ng-deep .main-fav-wrapper .title-wrapper .filter-wrapper .k-dropdown-button .k-button {\n    border: 1px solid var(--gray-color);\n    border-radius: 8px;   padding: 10px 25px;\n    background: var(--white-color);\n    color: var(--sideNav);\n}\n::ng-deep .main-area .card-list .card-wrapper .k-card-body {\n    padding: 16px !important;\n    position: relative;\n}\n::ng-deep .main-fav-wrapper .main-area .card-list .card-wrapper .list-item-icon {\n    position: absolute;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    top:12px;\n    right: 12px;\n    z-index: 9;\n}\n.grid-wrapper {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n::ng-deep .main-fav-wrapper .main-area .card-list .card-wrapper .list-item-icon .common-btn, .list-btn {\n    width: 38px;\n    height: 38px;\n    background: #000;\n    min-width: 38px;\n    border: 1px solid var(--gray-color);\n    border-radius: 8px; \n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background: transparent;\n    cursor: pointer;\n}\n::ng-deep .main-fav-wrapper .main-area .card-list .card-wrapper .k-card-body .list-item-icon:hover, .list-btn:hover {\n    border: 1px solid var(--border-active);\n}\n\n\n::ng-deep .main-area .card-list .card-wrapper:hover {\n    box-shadow: 0px 0px 20px 0px rgba(60, 73, 99, 0.2);\n    border: 1px solid var(--border-active);\n}\n::ng-deep .main-area .card-list .card-wrapper:hover .k-card-body .view-card-content-list h5 {\n    color: var(--border-blue);\n}\n::ng-deep .main-area .card-list .card-wrapper .k-card-body .view-card-content-list p {\n    color: var(--sideNav);\n    font-size: 14px;\n    line-height: 16px;\n    height: auto;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n\n}\n::ng-deep .main-area .card-list .card-wrapper .k-card-body .view-card-content-list h5 {\n    font-size: 18px;\n    line-height: 21px;\n    color: var(--text-darked);\n    font-weight: 600;\n}\n.breadcrumb-wrap {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 0;\n}\n.breadcrumb-wrap span {\n    font-size: 16px;\n    line-height: 18px;\n    font-weight: 400;\n    color: var(--black);\n}\n::ng-deep .k-menu-popup {\n    box-shadow: 0px 0px 20px 0px rgba(60, 73, 99, 0.2);\n    border-radius: 10px;\n    padding: 16px;\n}\n\n::ng-deep .k-menu-popup kendo-button-list ul li .k-menu-link {\n    box-shadow: none !important;\n} \n::ng-deep .k-menu-popup kendo-button-list ul li .k-menu-link:active {\n    background: transparent !important;\n}\n::ng-deep .k-menu-popup kendo-button-list ul li .k-menu-link .k-menu-link-text:hover {\n    color: var(--primary-color);\n    background: transparent !important;\n\n}\n::ng-deep .dialog-wrapper .popup-actions-btn button {\n    flex: 1;\n}\n::ng-deep .dialog-wrapper .popup-actions-btn {\n    display: flex;\n}\n::ng-deep .dialog-wrapper .popup-actions-btn .cancel-btn {\n    background: var(--primary-color);\n    color: var(--white-color);\n    font-size: 16px;\n    font-weight: 700;\n    line-height: 34px;\n    text-align: center;\n    border-radius: 10px;\n    border: 1px solid transparent;\n\n}\n::ng-deep .dialog-wrapper .popup-actions-btn .yes-btn {\n    border:1px solid var(--primary-color);\n    background: transparent;\n    color: var(--primary-color);\n    font-size: 16px;\n    font-weight: 700;\n    line-height: 34px;\n    text-align: center;\n    border-radius: 10px;\n    box-shadow: none;\n}\n::ng-deep .dialog-wrapper .popup-actions-btn .yes-btn:focus {\n    box-shadow: none !important;\n}\n::ng-deep .dialog-wrapper .k-window-title {\n    font-size: 30px;\n    font-weight: 500;\n    line-height: 36px;\n    text-align: left;\n    color: var(--text-darked);\n}\n::ng-deep .dialog-wrapper p {\n    font-size: 16px;\n    font-weight: 500;\n    line-height: 20px;\n    text-align: left;\n    color: var(--black);\n}\n\n.margin-left-small {\n    margin-left: 10px;\n}\n\n.card-wrapper {\n    min-width: 230px;\n    height: 150px;\n    min-height: 125px;\n}\n\n.padding-top-small {\n    padding-top: 10px;\n}\n\n.cursor-pointer {\n    cursor: pointer;\n}\n\n.title-folder {\n    padding-right: 20px;\n    margin: auto;\n}\n\n.title-flex-display {\n    display: flex;\n    flex-direction: row;\n}", "\n.main-area {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  gap: 24px;\n  padding: 24px 0;\n}\n.list-view {\n  padding: 16px;\n  min-width: 300px;\n  border-radius: 4px;\n  background:  #FAFAFA;\n  border: none;\n}\n::ng-deep .list-view .k-listview-header, \n::ng-deep .list-view .k-listview-footer {\n  border: none;\n}\n::ng-deep .list-view .k-listview-content {\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  border-radius: 4px;\n  background: #fff;\n  padding: 16px;\n}\n\n.header,\n.footer {\n  color: #424242;\n  font-size: 16px;\n  height: auto;\n  margin:0;\n}\n\n.header {\n  color: #424242;\n  margin-bottom: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n.header .head-tag {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color:  #424242;\nfont-size: 16px;\nfont-style: normal;\nfont-weight: 400;\nline-height: 20px;\n}\n\n.header .count {\n  width: 24px;\n  height: 24px;\n  min-width: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 10px;\n  background: rgba(0, 0, 0, 0.08);\n  border-radius: 50%;\n}\n.footer {\n  font-size: 14px;\n  margin-top: 16px;\n}\n\n.list-item {\n  color:  #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 4px;\n}\n.card-container {\n  margin: 0;\n  padding: 0;\n  box-shadow: none;\n}\n.card-header-entity {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding-bottom: 20px;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.08);\n}\n.card-header-entity .title-wrap h1 {\n  color: #424242;\n  font-size: 28px;\n  font-style: normal;\n  font-weight: 300;\n  line-height: 28px;\n  margin-bottom: 15px;\n}\n.card-header-entity .title-wrap {\n  display: flex;\n  flex-direction: column;\n}\n.card-header-entity .title-wrap p {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n}\n\n\n\n\n \n.view-card .view-icon {\n  color: var(--sideNav);\n}\n.card-wrapper {\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  border-radius: 6px;\n  width: 100% !important;\n}\n.card-wrapper .k-card-body {\n  background: #fff;\n  padding: 12px 20px;\n}\n.card-wrapper .view-card {\n  overflow: auto;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: #fafafa;\n  padding: 4px 15px;\n}\n.view-card .btn-wrapper {\n  display: flex;\n  align-items: center;\n}\n\n.k-card-body .view-card-content h5 {\n  color: #424242;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  margin-bottom: 0;\n  letter-spacing: 0.18px;\n}\n.k-card-body .view-card-content p {\n  color: #666;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  height: 48px;\n  margin-bottom: 0;\n}\n.card-container {\n  padding: 0;\n  margin: 0;\n  box-shadow: none;\n}\n.card-header-entity {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding-bottom: 20px;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.08);\n}\n\n.card-header-entity .title-wrap h1 {\n  color: #424242;\n  font-size: 28px;\n  font-style: normal;\n  font-weight: 300;\n  line-height: 28px;\n  margin-bottom: 15px;\n}\n.card-header-entity .title-wrap {\n  display: flex;\n  flex-direction: column;\n}\n.card-header-entity .title-wrap p {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: #424242;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n}\n.main-area .card-list {\n  display: grid;\n  grid-template-columns: repeat(4, 1fr);\n  gap: 20px;\n}\n"] }]
     }], () => [{ type: i1.SharedService }], { showLoader: [{
             type: Input
         }], itemType: [{

package/dist/lib/navigation/navigation.component.js

@@ -1090,7 +1090,7 @@ NavigationComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Navigat
         i0.ɵɵproperty("ngIf", !ctx.loading);
         i0.ɵɵadvance(2);
         i0.ɵɵproperty("ngIf", ctx.contextMenuVisible);
-    } }, dependencies: [i3.NgClass, i3.NgIf, i3.NgStyle, i1.RouterOutlet, i5.LoaderComponent, i6.FillContainer, i7.DrawerComponent, i7.DrawerContainerComponent, i7.DrawerContentComponent, i7.DrawerItemTemplateDirective, i8.SkipButtonComponent, i9.MJTabStripComponent, i9.MJTabBodyComponent, i9.MJTabComponent, i10.ResourceContainerComponent], styles: [".navigation-wrap[_ngcontent-%COMP%] {\n  height: calc(100vh - 80px);\n  width: 100%;\n  overflow:hidden\n}\n\n.nav-tab-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n}\n\n.drawer-item-icon[_ngcontent-%COMP%] {\n  width: 12px;\n  height: 12px;\n}\n\n.context-menu[_ngcontent-%COMP%] {\n  position: fixed;\n  z-index: 9999;\n  background-color: #ffffff;\n  border: 1px solid #ccc;\n  padding: 3px 3px;\n  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);\n}\n\n.context-menu-item[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  cursor: pointer;\n}\n\n.context-menu-item[_ngcontent-%COMP%]:hover {\n  background-color: #f1f1f1;\n}\n  .navigation-wrap .drawer-container {\n  background: var(--gray-color);\n}\n  .navigation-wrap .drawer-container .k-content {\n  padding: 25px;\n}\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper {\n  background: var(--med-gray);\n  padding-left: 20px;\n}\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item.k-active{\n  border: 1px solid var(--light-gray);\n  background: var(--light-gray);\n  border-radius: 8px 8px 0 0;\n  color: var(--blue-text);\n\n}\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item:hover {\n  color: var(--blue-text);\n}\n\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item {\n\n  background: var(--med-gray);\n  border-radius: 0;\n  border-right: 1px solid #909090;\n}\n\n.tab-resource[_ngcontent-%COMP%] {\n  display: block;\n}"] });
+    } }, dependencies: [i1.RouterOutlet, i3.NgClass, i3.NgIf, i3.NgStyle, i5.LoaderComponent, i6.FillContainer, i7.DrawerComponent, i7.DrawerContainerComponent, i7.DrawerContentComponent, i7.DrawerItemTemplateDirective, i8.SkipButtonComponent, i9.MJTabStripComponent, i9.MJTabBodyComponent, i9.MJTabComponent, i10.ResourceContainerComponent], styles: [".navigation-wrap[_ngcontent-%COMP%] {\n  height: calc(100vh - 80px);\n  width: 100%;\n  overflow:hidden\n}\n\n.nav-tab-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n}\n\n.drawer-item-icon[_ngcontent-%COMP%] {\n  width: 12px;\n  height: 12px;\n}\n\n.context-menu[_ngcontent-%COMP%] {\n  position: fixed;\n  z-index: 9999;\n  background-color: #ffffff;\n  border: 1px solid #ccc;\n  padding: 3px 3px;\n  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);\n}\n\n.context-menu-item[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  cursor: pointer;\n}\n\n.context-menu-item[_ngcontent-%COMP%]:hover {\n  background-color: #f1f1f1;\n}\n  .navigation-wrap .drawer-container {\n  background: var(--gray-color);\n}\n  .navigation-wrap .drawer-container .k-content {\n  padding: 25px;\n}\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper {\n  background: var(--med-gray);\n  padding-left: 20px;\n}\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item.k-active{\n  border: 1px solid var(--light-gray);\n  background: var(--light-gray);\n  border-radius: 8px 8px 0 0;\n  color: var(--blue-text);\n\n}\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item:hover {\n  color: var(--blue-text);\n}\n\n  .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item {\n\n  background: var(--med-gray);\n  border-radius: 0;\n  border-right: 1px solid #909090;\n}\n\n.tab-resource[_ngcontent-%COMP%] {\n  display: block;\n}"] });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NavigationComponent, [{
         type: Component,
         args: [{ selector: 'app-navigation', template: "<div class=\"navigation-wrap\" [ngClass]=\"{'waiting': loader}\"  #drawerWrapper>\n  <kendo-loader *ngIf=\"loading\" type=\"converging-spinner\" ></kendo-loader>\n  <kendo-drawer-container *ngIf=\"!loading\" >\n    <kendo-drawer\n      #drawer\n      [items]=\"drawerItems\"\n      [mode]=\"mode\"\n      [mini]=\"mini\"\n      [animation]=\"false\"\n      (select)=\"onDrawerSelect($event)\"\n      [autoCollapse]=\"false\"\n    >\n      <ng-template kendoDrawerItemTemplate let-item>\n        <div class=\"drawer-item-icon\">\n          <span [class]=\"item.icon\"></span>\n        </div>\n        <div class=\"item-descr-wrap\" *ngIf=\"!mini\">\n          <div>{{ item.text }}</div>\n          <span class=\"item-descr\">{{ item.description }}</span>\n        </div>\n      </ng-template>    \n    </kendo-drawer>\n    <kendo-drawer-content mjFillContainer>\n\n      <mj-tabstrip #mjTabstrip mjFillContainer (TabClosed)=\"handleTabClosed($event)\" (TabSelected)=\"handleTabSelected($event)\" (TabContextMenu)=\"handleTabContextMenu($event)\">\n        <mj-tab [TabCloseable]=\"false\">\n          Home\n        </mj-tab>\n        <mj-tab-body>\n          <router-outlet></router-outlet>\n        </mj-tab-body>\n\n        @for(tab of tabs; track tab.id; let i = $index) {\n          <mj-tab [TabCloseable]=\"true\">\n            @if(tab?.contentLoading) {\n              <span class=\"fa-regular fa-clock\"></span>\n            }\n            @else if (tab?.icon) {\n              <span [class]=\"tab.icon\"></span>\n            }\n            {{ tab.labelLoading ? 'Loading...' : tab.label }}\n          </mj-tab>\n        }\n        @for(tab of tabs; track tab.id; let i = $index) {\n          <mj-tab-body>\n            <mj-resource [Data]=\"tab.data\" [isVisible]=\"activeTabIndex - 1 === i\"\n              (ResourceRecordSaved)=\"SaveSingleWorkspaceItem(tab)\"\n              (ContentLoadingStarted)=\"setTabContentLoadingStatus(tab, true)\"\n              (ContentLoadingComplete)=\"setTabContentLoadingStatus(tab, false)\"\n              mjFillContainer\n              class=\"tab-resource\"\n            ></mj-resource>\n          </mj-tab-body>  \n        }\n      </mj-tabstrip>\n    </kendo-drawer-content>\n  </kendo-drawer-container>\n\n  \n  <mj-skip-button\n    action=\"route\"\n  ></mj-skip-button>\n  <!-- Skip Button shows up through the above line of code -->\n</div>\n\n<div class=\"context-menu\" [ngStyle]=\"contextMenuStyle\" *ngIf=\"contextMenuVisible\">\n  <div class=\"context-menu-item\" (click)=\"handleContextMenuOption(1)\">Close All</div>\n  <div class=\"context-menu-item\" (click)=\"handleContextMenuOption(2)\">Close Others</div>\n  <div class=\"context-menu-item\" (click)=\"handleContextMenuOption(3)\">Close Tabs to the Right</div>\n </div>\n", styles: [".navigation-wrap {\n  height: calc(100vh - 80px);\n  width: 100%;\n  overflow:hidden\n}\n\n.nav-tab-title {\n  margin-left: 10px;\n}\n\n.drawer-item-icon {\n  width: 12px;\n  height: 12px;\n}\n\n.context-menu {\n  position: fixed;\n  z-index: 9999;\n  background-color: #ffffff;\n  border: 1px solid #ccc;\n  padding: 3px 3px;\n  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);\n}\n\n.context-menu-item {\n  padding: 8px 16px;\n  cursor: pointer;\n}\n\n.context-menu-item:hover {\n  background-color: #f1f1f1;\n}\n::ng-deep .navigation-wrap .drawer-container {\n  background: var(--gray-color);\n}\n::ng-deep .navigation-wrap .drawer-container .k-content {\n  padding: 25px;\n}\n::ng-deep .navigation-wrap .drawer-container .k-tabstrip-items-wrapper {\n  background: var(--med-gray);\n  padding-left: 20px;\n}\n::ng-deep .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item.k-active{\n  border: 1px solid var(--light-gray);\n  background: var(--light-gray);\n  border-radius: 8px 8px 0 0;\n  color: var(--blue-text);\n\n}\n::ng-deep .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item:hover {\n  color: var(--blue-text);\n}\n\n::ng-deep .navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item {\n\n  background: var(--med-gray);\n  border-radius: 0;\n  border-right: 1px solid #909090;\n}\n\n.tab-resource {\n  display: block;\n}"] }]

package/dist/lib/resource-wrappers/query-resource.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"query-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/query-resource.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,MAAM,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;;AAIhF,wBAAgB,iBAAiB,SAEhC;AAED,qBAKa,aAAc,SAAQ,qBAAsB,YAAW,MAAM;IACtE,QAAQ,IAAI,IAAI;IAGV,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCAJxD,aAAa;2CAAb,aAAa;CASzB"}
+{"version":3,"file":"query-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/query-resource.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,MAAM,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;;AAIhF,wBAAgB,iBAAiB,SAEhC;AAED,qBAKa,aAAc,SAAQ,qBAAsB,YAAW,MAAM;IACtE,QAAQ,IAAI,IAAI;IAGV,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCAJxD,aAAa;2CAAb,aAAa;CAUzB"}

package/dist/lib/resource-wrappers/query-resource.component.js

@@ -16,7 +16,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { Component } from '@angular/core';
 import { BaseResourceComponent } from '@memberjunction/ng-shared';
 import { RegisterClass } from '@memberjunction/global';
-import { Metadata } from '@memberjunction/core';
+import { CompositeKey, Metadata } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 import * as i1 from "../single-query/single-query.component";
 export function LoadQueryResource() {
@@ -28,7 +28,8 @@ let QueryResource = class QueryResource extends BaseResourceComponent {
     GetResourceDisplayName(data) {
         return __awaiter(this, void 0, void 0, function* () {
             const md = new Metadata();
-            const name = yield md.GetEntityRecordName('Queries', [{ FieldName: "ID", Value: data.ResourceRecordID }]);
+            let compositeKey = new CompositeKey([{ FieldName: "ID", Value: data.ResourceRecordID }]);
+            const name = yield md.GetEntityRecordName('Queries', compositeKey);
             return `${name ? name : 'Query ID: ' + data.ResourceRecordID}`;
         });
     }

package/dist/lib/resource-wrappers/record-resource.component.d.ts

@@ -1,10 +1,10 @@
 import { BaseResourceComponent, ResourceData } from '@memberjunction/ng-shared';
-import { PrimaryKeyValue } from '@memberjunction/core';
+import { CompositeKey } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 export declare function LoadRecordResource(): void;
 export declare class EntityRecordResource extends BaseResourceComponent {
-    get primaryKeyValues(): PrimaryKeyValue[];
-    static GetPrimaryKeyValues(data: ResourceData): PrimaryKeyValue[];
+    get CompositeKey(): CompositeKey;
+    static GetCompositeKey(data: ResourceData): CompositeKey;
     GetResourceDisplayName(data: ResourceData): Promise<string>;
     static ɵfac: i0.ɵɵFactoryDeclaration<EntityRecordResource, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<EntityRecordResource, "mj-record-resource", never, {}, {}, never, never, false, never>;

package/dist/lib/resource-wrappers/record-resource.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"record-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/record-resource.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEhF,OAAO,EAAY,eAAe,EAAE,MAAM,sBAAsB,CAAC;;AAGjE,wBAAgB,kBAAkB,SAEjC;AAED,qBAKa,oBAAqB,SAAQ,qBAAqB;IAC3D,IAAW,gBAAgB,IAAI,eAAe,EAAE,CAE/C;WACa,mBAAmB,CAAC,IAAI,EAAE,YAAY,GAAG,eAAe,EAAE;IASlE,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCAbxD,oBAAoB;2CAApB,oBAAoB;CAwBhC"}
+{"version":3,"file":"record-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/record-resource.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEhF,OAAO,EAAY,YAAY,EAAE,MAAM,sBAAsB,CAAC;;AAE9D,wBAAgB,kBAAkB,SAEjC;AAED,qBAKa,oBAAqB,SAAQ,qBAAqB;IAC3D,IAAW,YAAY,IAAI,YAAY,CAEtC;WAEa,eAAe,CAAC,IAAI,EAAE,YAAY,GAAG,YAAY;IAYzD,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCAjBxD,oBAAoB;2CAApB,oBAAoB;CA6BhC"}

package/dist/lib/resource-wrappers/record-resource.component.js

@@ -17,8 +17,7 @@ var EntityRecordResource_1;
 import { Component } from '@angular/core';
 import { BaseResourceComponent } from '@memberjunction/ng-shared';
 import { RegisterClass } from '@memberjunction/global';
-import { Metadata } from '@memberjunction/core';
-import { SharedService } from '@memberjunction/ng-shared';
+import { Metadata, CompositeKey } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@memberjunction/ng-container-directives";
 import * as i2 from "../single-record/single-record.component";
@@ -26,38 +25,41 @@ export function LoadRecordResource() {
     const test = new EntityRecordResource(); // this looks really dumb. Thing is, in production builds, tree shaking causes the class below to not be included in the bundle. This is a hack to force it to be included.
 }
 let EntityRecordResource = EntityRecordResource_1 = class EntityRecordResource extends BaseResourceComponent {
-    get primaryKeyValues() {
-        return EntityRecordResource_1.GetPrimaryKeyValues(this.Data);
+    get CompositeKey() {
+        return EntityRecordResource_1.GetCompositeKey(this.Data);
     }
-    static GetPrimaryKeyValues(data) {
+    static GetCompositeKey(data) {
         const md = new Metadata();
         const e = md.Entities.find(e => e.Name.trim().toLowerCase() === data.Configuration.Entity.trim().toLowerCase());
-        if (!e)
+        if (!e) {
             throw new Error(`Entity ${data.Configuration.Entity} not found in metadata`);
-        const pKeys = SharedService.ParsePrimaryKeys(e, data.ResourceRecordID);
-        return pKeys;
+        }
+        let compositeKey = new CompositeKey();
+        compositeKey.LoadFromURLSegment(e, data.ResourceRecordID);
+        return compositeKey;
     }
     GetResourceDisplayName(data) {
         return __awaiter(this, void 0, void 0, function* () {
-            if (!data.Configuration.Entity)
+            if (!data.Configuration.Entity) {
                 return '';
+            }
             else {
                 const md = new Metadata();
-                const pKeys = EntityRecordResource_1.GetPrimaryKeyValues(data);
-                const name = yield md.GetEntityRecordName(data.Configuration.Entity, pKeys);
-                const displayId = pKeys.length > 1 ? pKeys.map(p => p.Value).join(', ') : pKeys[0].Value;
+                let compositeKey = EntityRecordResource_1.GetCompositeKey(data);
+                const name = yield md.GetEntityRecordName(data.Configuration.Entity, compositeKey);
+                const displayId = compositeKey.KeyValuePairs.length > 1 ? compositeKey.Values() : compositeKey.GetValueByIndex(0);
                 return (name ? name : data.Configuration.Entity) + ` (${displayId})`;
             }
         });
     }
 };
 EntityRecordResource.ɵfac = /*@__PURE__*/ (() => { let ɵEntityRecordResource_BaseFactory; return function EntityRecordResource_Factory(t) { return (ɵEntityRecordResource_BaseFactory || (ɵEntityRecordResource_BaseFactory = i0.ɵɵgetInheritedFactory(EntityRecordResource)))(t || EntityRecordResource); }; })();
-EntityRecordResource.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: EntityRecordResource, selectors: [["mj-record-resource"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 2, consts: [["mjFillContainer", "", 3, "primaryKeyValues", "entityName", "loadComplete"]], template: function EntityRecordResource_Template(rf, ctx) { if (rf & 1) {
+EntityRecordResource.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: EntityRecordResource, selectors: [["mj-record-resource"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 2, consts: [["mjFillContainer", "", 3, "CompositeKey", "entityName", "loadComplete"]], template: function EntityRecordResource_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "mj-single-record", 0);
         i0.ɵɵlistener("loadComplete", function EntityRecordResource_Template_mj_single_record_loadComplete_0_listener() { return ctx.NotifyLoadComplete(); });
         i0.ɵɵelementEnd();
     } if (rf & 2) {
-        i0.ɵɵproperty("primaryKeyValues", ctx.primaryKeyValues)("entityName", ctx.Data.Configuration.Entity);
+        i0.ɵɵproperty("CompositeKey", ctx.CompositeKey)("entityName", ctx.Data.Configuration.Entity);
     } }, dependencies: [i1.FillContainer, i2.SingleRecordComponent], encapsulation: 2 });
 EntityRecordResource = EntityRecordResource_1 = __decorate([
     RegisterClass(BaseResourceComponent, 'Records')
@@ -67,7 +69,7 @@ export { EntityRecordResource };
         type: Component,
         args: [{
                 selector: 'mj-record-resource',
-                template: `<mj-single-record [primaryKeyValues]="this.primaryKeyValues" [entityName]="Data.Configuration.Entity" (loadComplete)="NotifyLoadComplete()" mjFillContainer></mj-single-record>`
+                template: `<mj-single-record [CompositeKey]="this.CompositeKey" [entityName]="Data.Configuration.Entity" (loadComplete)="NotifyLoadComplete()" mjFillContainer></mj-single-record>`
             }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(EntityRecordResource, { className: "EntityRecordResource", filePath: "src/lib/resource-wrappers/record-resource.component.ts", lineNumber: 16 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(EntityRecordResource, { className: "EntityRecordResource", filePath: "src/lib/resource-wrappers/record-resource.component.ts", lineNumber: 15 }); })();

package/dist/lib/resource-wrappers/report-resource.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"report-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/report-resource.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,MAAM,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;;AAIhF,wBAAgB,kBAAkB,SAEjC;AAED,qBAKa,cAAe,SAAQ,qBAAsB,YAAW,MAAM;IACvE,QAAQ,IAAI,IAAI;IAGV,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCAJxD,cAAc;2CAAd,cAAc;CAS1B"}
+{"version":3,"file":"report-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/report-resource.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,MAAM,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;;AAIhF,wBAAgB,kBAAkB,SAEjC;AAED,qBAKa,cAAe,SAAQ,qBAAsB,YAAW,MAAM;IACvE,QAAQ,IAAI,IAAI;IAGV,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCAJxD,cAAc;2CAAd,cAAc;CAU1B"}

package/dist/lib/resource-wrappers/report-resource.component.js

@@ -16,7 +16,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { Component } from '@angular/core';
 import { BaseResourceComponent } from '@memberjunction/ng-shared';
 import { RegisterClass } from '@memberjunction/global';
-import { Metadata } from '@memberjunction/core';
+import { CompositeKey, Metadata } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 import * as i1 from "../single-report/single-report.component";
 export function LoadReportResource() {
@@ -28,7 +28,8 @@ let ReportResource = class ReportResource extends BaseResourceComponent {
     GetResourceDisplayName(data) {
         return __awaiter(this, void 0, void 0, function* () {
             const md = new Metadata();
-            const name = yield md.GetEntityRecordName('Reports', [{ FieldName: "ID", Value: data.ResourceRecordID }]);
+            let compositeKey = new CompositeKey([{ FieldName: "ID", Value: data.ResourceRecordID }]);
+            const name = yield md.GetEntityRecordName('Reports', compositeKey);
             return `${name ? name : 'Report ID: ' + data.ResourceRecordID}`;
         });
     }

package/dist/lib/resource-wrappers/view-resource.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"view-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/view-resource.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;;AAIhF,wBAAgB,gBAAgB,SAE/B;AAED,qBAUa,gBAAiB,SAAQ,qBAAqB;IACjD,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCADxD,gBAAgB;2CAAhB,gBAAgB;CAa5B"}
+{"version":3,"file":"view-resource.component.d.ts","sourceRoot":"","sources":["../../../src/lib/resource-wrappers/view-resource.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;;AAIhF,wBAAgB,gBAAgB,SAE/B;AAED,qBAUa,gBAAiB,SAAQ,qBAAqB;IACjD,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC;yCADxD,gBAAgB;2CAAhB,gBAAgB;CAc5B"}

package/dist/lib/resource-wrappers/view-resource.component.js

@@ -16,7 +16,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { Component } from '@angular/core';
 import { BaseResourceComponent } from '@memberjunction/ng-shared';
 import { RegisterClass } from '@memberjunction/global';
-import { Metadata } from '@memberjunction/core';
+import { CompositeKey, Metadata } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 import * as i1 from "../single-view/single-view.component";
 export function LoadViewResource() {
@@ -28,7 +28,8 @@ let UserViewResource = class UserViewResource extends BaseResourceComponent {
         return __awaiter(this, void 0, void 0, function* () {
             const md = new Metadata();
             if (data.ResourceRecordID > 0) {
-                const name = yield md.GetEntityRecordName('User Views', [{ FieldName: "ID", Value: data.ResourceRecordID }]);
+                let compositeKey = new CompositeKey([{ FieldName: "ID", Value: data.ResourceRecordID }]);
+                const name = yield md.GetEntityRecordName('User Views', compositeKey);
                 return name ? name : 'View: ' + data.ResourceRecordID;
             }
             else if (((_a = data.Configuration) === null || _a === void 0 ? void 0 : _a.Entity) && ((_b = data.Configuration) === null || _b === void 0 ? void 0 : _b.Entity.length) > 0) {

package/dist/lib/single-record/single-record.component.d.ts

@@ -1,12 +1,12 @@
 import { AfterViewInit, EventEmitter, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { PrimaryKeyValue } from '@memberjunction/core';
+import { CompositeKey } from '@memberjunction/core';
 import { Container } from '@memberjunction/ng-container-directives';
 import * as i0 from "@angular/core";
 export declare class SingleRecordComponent implements OnInit, AfterViewInit {
     private route;
     formContainer: Container;
-    primaryKeyValues: PrimaryKeyValue[];
+    CompositeKey: CompositeKey;
     entityName: string | null;
     loadComplete: EventEmitter<any>;
     constructor(route: ActivatedRoute);
@@ -15,8 +15,8 @@ export declare class SingleRecordComponent implements OnInit, AfterViewInit {
     loading: boolean;
     ngOnInit(): void;
     ngAfterViewInit(): void;
-    LoadForm(primaryKeyValues: PrimaryKeyValue[], entityName: string): Promise<void>;
+    LoadForm(compositeKey: CompositeKey, entityName: string): Promise<void>;
     static ɵfac: i0.ɵɵFactoryDeclaration<SingleRecordComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SingleRecordComponent, "mj-single-record", never, { "primaryKeyValues": { "alias": "primaryKeyValues"; "required": false; }; "entityName": { "alias": "entityName"; "required": false; }; }, { "loadComplete": "loadComplete"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SingleRecordComponent, "mj-single-record", never, { "CompositeKey": { "alias": "CompositeKey"; "required": false; }; "entityName": { "alias": "entityName"; "required": false; }; }, { "loadComplete": "loadComplete"; }, never, never, false, never>;
 }
 //# sourceMappingURL=single-record.component.d.ts.map

package/dist/lib/single-record/single-record.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"single-record.component.d.ts","sourceRoot":"","sources":["../../../src/lib/single-record/single-record.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAa,YAAY,EAAS,MAAM,EAAqB,MAAM,eAAe,CAAC;AACzG,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAAuC,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5F,OAAO,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;;AAIpE,qBAKa,qBAAsB,YAAW,MAAM,EAAE,aAAa;IAOpD,OAAO,CAAC,KAAK;IANY,aAAa,EAAG,SAAS,CAAC;IAChD,gBAAgB,EAAE,eAAe,EAAE,CAAM;IACzC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAM;IAE9B,YAAY,EAAE,YAAY,CAAC,GAAG,CAAC,CAA2B;gBAEtD,KAAK,EAAE,cAAc;IAInC,cAAc,EAAE,MAAM,CAAK;IAC3B,cAAc,EAAE,OAAO,CAAS;IAChC,OAAO,EAAE,OAAO,CAAQ;IAE/B,QAAQ,IAAI,IAAI;IAGhB,eAAe;IAIT,QAAQ,CAAC,gBAAgB,EAAE,eAAe,EAAE,EAAE,UAAU,EAAE,MAAM;yCAtB3D,qBAAqB;2CAArB,qBAAqB;CAyDjC"}
+{"version":3,"file":"single-record.component.d.ts","sourceRoot":"","sources":["../../../src/lib/single-record/single-record.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAa,YAAY,EAAS,MAAM,EAAqB,MAAM,eAAe,CAAC;AACzG,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAA0B,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAE5E,OAAO,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;;AAIpE,qBAKa,qBAAsB,YAAW,MAAM,EAAE,aAAa;IAOpD,OAAO,CAAC,KAAK;IANY,aAAa,EAAG,SAAS,CAAC;IAChD,YAAY,EAAE,YAAY,CAAsB;IAChD,UAAU,EAAE,MAAM,GAAG,IAAI,CAAM;IAE9B,YAAY,EAAE,YAAY,CAAC,GAAG,CAAC,CAA2B;gBAEtD,KAAK,EAAE,cAAc;IAInC,cAAc,EAAE,MAAM,CAAK;IAC3B,cAAc,EAAE,OAAO,CAAS;IAChC,OAAO,EAAE,OAAO,CAAQ;IAE/B,QAAQ,IAAI,IAAI;IAGhB,eAAe;IAIT,QAAQ,CAAC,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM;yCAtBlD,qBAAqB;2CAArB,qBAAqB;CAyDjC"}

package/dist/lib/single-record/single-record.component.js

@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
-import { Metadata } from '@memberjunction/core';
+import { Metadata, CompositeKey } from '@memberjunction/core';
 import { MJGlobal } from '@memberjunction/global';
 import { Container } from '@memberjunction/ng-container-directives';
 import { BaseFormComponent } from '@memberjunction/ng-base-forms';
@@ -24,7 +24,7 @@ function SingleRecordComponent_ng_template_1_Template(rf, ctx) { }
 export class SingleRecordComponent {
     constructor(route) {
         this.route = route;
-        this.primaryKeyValues = [];
+        this.CompositeKey = new CompositeKey();
         this.entityName = '';
         this.loadComplete = new EventEmitter();
         this.appDescription = '';
@@ -34,14 +34,14 @@ export class SingleRecordComponent {
     ngOnInit() {
     }
     ngAfterViewInit() {
-        this.LoadForm(this.primaryKeyValues, this.entityName);
+        this.LoadForm(this.CompositeKey, this.entityName);
     }
-    LoadForm(primaryKeyValues, entityName) {
+    LoadForm(compositeKey, entityName) {
         return __awaiter(this, void 0, void 0, function* () {
             // Perform any necessary actions with the ViewID, such as fetching data
-            if (primaryKeyValues && entityName) {
+            if (compositeKey.KeyValuePairs && entityName) {
                 this.entityName = entityName;
-                this.primaryKeyValues = primaryKeyValues;
+                this.CompositeKey = compositeKey;
                 const formReg = MJGlobal.Instance.ClassFactory.GetRegistration(BaseFormComponent, entityName);
                 const md = new Metadata();
                 const entity = md.Entities.find(e => {
@@ -51,7 +51,7 @@ export class SingleRecordComponent {
                 if (formReg) {
                     const record = yield md.GetEntityObject(entityName);
                     if (record) {
-                        yield record.InnerLoad(primaryKeyValues);
+                        yield record.InnerLoad(compositeKey);
                         const viewContainerRef = this.formContainer.viewContainerRef;
                         viewContainerRef.clear();
                         const componentRef = viewContainerRef.createComponent(formReg.SubClass);
@@ -61,7 +61,7 @@ export class SingleRecordComponent {
                         this.loadComplete.emit();
                     }
                     else
-                        throw new Error(`Unable to load entity ${entityName} with primary key values: ${primaryKeyValues.map(p => p.FieldName + ': ' + p.Value).join(', ')}`);
+                        throw new Error(`Unable to load entity ${entityName} with primary key values: ${compositeKey.ToString()}`);
                 }
                 this.loading = false;
             }
@@ -74,7 +74,7 @@ SingleRecordComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Singl
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.formContainer = _t.first);
-    } }, inputs: { primaryKeyValues: "primaryKeyValues", entityName: "entityName" }, outputs: { loadComplete: "loadComplete" }, decls: 2, vars: 1, consts: [["type", "converging-spinner", 4, "ngIf"], ["mjContainer", ""], ["type", "converging-spinner"]], template: function SingleRecordComponent_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { CompositeKey: "CompositeKey", entityName: "entityName" }, outputs: { loadComplete: "loadComplete" }, decls: 2, vars: 1, consts: [["type", "converging-spinner", 4, "ngIf"], ["mjContainer", ""], ["type", "converging-spinner"]], template: function SingleRecordComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵtemplate(0, SingleRecordComponent_kendo_loader_0_Template, 1, 0, "kendo-loader", 0)(1, SingleRecordComponent_ng_template_1_Template, 0, 0, "ng-template", 1);
     } if (rf & 2) {
         i0.ɵɵproperty("ngIf", ctx.loading);
@@ -85,7 +85,7 @@ SingleRecordComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Singl
     }], () => [{ type: i1.ActivatedRoute }], { formContainer: [{
             type: ViewChild,
             args: [Container, { static: true }]
-        }], primaryKeyValues: [{
+        }], CompositeKey: [{
             type: Input
         }], entityName: [{
             type: Input

package/dist/lib/single-view/single-view.component.js

@@ -13,7 +13,6 @@ import { Metadata, LogError } from '@memberjunction/core';
 import { distinctUntilChanged, Subject } from "rxjs";
 import { debounceTime } from "rxjs/operators";
 import { ViewInfo } from '@memberjunction/core-entities';
-import { SharedService } from '@memberjunction/ng-shared';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/router";
 import * as i2 from "@memberjunction/ng-shared";
@@ -103,7 +102,7 @@ export class SingleViewComponent {
     handleRowClick(args) {
         return __awaiter(this, void 0, void 0, function* () {
             // tell the router to navigate instead of raising an event directly. router will in turn handle raising the event as required
-            this.router.navigate(['resource', 'record', SharedService.GeneratePrimaryKeyValueString(args.primaryKeyValues)], { queryParams: { Entity: args.entityName } });
+            this.router.navigate(['resource', 'record', args.CompositeKey.ToURLSegment()], { queryParams: { Entity: args.entityName } });
         });
     }
     LoadView(viewInfo) {

package/dist/module.d.ts

@@ -36,39 +36,40 @@ import * as i34 from "./lib/user-notifications/user-notifications.component";
 import * as i35 from "./lib/resource-wrappers/query-resource.component";
 import * as i36 from "./lib/expansion-panel-component/expansion-panel-component";
 import * as i37 from "./lib/app-view/application-view.component";
-import * as i38 from "@angular/common";
-import * as i39 from "@angular/forms";
-import * as i40 from "@angular/router";
-import * as i41 from "@progress/kendo-angular-grid";
-import * as i42 from "@progress/kendo-angular-dialog";
-import * as i43 from "@progress/kendo-angular-excel-export";
-import * as i44 from "@memberjunction/ng-compare-records";
-import * as i45 from "@progress/kendo-angular-indicators";
-import * as i46 from "@progress/kendo-angular-charts";
-import * as i47 from "@progress/kendo-angular-buttons";
-import * as i48 from "@progress/kendo-angular-layout";
-import * as i49 from "@progress/kendo-angular-inputs";
-import * as i50 from "@progress/kendo-angular-label";
-import * as i51 from "@memberjunction/ng-record-changes";
-import * as i52 from "@memberjunction/ng-container-directives";
-import * as i53 from "@memberjunction/ng-base-forms";
-import * as i54 from "@progress/kendo-angular-listview";
-import * as i55 from "@progress/kendo-angular-treeview";
-import * as i56 from "@memberjunction/ng-user-view-grid";
-import * as i57 from "@memberjunction/ng-query-grid";
-import * as i58 from "@progress/kendo-angular-sortable";
-import * as i59 from "@progress/kendo-angular-filter";
-import * as i60 from "@progress/kendo-angular-dropdowns";
-import * as i61 from "@memberjunction/ng-shared";
-import * as i62 from "@memberjunction/ng-ask-skip";
-import * as i63 from "@memberjunction/ng-entity-permissions";
-import * as i64 from "@memberjunction/ng-explorer-settings";
-import * as i65 from "@memberjunction/ng-file-storage";
-import * as i66 from "@memberjunction/ng-user-view-properties";
-import * as i67 from "@memberjunction/ng-tabstrip";
+import * as i38 from "./app-routing.module";
+import * as i39 from "@angular/common";
+import * as i40 from "@angular/forms";
+import * as i41 from "@angular/router";
+import * as i42 from "@progress/kendo-angular-grid";
+import * as i43 from "@progress/kendo-angular-dialog";
+import * as i44 from "@progress/kendo-angular-excel-export";
+import * as i45 from "@memberjunction/ng-compare-records";
+import * as i46 from "@progress/kendo-angular-indicators";
+import * as i47 from "@progress/kendo-angular-charts";
+import * as i48 from "@progress/kendo-angular-buttons";
+import * as i49 from "@progress/kendo-angular-layout";
+import * as i50 from "@progress/kendo-angular-inputs";
+import * as i51 from "@progress/kendo-angular-label";
+import * as i52 from "@memberjunction/ng-record-changes";
+import * as i53 from "@memberjunction/ng-container-directives";
+import * as i54 from "@memberjunction/ng-base-forms";
+import * as i55 from "@progress/kendo-angular-listview";
+import * as i56 from "@progress/kendo-angular-treeview";
+import * as i57 from "@memberjunction/ng-user-view-grid";
+import * as i58 from "@memberjunction/ng-query-grid";
+import * as i59 from "@progress/kendo-angular-sortable";
+import * as i60 from "@progress/kendo-angular-filter";
+import * as i61 from "@progress/kendo-angular-dropdowns";
+import * as i62 from "@memberjunction/ng-shared";
+import * as i63 from "@memberjunction/ng-ask-skip";
+import * as i64 from "@memberjunction/ng-entity-permissions";
+import * as i65 from "@memberjunction/ng-explorer-settings";
+import * as i66 from "@memberjunction/ng-file-storage";
+import * as i67 from "@memberjunction/ng-user-view-properties";
+import * as i68 from "@memberjunction/ng-tabstrip";
 export declare class ExplorerCoreModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ExplorerCoreModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ExplorerCoreModule, [typeof i1.FormToolbarComponent, typeof i2.SectionLoaderComponent, typeof i3.ResourceContainerComponent, typeof i4.AuthButtonComponent, typeof i5.DashboardBrowserComponent, typeof i6.DataBrowserComponent, typeof i7.GenericBrowseListComponent, typeof i8.GenericBrowserListComponent, typeof i9.HomeComponent, typeof i10.NavigationComponent, typeof i11.ReportBrowserComponent, typeof i12.QueryBrowserComponent, typeof i13.DashboardResource, typeof i14.EntityRecordResource, typeof i15.ReportResource, typeof i16.SearchResultsResource, typeof i17.UserViewResource, typeof i18.FilesComponent, typeof i19.SingleApplicationComponent, typeof i20.FavoritesComponent, typeof i21.HeaderComponent, typeof i22.JoinGridComponent, typeof i23.SingleEntityComponent, typeof i24.SingleRecordComponent, typeof i25.SingleReportComponent, typeof i26.SingleSearchResultComponent, typeof i27.SingleViewComponent, typeof i28.SingleQueryComponent, typeof i29.UserProfileComponent, typeof i30.SingleDashboardComponent, typeof i31.AddItemComponent, typeof i32.DeleteItemComponent, typeof i33.EditDashboardComponent, typeof i34.UserNotificationsComponent, typeof i35.QueryResource, typeof i36.ExpansionPanelComponent, typeof i37.ApplicationViewComponent], [typeof i38.CommonModule, typeof i39.FormsModule, typeof i39.ReactiveFormsModule, typeof i40.RouterModule, typeof i41.GridModule, typeof i42.DialogsModule, typeof i43.ExcelExportModule, typeof i44.CompareRecordsModule, typeof i45.IndicatorsModule, typeof i38.CommonModule, typeof i39.FormsModule, typeof i41.GridModule, typeof i46.ChartsModule, typeof i47.ButtonsModule, typeof i48.TabStripModule, typeof i41.ExcelModule, typeof i41.PDFModule, typeof i45.IndicatorsModule, typeof i42.DialogsModule, typeof i49.InputsModule, typeof i50.LabelModule, typeof i44.CompareRecordsModule, typeof i51.RecordChangesModule, typeof i52.ContainerDirectivesModule, typeof i53.BaseFormsModule, typeof i54.ListViewModule, typeof i55.TreeViewModule, typeof i56.UserViewGridModule, typeof i57.QueryGridModule, typeof i58.SortableModule, typeof i48.LayoutModule, typeof i59.FilterModule, typeof i60.DropDownsModule, typeof i61.MemberJunctionSharedModule, typeof i62.AskSkipModule, typeof i63.EntityPermissionsModule, typeof i64.ExplorerSettingsModule, typeof i65.FileStorageModule, typeof i66.UserViewPropertiesDialogModule, typeof i67.MJTabStripModule], [typeof i1.FormToolbarComponent, typeof i2.SectionLoaderComponent, typeof i3.ResourceContainerComponent, typeof i4.AuthButtonComponent, typeof i5.DashboardBrowserComponent, typeof i6.DataBrowserComponent, typeof i7.GenericBrowseListComponent, typeof i8.GenericBrowserListComponent, typeof i9.HomeComponent, typeof i10.NavigationComponent, typeof i11.ReportBrowserComponent, typeof i13.DashboardResource, typeof i14.EntityRecordResource, typeof i15.ReportResource, typeof i16.SearchResultsResource, typeof i17.UserViewResource, typeof i19.SingleApplicationComponent, typeof i20.FavoritesComponent, typeof i21.HeaderComponent, typeof i22.JoinGridComponent, typeof i23.SingleEntityComponent, typeof i24.SingleRecordComponent, typeof i25.SingleReportComponent, typeof i26.SingleSearchResultComponent, typeof i27.SingleViewComponent, typeof i29.UserProfileComponent, typeof i30.SingleDashboardComponent, typeof i31.AddItemComponent, typeof i32.DeleteItemComponent, typeof i33.EditDashboardComponent, typeof i34.UserNotificationsComponent, typeof i36.ExpansionPanelComponent, typeof i37.ApplicationViewComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ExplorerCoreModule, [typeof i1.FormToolbarComponent, typeof i2.SectionLoaderComponent, typeof i3.ResourceContainerComponent, typeof i4.AuthButtonComponent, typeof i5.DashboardBrowserComponent, typeof i6.DataBrowserComponent, typeof i7.GenericBrowseListComponent, typeof i8.GenericBrowserListComponent, typeof i9.HomeComponent, typeof i10.NavigationComponent, typeof i11.ReportBrowserComponent, typeof i12.QueryBrowserComponent, typeof i13.DashboardResource, typeof i14.EntityRecordResource, typeof i15.ReportResource, typeof i16.SearchResultsResource, typeof i17.UserViewResource, typeof i18.FilesComponent, typeof i19.SingleApplicationComponent, typeof i20.FavoritesComponent, typeof i21.HeaderComponent, typeof i22.JoinGridComponent, typeof i23.SingleEntityComponent, typeof i24.SingleRecordComponent, typeof i25.SingleReportComponent, typeof i26.SingleSearchResultComponent, typeof i27.SingleViewComponent, typeof i28.SingleQueryComponent, typeof i29.UserProfileComponent, typeof i30.SingleDashboardComponent, typeof i31.AddItemComponent, typeof i32.DeleteItemComponent, typeof i33.EditDashboardComponent, typeof i34.UserNotificationsComponent, typeof i35.QueryResource, typeof i36.ExpansionPanelComponent, typeof i37.ApplicationViewComponent], [typeof i38.AppRoutingModule, typeof i39.CommonModule, typeof i40.FormsModule, typeof i40.ReactiveFormsModule, typeof i41.RouterModule, typeof i42.GridModule, typeof i43.DialogsModule, typeof i44.ExcelExportModule, typeof i45.CompareRecordsModule, typeof i46.IndicatorsModule, typeof i39.CommonModule, typeof i40.FormsModule, typeof i42.GridModule, typeof i47.ChartsModule, typeof i48.ButtonsModule, typeof i49.TabStripModule, typeof i42.ExcelModule, typeof i42.PDFModule, typeof i46.IndicatorsModule, typeof i43.DialogsModule, typeof i50.InputsModule, typeof i51.LabelModule, typeof i45.CompareRecordsModule, typeof i52.RecordChangesModule, typeof i53.ContainerDirectivesModule, typeof i54.BaseFormsModule, typeof i55.ListViewModule, typeof i56.TreeViewModule, typeof i57.UserViewGridModule, typeof i58.QueryGridModule, typeof i59.SortableModule, typeof i49.LayoutModule, typeof i60.FilterModule, typeof i61.DropDownsModule, typeof i62.MemberJunctionSharedModule, typeof i63.AskSkipModule, typeof i64.EntityPermissionsModule, typeof i65.ExplorerSettingsModule, typeof i66.FileStorageModule, typeof i67.UserViewPropertiesDialogModule, typeof i68.MJTabStripModule], [typeof i1.FormToolbarComponent, typeof i2.SectionLoaderComponent, typeof i3.ResourceContainerComponent, typeof i4.AuthButtonComponent, typeof i5.DashboardBrowserComponent, typeof i6.DataBrowserComponent, typeof i7.GenericBrowseListComponent, typeof i8.GenericBrowserListComponent, typeof i9.HomeComponent, typeof i10.NavigationComponent, typeof i11.ReportBrowserComponent, typeof i13.DashboardResource, typeof i14.EntityRecordResource, typeof i15.ReportResource, typeof i16.SearchResultsResource, typeof i17.UserViewResource, typeof i19.SingleApplicationComponent, typeof i20.FavoritesComponent, typeof i21.HeaderComponent, typeof i22.JoinGridComponent, typeof i23.SingleEntityComponent, typeof i24.SingleRecordComponent, typeof i25.SingleReportComponent, typeof i26.SingleSearchResultComponent, typeof i27.SingleViewComponent, typeof i29.UserProfileComponent, typeof i30.SingleDashboardComponent, typeof i31.AddItemComponent, typeof i32.DeleteItemComponent, typeof i33.EditDashboardComponent, typeof i34.UserNotificationsComponent, typeof i36.ExpansionPanelComponent, typeof i37.ApplicationViewComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ExplorerCoreModule>;
 }
 //# sourceMappingURL=module.d.ts.map

package/dist/module.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA,qBAsHa,kBAAkB;yCAAlB,kBAAkB;0CAAlB,kBAAkB;0CAAlB,kBAAkB;CAAG"}
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4EA,qBAwHa,kBAAkB;yCAAlB,kBAAkB;0CAAlB,kBAAkB;0CAAlB,kBAAkB;CAAG"}

package/dist/module.js

@@ -1,22 +1,22 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { RouterModule } from '@angular/router';
+import { RouterModule, RouteReuseStrategy } from '@angular/router';
 // Kendo UI Angular imports
 import { ButtonsModule } from '@progress/kendo-angular-buttons';
 import { ChartsModule } from '@progress/kendo-angular-charts';
-import { DialogsModule } from "@progress/kendo-angular-dialog";
+import { DialogsModule } from '@progress/kendo-angular-dialog';
 import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
 import { ExcelExportModule } from '@progress/kendo-angular-excel-export';
-import { FilterModule } from "@progress/kendo-angular-filter";
+import { FilterModule } from '@progress/kendo-angular-filter';
 import { ExcelModule, GridModule, PDFModule } from '@progress/kendo-angular-grid';
 import { IndicatorsModule } from '@progress/kendo-angular-indicators';
 import { InputsModule } from '@progress/kendo-angular-inputs';
 import { LabelModule } from '@progress/kendo-angular-label';
 import { LayoutModule, TabStripModule } from '@progress/kendo-angular-layout';
 import { ListViewModule } from '@progress/kendo-angular-listview';
-import { SortableModule } from "@progress/kendo-angular-sortable";
-import { TreeViewModule } from "@progress/kendo-angular-treeview";
+import { SortableModule } from '@progress/kendo-angular-sortable';
+import { TreeViewModule } from '@progress/kendo-angular-treeview';
 // MJ
 import { CompareRecordsModule } from '@memberjunction/ng-compare-records';
 import { ContainerDirectivesModule } from '@memberjunction/ng-container-directives';
@@ -69,6 +69,7 @@ import { UserProfileComponent } from './lib/user-profile/user-profile.component'
 import { ExpansionPanelComponent } from './lib/expansion-panel-component/expansion-panel-component';
 import { ApplicationViewComponent } from './lib/app-view/application-view.component';
 import { UserViewPropertiesDialogModule } from '@memberjunction/ng-user-view-properties';
+import { AppRoutingModule, CustomReuseStrategy } from './app-routing.module';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "@progress/kendo-angular-buttons";
@@ -77,7 +78,8 @@ export class ExplorerCoreModule {
 }
 ExplorerCoreModule.ɵfac = function ExplorerCoreModule_Factory(t) { return new (t || ExplorerCoreModule)(); };
 ExplorerCoreModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: ExplorerCoreModule });
-ExplorerCoreModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
+ExplorerCoreModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [{ provide: RouteReuseStrategy, useClass: CustomReuseStrategy }], imports: [AppRoutingModule,
+        CommonModule,
         FormsModule,
         ReactiveFormsModule,
         RouterModule,
@@ -157,9 +159,10 @@ ExplorerCoreModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [Commo
                     UserNotificationsComponent,
                     QueryResource,
                     ExpansionPanelComponent,
-                    ApplicationViewComponent
+                    ApplicationViewComponent,
                 ],
                 imports: [
+                    AppRoutingModule,
                     CommonModule,
                     FormsModule,
                     ReactiveFormsModule,
@@ -199,7 +202,7 @@ ExplorerCoreModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [Commo
                     ExplorerSettingsModule,
                     FileStorageModule,
                     UserViewPropertiesDialogModule,
-                    MJTabStripModule
+                    MJTabStripModule,
                 ],
                 exports: [
                     FormToolbarComponent,
@@ -234,8 +237,9 @@ ExplorerCoreModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [Commo
                     EditDashboardComponent,
                     UserNotificationsComponent,
                     ExpansionPanelComponent,
-                    ApplicationViewComponent
+                    ApplicationViewComponent,
                 ],
+                providers: [{ provide: RouteReuseStrategy, useClass: CustomReuseStrategy }],
             }]
     }], null, null); })();
 (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(ExplorerCoreModule, { declarations: [FormToolbarComponent,
@@ -274,7 +278,8 @@ ExplorerCoreModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [Commo
         UserNotificationsComponent,
         QueryResource,
         ExpansionPanelComponent,
-        ApplicationViewComponent], imports: [CommonModule,
+        ApplicationViewComponent], imports: [AppRoutingModule,
+        CommonModule,
         FormsModule,
         ReactiveFormsModule,
         RouterModule,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memberjunction/ng-explorer-core",
-  "version": "1.2.2",
+  "version": "1.3.1",
   "description": "MemberJunction Explorer: Core Angular Components",
   "main": "./dist/public-api.js",
   "typings": "./dist/public-api.d.ts",
@@ -26,21 +26,21 @@
     "@angular/router": "~17.2.2"
   },
   "dependencies": {
-    "@memberjunction/global": "~1.2.2",
-    "@memberjunction/core": "~1.2.2",
-    "@memberjunction/ng-compare-records": "~1.2.2",
-    "@memberjunction/ng-file-storage": "~1.2.2",
-    "@memberjunction/ng-record-changes": "~1.2.2",
-    "@memberjunction/ng-container-directives": "~1.2.2",
-    "@memberjunction/ng-user-view-grid": "~1.2.2",
-    "@memberjunction/ng-query-grid": "~1.2.2",
-    "@memberjunction/ng-user-view-properties": "~1.2.2",
-    "@memberjunction/ng-shared": "~1.2.2",
-    "@memberjunction/ng-tabstrip": "~1.2.2",
-    "@memberjunction/ng-ask-skip": "~1.2.2",
-    "@memberjunction/ng-auth-services": "~1.2.2",
-    "@memberjunction/ng-explorer-settings": "~1.2.2",
-    "@memberjunction/ng-base-forms": "~1.2.2",
+    "@memberjunction/global": "~1.3.1",
+    "@memberjunction/core": "~1.3.1",
+    "@memberjunction/ng-compare-records": "~1.3.1",
+    "@memberjunction/ng-file-storage": "~1.3.1",
+    "@memberjunction/ng-record-changes": "~1.3.1",
+    "@memberjunction/ng-container-directives": "~1.3.1",
+    "@memberjunction/ng-user-view-grid": "~1.3.1",
+    "@memberjunction/ng-query-grid": "~1.3.1",
+    "@memberjunction/ng-user-view-properties": "~1.3.1",
+    "@memberjunction/ng-shared": "~1.3.1",
+    "@memberjunction/ng-tabstrip": "~1.3.1",
+    "@memberjunction/ng-ask-skip": "~1.3.1",
+    "@memberjunction/ng-auth-services": "~1.3.1",
+    "@memberjunction/ng-explorer-settings": "~1.3.1",
+    "@memberjunction/ng-base-forms": "~1.3.1",
     "@progress/kendo-angular-grid": "~15.1.0",
     "@progress/kendo-angular-buttons": "~15.1.0",
     "@progress/kendo-angular-listview": "~15.1.0",