@memberjunction/ng-base-forms 5.29.0 → 5.30.1

package/dist/lib/toolbar/form-toolbar.component.js

@@ -215,18 +215,18 @@ function MjFormToolbarComponent_Conditional_1_Conditional_11_Template(rf, ctx) {
     i0.ɵɵconditional(ctx_r1.DescendantTree.length > 0 ? 5 : -1);
 } }
 function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 55);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.OnClearFilter()); });
-    i0.ɵɵelement(1, "i", 56);
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 51);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.OnClearFilter()); });
+    i0.ɵɵelement(1, "i", 52);
     i0.ɵɵelementEnd();
 } }
 function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 45)(1, "input", 53);
-    i0.ɵɵlistener("input", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Template_input_input_1_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnFilterInput($event)); });
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 45)(1, "input", 49);
+    i0.ɵɵlistener("input", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Template_input_input_1_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnFilterInput($event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(2, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Conditional_2_Template, 2, 0, "button", 54);
+    i0.ɵɵconditionalCreate(2, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Conditional_2_Template, 2, 0, "button", 50);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
@@ -236,54 +236,68 @@ function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Templ
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.SearchFilter ? 2 : -1);
 } }
-function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r16 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 53);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnExpandAll()); });
+    i0.ɵɵelement(1, "i", 54);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "button", 55);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_2_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnCollapseAll()); });
+    i0.ɵɵelement(3, "i", 56);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("disabled", ctx_r1.ExpandedSectionCount >= ctx_r1.VisibleSectionCount);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("disabled", ctx_r1.ExpandedSectionCount === 0);
+} }
+function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r17 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 57);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnResetSectionOrder()); });
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnResetSectionOrder()); });
     i0.ɵɵelement(1, "i", 58);
     i0.ɵɵelementEnd();
 } }
-function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_4_Template(rf, ctx) { if (rf & 1) {
     const _r18 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 59);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_7_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnManageSections()); });
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnManageSections()); });
     i0.ɵɵelement(1, "i", 60);
     i0.ɵɵelementEnd();
 } }
+function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 61);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnToggleWidthMode()); });
+    i0.ɵɵelement(1, "i");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("title", ctx_r1.WidthMode === "centered" ? "Expand to full width" : "Center content");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.WidthMode === "centered" ? "fa-solid fa-arrows-left-right-to-line" : "fa-solid fa-compress");
+} }
 function MjFormToolbarComponent_Conditional_1_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 24);
     i0.ɵɵconditionalCreate(1, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_1_Template, 3, 4, "div", 45);
-    i0.ɵɵelementStart(2, "button", 46);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OnExpandAll()); });
-    i0.ɵɵelement(3, "i", 47);
+    i0.ɵɵconditionalCreate(2, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_2_Template, 4, 2);
+    i0.ɵɵconditionalCreate(3, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_3_Template, 2, 0, "button", 46);
+    i0.ɵɵconditionalCreate(4, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_4_Template, 2, 0, "button", 47);
+    i0.ɵɵconditionalCreate(5, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_5_Template, 2, 3, "button", 48);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "button", 48);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OnCollapseAll()); });
-    i0.ɵɵelement(5, "i", 49);
-    i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_6_Template, 2, 0, "button", 50);
-    i0.ɵɵconditionalCreate(7, MjFormToolbarComponent_Conditional_1_Conditional_13_Conditional_7_Template, 2, 0, "button", 51);
-    i0.ɵɵelementStart(8, "button", 52);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_1_Conditional_13_Template_button_click_8_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OnToggleWidthMode()); });
-    i0.ɵɵelement(9, "i");
-    i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.Config.ShowSectionFilter ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("disabled", ctx_r1.ExpandedSectionCount >= ctx_r1.VisibleSectionCount);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", ctx_r1.ExpandedSectionCount === 0);
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.HasCustomSectionOrder ? 6 : -1);
+    i0.ɵɵconditional(ctx_r1.Config.ShowExpandCollapseAllButtons ? 2 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.Config.ShowSectionManager ? 7 : -1);
+    i0.ɵɵconditional(ctx_r1.HasCustomSectionOrder ? 3 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("title", ctx_r1.WidthMode === "centered" ? "Expand to full width" : "Center content");
+    i0.ɵɵconditional(ctx_r1.Config.ShowSectionManager ? 4 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(ctx_r1.WidthMode === "centered" ? "fa-solid fa-arrows-left-right-to-line" : "fa-solid fa-compress");
+    i0.ɵɵconditional(ctx_r1.Config.ShowWidthToggle ? 5 : -1);
 } }
 function MjFormToolbarComponent_Conditional_1_Conditional_14_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0, 25);
@@ -304,7 +318,7 @@ function MjFormToolbarComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵconditionalCreate(10, MjFormToolbarComponent_Conditional_1_Conditional_10_Template, 1, 0, "div", 22);
     i0.ɵɵconditionalCreate(11, MjFormToolbarComponent_Conditional_1_Conditional_11_Template, 6, 2, "div", 23);
     i0.ɵɵelement(12, "div", 4);
-    i0.ɵɵconditionalCreate(13, MjFormToolbarComponent_Conditional_1_Conditional_13_Template, 10, 8, "div", 24);
+    i0.ɵɵconditionalCreate(13, MjFormToolbarComponent_Conditional_1_Conditional_13_Template, 6, 5, "div", 24);
     i0.ɵɵconditionalCreate(14, MjFormToolbarComponent_Conditional_1_Conditional_14_Template, 1, 1, "ng-container", 25);
     i0.ɵɵprojection(15);
     i0.ɵɵelementEnd();
@@ -335,32 +349,32 @@ function MjFormToolbarComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵconditional(ctx_r1.AdditionalActionsTemplate ? 14 : -1);
 } }
 function MjFormToolbarComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 61);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardCancel()); });
-    i0.ɵɵelementStart(1, "div", 62);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r19); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(2, "div", 63)(3, "h3");
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 62);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardCancel()); });
+    i0.ɵɵelementStart(1, "div", 63);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r20); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(2, "div", 64)(3, "h3");
     i0.ɵɵtext(4, "Discard Changes?");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "button", 64);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardCancel()); });
-    i0.ɵɵelement(6, "i", 56);
+    i0.ɵɵelementStart(5, "button", 65);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardCancel()); });
+    i0.ɵɵelement(6, "i", 52);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 65)(8, "p");
+    i0.ɵɵelementStart(7, "div", 66)(8, "p");
     i0.ɵɵtext(9, "You have ");
     i0.ɵɵelementStart(10, "strong");
     i0.ɵɵtext(11);
     i0.ɵɵelementEnd();
     i0.ɵɵtext(12);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(13, "div", 66)(14, "button", 67);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardConfirm()); });
+    i0.ɵɵelementStart(13, "div", 67)(14, "button", 68);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardConfirm()); });
     i0.ɵɵelement(15, "i", 10);
     i0.ɵɵtext(16, " Discard Changes ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(17, "button", 68);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardCancel()); });
+    i0.ɵɵelementStart(17, "button", 69);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_2_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDiscardCancel()); });
     i0.ɵɵtext(18, " Keep Editing ");
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -371,99 +385,99 @@ function MjFormToolbarComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate2(" unsaved change", ctx_r1.DirtyFieldDisplayNames.length === 1 ? "" : "s", ". Are you sure you want to discard ", ctx_r1.DirtyFieldDisplayNames.length === 1 ? "it" : "them", "?");
 } }
 function MjFormToolbarComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r20 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 61);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteCancel()); });
-    i0.ɵɵelementStart(1, "div", 62);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r20); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(2, "div", 63)(3, "h3");
+    const _r21 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 62);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteCancel()); });
+    i0.ɵɵelementStart(1, "div", 63);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r21); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(2, "div", 64)(3, "h3");
     i0.ɵɵtext(4, "Confirm Deletion");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "button", 64);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteCancel()); });
-    i0.ɵɵelement(6, "i", 56);
+    i0.ɵɵelementStart(5, "button", 65);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteCancel()); });
+    i0.ɵɵelement(6, "i", 52);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 65)(8, "p");
+    i0.ɵɵelementStart(7, "div", 66)(8, "p");
     i0.ɵɵtext(9, "Are you sure you want to delete this record? This action cannot be undone.");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(10, "div", 66)(11, "button", 67);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteConfirm()); });
-    i0.ɵɵelement(12, "i", 69);
+    i0.ɵɵelementStart(10, "div", 67)(11, "button", 68);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteConfirm()); });
+    i0.ɵɵelement(12, "i", 70);
     i0.ɵɵtext(13, " Delete ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(14, "button", 68);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteCancel()); });
+    i0.ɵɵelementStart(14, "button", 69);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_Conditional_3_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDeleteCancel()); });
     i0.ɵɵtext(15, " Cancel ");
     i0.ɵɵelementEnd()()()();
 } }
 function MjFormToolbarComponent_ng_template_4_Conditional_0_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0, 40);
 } if (rf & 2) {
-    const items_r22 = i0.ɵɵnextContext(2).items;
+    const items_r23 = i0.ɵɵnextContext(2).items;
     i0.ɵɵnextContext();
     const descendantTreeTpl_r13 = i0.ɵɵreference(5);
-    i0.ɵɵproperty("ngTemplateOutlet", descendantTreeTpl_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, items_r22[0].Children));
+    i0.ɵɵproperty("ngTemplateOutlet", descendantTreeTpl_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, items_r23[0].Children));
 } }
 function MjFormToolbarComponent_ng_template_4_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    const _r21 = i0.ɵɵgetCurrentView();
+    const _r22 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "span", 43);
     i0.ɵɵelement(1, "i", 44);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "a", 71);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_ng_template_4_Conditional_0_Template_a_click_2_listener($event) { i0.ɵɵrestoreView(_r21); const items_r22 = i0.ɵɵnextContext().items; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDescendantBadgeClick(items_r22[0].EntityName, $event)); });
