@memberjunction/ng-explorer-core 2.52.0 → 2.54.0

package/dist/lib/resource-browser/resource-browser.component.js

@@ -14,220 +14,329 @@ import * as i7 from "@progress/kendo-angular-inputs";
 import * as i8 from "@progress/kendo-angular-label";
 import * as i9 from "@progress/kendo-angular-layout";
 import * as i10 from "@memberjunction/ng-entity-form-dialog";
-function ResourceBrowserComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+function ResourceBrowserComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 20);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_4_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goToParent()); });
+    i0.ɵɵelementStart(0, "span", 25);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_3_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goToParent()); });
+    i0.ɵɵelement(1, "span", 26);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(1, "span", 21);
 } }
-function ResourceBrowserComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-dropdownbutton", 22);
-    i0.ɵɵlistener("itemClick", function ResourceBrowserComponent_Conditional_7_Template_kendo_dropdownbutton_itemClick_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onDropdownItemClick($event)); });
-    i0.ɵɵelement(1, "span", 23);
-    i0.ɵɵtext(2, " Create New ");
+function ResourceBrowserComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 8);
+    i0.ɵɵelement(1, "span", 27);
+    i0.ɵɵtext(2, " Current Folder ");
     i0.ɵɵelementEnd();
+} }
+function ResourceBrowserComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dropdownbutton", 28);
+    i0.ɵɵlistener("itemClick", function ResourceBrowserComponent_Conditional_11_Template_kendo_dropdownbutton_itemClick_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onDropdownItemClick($event)); });
+    i0.ɵɵelementStart(1, "span", 29);
+    i0.ɵɵelement(2, "i", 30);
+    i0.ɵɵtext(3, " Create New ");
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵproperty("data", ctx_r2.ItemOptions);
 } }
-function ResourceBrowserComponent_ng_template_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 24);
+function ResourceBrowserComponent_ng_template_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 31);
 } }
-function ResourceBrowserComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "kendo-loader", 16);
-} }
-function ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 36);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const dataItem_r8 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.editItem(dataItem_r8)); });
-    i0.ɵɵelement(1, "span", 37);
+function ResourceBrowserComponent_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 21);
+    i0.ɵɵelement(1, "kendo-loader", 32);
     i0.ɵɵelementEnd();
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 40)(1, "span", 41);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const dataItem_r7 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(dataItem_r7.Name);
+} }
+function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "kendo-chip", 42);
+} if (rf & 2) {
+    const dataItem_r8 = ctx.$implicit;
+    i0.ɵɵproperty("label", dataItem_r8.Type)("themeColor", dataItem_r8.Type === "Folder" ? "info" : "base");
+} }
+function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 36);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const dataItem_r8 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.deleteItem(dataItem_r8)); });
-    i0.ɵɵelement(1, "span", 38);
+    i0.ɵɵelementStart(0, "button", 46);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const dataItem_r10 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.editItem(dataItem_r10)); });
+    i0.ɵɵelement(1, "span", 47);
     i0.ɵɵelementEnd();
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 39);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const dataItem_r8 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.unlinkItem(dataItem_r8)); });
-    i0.ɵɵelement(1, "span", 40);
+function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 48);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r11); const dataItem_r10 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.deleteItem(dataItem_r10)); });
+    i0.ɵɵelement(1, "span", 49);
+    i0.ɵɵelementEnd();
+} }
+function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 50);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r12); const dataItem_r10 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.unlinkItem(dataItem_r10)); });
+    i0.ɵɵelement(1, "span", 51);
     i0.ɵɵelementEnd();
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 33);
-    i0.ɵɵtemplate(1, ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_1_Template, 2, 0, "button", 34)(2, ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_2_Template, 2, 0, "button", 34)(3, ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Conditional_3_Template, 2, 0, "button", 35);
+function ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 15);
+    i0.ɵɵtemplate(1, ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_1_Template, 2, 0, "button", 43)(2, ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_2_Template, 2, 0, "button", 44)(3, ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Conditional_3_Template, 2, 0, "button", 45);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const dataItem_r8 = ctx.$implicit;
+    const dataItem_r10 = ctx.$implicit;
     const ctx_r2 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r2.EnableItemEdit && (!dataItem_r8.IsLink || dataItem_r8.LinkPermissionLevel === "Owner" || dataItem_r8.LinkPermissionLevel === "Edit") ? 1 : -1);
+    i0.ɵɵconditional(ctx_r2.EnableItemEdit && (!dataItem_r10.IsLink || dataItem_r10.LinkPermissionLevel === "Owner" || dataItem_r10.LinkPermissionLevel === "Edit") ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r2.EnableItemDelete && (!dataItem_r8.IsLike || dataItem_r8.LinkPermissionLevel === "Owner") ? 2 : -1);
+    i0.ɵɵconditional(ctx_r2.EnableItemDelete && (!dataItem_r10.IsLink || dataItem_r10.LinkPermissionLevel === "Owner") ? 2 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r2.EnableRemoveLink && dataItem_r8.IsLink ? 3 : -1);
+    i0.ɵɵconditional(ctx_r2.EnableRemoveLink && dataItem_r10.IsLink ? 3 : -1);
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+function ResourceBrowserComponent_Conditional_25_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-grid", 27);
-    i0.ɵɵlistener("cellClick", function ResourceBrowserComponent_Conditional_20_Conditional_0_Template_kendo_grid_cellClick_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onCellItemClicked($event)); });
-    i0.ɵɵelement(1, "kendo-grid-column", 28)(2, "kendo-grid-column", 29)(3, "kendo-grid-column", 30);
-    i0.ɵɵelementStart(4, "kendo-grid-column", 31);
-    i0.ɵɵtemplate(5, ResourceBrowserComponent_Conditional_20_Conditional_0_ng_template_5_Template, 4, 3, "ng-template", 32);
+    i0.ɵɵelementStart(0, "kendo-grid", 34);
+    i0.ɵɵlistener("cellClick", function ResourceBrowserComponent_Conditional_25_Conditional_0_Template_kendo_grid_cellClick_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onCellItemClicked($event)); });
+    i0.ɵɵelementStart(1, "kendo-grid-column", 35);
+    i0.ɵɵtemplate(2, ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_2_Template, 3, 1, "ng-template", 36);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(3, "kendo-grid-column", 37);
+    i0.ɵɵelementStart(4, "kendo-grid-column", 38);
+    i0.ɵɵtemplate(5, ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_5_Template, 1, 2, "ng-template", 36);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "kendo-grid-column", 39);
+    i0.ɵɵtemplate(7, ResourceBrowserComponent_Conditional_25_Conditional_0_ng_template_7_Template, 4, 3, "ng-template", 36);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("kendoGridBinding", ctx_r2.Items);
+    i0.ɵɵadvance(6);
+    i0.ɵɵproperty("width", 150);
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 51);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r12); const item_r13 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.editItem(item_r13)); });
-    i0.ɵɵelement(1, "span", 37);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_0_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-button", 57);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_0_Conditional_7_Template_kendo_button_click_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.onDropdownItemClick({ Text: ctx_r2.ItemOptions[0].Text })); });
+    i0.ɵɵelementStart(1, "span", 29);
+    i0.ɵɵelement(2, "i", 30);
+    i0.ɵɵtext(3, " Create Your First Item ");
+    i0.ɵɵelementEnd()();
+} }
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 52)(1, "div", 54);
+    i0.ɵɵelement(2, "span", 55);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "h3");
+    i0.ɵɵtext(4);
     i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "p");