-    i0.ɵɵelement(3, "i", 72);
+    i0.ɵɵelementStart(2, "a", 72);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_ng_template_4_Conditional_0_Template_a_click_2_listener($event) { i0.ɵɵrestoreView(_r22); const items_r23 = i0.ɵɵnextContext().items; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDescendantBadgeClick(items_r23[0].EntityName, $event)); });
+    i0.ɵɵelement(3, "i", 73);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd();
     i0.ɵɵconditionalCreate(5, MjFormToolbarComponent_ng_template_4_Conditional_0_Conditional_5_Template, 1, 4, "ng-container", 40);
 } if (rf & 2) {
-    const items_r22 = i0.ɵɵnextContext().items;
+    const items_r23 = i0.ɵɵnextContext().items;
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("title", "Navigate to: " + items_r22[0].EntityName);
+    i0.ɵɵproperty("title", "Navigate to: " + items_r23[0].EntityName);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", items_r22[0].EntityName, " ");
+    i0.ɵɵtextInterpolate1(" ", items_r23[0].EntityName, " ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(items_r22[0].Children.length > 0 ? 5 : -1);
+    i0.ɵɵconditional(items_r23[0].Children.length > 0 ? 5 : -1);
 } }
 function MjFormToolbarComponent_ng_template_4_Conditional_1_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0, 40);
 } if (rf & 2) {
-    const item_r24 = i0.ɵɵnextContext().$implicit;
+    const item_r25 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵnextContext(3);
     const descendantTreeTpl_r13 = i0.ɵɵreference(5);
-    i0.ɵɵproperty("ngTemplateOutlet", descendantTreeTpl_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, item_r24.Children));
+    i0.ɵɵproperty("ngTemplateOutlet", descendantTreeTpl_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, item_r25.Children));
 } }
 function MjFormToolbarComponent_ng_template_4_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r23 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 73)(1, "a", 71);
-    i0.ɵɵlistener("click", function MjFormToolbarComponent_ng_template_4_Conditional_1_For_2_Template_a_click_1_listener($event) { const item_r24 = i0.ɵɵrestoreView(_r23).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnDescendantBadgeClick(item_r24.EntityName, $event)); });
-    i0.ɵɵelement(2, "i", 72);
+    const _r24 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 74)(1, "a", 72);
+    i0.ɵɵlistener("click", function MjFormToolbarComponent_ng_template_4_Conditional_1_For_2_Template_a_click_1_listener($event) { const item_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnDescendantBadgeClick(item_r25.EntityName, $event)); });
+    i0.ɵɵelement(2, "i", 73);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
     i0.ɵɵconditionalCreate(4, MjFormToolbarComponent_ng_template_4_Conditional_1_For_2_Conditional_4_Template, 1, 4, "ng-container", 40);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const item_r24 = ctx.$implicit;
+    const item_r25 = ctx.$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵproperty("title", "Navigate to: " + item_r24.EntityName);
+    i0.ɵɵproperty("title", "Navigate to: " + item_r25.EntityName);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", item_r24.EntityName, " ");
+    i0.ɵɵtextInterpolate1(" ", item_r25.EntityName, " ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(item_r24.Children.length > 0 ? 4 : -1);
+    i0.ɵɵconditional(item_r25.Children.length > 0 ? 4 : -1);
 } }
 function MjFormToolbarComponent_ng_template_4_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 70);
-    i0.ɵɵrepeaterCreate(1, MjFormToolbarComponent_ng_template_4_Conditional_1_For_2_Template, 5, 3, "div", 73, _forTrack2);
+    i0.ɵɵelementStart(0, "div", 71);
+    i0.ɵɵrepeaterCreate(1, MjFormToolbarComponent_ng_template_4_Conditional_1_For_2_Template, 5, 3, "div", 74, _forTrack2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const items_r22 = i0.ɵɵnextContext().items;
+    const items_r23 = i0.ɵɵnextContext().items;
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(items_r22);
+    i0.ɵɵrepeater(items_r23);
 } }
 function MjFormToolbarComponent_ng_template_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, MjFormToolbarComponent_ng_template_4_Conditional_0_Template, 6, 3)(1, MjFormToolbarComponent_ng_template_4_Conditional_1_Template, 3, 0, "div", 70);