+    i0.ɵɵtext(6, "There are no items to display in this category.");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(7, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_0_Conditional_7_Template, 4, 0, "kendo-button", 56);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1("No ", ctx_r2.Title, " Found");
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r2.ItemOptions.length > 0 ? 7 : -1);
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 52);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r14); const item_r13 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.deleteItem(item_r13)); });
-    i0.ɵɵelement(1, "span", 38);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r16 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 46);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_2_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r16); const item_r15 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(4); ctx_r2.editItem(item_r15); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(1, "span", 47);
+    i0.ɵɵelementEnd();
+} }
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 48);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_3_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r17); const item_r15 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(4); ctx_r2.deleteItem(item_r15); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(1, "span", 49);
     i0.ɵɵelementEnd();
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 39);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r15); const item_r13 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.unlinkItem(item_r13)); });
-    i0.ɵɵelement(1, "span", 40);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 50);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_4_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r18); const item_r15 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(4); ctx_r2.unlinkItem(item_r15); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(1, "span", 51);
     i0.ɵɵelementEnd();
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 46);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 61);
+    i0.ɵɵelement(1, "span", 63)(2, "span", 64);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const item_r13 = i0.ɵɵnextContext().$implicit;
-    const ctx_r2 = i0.ɵɵnextContext(3);
-    i0.ɵɵproperty("title", item_r13.Name + "(Shared)")("ngClass", ctx_r2.getIconForResourceType(item_r13));
+    const item_r15 = i0.ɵɵnextContext().$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(4);
+    i0.ɵɵproperty("title", item_r15.Name + " (Shared)");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngClass", ctx_r2.getIconForResourceType(item_r15));
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 47);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "span", 62);
 } if (rf & 2) {
-    const item_r13 = i0.ɵɵnextContext().$implicit;
-    const ctx_r2 = i0.ɵɵnextContext(3);
-    i0.ɵɵproperty("title", item_r13.Name)("ngClass", ctx_r2.getIconForResourceType(item_r13));
+    const item_r15 = i0.ɵɵnextContext().$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(4);
+    i0.ɵɵproperty("ngClass", ctx_r2.getIconForResourceType(item_r15))("title", item_r15.Name);
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-card", 41)(1, "div", 42);
-    i0.ɵɵtemplate(2, ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_2_Template, 2, 0, "button", 43)(3, ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_3_Template, 2, 0, "button", 44)(4, ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_4_Template, 2, 0, "button", 35);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-card", 59);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Template_kendo_card_click_0_listener() { const item_r15 = i0.ɵɵrestoreView(_r14).$implicit; const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.itemClick(item_r15)); });
+    i0.ɵɵelementStart(1, "div", 60);
+    i0.ɵɵtemplate(2, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_2_Template, 2, 0, "button", 43)(3, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_3_Template, 2, 0, "button", 44)(4, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_4_Template, 2, 0, "button", 45);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "kendo-card-body", 45);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Template_kendo_card_body_click_5_listener() { const item_r13 = i0.ɵɵrestoreView(_r11).$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.itemClick(item_r13)); });
-    i0.ɵɵtemplate(6, ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_6_Template, 1, 2, "i", 46)(7, ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Conditional_7_Template, 1, 2, "span", 47);
-    i0.ɵɵelementStart(8, "div", 48)(9, "h5", 49);
-    i0.ɵɵtext(10);
+    i0.ɵɵelementStart(5, "kendo-card-body");
+    i0.ɵɵtemplate(6, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_6_Template, 3, 2, "div", 61)(7, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Conditional_7_Template, 1, 2, "span", 62);
+    i0.ɵɵelementStart(8, "h3");
+    i0.ɵɵtext(9);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(11, "p", 50);
-    i0.ɵɵtext(12);
-    i0.ɵɵelementEnd()()()();
+    i0.ɵɵelementStart(10, "p");
+    i0.ɵɵtext(11);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(12, "kendo-chip", 42);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const item_r13 = ctx.$implicit;
-    const ctx_r2 = i0.ɵɵnextContext(3);
+    const item_r15 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r2.EnableItemEdit && (!item_r13.IsLink || item_r13.LinkPermissionLevel === "Owner" || item_r13.LinkPermissionLevel === "Edit") ? 2 : -1);
+    i0.ɵɵconditional(ctx_r2.EnableItemEdit && (!item_r15.IsLink || item_r15.LinkPermissionLevel === "Owner" || item_r15.LinkPermissionLevel === "Edit") ? 2 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r2.EnableItemDelete && (!item_r13.IsLink || item_r13.LinkPermissionLevel === "Owner") ? 3 : ctx_r2.EnableRemoveLink && item_r13.IsLink ? 4 : -1);
+    i0.ɵɵconditional(ctx_r2.EnableItemDelete && (!item_r15.IsLink || item_r15.LinkPermissionLevel === "Owner") ? 3 : ctx_r2.EnableRemoveLink && item_r15.IsLink ? 4 : -1);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(item_r13.IsLink ? 6 : 7);
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(item_r13.Name);
+    i0.ɵɵconditional(item_r15.IsLink ? 6 : 7);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(item_r15.Name);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r13.Description);
+    i0.ɵɵtextInterpolate(item_r15.Description || "No description available");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("label", item_r15.Type)("themeColor", item_r15.Type === "Folder" ? "info" : "base");
 } }
-function ResourceBrowserComponent_Conditional_20_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 26);
-    i0.ɵɵrepeaterCreate(1, ResourceBrowserComponent_Conditional_20_Conditional_1_For_2_Template, 13, 5, "kendo-card", 41, i0.ɵɵrepeaterTrackByIdentity);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 53);
+    i0.ɵɵrepeaterCreate(1, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_For_2_Template, 13, 7, "kendo-card", 58, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext(2);
+    const ctx_r2 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r2.Items);
 } }
-function ResourceBrowserComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, ResourceBrowserComponent_Conditional_20_Conditional_0_Template, 6, 1, "kendo-grid", 25)(1, ResourceBrowserComponent_Conditional_20_Conditional_1_Template, 3, 0, "div", 26);
+function ResourceBrowserComponent_Conditional_25_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_0_Template, 8, 2, "div", 52)(1, ResourceBrowserComponent_Conditional_25_Conditional_1_Conditional_1_Template, 3, 0, "div", 53);
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵconditional(ctx_r2.Items.length === 0 ? 0 : 1);
+} }
+function ResourceBrowserComponent_Conditional_25_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, ResourceBrowserComponent_Conditional_25_Conditional_0_Template, 8, 2, "kendo-grid", 33)(1, ResourceBrowserComponent_Conditional_25_Conditional_1_Template, 2, 1);
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵconditional(ctx_r2.DisplayMode === "List" ? 0 : 1);
 } }
-function ResourceBrowserComponent_kendo_dialog_21_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-dialog", 53);
-    i0.ɵɵlistener("close", function ResourceBrowserComponent_kendo_dialog_21_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onConfirmDeleteItem(false)); });
-    i0.ɵɵelementStart(1, "p", 54);
-    i0.ɵɵtext(2);
-    i0.ɵɵelementStart(3, "b");
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "kendo-dialog-actions", 55)(6, "button", 56);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_21_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onConfirmDeleteItem(true)); });
-    i0.ɵɵtext(7, " Yes ");
+function ResourceBrowserComponent_kendo_dialog_26_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 69);
+    i0.ɵɵtext(1, "This action cannot be undone.");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "button", 57);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_21_Template_button_click_8_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onConfirmDeleteItem(false)); });
-    i0.ɵɵtext(9, " No ");
-    i0.ɵɵelementEnd()()();
+} }
+function ResourceBrowserComponent_kendo_dialog_26_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dialog", 65);
+    i0.ɵɵlistener("close", function ResourceBrowserComponent_kendo_dialog_26_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onConfirmDeleteItem(false)); });
+    i0.ɵɵelementStart(1, "div", 66)(2, "div", 67);
+    i0.ɵɵelement(3, "span", 68);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p");
+    i0.ɵɵtext(5, " Are you sure you want to ");
+    i0.ɵɵelementStart(6, "strong");
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "strong");
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(10, "? ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(11, ResourceBrowserComponent_kendo_dialog_26_Conditional_11_Template, 2, 0, "p", 69);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "kendo-dialog-actions", 70)(13, "kendo-button", 71);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_26_Template_kendo_button_click_13_listener() { i0.ɵɵrestoreView(_r19); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onConfirmDeleteItem(false)); });
+    i0.ɵɵtext(14, " Cancel ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "kendo-button", 72);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_26_Template_kendo_button_click_15_listener() { i0.ɵɵrestoreView(_r19); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onConfirmDeleteItem(true)); });
+    i0.ɵɵelementStart(16, "span", 29);
+    i0.ɵɵelement(17, "i", 73);
+    i0.ɵɵtext(18);
+    i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("minWidth", 450)("width", 650);
+    i0.ɵɵproperty("minWidth", 400)("width", 500);
+    i0.ɵɵadvance(7);
+    i0.ɵɵtextInterpolate((ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) && (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.LinkPermissionLevel) === "Owner" || !(ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) ? "delete" : "unlink");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" Are you sure you want to ", (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) && (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.LinkPermissionLevel) === "Owner" || !(ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) ? "delete" : "unlink", " ");
+    i0.ɵɵtextInterpolate(ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.Name);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1("", ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.Name, "?");
+    i0.ɵɵconditional((ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) && (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.LinkPermissionLevel) === "Owner" || !(ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) ? 11 : -1);
+    i0.ɵɵadvance(6);
+    i0.ɵɵproperty("ngClass", (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) && (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.LinkPermissionLevel) === "Owner" || !(ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) ? "fas fa-trash" : "fas fa-link-slash");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) && (ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.LinkPermissionLevel) === "Owner" || !(ctx_r2.selectedItem == null ? null : ctx_r2.selectedItem.IsLink) ? "Delete" : "Unlink", " ");
 } }
-function ResourceBrowserComponent_kendo_dialog_22_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    const _r18 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 56);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_22_Conditional_9_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.updateFolder()); });
-    i0.ɵɵtext(1, " Update ");
-    i0.ɵɵelementEnd();
+function ResourceBrowserComponent_kendo_dialog_27_ng_template_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 81);
 } }
-function ResourceBrowserComponent_kendo_dialog_22_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 56);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_22_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.createFolder()); });
-    i0.ɵɵtext(1, " Create ");
-    i0.ɵɵelementEnd();
+function ResourceBrowserComponent_kendo_dialog_27_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    const _r21 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-button", 57);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_27_Conditional_12_Template_kendo_button_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.updateFolder()); });
+    i0.ɵɵelementStart(1, "span", 29);
+    i0.ɵɵelement(2, "i", 82);
+    i0.ɵɵtext(3, " Update Folder ");
+    i0.ɵɵelementEnd()();
 } }