+    i0.ɵɵconditionalCreate(0, MjFormToolbarComponent_ng_template_4_Conditional_0_Template, 6, 3)(1, MjFormToolbarComponent_ng_template_4_Conditional_1_Template, 3, 0, "div", 71);
 } if (rf & 2) {
-    const items_r22 = ctx.items;
-    i0.ɵɵconditional(items_r22.length === 1 ? 0 : items_r22.length > 1 ? 1 : -1);
+    const items_r23 = ctx.items;
+    i0.ɵɵconditional(items_r23.length === 1 ? 0 : items_r23.length > 1 ? 1 : -1);
 } }
 /**
  * Configurable form toolbar component.
@@ -1000,7 +1014,7 @@ export class MjFormToolbarComponent {
         this.ManageSectionsRequested.emit();
     }
     static ɵfac = function MjFormToolbarComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MjFormToolbarComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MjFormToolbarComponent, selectors: [["mj-form-toolbar"]], inputs: { Form: "Form", _deprecatedForm: [0, "form", "_deprecatedForm"], Record: "Record", EditMode: "EditMode", UserCanEdit: "UserCanEdit", UserCanDelete: "UserCanDelete", IsFavorite: "IsFavorite", FavoriteInitDone: "FavoriteInitDone", IsDirty: "IsDirty", DirtyFieldNames: "DirtyFieldNames", ListCount: "ListCount", TagCount: "TagCount", IsTagsPanelOpen: "IsTagsPanelOpen", VersionCount: "VersionCount", EntityInfo: "EntityInfo", Config: "Config", IsSaving: "IsSaving", VisibleSectionCount: "VisibleSectionCount", TotalSectionCount: "TotalSectionCount", ExpandedSectionCount: "ExpandedSectionCount", SearchFilter: "SearchFilter", ShowEmptyFields: "ShowEmptyFields", WidthMode: "WidthMode", HasCustomSectionOrder: "HasCustomSectionOrder", AdditionalActionsTemplate: "AdditionalActionsTemplate" }, outputs: { Navigate: "Navigate", EditModeChange: "EditModeChange", BeforeSave: "BeforeSave", SaveRequested: "SaveRequested", BeforeCancel: "BeforeCancel", CancelRequested: "CancelRequested", BeforeDelete: "BeforeDelete", DeleteRequested: "DeleteRequested", FavoriteToggled: "FavoriteToggled", BeforeHistoryView: "BeforeHistoryView", HistoryRequested: "HistoryRequested", BeforeListManagement: "BeforeListManagement", ListManagementRequested: "ListManagementRequested", TagsPanelToggled: "TagsPanelToggled", ShowChangesRequested: "ShowChangesRequested", CustomButtonClick: "CustomButtonClick", FilterChange: "FilterChange", ExpandAllRequested: "ExpandAllRequested", CollapseAllRequested: "CollapseAllRequested", ShowEmptyFieldsChange: "ShowEmptyFieldsChange", WidthModeChange: "WidthModeChange", ResetSectionOrderRequested: "ResetSectionOrderRequested", ManageSectionsRequested: "ManageSectionsRequested" }, standalone: false, ngContentSelectors: _c1, decls: 6, vars: 4, consts: [["descendantTreeTpl", ""], [1, "mj-forms-edit-banner"], [1, "mj-forms-toolbar", 3, "mj-forms-toolbar--sticky"], [1, "mj-dialog-overlay"], [1, "mj-forms-toolbar-spacer"], [1, "mj-forms-edit-banner-actions"], ["title", "Save Changes", 1, "mj-forms-btn", "mj-forms-btn--primary", 3, "click", "disabled"], [1, "fa-solid", "fa-floppy-disk"], [1, "mj-forms-btn-text"], ["title", "Discard Changes", 1, "mj-forms-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-rotate-left"], [1, "fa-solid", "fa-circle-exclamation", "mj-forms-edit-banner-icon--dirty"], [1, "mj-forms-edit-banner-dirty"], [1, "fa-solid", "fa-pen-to-square"], [1, "mj-forms-edit-banner-text"], [1, "mj-forms-toolbar"], [1, "mj-forms-toolbar-group"], ["title", "Edit this Record", 1, "mj-forms-btn"], ["title", "Delete this Record", 1, "mj-forms-btn"], [1, "mj-forms-btn", 3, "title"], [1, "mj-forms-btn", "mj-forms-btn--history", 3, "title"], [1, "mj-forms-btn", "mj-forms-btn--list", 3, "title"], [1, "mj-forms-toolbar-separator"], [1, "mj-entity-hierarchy"], [1, "mj-forms-toolbar-group", "mj-section-controls"], [3, "ngTemplateOutlet"], ["title", "Edit this Record", 1, "mj-forms-btn", 3, "click"], ["title", "Delete this Record", 1, "mj-forms-btn", 3, "click"], [1, "fa-regular", "fa-trash-can"], [1, "mj-forms-btn", 3, "click", "title"], [1, "mj-forms-btn", "mj-forms-btn--history", 3, "click", "title"], [1, "fa-regular", "fa-clock"], [1, "mj-version-count-badge"], [1, "mj-forms-btn", "mj-forms-btn--list", 3, "click", "title"], [1, "fa-regular", "fa-bookmark"], [1, "mj-list-count-badge"], [1, "fa-solid", "fa-tags"], [1, "mj-forms-btn", 3, "class", "disabled", "title"], [1, "mj-forms-btn", 3, "click", "disabled", "title"], [1, "mj-entity-badge", "mj-entity-badge--current"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "mj-entity-badge", "mj-entity-badge--parent", 3, "click", "title"], [1, "fa-solid", "fa-arrow-up"], [1, "mj-hierarchy-arrow"], [1, "fa-solid", "fa-chevron-right"], [1, "mj-forms-search-wrapper"], ["title", "Expand all sections", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click", "disabled"], [1, "fa-solid", "fa-angles-down"], ["title", "Collapse all sections", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click", "disabled"], [1, "fa-solid", "fa-angles-up"], ["title", "Reset section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only"], ["title", "Manage section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only"], [1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click", "title"], ["type", "text", "placeholder", "Search sections...", 1, "mj-section-search", 3, "input", "value"], ["title", "Clear search", 1, "mj-clear-search"], ["title", "Clear search", 1, "mj-clear-search", 3, "click"], [1, "fa-solid", "fa-xmark"], ["title", "Reset section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click"], [1, "fa-solid", "fa-arrow-rotate-left"], ["title", "Manage section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click"], [1, "fa-solid", "fa-bars-staggered"], [1, "mj-dialog-overlay", 3, "click"], [1, "mj-dialog", 3, "click"], [1, "mj-dialog-header"], [1, "mj-dialog-close", 3, "click"], [1, "mj-dialog-body"], [1, "mj-dialog-footer"], [1, "mj-forms-btn", "mj-forms-btn--danger", 3, "click"], [1, "mj-forms-btn", 3, "click"], [1, "fa-solid", "fa-trash-can"], [1, "mj-descendant-chains"], [1, "mj-entity-badge", "mj-entity-badge--child", 3, "click", "title"], [1, "fa-solid", "fa-arrow-down"], [1, "mj-descendant-chain"]], template: function MjFormToolbarComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MjFormToolbarComponent, selectors: [["mj-form-toolbar"]], inputs: { Form: "Form", _deprecatedForm: [0, "form", "_deprecatedForm"], Record: "Record", EditMode: "EditMode", UserCanEdit: "UserCanEdit", UserCanDelete: "UserCanDelete", IsFavorite: "IsFavorite", FavoriteInitDone: "FavoriteInitDone", IsDirty: "IsDirty", DirtyFieldNames: "DirtyFieldNames", ListCount: "ListCount", TagCount: "TagCount", IsTagsPanelOpen: "IsTagsPanelOpen", VersionCount: "VersionCount", EntityInfo: "EntityInfo", Config: "Config", IsSaving: "IsSaving", VisibleSectionCount: "VisibleSectionCount", TotalSectionCount: "TotalSectionCount", ExpandedSectionCount: "ExpandedSectionCount", SearchFilter: "SearchFilter", ShowEmptyFields: "ShowEmptyFields", WidthMode: "WidthMode", HasCustomSectionOrder: "HasCustomSectionOrder", AdditionalActionsTemplate: "AdditionalActionsTemplate" }, outputs: { Navigate: "Navigate", EditModeChange: "EditModeChange", BeforeSave: "BeforeSave", SaveRequested: "SaveRequested", BeforeCancel: "BeforeCancel", CancelRequested: "CancelRequested", BeforeDelete: "BeforeDelete", DeleteRequested: "DeleteRequested", FavoriteToggled: "FavoriteToggled", BeforeHistoryView: "BeforeHistoryView", HistoryRequested: "HistoryRequested", BeforeListManagement: "BeforeListManagement", ListManagementRequested: "ListManagementRequested", TagsPanelToggled: "TagsPanelToggled", ShowChangesRequested: "ShowChangesRequested", CustomButtonClick: "CustomButtonClick", FilterChange: "FilterChange", ExpandAllRequested: "ExpandAllRequested", CollapseAllRequested: "CollapseAllRequested", ShowEmptyFieldsChange: "ShowEmptyFieldsChange", WidthModeChange: "WidthModeChange", ResetSectionOrderRequested: "ResetSectionOrderRequested", ManageSectionsRequested: "ManageSectionsRequested" }, standalone: false, ngContentSelectors: _c1, decls: 6, vars: 4, consts: [["descendantTreeTpl", ""], [1, "mj-forms-edit-banner"], [1, "mj-forms-toolbar", 3, "mj-forms-toolbar--sticky"], [1, "mj-dialog-overlay"], [1, "mj-forms-toolbar-spacer"], [1, "mj-forms-edit-banner-actions"], ["title", "Save Changes", 1, "mj-forms-btn", "mj-forms-btn--primary", 3, "click", "disabled"], [1, "fa-solid", "fa-floppy-disk"], [1, "mj-forms-btn-text"], ["title", "Discard Changes", 1, "mj-forms-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-rotate-left"], [1, "fa-solid", "fa-circle-exclamation", "mj-forms-edit-banner-icon--dirty"], [1, "mj-forms-edit-banner-dirty"], [1, "fa-solid", "fa-pen-to-square"], [1, "mj-forms-edit-banner-text"], [1, "mj-forms-toolbar"], [1, "mj-forms-toolbar-group"], ["title", "Edit this Record", 1, "mj-forms-btn"], ["title", "Delete this Record", 1, "mj-forms-btn"], [1, "mj-forms-btn", 3, "title"], [1, "mj-forms-btn", "mj-forms-btn--history", 3, "title"], [1, "mj-forms-btn", "mj-forms-btn--list", 3, "title"], [1, "mj-forms-toolbar-separator"], [1, "mj-entity-hierarchy"], [1, "mj-forms-toolbar-group", "mj-section-controls"], [3, "ngTemplateOutlet"], ["title", "Edit this Record", 1, "mj-forms-btn", 3, "click"], ["title", "Delete this Record", 1, "mj-forms-btn", 3, "click"], [1, "fa-regular", "fa-trash-can"], [1, "mj-forms-btn", 3, "click", "title"], [1, "mj-forms-btn", "mj-forms-btn--history", 3, "click", "title"], [1, "fa-regular", "fa-clock"], [1, "mj-version-count-badge"], [1, "mj-forms-btn", "mj-forms-btn--list", 3, "click", "title"], [1, "fa-regular", "fa-bookmark"], [1, "mj-list-count-badge"], [1, "fa-solid", "fa-tags"], [1, "mj-forms-btn", 3, "class", "disabled", "title"], [1, "mj-forms-btn", 3, "click", "disabled", "title"], [1, "mj-entity-badge", "mj-entity-badge--current"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "mj-entity-badge", "mj-entity-badge--parent", 3, "click", "title"], [1, "fa-solid", "fa-arrow-up"], [1, "mj-hierarchy-arrow"], [1, "fa-solid", "fa-chevron-right"], [1, "mj-forms-search-wrapper"], ["title", "Reset section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only"], ["title", "Manage section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only"], [1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "title"], ["type", "text", "placeholder", "Search sections...", 1, "mj-section-search", 3, "input", "value"], ["title", "Clear search", 1, "mj-clear-search"], ["title", "Clear search", 1, "mj-clear-search", 3, "click"], [1, "fa-solid", "fa-xmark"], ["title", "Expand all sections", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click", "disabled"], [1, "fa-solid", "fa-angles-down"], ["title", "Collapse all sections", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click", "disabled"], [1, "fa-solid", "fa-angles-up"], ["title", "Reset section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click"], [1, "fa-solid", "fa-arrow-rotate-left"], ["title", "Manage section order", 1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click"], [1, "fa-solid", "fa-bars-staggered"], [1, "mj-forms-btn", "mj-forms-btn--ghost", "mj-forms-btn--icon-only", 3, "click", "title"], [1, "mj-dialog-overlay", 3, "click"], [1, "mj-dialog", 3, "click"], [1, "mj-dialog-header"], [1, "mj-dialog-close", 3, "click"], [1, "mj-dialog-body"], [1, "mj-dialog-footer"], [1, "mj-forms-btn", "mj-forms-btn--danger", 3, "click"], [1, "mj-forms-btn", 3, "click"], [1, "fa-solid", "fa-trash-can"], [1, "mj-descendant-chains"], [1, "mj-entity-badge", "mj-entity-badge--child", 3, "click", "title"], [1, "fa-solid", "fa-arrow-down"], [1, "mj-descendant-chain"]], template: function MjFormToolbarComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c0);
             i0.ɵɵconditionalCreate(0, MjFormToolbarComponent_Conditional_0_Template, 13, 3, "div", 1);
             i0.ɵɵconditionalCreate(1, MjFormToolbarComponent_Conditional_1_Template, 16, 12, "div", 2);
@@ -1019,7 +1033,7 @@ export class MjFormToolbarComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MjFormToolbarComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-form-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- ============================================\n     EDIT MODE BANNER (shows above toolbar when editing)\n     ============================================ -->\n@if (EditMode && Config.ShowEditBanner) {\n  <div class=\"mj-forms-edit-banner\">\n    @if (DirtyFieldDisplayNames.length > 0) {\n      <i class=\"fa-solid fa-circle-exclamation mj-forms-edit-banner-icon--dirty\"></i>\n      <span class=\"mj-forms-edit-banner-dirty\">\n        <strong>{{ DirtyFieldDisplayNames.length }}</strong>\n        field{{ DirtyFieldDisplayNames.length === 1 ? '' : 's' }} modified\n        &mdash; {{ DirtyFieldDisplayNames.join(', ') }}\n      </span>\n    } @else {\n      <i class=\"fa-solid fa-pen-to-square\"></i>\n      <span class=\"mj-forms-edit-banner-text\">Editing: {{ RecordDisplayName }}</span>\n    }\n    <div class=\"mj-forms-toolbar-spacer\"></div>\n    <div class=\"mj-forms-edit-banner-actions\">\n      <button class=\"mj-forms-btn mj-forms-btn--primary\" (click)=\"OnSave()\" [disabled]=\"IsSaving\" title=\"Save Changes\">\n        <i class=\"fa-solid fa-floppy-disk\"></i>\n        <span class=\"mj-forms-btn-text\">Save Changes</span>\n      </button>\n      <button class=\"mj-forms-btn\" (click)=\"OnCancel()\" [disabled]=\"IsSaving\" title=\"Discard Changes\">\n        <i class=\"fa-solid fa-rotate-left\"></i>\n        <span class=\"mj-forms-btn-text\">Discard</span>\n      </button>\n    </div>\n  </div>\n}\n\n<!-- ============================================\n     MAIN TOOLBAR (read mode only \u2014 hidden in edit mode)\n     ============================================ -->\n@if (!EditMode) {\n  <div class=\"mj-forms-toolbar\" [class.mj-forms-toolbar--sticky]=\"Config.StickyToolbar\">\n\n    <!-- Action buttons -->\n    <div class=\"mj-forms-toolbar-group\">\n      @if (Config.ShowEditButton && UserCanEdit) {\n        <button class=\"mj-forms-btn\" (click)=\"OnEdit()\" title=\"Edit this Record\">\n          <i class=\"fa-solid fa-pen-to-square\"></i>\n        </button>\n      }\n      @if (Config.ShowDeleteButton && UserCanDelete) {\n        <button class=\"mj-forms-btn\" (click)=\"OnDeleteClick()\" title=\"Delete this Record\">\n          <i class=\"fa-regular fa-trash-can\"></i>\n        </button>\n      }\n      @if (Config.ShowFavoriteButton && FavoriteInitDone) {\n        <button class=\"mj-forms-btn\" (click)=\"OnFavoriteToggle()\" [title]=\"IsFavorite ? 'Remove Favorite' : 'Make Favorite'\">\n          <i [class]=\"IsFavorite ? 'fa-solid fa-star mj-icon--favorite' : 'fa-regular fa-star'\"></i>\n        </button>\n      }\n      @if (Config.ShowHistoryButton && TracksChanges) {\n        <button class=\"mj-forms-btn mj-forms-btn--history\" (click)=\"OnHistory()\"\n          [title]=\"VersionCount > 0 ? VersionCount + ' version(s) tracked' : 'Record Changes'\">\n          <i class=\"fa-regular fa-clock\"></i>\n          @if (VersionCount > 0) {\n            <span class=\"mj-version-count-badge\">v{{ VersionCount }}</span>\n          }\n        </button>\n      }\n      @if (Config.ShowListButton) {\n        <button class=\"mj-forms-btn mj-forms-btn--list\" (click)=\"OnListManagement()\"\n          [title]=\"ListCount > 0 ? 'Member of ' + ListCount + ' list(s)' : 'Add to a list'\">\n          <i class=\"fa-regular fa-bookmark\"></i>\n          @if (ListCount > 0) {\n            <span class=\"mj-list-count-badge\">{{ ListCount }}</span>\n          }\n        </button>\n      }\n      @if (Config.ShowTagsButton) {\n        <button class=\"mj-forms-btn\" (click)=\"OnTagsPanel()\"\n          [title]=\"TagCount > 0 ? TagCount + ' tag(s)' : 'View tags'\">\n          <i class=\"fa-solid fa-tags\"></i>\n          @if (TagCount > 0) {\n            <span class=\"mj-list-count-badge\">{{ TagCount }}</span>\n          }\n        </button>\n      }\n\n      <!-- Custom toolbar buttons -->\n      @for (button of Config.CustomButtons; track button.Key) {\n        @if (button.Visible !== false) {\n          <button class=\"mj-forms-btn\"\n            [class]=\"button.CssClass || ''\"\n            [disabled]=\"button.Disabled || false\"\n            [title]=\"button.Description\"\n            (click)=\"OnCustomButtonClick(button)\">\n            <i [class]=\"button.Icon\"></i>\n          </button>\n        }\n      }\n    </div>\n\n    <!-- Separator before hierarchy -->\n    @if (Config.ShowEntityHierarchy && IsInHierarchy) {\n      <div class=\"mj-forms-toolbar-separator\"></div>\n    }\n\n    <!-- IS-A Entity Hierarchy Breadcrumb (bidirectional: Root \u2192 ... \u2192 Current \u2192 ... \u2192 Leaf) -->\n    @if (Config.ShowEntityHierarchy && IsInHierarchy) {\n      <div class=\"mj-entity-hierarchy\">\n        <!-- Parent chain (root \u2192 ... \u2192 immediate parent) -->\n        @for (parent of ParentChain; track parent.ID) {\n          <a class=\"mj-entity-badge mj-entity-badge--parent\"\n             [title]=\"'Navigate to parent: ' + parent.Name\"\n             (click)=\"OnParentBadgeClick(parent, $event)\">\n            <i class=\"fa-solid fa-arrow-up\"></i>\n            {{ parent.Name }}\n          </a>\n          <span class=\"mj-hierarchy-arrow\"><i class=\"fa-solid fa-chevron-right\"></i></span>\n        }\n\n        <!-- Current entity (always shown) -->\n        <span class=\"mj-entity-badge mj-entity-badge--current\">{{ EntityInfo?.Name }}</span>\n\n        <!-- Descendant tree (recursive: inline for single paths, branching for multiple) -->\n        @if (DescendantTree.length > 0) {\n          <ng-container [ngTemplateOutlet]=\"descendantTreeTpl\"\n            [ngTemplateOutletContext]=\"{ items: DescendantTree }\"></ng-container>\n        }\n      </div>\n    }\n\n    <!-- Spacer pushes section controls to the right -->\n    <div class=\"mj-forms-toolbar-spacer\"></div>\n\n    <!-- Section Controls -->\n    @if (Config.ShowSectionControls) {\n      <div class=\"mj-forms-toolbar-group mj-section-controls\">\n        @if (Config.ShowSectionFilter) {\n          <div class=\"mj-forms-search-wrapper\">\n            <input type=\"text\"\n              class=\"mj-section-search\"\n              [class.mj-section-search--active]=\"SearchFilter\"\n              [value]=\"SearchFilter\"\n              (input)=\"OnFilterInput($event)\"\n              placeholder=\"Search sections...\">\n            @if (SearchFilter) {\n              <button class=\"mj-clear-search\" (click)=\"OnClearFilter()\" title=\"Clear search\">\n                <i class=\"fa-solid fa-xmark\"></i>\n              </button>\n            }\n          </div>\n        }\n        <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n          [disabled]=\"ExpandedSectionCount >= VisibleSectionCount\"\n          (click)=\"OnExpandAll()\" title=\"Expand all sections\">\n          <i class=\"fa-solid fa-angles-down\"></i>\n        </button>\n        <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n          [disabled]=\"ExpandedSectionCount === 0\"\n          (click)=\"OnCollapseAll()\" title=\"Collapse all sections\">\n          <i class=\"fa-solid fa-angles-up\"></i>\n        </button>\n        @if (HasCustomSectionOrder) {\n          <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\" (click)=\"OnResetSectionOrder()\" title=\"Reset section order\">\n            <i class=\"fa-solid fa-arrow-rotate-left\"></i>\n          </button>\n        }\n        @if (Config.ShowSectionManager) {\n          <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n            (click)=\"OnManageSections()\" title=\"Manage section order\">\n            <i class=\"fa-solid fa-bars-staggered\"></i>\n          </button>\n        }\n        <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n          (click)=\"OnToggleWidthMode()\"\n          [title]=\"WidthMode === 'centered' ? 'Expand to full width' : 'Center content'\">\n          <i [class]=\"WidthMode === 'centered' ? 'fa-solid fa-arrows-left-right-to-line' : 'fa-solid fa-compress'\"></i>\n        </button>\n      </div>\n    }\n\n    <!-- Additional actions slot -->\n    @if (AdditionalActionsTemplate) {\n      <ng-container [ngTemplateOutlet]=\"AdditionalActionsTemplate\"></ng-container>\n    }\n    <ng-content select=\"[toolbar-additional-controls]\"></ng-content>\n  </div>\n}\n\n<!-- ============================================\n     DISCARD CHANGES CONFIRMATION DIALOG\n     ============================================ -->\n@if (ShowDiscardDialog) {\n  <div class=\"mj-dialog-overlay\" (click)=\"OnDiscardCancel()\">\n    <div class=\"mj-dialog\" (click)=\"$event.stopPropagation()\">\n      <div class=\"mj-dialog-header\">\n        <h3>Discard Changes?</h3>\n        <button class=\"mj-dialog-close\" (click)=\"OnDiscardCancel()\">\n          <i class=\"fa-solid fa-xmark\"></i>\n        </button>\n      </div>\n      <div class=\"mj-dialog-body\">\n        <p>You have <strong>{{ DirtyFieldDisplayNames.length }}</strong> unsaved change{{ DirtyFieldDisplayNames.length === 1 ? '' : 's' }}. Are you sure you want to discard {{ DirtyFieldDisplayNames.length === 1 ? 'it' : 'them' }}?</p>\n      </div>\n      <div class=\"mj-dialog-footer\">\n        <button class=\"mj-forms-btn mj-forms-btn--danger\" (click)=\"OnDiscardConfirm()\">\n          <i class=\"fa-solid fa-rotate-left\"></i>\n          Discard Changes\n        </button>\n        <button class=\"mj-forms-btn\" (click)=\"OnDiscardCancel()\">\n          Keep Editing\n        </button>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- ============================================\n     DELETE CONFIRMATION DIALOG\n     ============================================ -->\n@if (ShowDeleteDialog) {\n  <div class=\"mj-dialog-overlay\" (click)=\"OnDeleteCancel()\">\n    <div class=\"mj-dialog\" (click)=\"$event.stopPropagation()\">\n      <div class=\"mj-dialog-header\">\n        <h3>Confirm Deletion</h3>\n        <button class=\"mj-dialog-close\" (click)=\"OnDeleteCancel()\">\n          <i class=\"fa-solid fa-xmark\"></i>\n        </button>\n      </div>\n      <div class=\"mj-dialog-body\">\n        <p>Are you sure you want to delete this record? This action cannot be undone.</p>\n      </div>\n      <div class=\"mj-dialog-footer\">\n        <button class=\"mj-forms-btn mj-forms-btn--danger\" (click)=\"OnDeleteConfirm()\">\n          <i class=\"fa-solid fa-trash-can\"></i>\n          Delete\n        </button>\n        <button class=\"mj-forms-btn\" (click)=\"OnDeleteCancel()\">\n          Cancel\n        </button>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Recursive template for IS-A descendant tree rendering.\n     Single child at a level \u2192 inline with chevron.\n     Multiple children at a level \u2192 tree branch with CSS connector lines. -->\n<ng-template #descendantTreeTpl let-items=\"items\">\n  @if (items.length === 1) {\n    <span class=\"mj-hierarchy-arrow\"><i class=\"fa-solid fa-chevron-right\"></i></span>\n    <a class=\"mj-entity-badge mj-entity-badge--child\"\n       [title]=\"'Navigate to: ' + items[0].EntityName\"\n       (click)=\"OnDescendantBadgeClick(items[0].EntityName, $event)\">\n      <i class=\"fa-solid fa-arrow-down\"></i>\n      {{ items[0].EntityName }}\n    </a>\n    @if (items[0].Children.length > 0) {\n      <ng-container [ngTemplateOutlet]=\"descendantTreeTpl\"\n        [ngTemplateOutletContext]=\"{ items: items[0].Children }\"></ng-container>\n    }\n  } @else if (items.length > 1) {\n    <div class=\"mj-descendant-chains\">\n      @for (item of items; track item.EntityName) {\n        <div class=\"mj-descendant-chain\">\n          <a class=\"mj-entity-badge mj-entity-badge--child\"\n             [title]=\"'Navigate to: ' + item.EntityName\"\n             (click)=\"OnDescendantBadgeClick(item.EntityName, $event)\">\n            <i class=\"fa-solid fa-arrow-down\"></i>\n            {{ item.EntityName }}\n          </a>\n          @if (item.Children.length > 0) {\n            <ng-container [ngTemplateOutlet]=\"descendantTreeTpl\"\n              [ngTemplateOutletContext]=\"{ items: item.Children }\"></ng-container>\n          }\n        </div>\n      }\n    </div>\n  }\n</ng-template>\n", styles: ["/* ============================================\n   FORM TOOLBAR \u2014 uses global --mj-* design tokens\n   ============================================ */\n:host {\n  display: block;\n}\n\n/* ============================================\n   EDIT BANNER\n   ============================================ */\n.mj-forms-edit-banner {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 16px 16px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-bottom: 2px solid var(--mj-brand-primary);\n  font-size: 13px;\n  color: var(--mj-brand-primary);\n  font-weight: var(--mj-font-medium);\n}\n\n.mj-forms-edit-banner > i {\n  font-size: var(--mj-text-sm);\n}\n\n.mj-forms-edit-banner-icon--dirty {\n  color: var(--mj-status-warning);\n  font-size: var(--mj-text-base);\n}\n\n.mj-forms-edit-banner-text {\n  font-size: var(--mj-text-sm);\n}\n\n.mj-forms-edit-banner-dirty {\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-primary);\n}\n\n.mj-forms-edit-banner-dirty strong {\n  color: var(--mj-status-warning);\n  font-weight: var(--mj-font-bold);\n}\n\n.mj-forms-edit-banner-actions {\n  display: flex;\n  gap: 8px;\n}\n\n/* ============================================\n   MAIN TOOLBAR\n   ============================================ */\n.mj-forms-toolbar {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 22px 16px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  flex-wrap: wrap;\n  z-index: 40;\n}\n\n.mj-forms-toolbar--sticky {\n  position: sticky;\n  top: 0;\n}\n\n.mj-forms-toolbar--disabled {\n  pointer-events: none;\n  opacity: 0.7;\n}\n\n.mj-forms-toolbar-group {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.mj-forms-toolbar-separator {\n  width: 1px;\n  height: 24px;\n  background: var(--mj-border-default);\n  margin: 0 4px;\n}\n\n.mj-forms-toolbar-spacer {\n  flex: 1;\n}\n\n/* ============================================\n   BUTTONS\n   ============================================ */\n.mj-forms-btn {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 16px;\n  font-size: 13px;\n  font-weight: var(--mj-font-medium);\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n  border-radius: var(--mj-radius-sm);\n  cursor: pointer;\n  transition: all var(--mj-transition-base) ease;\n  white-space: nowrap;\n  font-family: inherit;\n  line-height: 1;\n}\n\n.mj-forms-btn:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.mj-forms-btn:active {\n  transform: translateY(0);\n  box-shadow: none;\n}\n\n.mj-forms-btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.mj-forms-btn i {\n  font-size: 15px;\n  line-height: 1;\n}\n\n.mj-forms-btn--primary {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n}\n\n.mj-forms-btn--primary:hover {\n  background: var(--mj-brand-primary-hover);\n  border-color: var(--mj-brand-primary-hover);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 30%, transparent);\n}\n\n.mj-forms-btn--danger {\n  color: var(--mj-status-error);\n  border-color: color-mix(in srgb, var(--mj-status-error) 30%, transparent);\n  background: color-mix(in srgb, var(--mj-status-error) 5%, var(--mj-bg-surface));\n}\n\n.mj-forms-btn--danger:hover {\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n  border-color: var(--mj-status-error);\n}\n\n.mj-forms-btn--ghost {\n  border-color: transparent;\n  background: transparent;\n}\n\n.mj-forms-btn--ghost:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n  border-color: transparent;\n}\n\n.mj-forms-btn--icon-only {\n  padding: 7px 9px;\n}\n\n.mj-forms-btn--sm {\n  padding: 5px 12px;\n  font-size: var(--mj-text-xs);\n}\n\n.mj-forms-btn--sm i {\n  font-size: var(--mj-text-xs);\n}\n\n.mj-forms-btn-text {\n  margin-left: 2px;\n}\n\n.mj-icon--favorite {\n  color: var(--mj-status-warning);\n}\n\n/* List button with count badge */\n.mj-forms-btn--list {\n  position: relative;\n}\n\n/* History button with version badge */\n.mj-forms-btn--history {\n  position: relative;\n}\n\n.mj-version-count-badge {\n  position: absolute;\n  top: -6px;\n  right: -10px;\n  padding: 0 5px;\n  font-size: 10px;\n  font-weight: var(--mj-font-bold);\n  color: var(--mj-text-inverse);\n  background: linear-gradient(135deg, var(--mj-status-success) 0%, color-mix(in srgb, var(--mj-status-success) 85%, black) 100%);\n  border-radius: var(--mj-radius-full);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 16px;\n  border: 2px solid var(--mj-bg-surface-card);\n  white-space: nowrap;\n  line-height: 1;\n}\n\n.mj-list-count-badge {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  font-size: 10px;\n  font-weight: var(--mj-font-bold);\n  color: var(--mj-text-inverse);\n  background: linear-gradient(135deg, var(--mj-status-info) 0%, color-mix(in srgb, var(--mj-status-info) 85%, black) 100%);\n  border-radius: var(--mj-radius-full);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: 2px solid var(--mj-bg-surface-card);\n}\n\n/* ============================================\n   IS-A ENTITY HIERARCHY\n   ============================================ */\n.mj-entity-hierarchy {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.mj-entity-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  padding: 4px 10px;\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  border-radius: var(--mj-radius-sm);\n  cursor: pointer;\n  transition: all var(--mj-transition-base) ease;\n  text-decoration: none;\n  border: 1px solid transparent;\n}\n\n.mj-entity-badge i {\n  font-size: 11px;\n}\n\n.mj-entity-badge--parent {\n  background: color-mix(in srgb, var(--mj-color-indigo-500) 10%, var(--mj-bg-surface));\n  color: var(--mj-color-indigo-500);\n  border-color: color-mix(in srgb, var(--mj-color-indigo-500) 25%, transparent);\n}\n\n.mj-entity-badge--parent:hover {\n  background: color-mix(in srgb, var(--mj-color-indigo-500) 18%, var(--mj-bg-surface));\n  border-color: var(--mj-color-indigo-500);\n  box-shadow: 0 2px 6px color-mix(in srgb, var(--mj-color-indigo-500) 15%, transparent);\n}\n\n.mj-entity-badge--current {\n  font-weight: var(--mj-font-semibold);\n  font-size: 13px;\n  color: var(--mj-text-primary);\n  padding: 4px 8px;\n  background: var(--mj-bg-surface-hover);\n  border-radius: var(--mj-radius-sm);\n  cursor: default;\n}\n\n.mj-entity-badge--child {\n  background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n  color: var(--mj-status-info);\n  border-color: color-mix(in srgb, var(--mj-status-info) 25%, transparent);\n}\n\n.mj-entity-badge--child:hover {\n  background: color-mix(in srgb, var(--mj-status-info) 18%, var(--mj-bg-surface));\n  border-color: var(--mj-status-info);\n  box-shadow: 0 2px 6px color-mix(in srgb, var(--mj-status-info) 15%, transparent);\n}\n\n.mj-entity-badge--overlapping {\n  background: color-mix(in srgb, var(--mj-status-warning) 10%, var(--mj-bg-surface));\n  color: color-mix(in srgb, var(--mj-status-warning) 85%, black);\n  border-color: color-mix(in srgb, var(--mj-status-warning) 40%, transparent);\n}\n\n.mj-entity-badge--overlapping:hover {\n  background: color-mix(in srgb, var(--mj-status-warning) 18%, var(--mj-bg-surface));\n  border-color: color-mix(in srgb, var(--mj-status-warning) 85%, black);\n  box-shadow: 0 2px 6px color-mix(in srgb, var(--mj-status-warning) 15%, transparent);\n}\n\n.mj-entity-badge-group {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  flex-wrap: wrap;\n}\n\n.mj-child-count {\n  background: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  padding: 1px 5px;\n  border-radius: var(--mj-radius-full);\n  font-weight: var(--mj-font-bold);\n}\n\n.mj-entity-badge--leaf {\n  border-style: dashed;\n}\n\n.mj-entity-badge--root {\n  border-style: dashed;\n}\n\n.mj-hierarchy-arrow {\n  color: var(--mj-text-muted);\n  font-size: 10px;\n}\n\n/* Descendant chain tree (connecting lines when multiple chains branch) */\n.mj-descendant-chains {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  position: relative;\n  padding-left: 20px;\n}\n\n/* Horizontal connector from parent entity badge to tree trunk */\n.mj-descendant-chains::before {\n  content: '';\n  position: absolute;\n  left: -4px;\n  top: 50%;\n  width: 4px;\n  border-top: 1.5px solid var(--mj-text-muted);\n}\n\n.mj-descendant-chain {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  position: relative;\n  padding: 2px 0;\n}\n\n/* Horizontal branch line from trunk to chain content */\n.mj-descendant-chain::before {\n  content: '';\n  position: absolute;\n  left: -20px;\n  top: 50%;\n  width: 18px;\n  border-top: 1.5px solid var(--mj-text-muted);\n}\n\n/* Vertical trunk segment (each chain draws its portion) */\n.mj-descendant-chain::after {\n  content: '';\n  position: absolute;\n  left: -20px;\n  top: 0;\n  bottom: 0;\n  border-left: 1.5px solid var(--mj-text-muted);\n}\n\n/* First chain: trunk starts from center */\n.mj-descendant-chain:first-child::after {\n  top: 50%;\n}\n\n/* Last chain: trunk ends at center */\n.mj-descendant-chain:last-child::after {\n  bottom: 50%;\n}\n\n/* (dirty summary removed \u2014 now inline in edit banner) */\n\n/* ============================================\n   SECTION CONTROLS\n   ============================================ */\n.mj-section-controls {\n  gap: 6px;\n}\n\n.mj-forms-search-wrapper {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n}\n\n.mj-section-search {\n  max-width: 180px;\n  font-size: 13px;\n  padding: 6px 28px 6px 8px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  outline: none;\n  font-family: inherit;\n  transition: all var(--mj-transition-base);\n}\n\n.mj-section-search:focus {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n/* Active filter highlight \u2014 matches the yellow used on matched panel/field names */\n.mj-section-search--active {\n  background-color: color-mix(in srgb, var(--mj-status-warning) 40%, var(--mj-bg-surface));\n  border-color: var(--mj-status-warning);\n  color: color-mix(in srgb, var(--mj-status-warning) 80%, black);\n  font-weight: var(--mj-font-semibold);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-status-warning) 25%, transparent);\n}\n\n.mj-section-search::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.mj-clear-search {\n  position: absolute;\n  right: 4px;\n  padding: 4px;\n  background: none;\n  border: none;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  font-size: var(--mj-text-xs);\n  line-height: 1;\n}\n\n.mj-clear-search:hover {\n  color: var(--mj-text-secondary);\n}\n\n/* ============================================\n   DIALOG (lightweight inline)\n   ============================================ */\n.mj-dialog-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n  animation: mj-fade-in 150ms ease;\n}\n\n.mj-dialog {\n  background: var(--mj-bg-surface-card);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-lg);\n  min-width: 400px;\n  max-width: 550px;\n  animation: mj-slide-up 200ms ease;\n}\n\n.mj-dialog-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-dialog-header h3 {\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n}\n\n.mj-dialog-close {\n  background: none;\n  border: none;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  padding: 4px;\n  font-size: var(--mj-text-base);\n  transition: color var(--mj-transition-base);\n}\n\n.mj-dialog-close:hover {\n  color: var(--mj-text-primary);\n}\n\n.mj-dialog-body {\n  padding: 20px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  line-height: 1.6;\n}\n\n.mj-dialog-body p {\n  margin: 0;\n}\n\n.mj-dialog-footer {\n  display: flex;\n  gap: 8px;\n  padding: 16px 20px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n@keyframes mj-fade-in {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n@keyframes mj-slide-up {\n  from { transform: translateY(8px); opacity: 0; }\n  to { transform: translateY(0); opacity: 1; }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-form-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- ============================================\n     EDIT MODE BANNER (shows above toolbar when editing)\n     ============================================ -->\n@if (EditMode && Config.ShowEditBanner) {\n  <div class=\"mj-forms-edit-banner\">\n    @if (DirtyFieldDisplayNames.length > 0) {\n      <i class=\"fa-solid fa-circle-exclamation mj-forms-edit-banner-icon--dirty\"></i>\n      <span class=\"mj-forms-edit-banner-dirty\">\n        <strong>{{ DirtyFieldDisplayNames.length }}</strong>\n        field{{ DirtyFieldDisplayNames.length === 1 ? '' : 's' }} modified\n        &mdash; {{ DirtyFieldDisplayNames.join(', ') }}\n      </span>\n    } @else {\n      <i class=\"fa-solid fa-pen-to-square\"></i>\n      <span class=\"mj-forms-edit-banner-text\">Editing: {{ RecordDisplayName }}</span>\n    }\n    <div class=\"mj-forms-toolbar-spacer\"></div>\n    <div class=\"mj-forms-edit-banner-actions\">\n      <button class=\"mj-forms-btn mj-forms-btn--primary\" (click)=\"OnSave()\" [disabled]=\"IsSaving\" title=\"Save Changes\">\n        <i class=\"fa-solid fa-floppy-disk\"></i>\n        <span class=\"mj-forms-btn-text\">Save Changes</span>\n      </button>\n      <button class=\"mj-forms-btn\" (click)=\"OnCancel()\" [disabled]=\"IsSaving\" title=\"Discard Changes\">\n        <i class=\"fa-solid fa-rotate-left\"></i>\n        <span class=\"mj-forms-btn-text\">Discard</span>\n      </button>\n    </div>\n  </div>\n}\n\n<!-- ============================================\n     MAIN TOOLBAR (read mode only \u2014 hidden in edit mode)\n     ============================================ -->\n@if (!EditMode) {\n  <div class=\"mj-forms-toolbar\" [class.mj-forms-toolbar--sticky]=\"Config.StickyToolbar\">\n\n    <!-- Action buttons -->\n    <div class=\"mj-forms-toolbar-group\">\n      @if (Config.ShowEditButton && UserCanEdit) {\n        <button class=\"mj-forms-btn\" (click)=\"OnEdit()\" title=\"Edit this Record\">\n          <i class=\"fa-solid fa-pen-to-square\"></i>\n        </button>\n      }\n      @if (Config.ShowDeleteButton && UserCanDelete) {\n        <button class=\"mj-forms-btn\" (click)=\"OnDeleteClick()\" title=\"Delete this Record\">\n          <i class=\"fa-regular fa-trash-can\"></i>\n        </button>\n      }\n      @if (Config.ShowFavoriteButton && FavoriteInitDone) {\n        <button class=\"mj-forms-btn\" (click)=\"OnFavoriteToggle()\" [title]=\"IsFavorite ? 'Remove Favorite' : 'Make Favorite'\">\n          <i [class]=\"IsFavorite ? 'fa-solid fa-star mj-icon--favorite' : 'fa-regular fa-star'\"></i>\n        </button>\n      }\n      @if (Config.ShowHistoryButton && TracksChanges) {\n        <button class=\"mj-forms-btn mj-forms-btn--history\" (click)=\"OnHistory()\"\n          [title]=\"VersionCount > 0 ? VersionCount + ' version(s) tracked' : 'Record Changes'\">\n          <i class=\"fa-regular fa-clock\"></i>\n          @if (VersionCount > 0) {\n            <span class=\"mj-version-count-badge\">v{{ VersionCount }}</span>\n          }\n        </button>\n      }\n      @if (Config.ShowListButton) {\n        <button class=\"mj-forms-btn mj-forms-btn--list\" (click)=\"OnListManagement()\"\n          [title]=\"ListCount > 0 ? 'Member of ' + ListCount + ' list(s)' : 'Add to a list'\">\n          <i class=\"fa-regular fa-bookmark\"></i>\n          @if (ListCount > 0) {\n            <span class=\"mj-list-count-badge\">{{ ListCount }}</span>\n          }\n        </button>\n      }\n      @if (Config.ShowTagsButton) {\n        <button class=\"mj-forms-btn\" (click)=\"OnTagsPanel()\"\n          [title]=\"TagCount > 0 ? TagCount + ' tag(s)' : 'View tags'\">\n          <i class=\"fa-solid fa-tags\"></i>\n          @if (TagCount > 0) {\n            <span class=\"mj-list-count-badge\">{{ TagCount }}</span>\n          }\n        </button>\n      }\n\n      <!-- Custom toolbar buttons -->\n      @for (button of Config.CustomButtons; track button.Key) {\n        @if (button.Visible !== false) {\n          <button class=\"mj-forms-btn\"\n            [class]=\"button.CssClass || ''\"\n            [disabled]=\"button.Disabled || false\"\n            [title]=\"button.Description\"\n            (click)=\"OnCustomButtonClick(button)\">\n            <i [class]=\"button.Icon\"></i>\n          </button>\n        }\n      }\n    </div>\n\n    <!-- Separator before hierarchy -->\n    @if (Config.ShowEntityHierarchy && IsInHierarchy) {\n      <div class=\"mj-forms-toolbar-separator\"></div>\n    }\n\n    <!-- IS-A Entity Hierarchy Breadcrumb (bidirectional: Root \u2192 ... \u2192 Current \u2192 ... \u2192 Leaf) -->\n    @if (Config.ShowEntityHierarchy && IsInHierarchy) {\n      <div class=\"mj-entity-hierarchy\">\n        <!-- Parent chain (root \u2192 ... \u2192 immediate parent) -->\n        @for (parent of ParentChain; track parent.ID) {\n          <a class=\"mj-entity-badge mj-entity-badge--parent\"\n             [title]=\"'Navigate to parent: ' + parent.Name\"\n             (click)=\"OnParentBadgeClick(parent, $event)\">\n            <i class=\"fa-solid fa-arrow-up\"></i>\n            {{ parent.Name }}\n          </a>\n          <span class=\"mj-hierarchy-arrow\"><i class=\"fa-solid fa-chevron-right\"></i></span>\n        }\n\n        <!-- Current entity (always shown) -->\n        <span class=\"mj-entity-badge mj-entity-badge--current\">{{ EntityInfo?.Name }}</span>\n\n        <!-- Descendant tree (recursive: inline for single paths, branching for multiple) -->\n        @if (DescendantTree.length > 0) {\n          <ng-container [ngTemplateOutlet]=\"descendantTreeTpl\"\n            [ngTemplateOutletContext]=\"{ items: DescendantTree }\"></ng-container>\n        }\n      </div>\n    }\n\n    <!-- Spacer pushes section controls to the right -->\n    <div class=\"mj-forms-toolbar-spacer\"></div>\n\n    <!-- Section Controls -->\n    @if (Config.ShowSectionControls) {\n      <div class=\"mj-forms-toolbar-group mj-section-controls\">\n        @if (Config.ShowSectionFilter) {\n          <div class=\"mj-forms-search-wrapper\">\n            <input type=\"text\"\n              class=\"mj-section-search\"\n              [class.mj-section-search--active]=\"SearchFilter\"\n              [value]=\"SearchFilter\"\n              (input)=\"OnFilterInput($event)\"\n              placeholder=\"Search sections...\">\n            @if (SearchFilter) {\n              <button class=\"mj-clear-search\" (click)=\"OnClearFilter()\" title=\"Clear search\">\n                <i class=\"fa-solid fa-xmark\"></i>\n              </button>\n            }\n          </div>\n        }\n        @if (Config.ShowExpandCollapseAllButtons) {\n          <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n            [disabled]=\"ExpandedSectionCount >= VisibleSectionCount\"\n            (click)=\"OnExpandAll()\" title=\"Expand all sections\">\n            <i class=\"fa-solid fa-angles-down\"></i>\n          </button>\n          <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n            [disabled]=\"ExpandedSectionCount === 0\"\n            (click)=\"OnCollapseAll()\" title=\"Collapse all sections\">\n            <i class=\"fa-solid fa-angles-up\"></i>\n          </button>\n        }\n        @if (HasCustomSectionOrder) {\n          <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\" (click)=\"OnResetSectionOrder()\" title=\"Reset section order\">\n            <i class=\"fa-solid fa-arrow-rotate-left\"></i>\n          </button>\n        }\n        @if (Config.ShowSectionManager) {\n          <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n            (click)=\"OnManageSections()\" title=\"Manage section order\">\n            <i class=\"fa-solid fa-bars-staggered\"></i>\n          </button>\n        }\n        @if (Config.ShowWidthToggle) {\n          <button class=\"mj-forms-btn mj-forms-btn--ghost mj-forms-btn--icon-only\"\n            (click)=\"OnToggleWidthMode()\"\n            [title]=\"WidthMode === 'centered' ? 'Expand to full width' : 'Center content'\">\n            <i [class]=\"WidthMode === 'centered' ? 'fa-solid fa-arrows-left-right-to-line' : 'fa-solid fa-compress'\"></i>\n          </button>\n        }\n      </div>\n    }\n\n    <!-- Additional actions slot -->\n    @if (AdditionalActionsTemplate) {\n      <ng-container [ngTemplateOutlet]=\"AdditionalActionsTemplate\"></ng-container>\n    }\n    <ng-content select=\"[toolbar-additional-controls]\"></ng-content>\n  </div>\n}\n\n<!-- ============================================\n     DISCARD CHANGES CONFIRMATION DIALOG\n     ============================================ -->\n@if (ShowDiscardDialog) {\n  <div class=\"mj-dialog-overlay\" (click)=\"OnDiscardCancel()\">\n    <div class=\"mj-dialog\" (click)=\"$event.stopPropagation()\">\n      <div class=\"mj-dialog-header\">\n        <h3>Discard Changes?</h3>\n        <button class=\"mj-dialog-close\" (click)=\"OnDiscardCancel()\">\n          <i class=\"fa-solid fa-xmark\"></i>\n        </button>\n      </div>\n      <div class=\"mj-dialog-body\">\n        <p>You have <strong>{{ DirtyFieldDisplayNames.length }}</strong> unsaved change{{ DirtyFieldDisplayNames.length === 1 ? '' : 's' }}. Are you sure you want to discard {{ DirtyFieldDisplayNames.length === 1 ? 'it' : 'them' }}?</p>\n      </div>\n      <div class=\"mj-dialog-footer\">\n        <button class=\"mj-forms-btn mj-forms-btn--danger\" (click)=\"OnDiscardConfirm()\">\n          <i class=\"fa-solid fa-rotate-left\"></i>\n          Discard Changes\n        </button>\n        <button class=\"mj-forms-btn\" (click)=\"OnDiscardCancel()\">\n          Keep Editing\n        </button>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- ============================================\n     DELETE CONFIRMATION DIALOG\n     ============================================ -->\n@if (ShowDeleteDialog) {\n  <div class=\"mj-dialog-overlay\" (click)=\"OnDeleteCancel()\">\n    <div class=\"mj-dialog\" (click)=\"$event.stopPropagation()\">\n      <div class=\"mj-dialog-header\">\n        <h3>Confirm Deletion</h3>\n        <button class=\"mj-dialog-close\" (click)=\"OnDeleteCancel()\">\n          <i class=\"fa-solid fa-xmark\"></i>\n        </button>\n      </div>\n      <div class=\"mj-dialog-body\">\n        <p>Are you sure you want to delete this record? This action cannot be undone.</p>\n      </div>\n      <div class=\"mj-dialog-footer\">\n        <button class=\"mj-forms-btn mj-forms-btn--danger\" (click)=\"OnDeleteConfirm()\">\n          <i class=\"fa-solid fa-trash-can\"></i>\n          Delete\n        </button>\n        <button class=\"mj-forms-btn\" (click)=\"OnDeleteCancel()\">\n          Cancel\n        </button>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Recursive template for IS-A descendant tree rendering.\n     Single child at a level \u2192 inline with chevron.\n     Multiple children at a level \u2192 tree branch with CSS connector lines. -->\n<ng-template #descendantTreeTpl let-items=\"items\">\n  @if (items.length === 1) {\n    <span class=\"mj-hierarchy-arrow\"><i class=\"fa-solid fa-chevron-right\"></i></span>\n    <a class=\"mj-entity-badge mj-entity-badge--child\"\n       [title]=\"'Navigate to: ' + items[0].EntityName\"\n       (click)=\"OnDescendantBadgeClick(items[0].EntityName, $event)\">\n      <i class=\"fa-solid fa-arrow-down\"></i>\n      {{ items[0].EntityName }}\n    </a>\n    @if (items[0].Children.length > 0) {\n      <ng-container [ngTemplateOutlet]=\"descendantTreeTpl\"\n        [ngTemplateOutletContext]=\"{ items: items[0].Children }\"></ng-container>\n    }\n  } @else if (items.length > 1) {\n    <div class=\"mj-descendant-chains\">\n      @for (item of items; track item.EntityName) {\n        <div class=\"mj-descendant-chain\">\n          <a class=\"mj-entity-badge mj-entity-badge--child\"\n             [title]=\"'Navigate to: ' + item.EntityName\"\n             (click)=\"OnDescendantBadgeClick(item.EntityName, $event)\">\n            <i class=\"fa-solid fa-arrow-down\"></i>\n            {{ item.EntityName }}\n          </a>\n          @if (item.Children.length > 0) {\n            <ng-container [ngTemplateOutlet]=\"descendantTreeTpl\"\n              [ngTemplateOutletContext]=\"{ items: item.Children }\"></ng-container>\n          }\n        </div>\n      }\n    </div>\n  }\n</ng-template>\n", styles: ["/* ============================================\n   FORM TOOLBAR \u2014 uses global --mj-* design tokens\n   ============================================ */\n:host {\n  display: block;\n}\n\n/* ============================================\n   EDIT BANNER\n   ============================================ */\n.mj-forms-edit-banner {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 16px 16px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-bottom: 2px solid var(--mj-brand-primary);\n  font-size: 13px;\n  color: var(--mj-brand-primary);\n  font-weight: var(--mj-font-medium);\n}\n\n.mj-forms-edit-banner > i {\n  font-size: var(--mj-text-sm);\n}\n\n.mj-forms-edit-banner-icon--dirty {\n  color: var(--mj-status-warning);\n  font-size: var(--mj-text-base);\n}\n\n.mj-forms-edit-banner-text {\n  font-size: var(--mj-text-sm);\n}\n\n.mj-forms-edit-banner-dirty {\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-primary);\n}\n\n.mj-forms-edit-banner-dirty strong {\n  color: var(--mj-status-warning);\n  font-weight: var(--mj-font-bold);\n}\n\n.mj-forms-edit-banner-actions {\n  display: flex;\n  gap: 8px;\n}\n\n/* ============================================\n   MAIN TOOLBAR\n   ============================================ */\n.mj-forms-toolbar {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 22px 16px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  flex-wrap: wrap;\n  z-index: 40;\n}\n\n.mj-forms-toolbar--sticky {\n  position: sticky;\n  top: 0;\n}\n\n.mj-forms-toolbar--disabled {\n  pointer-events: none;\n  opacity: 0.7;\n}\n\n.mj-forms-toolbar-group {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.mj-forms-toolbar-separator {\n  width: 1px;\n  height: 24px;\n  background: var(--mj-border-default);\n  margin: 0 4px;\n}\n\n.mj-forms-toolbar-spacer {\n  flex: 1;\n}\n\n/* ============================================\n   BUTTONS\n   ============================================ */\n.mj-forms-btn {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 16px;\n  font-size: 13px;\n  font-weight: var(--mj-font-medium);\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n  border-radius: var(--mj-radius-sm);\n  cursor: pointer;\n  transition: all var(--mj-transition-base) ease;\n  white-space: nowrap;\n  font-family: inherit;\n  line-height: 1;\n}\n\n.mj-forms-btn:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.mj-forms-btn:active {\n  transform: translateY(0);\n  box-shadow: none;\n}\n\n.mj-forms-btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.mj-forms-btn i {\n  font-size: 15px;\n  line-height: 1;\n}\n\n.mj-forms-btn--primary {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n}\n\n.mj-forms-btn--primary:hover {\n  background: var(--mj-brand-primary-hover);\n  border-color: var(--mj-brand-primary-hover);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 30%, transparent);\n}\n\n.mj-forms-btn--danger {\n  color: var(--mj-status-error);\n  border-color: color-mix(in srgb, var(--mj-status-error) 30%, transparent);\n  background: color-mix(in srgb, var(--mj-status-error) 5%, var(--mj-bg-surface));\n}\n\n.mj-forms-btn--danger:hover {\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n  border-color: var(--mj-status-error);\n}\n\n.mj-forms-btn--ghost {\n  border-color: transparent;\n  background: transparent;\n}\n\n.mj-forms-btn--ghost:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n  border-color: transparent;\n}\n\n.mj-forms-btn--icon-only {\n  padding: 7px 9px;\n}\n\n.mj-forms-btn--sm {\n  padding: 5px 12px;\n  font-size: var(--mj-text-xs);\n}\n\n.mj-forms-btn--sm i {\n  font-size: var(--mj-text-xs);\n}\n\n.mj-forms-btn-text {\n  margin-left: 2px;\n}\n\n.mj-icon--favorite {\n  color: var(--mj-status-warning);\n}\n\n/* List button with count badge */\n.mj-forms-btn--list {\n  position: relative;\n}\n\n/* History button with version badge */\n.mj-forms-btn--history {\n  position: relative;\n}\n\n.mj-version-count-badge {\n  position: absolute;\n  top: -6px;\n  right: -10px;\n  padding: 0 5px;\n  font-size: 10px;\n  font-weight: var(--mj-font-bold);\n  color: var(--mj-text-inverse);\n  background: linear-gradient(135deg, var(--mj-status-success) 0%, color-mix(in srgb, var(--mj-status-success) 85%, black) 100%);\n  border-radius: var(--mj-radius-full);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 16px;\n  border: 2px solid var(--mj-bg-surface-card);\n  white-space: nowrap;\n  line-height: 1;\n}\n\n.mj-list-count-badge {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  font-size: 10px;\n  font-weight: var(--mj-font-bold);\n  color: var(--mj-text-inverse);\n  background: linear-gradient(135deg, var(--mj-status-info) 0%, color-mix(in srgb, var(--mj-status-info) 85%, black) 100%);\n  border-radius: var(--mj-radius-full);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: 2px solid var(--mj-bg-surface-card);\n}\n\n/* ============================================\n   IS-A ENTITY HIERARCHY\n   ============================================ */\n.mj-entity-hierarchy {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.mj-entity-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  padding: 4px 10px;\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  border-radius: var(--mj-radius-sm);\n  cursor: pointer;\n  transition: all var(--mj-transition-base) ease;\n  text-decoration: none;\n  border: 1px solid transparent;\n}\n\n.mj-entity-badge i {\n  font-size: 11px;\n}\n\n.mj-entity-badge--parent {\n  background: color-mix(in srgb, var(--mj-color-indigo-500) 10%, var(--mj-bg-surface));\n  color: var(--mj-color-indigo-500);\n  border-color: color-mix(in srgb, var(--mj-color-indigo-500) 25%, transparent);\n}\n\n.mj-entity-badge--parent:hover {\n  background: color-mix(in srgb, var(--mj-color-indigo-500) 18%, var(--mj-bg-surface));\n  border-color: var(--mj-color-indigo-500);\n  box-shadow: 0 2px 6px color-mix(in srgb, var(--mj-color-indigo-500) 15%, transparent);\n}\n\n.mj-entity-badge--current {\n  font-weight: var(--mj-font-semibold);\n  font-size: 13px;\n  color: var(--mj-text-primary);\n  padding: 4px 8px;\n  background: var(--mj-bg-surface-hover);\n  border-radius: var(--mj-radius-sm);\n  cursor: default;\n}\n\n.mj-entity-badge--child {\n  background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n  color: var(--mj-status-info);\n  border-color: color-mix(in srgb, var(--mj-status-info) 25%, transparent);\n}\n\n.mj-entity-badge--child:hover {\n  background: color-mix(in srgb, var(--mj-status-info) 18%, var(--mj-bg-surface));\n  border-color: var(--mj-status-info);\n  box-shadow: 0 2px 6px color-mix(in srgb, var(--mj-status-info) 15%, transparent);\n}\n\n.mj-entity-badge--overlapping {\n  background: color-mix(in srgb, var(--mj-status-warning) 10%, var(--mj-bg-surface));\n  color: color-mix(in srgb, var(--mj-status-warning) 85%, black);\n  border-color: color-mix(in srgb, var(--mj-status-warning) 40%, transparent);\n}\n\n.mj-entity-badge--overlapping:hover {\n  background: color-mix(in srgb, var(--mj-status-warning) 18%, var(--mj-bg-surface));\n  border-color: color-mix(in srgb, var(--mj-status-warning) 85%, black);\n  box-shadow: 0 2px 6px color-mix(in srgb, var(--mj-status-warning) 15%, transparent);\n}\n\n.mj-entity-badge-group {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  flex-wrap: wrap;\n}\n\n.mj-child-count {\n  background: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  padding: 1px 5px;\n  border-radius: var(--mj-radius-full);\n  font-weight: var(--mj-font-bold);\n}\n\n.mj-entity-badge--leaf {\n  border-style: dashed;\n}\n\n.mj-entity-badge--root {\n  border-style: dashed;\n}\n\n.mj-hierarchy-arrow {\n  color: var(--mj-text-muted);\n  font-size: 10px;\n}\n\n/* Descendant chain tree (connecting lines when multiple chains branch) */\n.mj-descendant-chains {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  position: relative;\n  padding-left: 20px;\n}\n\n/* Horizontal connector from parent entity badge to tree trunk */\n.mj-descendant-chains::before {\n  content: '';\n  position: absolute;\n  left: -4px;\n  top: 50%;\n  width: 4px;\n  border-top: 1.5px solid var(--mj-text-muted);\n}\n\n.mj-descendant-chain {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  position: relative;\n  padding: 2px 0;\n}\n\n/* Horizontal branch line from trunk to chain content */\n.mj-descendant-chain::before {\n  content: '';\n  position: absolute;\n  left: -20px;\n  top: 50%;\n  width: 18px;\n  border-top: 1.5px solid var(--mj-text-muted);\n}\n\n/* Vertical trunk segment (each chain draws its portion) */\n.mj-descendant-chain::after {\n  content: '';\n  position: absolute;\n  left: -20px;\n  top: 0;\n  bottom: 0;\n  border-left: 1.5px solid var(--mj-text-muted);\n}\n\n/* First chain: trunk starts from center */\n.mj-descendant-chain:first-child::after {\n  top: 50%;\n}\n\n/* Last chain: trunk ends at center */\n.mj-descendant-chain:last-child::after {\n  bottom: 50%;\n}\n\n/* (dirty summary removed \u2014 now inline in edit banner) */\n\n/* ============================================\n   SECTION CONTROLS\n   ============================================ */\n.mj-section-controls {\n  gap: 6px;\n}\n\n.mj-forms-search-wrapper {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n}\n\n.mj-section-search {\n  max-width: 180px;\n  font-size: 13px;\n  padding: 6px 28px 6px 8px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  outline: none;\n  font-family: inherit;\n  transition: all var(--mj-transition-base);\n}\n\n.mj-section-search:focus {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n/* Active filter highlight \u2014 matches the yellow used on matched panel/field names */\n.mj-section-search--active {\n  background-color: color-mix(in srgb, var(--mj-status-warning) 40%, var(--mj-bg-surface));\n  border-color: var(--mj-status-warning);\n  color: color-mix(in srgb, var(--mj-status-warning) 80%, black);\n  font-weight: var(--mj-font-semibold);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-status-warning) 25%, transparent);\n}\n\n.mj-section-search::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.mj-clear-search {\n  position: absolute;\n  right: 4px;\n  padding: 4px;\n  background: none;\n  border: none;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  font-size: var(--mj-text-xs);\n  line-height: 1;\n}\n\n.mj-clear-search:hover {\n  color: var(--mj-text-secondary);\n}\n\n/* ============================================\n   DIALOG (lightweight inline)\n   ============================================ */\n.mj-dialog-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n  animation: mj-fade-in 150ms ease;\n}\n\n.mj-dialog {\n  background: var(--mj-bg-surface-card);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-lg);\n  min-width: 400px;\n  max-width: 550px;\n  animation: mj-slide-up 200ms ease;\n}\n\n.mj-dialog-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-dialog-header h3 {\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n}\n\n.mj-dialog-close {\n  background: none;\n  border: none;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  padding: 4px;\n  font-size: var(--mj-text-base);\n  transition: color var(--mj-transition-base);\n}\n\n.mj-dialog-close:hover {\n  color: var(--mj-text-primary);\n}\n\n.mj-dialog-body {\n  padding: 20px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  line-height: 1.6;\n}\n\n.mj-dialog-body p {\n  margin: 0;\n}\n\n.mj-dialog-footer {\n  display: flex;\n  gap: 8px;\n  padding: 16px 20px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n@keyframes mj-fade-in {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n@keyframes mj-slide-up {\n  from { transform: translateY(8px); opacity: 0; }\n  to { transform: translateY(0); opacity: 1; }\n}\n"] }]
     }], null, { Form: [{
             type: Input
         }], _deprecatedForm: [{