-function ResourceBrowserComponent_kendo_dialog_22_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-dialog", 58);
-    i0.ɵɵlistener("close", function ResourceBrowserComponent_kendo_dialog_22_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleUpsertFolderView(false, false)); });
-    i0.ɵɵelementStart(1, "div", 7)(2, "kendo-label", 59)(3, "kendo-textbox", 60);
-    i0.ɵɵlistener("valueChange", function ResourceBrowserComponent_kendo_dialog_22_Template_kendo_textbox_valueChange_3_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onUpsertFolderNameKeyup($event)); });
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelement(4, "br");
-    i0.ɵɵelementStart(5, "div", 7)(6, "kendo-label", 61)(7, "kendo-textbox", 62);
-    i0.ɵɵlistener("valueChange", function ResourceBrowserComponent_kendo_dialog_22_Template_kendo_textbox_valueChange_7_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onUpsertFolderDescriptionKeyup($event)); });
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(8, "kendo-dialog-actions", 55);
-    i0.ɵɵtemplate(9, ResourceBrowserComponent_kendo_dialog_22_Conditional_9_Template, 2, 0, "button", 63)(10, ResourceBrowserComponent_kendo_dialog_22_Conditional_10_Template, 2, 0, "button", 63);
-    i0.ɵɵelementStart(11, "button", 57);
-    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_22_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleUpsertFolderView(false, false)); });
-    i0.ɵɵtext(12, " Cancel ");
+function ResourceBrowserComponent_kendo_dialog_27_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-button", 57);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_27_Conditional_13_Template_kendo_button_click_0_listener() { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.createFolder()); });
+    i0.ɵɵelementStart(1, "span", 29);
+    i0.ɵɵelement(2, "i", 83);
+    i0.ɵɵtext(3, " Create Folder ");
+    i0.ɵɵelementEnd()();
+} }
+function ResourceBrowserComponent_kendo_dialog_27_Template(rf, ctx) { if (rf & 1) {
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dialog", 74);
+    i0.ɵɵlistener("close", function ResourceBrowserComponent_kendo_dialog_27_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r20); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleUpsertFolderView(false, false)); });
+    i0.ɵɵelementStart(1, "div", 66)(2, "kendo-formfield", 75);
+    i0.ɵɵelement(3, "kendo-label", 76);
+    i0.ɵɵelementStart(4, "kendo-textbox", 77);
+    i0.ɵɵlistener("valueChange", function ResourceBrowserComponent_kendo_dialog_27_Template_kendo_textbox_valueChange_4_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onUpsertFolderNameKeyup($event)); });
+    i0.ɵɵtemplate(5, ResourceBrowserComponent_kendo_dialog_27_ng_template_5_Template, 1, 0, "ng-template", 14);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(6, "kendo-formfield", 78);
+    i0.ɵɵelement(7, "kendo-label", 79);
+    i0.ɵɵelementStart(8, "kendo-textarea", 80);
+    i0.ɵɵlistener("valueChange", function ResourceBrowserComponent_kendo_dialog_27_Template_kendo_textarea_valueChange_8_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onUpsertFolderDescriptionKeyup($event)); });
     i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(9, "kendo-dialog-actions", 70)(10, "kendo-button", 71);
+    i0.ɵɵlistener("click", function ResourceBrowserComponent_kendo_dialog_27_Template_kendo_button_click_10_listener() { i0.ɵɵrestoreView(_r20); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleUpsertFolderView(false, false)); });
+    i0.ɵɵtext(11, " Cancel ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(12, ResourceBrowserComponent_kendo_dialog_27_Conditional_12_Template, 4, 0, "kendo-button", 56)(13, ResourceBrowserComponent_kendo_dialog_27_Conditional_13_Template, 4, 0, "kendo-button", 56);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("title", ctx_r2.selectedFolder ? "Edit Folder" : "Create new folder")("minWidth", 250)("width", 450);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("value", ctx_r2.upsertNewFolderName);
+    i0.ɵɵproperty("title", ctx_r2.selectedFolder ? "Edit Folder" : "Create New Folder")("minWidth", 400)("width", 500);
     i0.ɵɵadvance(4);
-    i0.ɵɵproperty("value", ctx_r2.upsertNewFolderDescription);
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r2.selectedFolder ? 9 : 10);
+    i0.ɵɵproperty("value", ctx_r2.upsertNewFolderName)("clearButton", true);
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("value", ctx_r2.upsertNewFolderDescription)("rows", 3);
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional(ctx_r2.selectedFolder ? 12 : 13);
 } }
 export class ResourceBrowserComponent {
     sharedService;
@@ -797,55 +906,66 @@ export class ResourceBrowserComponent {
         return "";
     }
     static ɵfac = function ResourceBrowserComponent_Factory(t) { return new (t || ResourceBrowserComponent)(i0.ɵɵdirectiveInject(i1.SharedService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ResourceBrowserComponent, selectors: [["mj-resource-browser"]], inputs: { ResourceTypeName: "ResourceTypeName", EnableCategories: "EnableCategories", CategoryEntityID: "CategoryEntityID", CurrentCategoryID: "CurrentCategoryID", EnableItemEdit: "EnableItemEdit", EnableItemDelete: "EnableItemDelete", EnableRemoveLink: "EnableRemoveLink", Title: "Title", ItemFilter: "ItemFilter", OrderBy: "OrderBy", NewItemOptions: "NewItemOptions", DisplayMode: "DisplayMode" }, outputs: { ResourceSelected: "ResourceSelected", CategoryChanged: "CategoryChanged", DisplayModeChanged: "DisplayModeChanged", NavigateToParentEvent: "NavigateToParentEvent", EditItemEvent: "EditItemEvent", DeleteItemEvent: "DeleteItemEvent" }, decls: 25, vars: 8, consts: [["searchInput", ""], ["entityFormDialog", ""], [1, "generic-browser-list-container"], [1, "main-fav-wrapper"], [1, "title-wrapper"], [1, "title-flex-display"], ["textField", "Text", "themeColor", "info", 1, "custom-dropdwn", 3, "data"], [1, "search"], ["type", "text", "placeholder", "Search", "size", "large", "rounded", "large", "fillMode", "solid", 3, "keyup", "clearButton"], ["kendoTextBoxPrefixTemplate", "", 3, "showSeparator"], [1, "filter-wrapper"], ["kendobutton", "", 1, "cursor-pointer", "grid-btn", "btn-cmn", 3, "click"], [1, "fa-solid", "fa-bars"], ["kendobutton", "", 1, "cursor-pointer", "active", "btn-cmn", 3, "click"], [1, "fa-solid", "fa-table-cells-large"], [1, "main-area"], ["type", "converging-spinner"], ["class", "dialog-wrapper", "title", "Confirm", 3, "minWidth", "width", "close", 4, "ngIf"], ["class", "dialog-wrapper", 3, "title", "minWidth", "width", "close", 4, "ngIf"], ["Mode", "complete"], ["title", "Parent", 1, "title-folder", "fa-solid", "fa-arrow-left", "fa-2xl", "breadcrumb-icon", 3, "click"], ["title", "Folder", 1, "title-folder", "fa-regular", "fa-folder", "fa-2xl"], ["textField", "Text", "themeColor", "info", 1, "custom-dropdwn", 3, "itemClick", "data"], [1, "fa-solid", "fa-plus"], [1, "fa-solid", "fa-magnifying-glass", "margin-left-small"], [3, "kendoGridBinding"], [1, "card-list", "k-d-flex", "k-flex-row", "k-h-full", "k-flex-wrap"], [3, "cellClick", "kendoGridBinding"], ["field", "Name", "title", "Name"], ["field", "Description", "title", "Description"], ["field", "Type", "title", "Type"], ["title", ""], ["kendoGridCellTemplate", ""], [1, "grid-wrapper"], [1, "list-btn"], ["title", "Remove Link to Shared Item", 1, "list-btn"], [1, "list-btn", 3, "click"], [1, "fa-regular", "fa-pen-to-square"], [1, "fa-regular", "fa-trash-can"], ["title", "Remove Link to Shared Item", 1, "list-btn", 3, "click"], [1, "fa-solid", "fa-link-slash", 2, "color", "rgb(19, 92, 201)"], [1, "card-wrapper", "cursor-pointer"], [1, "list-item-icon"], ["title", "Edit Item", 1, "list-btn"], ["title", "Delete Item", 1, "list-btn"], [3, "click"], [2, "color", "rgb(19, 92, 201)", 3, "title", "ngClass"], [3, "title", "ngClass"], [1, "padding-top-small"], ["kendoCardTitle", ""], ["kendoCardSubtitle", ""], ["title", "Edit Item", 1, "list-btn", 3, "click"], ["title", "Delete Item", 1, "list-btn", 3, "click"], ["title", "Confirm", 1, "dialog-wrapper", 3, "close", "minWidth", "width"], [1, "k-m-7.5", "k-text-center"], [1, "popup-actions-btn"], ["kendoButton", "", "themeColor", "info", 1, "cancel-btn", 3, "click"], ["kendoButton", "", "fillMode", "outline", "themeColor", "info", 1, "yes-btn", 3, "click"], [1, "dialog-wrapper", 3, "close", "title", "minWidth", "width"], ["text", "Name"], ["placeholder", "Enter a folder name", 3, "valueChange", "value"], ["text", "Description"], ["placeholder", "Enter a Description", 3, "valueChange", "value"], ["kendoButton", "", "themeColor", "info", 1, "cancel-btn"]], template: function ResourceBrowserComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ResourceBrowserComponent, selectors: [["mj-resource-browser"]], inputs: { ResourceTypeName: "ResourceTypeName", EnableCategories: "EnableCategories", CategoryEntityID: "CategoryEntityID", CurrentCategoryID: "CurrentCategoryID", EnableItemEdit: "EnableItemEdit", EnableItemDelete: "EnableItemDelete", EnableRemoveLink: "EnableRemoveLink", Title: "Title", ItemFilter: "ItemFilter", OrderBy: "OrderBy", NewItemOptions: "NewItemOptions", DisplayMode: "DisplayMode" }, outputs: { ResourceSelected: "ResourceSelected", CategoryChanged: "CategoryChanged", DisplayModeChanged: "DisplayModeChanged", NavigateToParentEvent: "NavigateToParentEvent", EditItemEvent: "EditItemEvent", DeleteItemEvent: "DeleteItemEvent" }, decls: 30, vars: 14, consts: [["searchInput", ""], ["entityFormDialog", ""], [1, "mj-page-container"], [1, "mj-header"], [1, "mj-header-title"], ["title", "Back to Parent", 1, "mj-btn-icon-only"], [1, "mj-header-icon"], [1, "fa-regular", "fa-folder"], [1, "mj-header-subtitle"], [1, "mj-header-actions"], ["textField", "Text", "themeColor", "primary", "rounded", "medium", 3, "data"], [1, "mj-toolbar"], [1, "mj-search"], ["type", "text", "size", "medium", "rounded", "medium", "fillMode", "outline", 3, "keyup", "placeholder", "clearButton"], ["kendoTextBoxPrefixTemplate", ""], [1, "mj-toolbar-actions"], ["kendoButton", "", "title", "Table View", "fillMode", "outline", "themeColor", "base", 3, "click", "toggleable", "selected"], [1, "fa-solid", "fa-table"], ["kendoButton", "", "title", "Card View", "fillMode", "outline", "themeColor", "base", 3, "click", "toggleable", "selected"], [1, "fa-solid", "fa-grip"], [1, "main-area"], [1, "mj-loading"], ["class", "mj-dialog-confirm", "title", "Confirm Action", 3, "minWidth", "width", "close", 4, "ngIf"], ["class", "mj-dialog-form", 3, "title", "minWidth", "width", "close", 4, "ngIf"], ["Mode", "complete"], ["title", "Back to Parent", 1, "mj-btn-icon-only", 3, "click"], [1, "fa-solid", "fa-arrow-left"], [1, "fa-solid", "fa-folder-open"], ["textField", "Text", "themeColor", "primary", "rounded", "medium", 3, "itemClick", "data"], [1, "button-content"], [1, "fas", "fa-plus"], [1, "fas", "fa-search", "search-prefix-icon"], ["type", "converging-spinner", "themeColor", "primary", "size", "large"], [1, "mj-grid-table", 3, "kendoGridBinding"], [1, "mj-grid-table", 3, "cellClick", "kendoGridBinding"], ["field", "Name", "title", "Name"], ["kendoGridCellTemplate", ""], ["field", "Description", "title", "Description"], ["field", "Type", "title", "Type"], ["title", "Actions", 3, "width"], [1, "mj-grid-name-cell"], [1, "mj-grid-name"], ["rounded", "full", "size", "small", 3, "label", "themeColor"], ["title", "Edit Item", 1, "mj-btn-icon-only", "mj-btn-sm"], ["title", "Delete Item", 1, "mj-btn-icon-only", "mj-btn-sm"], ["title", "Remove Link", 1, "mj-btn-icon-only", "mj-btn-sm"], ["title", "Edit Item", 1, "mj-btn-icon-only", "mj-btn-sm", 3, "click"], [1, "fa-regular", "fa-pen-to-square"], ["title", "Delete Item", 1, "mj-btn-icon-only", "mj-btn-sm", 3, "click"], [1, "fa-regular", "fa-trash-can"], ["title", "Remove Link", 1, "mj-btn-icon-only", "mj-btn-sm", 3, "click"], [1, "fa-solid", "fa-link-slash"], [1, "mj-empty-state"], [1, "mj-grid-responsive"], [1, "mj-empty-icon"], [1, "fa-regular", "fa-folder-open"], ["themeColor", "primary", "rounded", "medium"], ["themeColor", "primary", "rounded", "medium", 3, "click"], [1, "mj-kendo-icon-card", "mj-kendo-icon-card-clickable"], [1, "mj-kendo-icon-card", "mj-kendo-icon-card-clickable", 3, "click"], [1, "mj-card-actions"], [1, "mj-icon-wrapper-linked", 3, "title"], [1, "mj-card-icon-large", 3, "ngClass", "title"], [1, "mj-card-icon-large", 3, "ngClass"], [1, "fa-solid", "fa-link", "mj-link-indicator"], ["title", "Confirm Action", 1, "mj-dialog-confirm", 3, "close", "minWidth", "width"], [1, "mj-dialog-content"], [1, "mj-dialog-icon"], [1, "fa-solid", "fa-triangle-exclamation"], [1, "mj-dialog-warning"], [1, "mj-dialog-actions"], ["fillMode", "outline", "rounded", "medium", 3, "click"], ["themeColor", "error", "rounded", "medium", 3, "click"], [3, "ngClass"], [1, "mj-dialog-form", 3, "close", "title", "minWidth", "width"], ["orientation", "vertical", 1, "mb-3"], ["text", "Folder Name"], ["placeholder", "Enter folder name...", "rounded", "medium", "fillMode", "outline", 3, "valueChange", "value", "clearButton"], ["orientation", "vertical"], ["text", "Description"], ["placeholder", "Enter description (optional)...", "rounded", "medium", "fillMode", "outline", 3, "valueChange", "value", "rows"], [1, "fas", "fa-folder", "search-prefix-icon"], [1, "fas", "fa-save"], [1, "fas", "fa-folder-plus"]], template: function ResourceBrowserComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
-            i0.ɵɵelementStart(0, "div", 2)(1, "div", 3)(2, "div", 4)(3, "div", 5);
-            i0.ɵɵtemplate(4, ResourceBrowserComponent_Conditional_4_Template, 2, 0);
-            i0.ɵɵelementStart(5, "h4");
-            i0.ɵɵtext(6);
-            i0.ɵɵelementEnd()();
-            i0.ɵɵtemplate(7, ResourceBrowserComponent_Conditional_7_Template, 3, 1, "kendo-dropdownbutton", 6);
+            i0.ɵɵelementStart(0, "div", 2)(1, "div", 3)(2, "div", 4);
+            i0.ɵɵtemplate(3, ResourceBrowserComponent_Conditional_3_Template, 2, 0, "span", 5);
+            i0.ɵɵelementStart(4, "div", 6);
+            i0.ɵɵelement(5, "span", 7);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(8, "div", 4)(9, "div", 7)(10, "kendo-textbox", 8, 0);
-            i0.ɵɵlistener("keyup", function ResourceBrowserComponent_Template_kendo_textbox_keyup_10_listener() { i0.ɵɵrestoreView(_r1); const searchInput_r5 = i0.ɵɵreference(11); return i0.ɵɵresetView(ctx.onKeyup(searchInput_r5.value)); });
-            i0.ɵɵtemplate(12, ResourceBrowserComponent_ng_template_12_Template, 1, 0, "ng-template", 9);
-            i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(13, "div", 10)(14, "button", 11);
-            i0.ɵɵlistener("click", function ResourceBrowserComponent_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.changeViewMode("List")); });
-            i0.ɵɵelement(15, "span", 12);
+            i0.ɵɵelementStart(6, "div")(7, "h1");
+            i0.ɵɵtext(8);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(16, "button", 13);
-            i0.ɵɵlistener("click", function ResourceBrowserComponent_Template_button_click_16_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.changeViewMode("Tile")); });
-            i0.ɵɵelement(17, "span", 14);
-            i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(18, "div", 15);
-            i0.ɵɵtemplate(19, ResourceBrowserComponent_Conditional_19_Template, 1, 0, "kendo-loader", 16)(20, ResourceBrowserComponent_Conditional_20_Template, 2, 1);
+            i0.ɵɵtemplate(9, ResourceBrowserComponent_Conditional_9_Template, 3, 0, "div", 8);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(10, "div", 9);
+            i0.ɵɵtemplate(11, ResourceBrowserComponent_Conditional_11_Template, 4, 1, "kendo-dropdownbutton", 10);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(12, "div", 11)(13, "div", 12)(14, "kendo-textbox", 13, 0);
+            i0.ɵɵlistener("keyup", function ResourceBrowserComponent_Template_kendo_textbox_keyup_14_listener() { i0.ɵɵrestoreView(_r1); const searchInput_r5 = i0.ɵɵreference(15); return i0.ɵɵresetView(ctx.onKeyup(searchInput_r5.value)); });
+            i0.ɵɵtemplate(16, ResourceBrowserComponent_ng_template_16_Template, 1, 0, "ng-template", 14);
             i0.ɵɵelementEnd()();
-            i0.ɵɵtemplate(21, ResourceBrowserComponent_kendo_dialog_21_Template, 10, 4, "kendo-dialog", 17)(22, ResourceBrowserComponent_kendo_dialog_22_Template, 13, 6, "kendo-dialog", 18);
-            i0.ɵɵelement(23, "mj-entity-form-dialog", 19, 1);
+            i0.ɵɵelementStart(17, "div", 15)(18, "kendo-buttongroup")(19, "button", 16);
+            i0.ɵɵlistener("click", function ResourceBrowserComponent_Template_button_click_19_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.changeViewMode("List")); });
+            i0.ɵɵelement(20, "span", 17);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(21, "button", 18);
+            i0.ɵɵlistener("click", function ResourceBrowserComponent_Template_button_click_21_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.changeViewMode("Tile")); });
+            i0.ɵɵelement(22, "span", 19);
+            i0.ɵɵelementEnd()()()();
+            i0.ɵɵelementStart(23, "div", 20);
+            i0.ɵɵtemplate(24, ResourceBrowserComponent_Conditional_24_Template, 2, 0, "div", 21)(25, ResourceBrowserComponent_Conditional_25_Template, 2, 1);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(26, ResourceBrowserComponent_kendo_dialog_26_Template, 19, 7, "kendo-dialog", 22)(27, ResourceBrowserComponent_kendo_dialog_27_Template, 14, 8, "kendo-dialog", 23);
+            i0.ɵɵelement(28, "mj-entity-form-dialog", 24, 1);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
-            i0.ɵɵadvance(4);
-            i0.ɵɵconditional(ctx.CurrentCategoryID ? 4 : -1);
-            i0.ɵɵadvance(2);
+            i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.CurrentCategoryID ? 3 : -1);
+            i0.ɵɵadvance(5);
             i0.ɵɵtextInterpolate(ctx.Title);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.ItemOptions.length > 0 ? 7 : -1);
+            i0.ɵɵconditional(ctx.CurrentCategoryID ? 9 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.ItemOptions.length > 0 ? 11 : -1);
             i0.ɵɵadvance(3);
+            i0.ɵɵpropertyInterpolate1("placeholder", "Search ", ctx.Title, "...");
             i0.ɵɵproperty("clearButton", true);
+            i0.ɵɵadvance(5);
+            i0.ɵɵproperty("toggleable", true)("selected", ctx.DisplayMode === "List");
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("showSeparator", true);
-            i0.ɵɵadvance(7);
-            i0.ɵɵconditional(ctx.IsLoading ? 19 : 20);
+            i0.ɵɵproperty("toggleable", true)("selected", ctx.DisplayMode === "Tile");
+            i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.IsLoading ? 24 : 25);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.deleteDialogOpened);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.upsertFolderDialogVisible);
-        } }, 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.LabelComponent, i9.CardComponent, i9.CardBodyComponent, i9.CardTitleDirective, i9.CardSubtitleDirective, i10.EntityFormDialogComponent], 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-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}\n\n.breadcrumb-icon[_ngcontent-%COMP%] {\n    cursor: pointer;\n}\n.breacrumb-icon[_ngcontent-%COMP%]:hover {\n    color: var(--primary-color);\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, \n  .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%], \n.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}"] });
+        } }, dependencies: [i2.NgClass, i2.NgIf, i3.GridComponent, i3.DataBindingDirective, i3.ColumnComponent, i3.CellTemplateDirective, i4.DialogComponent, i4.DialogActionsComponent, i5.LoaderComponent, i6.ButtonGroupComponent, i6.ButtonComponent, i6.DropDownButtonComponent, i6.ChipComponent, i7.TextAreaComponent, i7.TextBoxComponent, i7.TextBoxPrefixTemplateDirective, i7.FormFieldComponent, i8.LabelComponent, i9.CardComponent, i9.CardBodyComponent, i10.EntityFormDialogComponent], styles: ["\n\n\n\n\n.generic-browser-list-container[_ngcontent-%COMP%] {\n    @extend .mj-page-container;\n}\n\n\n\n.title-wrapper[_ngcontent-%COMP%] {\n    @extend .mj-toolbar;\n    margin-bottom: 20px;\n}\n\n.title-flex-display[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 15px;\n}\n\n.title-folder[_ngcontent-%COMP%] {\n    width: 44px;\n    height: 44px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    border-radius: var(--border-radius);\n    transition: var(--transition-time);\n    color: var(--mj-blue);\n}\n\n.title-folder[_ngcontent-%COMP%]:hover {\n    background: var(--gray-600);\n    color: var(--navy);\n}\n\n.title-wrapper[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n    @extend .mj-toolbar-title;\n    margin: 0;\n    font-size: 1.5rem;\n    font-weight: 600;\n    color: var(--navy);\n}\n\n\n\n.title-wrapper[_ngcontent-%COMP%]:last-child {\n    border-bottom: none;\n    padding-bottom: 0;\n    margin-bottom: 30px;\n}\n\n.search[_ngcontent-%COMP%] {\n    @extend .mj-search;\n    max-width: 360px;\n}\n\n.filter-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.btn-cmn[_ngcontent-%COMP%] {\n    @extend .mj-btn-icon-only;\n    \n    &.active {\n        background: var(--mj-blue);\n        color: var(--white-color);\n        border-color: var(--mj-blue);\n    }\n}\n\n\n\n  .title-wrapper .k-dropdown-button .k-button {\n    @extend .mj-btn-primary;\n    \n    .k-button-text {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n    }\n}\n\n\n\n.main-area[_ngcontent-%COMP%] {\n    position: relative;\n}\n\n.main-area[_ngcontent-%COMP%]   kendo-loader[_ngcontent-%COMP%] {\n    @extend .mj-loading;\n}\n\n\n\n.nav-container[_ngcontent-%COMP%] {\n    @extend .mj-grid-responsive;\n}\n\n.nav-item[_ngcontent-%COMP%] {\n    @extend .mj-card;\n    @extend .mj-grid-item;\n    position: relative;\n}\n\n.nav-item-icon[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: center;\n    margin-bottom: 16px;\n    \n    i, span {\n        font-size: 3rem;\n        color: var(--mj-blue);\n        transition: var(--transition-time);\n    }\n}\n\n.nav-item-content[_ngcontent-%COMP%] {\n    @extend .mj-card-body;\n    text-align: center;\n    padding-top: 0;\n}\n\n.nav-item-title[_ngcontent-%COMP%] {\n    margin: 0 0 8px 0;\n    font-size: 1.25rem;\n    font-weight: 600;\n    color: var(--navy);\n    cursor: pointer;\n    transition: var(--transition-time);\n}\n\n.nav-item-title[_ngcontent-%COMP%]:hover {\n    color: var(--mj-blue);\n    text-decoration: underline;\n}\n\n.nav-item-subtitle[_ngcontent-%COMP%] {\n    margin: 0 0 16px 0;\n    font-size: 0.9rem;\n    color: var(--gray-800);\n    line-height: 1.4;\n    display: -webkit-box;\n    -webkit-line-clamp: 3;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n}\n\n.nav-item-edit[_ngcontent-%COMP%] {\n    @extend .mj-card-actions;\n    position: static;\n    opacity: 1;\n    justify-content: center;\n    margin-top: 12px;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover   .nav-item-edit[_ngcontent-%COMP%] {\n    opacity: 1;\n}\n\n\n\n.list-btn[_ngcontent-%COMP%] {\n    @extend .mj-btn-icon-only;\n    @extend .mj-btn-sm;\n    \n    &:hover {\n        color: var(--white-color);\n        background: var(--mj-blue);\n        border-color: var(--mj-blue);\n    }\n}\n\n\n\n.nav-item[_ngcontent-%COMP%]:hover {\n    .nav-item-icon i,\n    .nav-item-icon span {\n        color: var(--navy);\n        transform: scale(1.1);\n    }\n    \n    .nav-item-title {\n        color: var(--mj-blue);\n    }\n}\n\n\n\n.kendo-grid[_ngcontent-%COMP%] {\n    border-radius: var(--border-radius);\n    overflow: hidden;\n    box-shadow: var(--shadow);\n}\n\n.grid-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    justify-content: center;\n}\n\n\n\n.dialog-wrapper[_ngcontent-%COMP%] {\n    .k-window-content {\n        padding: 0;\n    }\n}\n\n.dialog-wrapper[_ngcontent-%COMP%]   .k-window-title[_ngcontent-%COMP%] {\n    font-size: 1.5rem;\n    font-weight: 600;\n    color: var(--navy);\n    margin: 0;\n}\n\n.dialog-wrapper[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    font-size: 1rem;\n    color: var(--gray-900);\n    line-height: 1.5;\n    margin: 0;\n}\n\n.popup-actions-btn[_ngcontent-%COMP%] {\n    @extend .mj-card-footer;\n    gap: 12px;\n}\n\n.popup-actions-btn[_ngcontent-%COMP%]   .cancel-btn[_ngcontent-%COMP%] {\n    @extend .mj-btn-primary;\n    flex: 1;\n}\n\n.popup-actions-btn[_ngcontent-%COMP%]   .yes-btn[_ngcontent-%COMP%] {\n    @extend .mj-btn-secondary;\n    flex: 1;\n}\n\n\n\n.dialog-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.dialog-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%]   kendo-label[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    \n    .k-label {\n        color: var(--navy);\n        font-size: 14px;\n        font-weight: 500;\n    }\n}\n\n.dialog-wrapper[_ngcontent-%COMP%]   kendo-textbox[_ngcontent-%COMP%] {\n    width: 100%;\n    \n    .k-input {\n        border-radius: var(--border-radius);\n        border: 1px solid var(--gray-700);\n        padding: 10px 12px;\n        font-size: 16px;\n        transition: var(--transition-time);\n        \n        &:focus {\n            border-color: var(--mj-blue);\n            box-shadow: 0 0 0 2px rgba(0, 118, 182, 0.2);\n        }\n    }\n}\n\n\n\n.breadcrumb-wrap[_ngcontent-%COMP%] {\n    @extend .mj-breadcrumb;\n}\n\n.breadcrumb-icon[_ngcontent-%COMP%]:hover {\n    color: var(--mj-blue);\n}\n\n\n\n  .k-menu-popup {\n    background: var(--white-color);\n    border-radius: var(--border-radius);\n    box-shadow: var(--shadow);\n    border: 1px solid var(--gray-700);\n    padding: 8px 0;\n}\n\n  .k-menu-popup .k-menu-link {\n    padding: 10px 16px;\n    color: var(--navy);\n    transition: var(--transition-time);\n    border-radius: 0;\n}\n\n  .k-menu-popup .k-menu-link:hover {\n    background: var(--gray-600);\n    color: var(--mj-blue);\n}\n\n\n\n.margin-left-small[_ngcontent-%COMP%] {\n    margin-left: 10px;\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\n\n.card-wrapper[_ngcontent-%COMP%] {\n    min-width: 280px;\n    min-height: 200px;\n}\n\n\n\n  .card-header-entity .title-wrap h1 {\n    @extend .mj-header-title;\n    font-size: 2.25rem !important;\n    line-height: 1.2 !important;\n    color: var(--navy) !important;\n    margin: 0 !important;\n}\n\n  .card-header-entity .add-item .k-button {\n    @extend .mj-btn-primary;\n}\n\n  .card-header-entity .add-item .k-button:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 8px rgba(0, 118, 182, 0.3);\n}\n\n\n\n\n\n\n@media (max-width: 768px) {\n    .title-wrapper[_ngcontent-%COMP%] {\n        flex-direction: column;\n        align-items: stretch;\n        gap: 15px;\n    }\n    \n    .filter-wrapper[_ngcontent-%COMP%] {\n        justify-content: space-between;\n    }\n    \n    .search[_ngcontent-%COMP%] {\n        max-width: none;\n    }\n}\n\n@media (max-width: 480px) {\n    .title-flex-display[_ngcontent-%COMP%] {\n        gap: 10px;\n    }\n    \n    .filter-wrapper[_ngcontent-%COMP%] {\n        flex-wrap: wrap;\n        gap: 8px;\n    }\n}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ResourceBrowserComponent, [{
         type: Component,
-        args: [{ selector: 'mj-resource-browser', 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(CurrentCategoryID){\n          <span title=\"Parent\" class=\"title-folder fa-solid fa-arrow-left fa-2xl breadcrumb-icon\" (click)=\"goToParent()\"></span> \n          <span title=\"Folder\" class=\"title-folder fa-regular fa-folder fa-2xl\"></span>\n        }\n        <h4>{{Title}}</h4>\n      </div>\n      @if(ItemOptions.length > 0){\n        <kendo-dropdownbutton \n          class=\"custom-dropdwn\" \n          (itemClick)=\"onDropdownItemClick($event)\" \n          [data]=\"ItemOptions\" \n          textField=\"Text\"\n          themeColor=\"info\">\n            <span class=\"fa-solid fa-plus\"></span>\n              Create New\n        </kendo-dropdownbutton> \n      }\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('List')\" class=\"cursor-pointer grid-btn btn-cmn\">\n          <span class=\"fa-solid fa-bars\"></span>\n        </button>\n        <button kendobutton (click)=\"changeViewMode('Tile')\" 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      @if (IsLoading) {\n        <kendo-loader type=\"converging-spinner\"></kendo-loader>\n      }\n      @else {\n        @if(DisplayMode === 'List'){\n          <kendo-grid (cellClick)=\"onCellItemClicked($event)\" [kendoGridBinding]=\"Items\">\n            <kendo-grid-column field=\"Name\" title=\"Name\"></kendo-grid-column>\n            <kendo-grid-column field=\"Description\" title=\"Description\"></kendo-grid-column>\n            <kendo-grid-column field=\"Type\" title=\"Type\"></kendo-grid-column>\n            <kendo-grid-column title=\"\">\n              <ng-template kendoGridCellTemplate let-dataItem>\n                <div class=\"grid-wrapper\">\n                  @if(EnableItemEdit && (!dataItem.IsLink || dataItem.LinkPermissionLevel === 'Owner' || dataItem.LinkPermissionLevel === 'Edit')) {\n                    <button class=\"list-btn\" (click)=\"editItem(dataItem)\">\n                      <span class=\"fa-regular fa-pen-to-square\"></span>\n                    </button>\n                  }\n                  @if(EnableItemDelete && (!dataItem.IsLike || dataItem.LinkPermissionLevel === 'Owner')) {\n                    <button class=\"list-btn\" (click)=\"deleteItem(dataItem)\">\n                      <span class=\"fa-regular fa-trash-can\"></span>\n                    </button>  \n                  }\n                  @if(EnableRemoveLink && dataItem.IsLink) {\n                    <button (click)=\"unlinkItem(dataItem)\" class=\"list-btn\" title=\"Remove Link to Shared Item\" >\n                      <span class=\"fa-solid fa-link-slash\" style=\"color: rgb(19, 92, 201);\"></span>\n                    </button>                    \n                  }\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(EnableItemEdit && (!item.IsLink || item.LinkPermissionLevel === 'Owner' || item.LinkPermissionLevel === 'Edit')) {\n                    <button (click)=\"editItem(item)\" class=\"list-btn\" title=\"Edit Item\">\n                      <span class=\"fa-regular fa-pen-to-square\"></span>\n                    </button>\n                  }\n                  @if(EnableItemDelete && (!item.IsLink || item.LinkPermissionLevel === 'Owner') ) {\n                    <button (click)=\"deleteItem(item)\" class=\"list-btn\" title=\"Delete Item\">\n                      <span class=\"fa-regular fa-trash-can\"></span>\n                    </button>                    \n                  }\n                  @else if (EnableRemoveLink && item.IsLink) {\n                    <button (click)=\"unlinkItem(item)\" class=\"list-btn\" title=\"Remove Link to Shared Item\" >\n                      <span class=\"fa-solid fa-link-slash\" style=\"color: rgb(19, 92, 201);\"></span>\n                    </button>                    \n                  }\n                </div>\n                <kendo-card-body (click)=\"itemClick(item)\">\n                    @if(item.IsLink) {\n                      <i [title]=\"item.Name + '(Shared)'\" [ngClass]=\"getIconForResourceType(item)\" style=\"color: rgb(19, 92, 201);\"></i>\n                    }\n                    @else {\n                      <span [title]=\"item.Name\" [ngClass]=\"getIconForResourceType(item)\"></span>\n                    }\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 {{(selectedItem?.IsLink && selectedItem?.LinkPermissionLevel === 'Owner') || !selectedItem?.IsLink ? 'delete' : 'unlink'}} <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\n      </button>\n      <button class=\"yes-btn\" (click)=\"onConfirmDeleteItem(false)\" kendoButton fillMode=\"outline\" themeColor=\"info\">\n        No \n      </button>\n    </kendo-dialog-actions>\n  </kendo-dialog>\n\n  <kendo-dialog \n    [title]=\"selectedFolder ? 'Edit Folder' : 'Create new folder'\" \n    *ngIf=\"upsertFolderDialogVisible\" \n    (close)=\"toggleUpsertFolderView(false, false)\"\n    [minWidth]=\"250\"\n    [width]=\"450\"\n    class=\"dialog-wrapper\"\n  >\n  <div class=\"search\">\n    <kendo-label text=\"Name\">\n      <kendo-textbox [value]=\"upsertNewFolderName\" placeholder=\"Enter a folder name\" (valueChange)=\"onUpsertFolderNameKeyup($event)\"/>\n    </kendo-label>\n  </div>\n  <br>\n  <div class=\"search\">\n    <kendo-label text=\"Description\">\n      <kendo-textbox [value]=\"upsertNewFolderDescription\" placeholder=\"Enter a Description\" (valueChange)=\"onUpsertFolderDescriptionKeyup($event)\"/>\n    </kendo-label>\n  </div>\n  <kendo-dialog-actions class=\"popup-actions-btn\">\n    @if(selectedFolder){\n      <button class=\"cancel-btn\" (click)=\"updateFolder()\" kendoButton themeColor=\"info\">\n        Update\n      </button>\n    }\n    @else {\n      <button class=\"cancel-btn\" (click)=\"createFolder()\" kendoButton themeColor=\"info\">\n        Create\n      </button>\n    }\n    <button  class=\"yes-btn\" (click)=\"toggleUpsertFolderView(false, false)\" kendoButton fillMode=\"outline\" themeColor=\"info\">\n      Cancel\n    </button>\n  </kendo-dialog-actions>\n  </kendo-dialog>\n  <mj-entity-form-dialog\n    #entityFormDialog\n    Mode=\"complete\"\n  >\n  </mj-entity-form-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-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\n.breadcrumb-icon {\n    cursor: pointer;\n}\n.breacrumb-icon:hover {\n    color: var(--primary-color);\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: 'mj-resource-browser', template: "<div class=\"mj-page-container\">\n    <!-- Header Section -->\n    <div class=\"mj-header\">\n      <div class=\"mj-header-title\">\n        @if(CurrentCategoryID) {\n          <span title=\"Back to Parent\" class=\"mj-btn-icon-only\" (click)=\"goToParent()\">\n            <span class=\"fa-solid fa-arrow-left\"></span>\n          </span>\n        }\n        <div class=\"mj-header-icon\">\n          <span class=\"fa-regular fa-folder\"></span>\n        </div>\n        <div>\n          <h1>{{Title}}</h1>\n          @if(CurrentCategoryID) {\n            <div class=\"mj-header-subtitle\">\n              <span class=\"fa-solid fa-folder-open\"></span>\n              Current Folder\n            </div>\n          }\n        </div>\n      </div>\n      \n      <div class=\"mj-header-actions\">\n        @if(ItemOptions.length > 0) {\n          <kendo-dropdownbutton \n            (itemClick)=\"onDropdownItemClick($event)\" \n            [data]=\"ItemOptions\" \n            textField=\"Text\"\n            themeColor=\"primary\"\n            rounded=\"medium\">\n            <span class=\"button-content\">\n              <i class=\"fas fa-plus\"></i>\n              Create New\n            </span>\n          </kendo-dropdownbutton> \n        }\n      </div>\n    </div>\n\n    <!-- Toolbar Section -->\n    <div class=\"mj-toolbar\">\n      <div class=\"mj-search\">\n        <kendo-textbox \n          type=\"text\" \n          #searchInput \n          placeholder=\"Search {{Title}}...\" \n          (keyup)=\"onKeyup(searchInput.value)\"\n          [clearButton]=\"true\"\n          size=\"medium\"\n          rounded=\"medium\"\n          fillMode=\"outline\">\n          <ng-template kendoTextBoxPrefixTemplate>\n            <i class=\"fas fa-search search-prefix-icon\"></i>\n          </ng-template>\n        </kendo-textbox>\n      </div>\n      \n      <div class=\"mj-toolbar-actions\">\n        <kendo-buttongroup>\n          <button kendoButton \n                  [toggleable]=\"true\" \n                  [selected]=\"DisplayMode === 'List'\"\n                  (click)=\"changeViewMode('List')\" \n                  title=\"Table View\"\n                  fillMode=\"outline\"\n                  themeColor=\"base\">\n            <span class=\"fa-solid fa-table\"></span>\n          </button>\n          <button kendoButton \n                  [toggleable]=\"true\" \n                  [selected]=\"DisplayMode === 'Tile'\"\n                  (click)=\"changeViewMode('Tile')\" \n                  title=\"Card View\"\n                  fillMode=\"outline\"\n                  themeColor=\"base\">\n            <span class=\"fa-solid fa-grip\"></span>\n          </button>\n        </kendo-buttongroup>\n      </div>\n    </div>\n\n    <!-- Main Content Area -->\n    <div class=\"main-area\">\n      <!-- Loading State -->\n      @if (IsLoading) {\n        <div class=\"mj-loading\">\n          <kendo-loader type=\"converging-spinner\" themeColor=\"primary\" size=\"large\"></kendo-loader>\n        </div>\n      }\n      @else {\n        <!-- List View -->\n        @if(DisplayMode === 'List') {\n          <kendo-grid \n            (cellClick)=\"onCellItemClicked($event)\" \n            [kendoGridBinding]=\"Items\"\n            class=\"mj-grid-table\">\n            <kendo-grid-column field=\"Name\" title=\"Name\">\n              <ng-template kendoGridCellTemplate let-dataItem>\n                <div class=\"mj-grid-name-cell\">\n                  <span class=\"mj-grid-name\">{{ dataItem.Name }}</span>\n                </div>\n              </ng-template>\n            </kendo-grid-column>\n            <kendo-grid-column field=\"Description\" title=\"Description\"></kendo-grid-column>\n            <kendo-grid-column field=\"Type\" title=\"Type\">\n              <ng-template kendoGridCellTemplate let-dataItem>\n                <kendo-chip \n                  [label]=\"dataItem.Type\" \n                  rounded=\"full\"\n                  [themeColor]=\"dataItem.Type === 'Folder' ? 'info' : 'base'\"\n                  size=\"small\">\n                </kendo-chip>\n              </ng-template>\n            </kendo-grid-column>\n            <kendo-grid-column title=\"Actions\" [width]=\"150\">\n              <ng-template kendoGridCellTemplate let-dataItem>\n                <div class=\"mj-toolbar-actions\">\n                  @if(EnableItemEdit && (!dataItem.IsLink || dataItem.LinkPermissionLevel === 'Owner' || dataItem.LinkPermissionLevel === 'Edit')) {\n                    <button class=\"mj-btn-icon-only mj-btn-sm\" (click)=\"editItem(dataItem)\" title=\"Edit Item\">\n                      <span class=\"fa-regular fa-pen-to-square\"></span>\n                    </button>\n                  }\n                  @if(EnableItemDelete && (!dataItem.IsLink || dataItem.LinkPermissionLevel === 'Owner')) {\n                    <button class=\"mj-btn-icon-only mj-btn-sm\" (click)=\"deleteItem(dataItem)\" title=\"Delete Item\">\n                      <span class=\"fa-regular fa-trash-can\"></span>\n                    </button>  \n                  }\n                  @if(EnableRemoveLink && dataItem.IsLink) {\n                    <button class=\"mj-btn-icon-only mj-btn-sm\" (click)=\"unlinkItem(dataItem)\" title=\"Remove Link\">\n                      <span class=\"fa-solid fa-link-slash\"></span>\n                    </button>                    \n                  }\n                </div>\n              </ng-template>\n            </kendo-grid-column>\n          </kendo-grid>\n        }\n        @else {\n          <!-- Card View -->\n          @if(Items.length === 0) {\n            <div class=\"mj-empty-state\">\n              <div class=\"mj-empty-icon\">\n                <span class=\"fa-regular fa-folder-open\"></span>\n              </div>\n              <h3>No {{Title}} Found</h3>\n              <p>There are no items to display in this category.</p>\n              @if(ItemOptions.length > 0) {\n                <kendo-button themeColor=\"primary\" rounded=\"medium\" (click)=\"onDropdownItemClick({Text: ItemOptions[0].Text})\">\n                  <span class=\"button-content\">\n                    <i class=\"fas fa-plus\"></i>\n                    Create Your First Item\n                  </span>\n                </kendo-button>\n              }\n            </div>\n          }\n          @else {\n            <div class=\"mj-grid-responsive\">\n              @for(item of Items; track item) {\n                <kendo-card class=\"mj-kendo-icon-card mj-kendo-icon-card-clickable\" (click)=\"itemClick(item)\">\n                  <!-- Card Actions -->\n                  <div class=\"mj-card-actions\">\n                    @if(EnableItemEdit && (!item.IsLink || item.LinkPermissionLevel === 'Owner' || item.LinkPermissionLevel === 'Edit')) {\n                      <button class=\"mj-btn-icon-only mj-btn-sm\" (click)=\"editItem(item); $event.stopPropagation()\" title=\"Edit Item\">\n                        <span class=\"fa-regular fa-pen-to-square\"></span>\n                      </button>\n                    }\n                    @if(EnableItemDelete && (!item.IsLink || item.LinkPermissionLevel === 'Owner')) {\n                      <button class=\"mj-btn-icon-only mj-btn-sm\" (click)=\"deleteItem(item); $event.stopPropagation()\" title=\"Delete Item\">\n                        <span class=\"fa-regular fa-trash-can\"></span>\n                      </button>                    \n                    }\n                    @else if (EnableRemoveLink && item.IsLink) {\n                      <button class=\"mj-btn-icon-only mj-btn-sm\" (click)=\"unlinkItem(item); $event.stopPropagation()\" title=\"Remove Link\">\n                        <span class=\"fa-solid fa-link-slash\"></span>\n                      </button>                    \n                    }\n                  </div>\n                  \n                  <!-- Card Body -->\n                  <kendo-card-body>\n                    @if(item.IsLink) {\n                      <div class=\"mj-icon-wrapper-linked\" [title]=\"item.Name + ' (Shared)'\">\n                        <span [ngClass]=\"getIconForResourceType(item)\" class=\"mj-card-icon-large\"></span>\n                        <span class=\"fa-solid fa-link mj-link-indicator\"></span>\n                      </div>\n                    }\n                    @else {\n                      <span [ngClass]=\"getIconForResourceType(item)\" class=\"mj-card-icon-large\" [title]=\"item.Name\"></span>\n                    }\n                    \n                    <h3>{{ item.Name }}</h3>\n                    <p>{{ item.Description || 'No description available' }}</p>\n                    \n                    <!-- Type chip -->\n                    <kendo-chip \n                      [label]=\"item.Type\" \n                      rounded=\"full\"\n                      [themeColor]=\"item.Type === 'Folder' ? 'info' : 'base'\"\n                      size=\"small\">\n                    </kendo-chip>\n                  </kendo-card-body>\n                </kendo-card>\n              }\n            </div>\n          }\n        }\n      }\n</div>\n\n  <!-- Delete Confirmation Dialog -->\n  <kendo-dialog \n    [minWidth]=\"400\"\n    [width]=\"500\"\n    class=\"mj-dialog-confirm\" \n    title=\"Confirm Action\" \n    *ngIf=\"deleteDialogOpened\" \n    (close)=\"onConfirmDeleteItem(false)\">\n    \n    <div class=\"mj-dialog-content\">\n      <div class=\"mj-dialog-icon\">\n        <span class=\"fa-solid fa-triangle-exclamation\"></span>\n      </div>\n      <p>\n        Are you sure you want to \n        <strong>{{(selectedItem?.IsLink && selectedItem?.LinkPermissionLevel === 'Owner') || !selectedItem?.IsLink ? 'delete' : 'unlink'}}</strong> \n        <strong>{{selectedItem?.Name}}</strong>?\n      </p>\n      @if((selectedItem?.IsLink && selectedItem?.LinkPermissionLevel === 'Owner') || !selectedItem?.IsLink) {\n        <p class=\"mj-dialog-warning\">This action cannot be undone.</p>\n      }\n    </div>\n    \n    <kendo-dialog-actions class=\"mj-dialog-actions\">\n      <kendo-button fillMode=\"outline\" rounded=\"medium\" (click)=\"onConfirmDeleteItem(false)\">\n        Cancel\n      </kendo-button>\n      <kendo-button themeColor=\"error\" rounded=\"medium\" (click)=\"onConfirmDeleteItem(true)\">\n        <span class=\"button-content\">\n          <i [ngClass]=\"(selectedItem?.IsLink && selectedItem?.LinkPermissionLevel === 'Owner') || !selectedItem?.IsLink ? 'fas fa-trash' : 'fas fa-link-slash'\"></i>\n          {{(selectedItem?.IsLink && selectedItem?.LinkPermissionLevel === 'Owner') || !selectedItem?.IsLink ? 'Delete' : 'Unlink'}}\n        </span>\n      </kendo-button>\n    </kendo-dialog-actions>\n  </kendo-dialog>\n\n  <!-- Folder Creation/Edit Dialog -->\n  <kendo-dialog \n    [title]=\"selectedFolder ? 'Edit Folder' : 'Create New Folder'\" \n    *ngIf=\"upsertFolderDialogVisible\" \n    (close)=\"toggleUpsertFolderView(false, false)\"\n    [minWidth]=\"400\"\n    [width]=\"500\"\n    class=\"mj-dialog-form\">\n    \n    <div class=\"mj-dialog-content\">\n      <kendo-formfield orientation=\"vertical\" class=\"mb-3\">\n        <kendo-label text=\"Folder Name\"></kendo-label>\n        <kendo-textbox \n          [value]=\"upsertNewFolderName\" \n          placeholder=\"Enter folder name...\" \n          (valueChange)=\"onUpsertFolderNameKeyup($event)\"\n          rounded=\"medium\"\n          fillMode=\"outline\"\n          [clearButton]=\"true\">\n          <ng-template kendoTextBoxPrefixTemplate>\n            <i class=\"fas fa-folder search-prefix-icon\"></i>\n          </ng-template>\n        </kendo-textbox>\n      </kendo-formfield>\n      \n      <kendo-formfield orientation=\"vertical\">\n        <kendo-label text=\"Description\"></kendo-label>\n        <kendo-textarea \n          [value]=\"upsertNewFolderDescription\" \n          placeholder=\"Enter description (optional)...\" \n          (valueChange)=\"onUpsertFolderDescriptionKeyup($event)\"\n          rounded=\"medium\"\n          fillMode=\"outline\"\n          [rows]=\"3\">\n        </kendo-textarea>\n      </kendo-formfield>\n    </div>\n    \n    <kendo-dialog-actions class=\"mj-dialog-actions\">\n      <kendo-button fillMode=\"outline\" rounded=\"medium\" (click)=\"toggleUpsertFolderView(false, false)\">\n        Cancel\n      </kendo-button>\n      @if(selectedFolder) {\n        <kendo-button themeColor=\"primary\" rounded=\"medium\" (click)=\"updateFolder()\">\n          <span class=\"button-content\">\n            <i class=\"fas fa-save\"></i>\n            Update Folder\n          </span>\n        </kendo-button>\n      }\n      @else {\n        <kendo-button themeColor=\"primary\" rounded=\"medium\" (click)=\"createFolder()\">\n          <span class=\"button-content\">\n            <i class=\"fas fa-folder-plus\"></i>\n            Create Folder\n          </span>\n        </kendo-button>\n      }\n    </kendo-dialog-actions>\n  </kendo-dialog>\n\n  <!-- Entity Form Dialog -->\n  <mj-entity-form-dialog\n    #entityFormDialog\n    Mode=\"complete\">\n  </mj-entity-form-dialog>\n</div>", styles: ["/* ===================================\n   RESOURCE BROWSER COMPONENT - STANDARDIZED\n   =================================== */\n\n.generic-browser-list-container {\n    @extend .mj-page-container;\n}\n\n/* Header Section */\n.title-wrapper {\n    @extend .mj-toolbar;\n    margin-bottom: 20px;\n}\n\n.title-flex-display {\n    display: flex;\n    align-items: center;\n    gap: 15px;\n}\n\n.title-folder {\n    width: 44px;\n    height: 44px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    border-radius: var(--border-radius);\n    transition: var(--transition-time);\n    color: var(--mj-blue);\n}\n\n.title-folder:hover {\n    background: var(--gray-600);\n    color: var(--navy);\n}\n\n.title-wrapper h4 {\n    @extend .mj-toolbar-title;\n    margin: 0;\n    font-size: 1.5rem;\n    font-weight: 600;\n    color: var(--navy);\n}\n\n/* Search and Filter Section */\n.title-wrapper:last-child {\n    border-bottom: none;\n    padding-bottom: 0;\n    margin-bottom: 30px;\n}\n\n.search {\n    @extend .mj-search;\n    max-width: 360px;\n}\n\n.filter-wrapper {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.btn-cmn {\n    @extend .mj-btn-icon-only;\n    \n    &.active {\n        background: var(--mj-blue);\n        color: var(--white-color);\n        border-color: var(--mj-blue);\n    }\n}\n\n/* Create New Dropdown */\n::ng-deep .title-wrapper .k-dropdown-button .k-button {\n    @extend .mj-btn-primary;\n    \n    .k-button-text {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n    }\n}\n\n/* Main Content Area */\n.main-area {\n    position: relative;\n}\n\n.main-area kendo-loader {\n    @extend .mj-loading;\n}\n\n/* Navigation Container (Tile View) */\n.nav-container {\n    @extend .mj-grid-responsive;\n}\n\n.nav-item {\n    @extend .mj-card;\n    @extend .mj-grid-item;\n    position: relative;\n}\n\n.nav-item-icon {\n    display: flex;\n    justify-content: center;\n    margin-bottom: 16px;\n    \n    i, span {\n        font-size: 3rem;\n        color: var(--mj-blue);\n        transition: var(--transition-time);\n    }\n}\n\n.nav-item-content {\n    @extend .mj-card-body;\n    text-align: center;\n    padding-top: 0;\n}\n\n.nav-item-title {\n    margin: 0 0 8px 0;\n    font-size: 1.25rem;\n    font-weight: 600;\n    color: var(--navy);\n    cursor: pointer;\n    transition: var(--transition-time);\n}\n\n.nav-item-title:hover {\n    color: var(--mj-blue);\n    text-decoration: underline;\n}\n\n.nav-item-subtitle {\n    margin: 0 0 16px 0;\n    font-size: 0.9rem;\n    color: var(--gray-800);\n    line-height: 1.4;\n    display: -webkit-box;\n    -webkit-line-clamp: 3;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n}\n\n.nav-item-edit {\n    @extend .mj-card-actions;\n    position: static;\n    opacity: 1;\n    justify-content: center;\n    margin-top: 12px;\n}\n\n.nav-item:hover .nav-item-edit {\n    opacity: 1;\n}\n\n/* List Item Buttons */\n.list-btn {\n    @extend .mj-btn-icon-only;\n    @extend .mj-btn-sm;\n    \n    &:hover {\n        color: var(--white-color);\n        background: var(--mj-blue);\n        border-color: var(--mj-blue);\n    }\n}\n\n/* Card Hover Effects */\n.nav-item:hover {\n    .nav-item-icon i,\n    .nav-item-icon span {\n        color: var(--navy);\n        transform: scale(1.1);\n    }\n    \n    .nav-item-title {\n        color: var(--mj-blue);\n    }\n}\n\n/* Grid View Styles */\n.kendo-grid {\n    border-radius: var(--border-radius);\n    overflow: hidden;\n    box-shadow: var(--shadow);\n}\n\n.grid-wrapper {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    justify-content: center;\n}\n\n/* Dialog Styles */\n.dialog-wrapper {\n    .k-window-content {\n        padding: 0;\n    }\n}\n\n.dialog-wrapper .k-window-title {\n    font-size: 1.5rem;\n    font-weight: 600;\n    color: var(--navy);\n    margin: 0;\n}\n\n.dialog-wrapper p {\n    font-size: 1rem;\n    color: var(--gray-900);\n    line-height: 1.5;\n    margin: 0;\n}\n\n.popup-actions-btn {\n    @extend .mj-card-footer;\n    gap: 12px;\n}\n\n.popup-actions-btn .cancel-btn {\n    @extend .mj-btn-primary;\n    flex: 1;\n}\n\n.popup-actions-btn .yes-btn {\n    @extend .mj-btn-secondary;\n    flex: 1;\n}\n\n/* Form Styles */\n.dialog-wrapper .search {\n    margin-bottom: 20px;\n}\n\n.dialog-wrapper .search kendo-label {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    \n    .k-label {\n        color: var(--navy);\n        font-size: 14px;\n        font-weight: 500;\n    }\n}\n\n.dialog-wrapper kendo-textbox {\n    width: 100%;\n    \n    .k-input {\n        border-radius: var(--border-radius);\n        border: 1px solid var(--gray-700);\n        padding: 10px 12px;\n        font-size: 16px;\n        transition: var(--transition-time);\n        \n        &:focus {\n            border-color: var(--mj-blue);\n            box-shadow: 0 0 0 2px rgba(0, 118, 182, 0.2);\n        }\n    }\n}\n\n/* Breadcrumb */\n.breadcrumb-wrap {\n    @extend .mj-breadcrumb;\n}\n\n.breadcrumb-icon:hover {\n    color: var(--mj-blue);\n}\n\n/* Context Menu */\n::ng-deep .k-menu-popup {\n    background: var(--white-color);\n    border-radius: var(--border-radius);\n    box-shadow: var(--shadow);\n    border: 1px solid var(--gray-700);\n    padding: 8px 0;\n}\n\n::ng-deep .k-menu-popup .k-menu-link {\n    padding: 10px 16px;\n    color: var(--navy);\n    transition: var(--transition-time);\n    border-radius: 0;\n}\n\n::ng-deep .k-menu-popup .k-menu-link:hover {\n    background: var(--gray-600);\n    color: var(--mj-blue);\n}\n\n/* Utility Classes */\n.margin-left-small {\n    margin-left: 10px;\n}\n\n.padding-top-small {\n    padding-top: 10px;\n}\n\n.cursor-pointer {\n    cursor: pointer;\n}\n\n/* Card Wrapper Override for Legacy Support */\n.card-wrapper {\n    min-width: 280px;\n    min-height: 200px;\n}\n\n/* Legacy Card Header Overrides */\n::ng-deep .card-header-entity .title-wrap h1 {\n    @extend .mj-header-title;\n    font-size: 2.25rem !important;\n    line-height: 1.2 !important;\n    color: var(--navy) !important;\n    margin: 0 !important;\n}\n\n::ng-deep .card-header-entity .add-item .k-button {\n    @extend .mj-btn-primary;\n}\n\n::ng-deep .card-header-entity .add-item .k-button:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 8px rgba(0, 118, 182, 0.3);\n}\n\n/* ===================================\n   RESPONSIVE DESIGN\n   =================================== */\n\n@media (max-width: 768px) {\n    .title-wrapper {\n        flex-direction: column;\n        align-items: stretch;\n        gap: 15px;\n    }\n    \n    .filter-wrapper {\n        justify-content: space-between;\n    }\n    \n    .search {\n        max-width: none;\n    }\n}\n\n@media (max-width: 480px) {\n    .title-flex-display {\n        gap: 10px;\n    }\n    \n    .filter-wrapper {\n        flex-wrap: wrap;\n        gap: 8px;\n    }\n}"] }]
     }], () => [{ type: i1.SharedService }], { ResourceTypeName: [{
             type: Input,
             args: [{ required: true }]