@memberjunction/ng-core-entity-forms 6.2.1 → 6.3.0-edge.0

package/dist/lib/custom/EntityActions/entityaction.form.component.js

@@ -112,7 +112,7 @@ let MJEntityActionFormComponentExtended = class MJEntityActionFormComponentExten
             i0.ɵɵconditionalCreate(0, MJEntityActionFormComponentExtended_Conditional_0_Template, 22, 39, "mj-record-form-container", 2);
         } if (rf & 2) {
             i0.ɵɵconditional(ctx.record ? 0 : -1);
-        } }, dependencies: [i1.ɵNgNoValidate, i1.NgControlStatusGroup, i1.NgForm, i2.JoinGridComponent, i3.MjRecordFormContainerComponent, i3.SectionLoaderComponent, i3.ExplorerEntityDataGridComponent, i4.MJTabStripComponent, i4.MJTabBodyComponent, i4.MJTabComponent], styles: [".k-pane[_ngcontent-%COMP%] {\n  background-color: var(--mj-bg-surface);\n}\n\n.content-margin[_ngcontent-%COMP%] {\n  margin: 10px;\n}\n\n\na[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%] {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group[_ngcontent-%COMP%] {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin-bottom: 10px;\n}\n\n.k-splitter[_ngcontent-%COMP%] {\n  border-width: 0px;\n}\n\n.record-form-row[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > [_ngcontent-%COMP%]:first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row[_ngcontent-%COMP%] {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n\n.form-panels-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]    > .form-card[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n\n@media (min-width: 1400px) {\n  .form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card[_ngcontent-%COMP%] {\n  overflow: hidden;\n}\n\n.collapsible-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header[_ngcontent-%COMP%]   .collapse-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body[_ngcontent-%COMP%] {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed[_ngcontent-%COMP%] {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body[_ngcontent-%COMP%] {\n  padding: 24px;\n}\n\n\n.form-card.related-entity[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n\n\n.form-section-controls[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .control-group[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:active {\n  transform: translateY(0);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-count[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n\n.form-card.search-hidden[_ngcontent-%COMP%] {\n  display: none;\n}\n\n\n.section-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   .search-highlight[_ngcontent-%COMP%] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge.zero-rows[_ngcontent-%COMP%] {\n  background: var(--mj-text-muted);\n}", "\n[_nghost-%COMP%] {\n    display: block;\n    height: 100%;\n}\n\n.record-form-container[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0 !important;\n    overflow: hidden;\n}"] }); }
+        } }, dependencies: [i1.ɵNgNoValidate, i1.NgControlStatusGroup, i1.NgForm, i2.JoinGridComponent, i3.MjRecordFormContainerComponent, i3.SectionLoaderComponent, i3.ExplorerEntityDataGridComponent, i4.MJTabStripComponent, i4.MJTabBodyComponent, i4.MJTabComponent], styles: [".content-margin[_ngcontent-%COMP%] {\n  margin: 10px;\n}\n\n\na[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%] {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group[_ngcontent-%COMP%] {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin-bottom: 10px;\n}\n\n.record-form-row[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > [_ngcontent-%COMP%]:first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row[_ngcontent-%COMP%] {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n\n.form-panels-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]    > .form-card[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n\n@media (min-width: 1400px) {\n  .form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card[_ngcontent-%COMP%] {\n  overflow: hidden;\n}\n\n.collapsible-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header[_ngcontent-%COMP%]   .collapse-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body[_ngcontent-%COMP%] {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed[_ngcontent-%COMP%] {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body[_ngcontent-%COMP%] {\n  padding: 24px;\n}\n\n\n.form-card.related-entity[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n\n\n.form-section-controls[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .control-group[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:active {\n  transform: translateY(0);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-count[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n\n.form-card.search-hidden[_ngcontent-%COMP%] {\n  display: none;\n}\n\n\n.section-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   .search-highlight[_ngcontent-%COMP%] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge.zero-rows[_ngcontent-%COMP%] {\n  background: var(--mj-text-muted);\n}", "\n[_nghost-%COMP%] {\n    display: block;\n    height: 100%;\n}\n\n.record-form-container[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0 !important;\n    overflow: hidden;\n}"] }); }
 };
 MJEntityActionFormComponentExtended = __decorate([
     RegisterClass(BaseFormComponent, 'MJ: Entity Actions')
@@ -120,7 +120,7 @@ MJEntityActionFormComponentExtended = __decorate([
 export { MJEntityActionFormComponentExtended };
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJEntityActionFormComponentExtended, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-custom-entity-action-extended-form', template: "@if (record) {\n<mj-record-form-container [Record]=\"record\" [FormComponent]=\"this\"\n    [ToolbarConfig]=\"toolbarConfig\"\n    [WidthMode]=\"'full-width'\"\n    (Navigate)=\"OnFormNavigate($event)\"\n    (DeleteRequested)=\"OnDeleteRequested()\"\n    (FavoriteToggled)=\"OnFavoriteToggled()\"\n    (HistoryRequested)=\"OnHistoryRequested()\"\n    (ListManagementRequested)=\"OnListManagementRequested()\">\n    <form class=\"record-form\" #form=\"ngForm\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n      <div #topArea class=\"record-form-group\">\n      </div>\n      <mj-tabstrip (TabSelected)=\"onTabSelect($event)\"  (ResizeContainer)=\"InvokeManualResize()\">\n        <mj-tab Name=\"Details\">\n          Details\n        </mj-tab>\n        <mj-tab-body>\n          <mj-form-section\n            Entity=\"MJ: Entity Actions\"\n            Section=\"details\"\n            [record]=\"record\"\n            [EditMode]=\"EditMode\">\n          </mj-form-section>\n        </mj-tab-body>\n        <mj-tab Name=\"MJ: Entity Action Params\"\n          [Visible]=\"record.IsSaved\"\n          [Props]=\"{EntityRelationshipID: 247}\">\n          Params\n        </mj-tab>\n        <mj-tab-body>\n          <mj-join-grid\n            [ShowSaveButton]=\"false\"\n            [ShowCancelButton]=\"false\"\n            [EditMode]=\"GridEditMode()\"\n            RowsEntityName=\"MJ: Action Params\"\n                            [RowsExtraFilter]=\"'ActionID=' + record.ActionID\"\n                            RowsEntityDisplayField=\"Name\"\n                            RowsEntityDataSource=\"FullEntity\"\n                            RowsOrderBy=\"ID\"\n                            RowsEntityDisplayName=\"Action Param\"\n                            ColumnsMode=\"Fields\"\n                            JoinEntityName=\"MJ: Entity Action Params\"\n                            JoinEntityRowForeignKey=\"ActionParamID\"\n                            [JoinEntityExtraFilter]=\"'EntityActionID=' + record.ID\"\n                            [JoinEntityDisplayColumns]=\"['ValueType', 'Value','Comments']\"\n            [NewRecordDefaultValues]=\"{EntityActionID: record.ID}\"\n            >\n          </mj-join-grid>\n        </mj-tab-body>\n        <mj-tab Name=\"MJ: Entity Action Invocations\"\n          [Visible]=\"record.IsSaved\"\n          [Props]=\"{EntityRelationshipID: 247}\">\n          Invocations\n        </mj-tab>\n        <mj-tab-body>\n          <mj-join-grid\n            [ShowSaveButton]=\"false\"\n            [ShowCancelButton]=\"false\"\n            [EditMode]=\"GridEditMode()\"\n            RowsEntityName=\"MJ: Entity Action Invocation Types\"\n            RowsEntityDisplayField=\"Name\"\n            RowsEntityDataSource=\"FullEntity\"\n            RowsOrderBy=\"Name\"\n            RowsEntityDisplayName=\"Type\"\n            ColumnsMode=\"Fields\"\n            JoinEntityName=\"MJ: Entity Action Invocations\"\n            JoinEntityRowForeignKey=\"InvocationTypeID\"\n                            [JoinEntityExtraFilter]=\"'EntityActionID=' + record.ID\"\n                            [JoinEntityDisplayColumns]=\"['Status']\"\n            CheckBoxValueMode=\"RecordExists\"\n            [NewRecordDefaultValues]=\"{EntityActionID: record.ID}\"\n            style=\"height: 500px; width: 800px;\"\n            >\n          </mj-join-grid>\n        </mj-tab-body>\n        <mj-tab Name=\"MJ: Entity Action Filters\"\n          [Visible]=\"record.IsSaved\"\n          [Props]=\"{EntityRelationshipID: 248}\">\n          Filters\n        </mj-tab>\n        <mj-tab-body>\n          <!-- Explicit Height: the default 'auto' resolves to height:100%, which needs a definite\n               ancestor \u2014 the tab body used to hardcode viewport height and provide one, but it now\n               sizes to content (the host owns region sizing), so 100% would resolve to nothing and\n               the grid loses its internal scroll. 600px \u2248 the region the old viewport math yielded. -->\n          <mj-explorer-entity-data-grid\n            [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: Entity Action Filters')\"\n            [NewRecordValues]=\"NewRecordValues('MJ: Entity Action Filters')\"\n            [AllowLoad]=\"IsCurrentTab('MJ: Entity Action Filters')\"\n            [Height]=\"600\"\n            [ShowToolbar]=\"false\">\n          </mj-explorer-entity-data-grid>\n        </mj-tab-body>\n      </mj-tabstrip>\n    </form>\n</mj-record-form-container>\n}\n", styles: [".k-pane {\n  background-color: var(--mj-bg-surface);\n}\n\n.content-margin {\n  margin: 10px;\n}\n\n\na {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon {\n  margin-right: 5px;\n}\n\n.record-form {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton {\n  margin-right: 5px;\n}\n\n.record-form h2 {\n  margin-bottom: 10px;\n}\n\n.k-splitter {\n  border-width: 0px;\n}\n\n.record-form-row {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form .record-form-row > :first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form .record-form-row > span {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row label {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n/* Collapsible Panel Styles */\n.form-panels-container {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n/* All field sections take full width */\n.form-panels-container > .form-card {\n  width: 100%;\n}\n\n/* Related entity grid container - responsive layout */\n.form-panels-container .related-entity-grid {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n/* Responsive multi-column layout for related entities on wider screens */\n@media (min-width: 1400px) {\n  .form-panels-container .related-entity-grid {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card {\n  overflow: hidden;\n}\n\n.collapsible-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title i {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header .collapse-icon {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body {\n  padding: 24px;\n}\n\n/* Related Entity Sections - Visual Distinction */\n.form-card.related-entity {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-header {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity .collapsible-header:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-title i {\n  color: var(--mj-brand-primary);\n}\n\n/* Section Controls */\n.form-section-controls {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls .control-group {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls button {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls button:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls button:active {\n  transform: translateY(0);\n}\n\n.form-section-controls button i {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls .section-search {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls .section-search:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls .section-search::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls .section-count {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n/* Hidden sections for search filter */\n.form-card.search-hidden {\n  display: none;\n}\n\n/* Section count badge */\n.section-count-badge {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n/* Search highlighting in section names */\n.collapsible-title h3 .search-highlight {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n/* Row count badge in section headers */\n.collapsible-title .row-count-badge {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n/* Gray badge for zero rows (loaded but empty) */\n.collapsible-title .row-count-badge.zero-rows {\n  background: var(--mj-text-muted);\n}\n", "/* EntityAction Form - Scrolling Layout Fixes */\n:host {\n    display: block;\n    height: 100%;\n}\n\n.record-form-container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0 !important;\n    overflow: hidden;\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-custom-entity-action-extended-form', template: "@if (record) {\n<mj-record-form-container [Record]=\"record\" [FormComponent]=\"this\"\n    [ToolbarConfig]=\"toolbarConfig\"\n    [WidthMode]=\"'full-width'\"\n    (Navigate)=\"OnFormNavigate($event)\"\n    (DeleteRequested)=\"OnDeleteRequested()\"\n    (FavoriteToggled)=\"OnFavoriteToggled()\"\n    (HistoryRequested)=\"OnHistoryRequested()\"\n    (ListManagementRequested)=\"OnListManagementRequested()\">\n    <form class=\"record-form\" #form=\"ngForm\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n      <div #topArea class=\"record-form-group\">\n      </div>\n      <mj-tabstrip (TabSelected)=\"onTabSelect($event)\"  (ResizeContainer)=\"InvokeManualResize()\">\n        <mj-tab Name=\"Details\">\n          Details\n        </mj-tab>\n        <mj-tab-body>\n          <mj-form-section\n            Entity=\"MJ: Entity Actions\"\n            Section=\"details\"\n            [record]=\"record\"\n            [EditMode]=\"EditMode\">\n          </mj-form-section>\n        </mj-tab-body>\n        <mj-tab Name=\"MJ: Entity Action Params\"\n          [Visible]=\"record.IsSaved\"\n          [Props]=\"{EntityRelationshipID: 247}\">\n          Params\n        </mj-tab>\n        <mj-tab-body>\n          <mj-join-grid\n            [ShowSaveButton]=\"false\"\n            [ShowCancelButton]=\"false\"\n            [EditMode]=\"GridEditMode()\"\n            RowsEntityName=\"MJ: Action Params\"\n                            [RowsExtraFilter]=\"'ActionID=' + record.ActionID\"\n                            RowsEntityDisplayField=\"Name\"\n                            RowsEntityDataSource=\"FullEntity\"\n                            RowsOrderBy=\"ID\"\n                            RowsEntityDisplayName=\"Action Param\"\n                            ColumnsMode=\"Fields\"\n                            JoinEntityName=\"MJ: Entity Action Params\"\n                            JoinEntityRowForeignKey=\"ActionParamID\"\n                            [JoinEntityExtraFilter]=\"'EntityActionID=' + record.ID\"\n                            [JoinEntityDisplayColumns]=\"['ValueType', 'Value','Comments']\"\n            [NewRecordDefaultValues]=\"{EntityActionID: record.ID}\"\n            >\n          </mj-join-grid>\n        </mj-tab-body>\n        <mj-tab Name=\"MJ: Entity Action Invocations\"\n          [Visible]=\"record.IsSaved\"\n          [Props]=\"{EntityRelationshipID: 247}\">\n          Invocations\n        </mj-tab>\n        <mj-tab-body>\n          <mj-join-grid\n            [ShowSaveButton]=\"false\"\n            [ShowCancelButton]=\"false\"\n            [EditMode]=\"GridEditMode()\"\n            RowsEntityName=\"MJ: Entity Action Invocation Types\"\n            RowsEntityDisplayField=\"Name\"\n            RowsEntityDataSource=\"FullEntity\"\n            RowsOrderBy=\"Name\"\n            RowsEntityDisplayName=\"Type\"\n            ColumnsMode=\"Fields\"\n            JoinEntityName=\"MJ: Entity Action Invocations\"\n            JoinEntityRowForeignKey=\"InvocationTypeID\"\n                            [JoinEntityExtraFilter]=\"'EntityActionID=' + record.ID\"\n                            [JoinEntityDisplayColumns]=\"['Status']\"\n            CheckBoxValueMode=\"RecordExists\"\n            [NewRecordDefaultValues]=\"{EntityActionID: record.ID}\"\n            style=\"height: 500px; width: 800px;\"\n            >\n          </mj-join-grid>\n        </mj-tab-body>\n        <mj-tab Name=\"MJ: Entity Action Filters\"\n          [Visible]=\"record.IsSaved\"\n          [Props]=\"{EntityRelationshipID: 248}\">\n          Filters\n        </mj-tab>\n        <mj-tab-body>\n          <!-- Explicit Height: the default 'auto' resolves to height:100%, which needs a definite\n               ancestor \u2014 the tab body used to hardcode viewport height and provide one, but it now\n               sizes to content (the host owns region sizing), so 100% would resolve to nothing and\n               the grid loses its internal scroll. 600px \u2248 the region the old viewport math yielded. -->\n          <mj-explorer-entity-data-grid\n            [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: Entity Action Filters')\"\n            [NewRecordValues]=\"NewRecordValues('MJ: Entity Action Filters')\"\n            [AllowLoad]=\"IsCurrentTab('MJ: Entity Action Filters')\"\n            [Height]=\"600\"\n            [ShowToolbar]=\"false\">\n          </mj-explorer-entity-data-grid>\n        </mj-tab-body>\n      </mj-tabstrip>\n    </form>\n</mj-record-form-container>\n}\n", styles: [".content-margin {\n  margin: 10px;\n}\n\n\na {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon {\n  margin-right: 5px;\n}\n\n.record-form {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton {\n  margin-right: 5px;\n}\n\n.record-form h2 {\n  margin-bottom: 10px;\n}\n\n.record-form-row {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form .record-form-row > :first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form .record-form-row > span {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row label {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n/* Collapsible Panel Styles */\n.form-panels-container {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n/* All field sections take full width */\n.form-panels-container > .form-card {\n  width: 100%;\n}\n\n/* Related entity grid container - responsive layout */\n.form-panels-container .related-entity-grid {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n/* Responsive multi-column layout for related entities on wider screens */\n@media (min-width: 1400px) {\n  .form-panels-container .related-entity-grid {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card {\n  overflow: hidden;\n}\n\n.collapsible-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title i {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header .collapse-icon {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body {\n  padding: 24px;\n}\n\n/* Related Entity Sections - Visual Distinction */\n.form-card.related-entity {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-header {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity .collapsible-header:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-title i {\n  color: var(--mj-brand-primary);\n}\n\n/* Section Controls */\n.form-section-controls {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls .control-group {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls button {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls button:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls button:active {\n  transform: translateY(0);\n}\n\n.form-section-controls button i {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls .section-search {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls .section-search:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls .section-search::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls .section-count {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n/* Hidden sections for search filter */\n.form-card.search-hidden {\n  display: none;\n}\n\n/* Section count badge */\n.section-count-badge {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n/* Search highlighting in section names */\n.collapsible-title h3 .search-highlight {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n/* Row count badge in section headers */\n.collapsible-title .row-count-badge {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n/* Gray badge for zero rows (loaded but empty) */\n.collapsible-title .row-count-badge.zero-rows {\n  background: var(--mj-text-muted);\n}\n", "/* EntityAction Form - Scrolling Layout Fixes */\n:host {\n    display: block;\n    height: 100%;\n}\n\n.record-form-container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0 !important;\n    overflow: hidden;\n}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJEntityActionFormComponentExtended, { className: "MJEntityActionFormComponentExtended", filePath: "src/lib/custom/EntityActions/entityaction.form.component.ts", lineNumber: 16 }); })();
 //# sourceMappingURL=entityaction.form.component.js.map

package/dist/lib/custom/Files/file-form.component.js

@@ -726,7 +726,7 @@ let MJFileFormComponentExtended = class MJFileFormComponentExtended extends MJFi
             i0.ɵɵconditionalCreate(0, MJFileFormComponentExtended_Conditional_0_Template, 32, 14, "div", 0)(1, MJFileFormComponentExtended_Conditional_1_Template, 21, 50, "div", 1);
         } if (rf & 2) {
             i0.ɵɵconditional(!ctx.ViewStandardForm ? 0 : 1);
-        } }, dependencies: [i1.DocxPreviewComponent, i1.XlsxPreviewComponent, i2.MJButtonDirective, i3.MjFormFieldComponent, i3.MjCollapsiblePanelComponent, i3.MjRecordFormContainerComponent, i3.FormPanelSlotComponent, i4.LoadingComponent, i5.DatePipe], styles: [".k-pane[_ngcontent-%COMP%] {\n  background-color: var(--mj-bg-surface);\n}\n\n.content-margin[_ngcontent-%COMP%] {\n  margin: 10px;\n}\n\n\na[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%] {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group[_ngcontent-%COMP%] {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin-bottom: 10px;\n}\n\n.k-splitter[_ngcontent-%COMP%] {\n  border-width: 0px;\n}\n\n.record-form-row[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > [_ngcontent-%COMP%]:first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row[_ngcontent-%COMP%] {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n\n.form-panels-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]    > .form-card[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n\n@media (min-width: 1400px) {\n  .form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card[_ngcontent-%COMP%] {\n  overflow: hidden;\n}\n\n.collapsible-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header[_ngcontent-%COMP%]   .collapse-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body[_ngcontent-%COMP%] {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed[_ngcontent-%COMP%] {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body[_ngcontent-%COMP%] {\n  padding: 24px;\n}\n\n\n.form-card.related-entity[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n\n\n.form-section-controls[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .control-group[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:active {\n  transform: translateY(0);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-count[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n\n.form-card.search-hidden[_ngcontent-%COMP%] {\n  display: none;\n}\n\n\n.section-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   .search-highlight[_ngcontent-%COMP%] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge.zero-rows[_ngcontent-%COMP%] {\n  background: var(--mj-text-muted);\n}", ".mj-file-viewer-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  background: var(--mj-bg-surface);\n  overflow: hidden;\n}\n\n\n.mj-file-viewer-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 20px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.mj-file-viewer-header-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  min-width: 0;\n}\n\n.mj-file-viewer-icon-box[_ngcontent-%COMP%] {\n  width: 38px;\n  height: 38px;\n  border-radius: var(--mj-radius-md, 8px);\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.25rem;\n  flex-shrink: 0;\n}\n\n.mj-file-color-pdf[_ngcontent-%COMP%] { color: var(--mj-status-danger, #ef4444); }\n.mj-file-color-image[_ngcontent-%COMP%] { color: var(--mj-status-success, #10b981); }\n.mj-file-color-video[_ngcontent-%COMP%] { color: var(--mj-status-purple, #8b5cf6); }\n.mj-file-color-audio[_ngcontent-%COMP%] { color: var(--mj-status-warning, #f59e0b); }\n.mj-file-color-text[_ngcontent-%COMP%] { color: var(--mj-status-info, #3b82f6); }\n.mj-file-color-generic[_ngcontent-%COMP%] { color: var(--mj-text-muted, #94a3b8); }\n.mj-file-color-word[_ngcontent-%COMP%] { color: var(--mj-status-info, #2b579a); }\n.mj-file-color-excel[_ngcontent-%COMP%] { color: var(--mj-status-success, #217346); }\n\n.mj-file-viewer-title-group[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.mj-file-viewer-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 1.1rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.mj-file-viewer-badges[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin-top: 3px;\n}\n\n.mj-file-badge[_ngcontent-%COMP%] {\n  font-size: 0.72rem;\n  font-weight: 600;\n  padding: 2px 7px;\n  border-radius: 9999px;\n}\n\n.mj-file-badge--type[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--size[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--status[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n  color: var(--mj-brand-primary);\n}\n\n.mj-file-viewer-header-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n\n.mj-file-viewer-body[_ngcontent-%COMP%] {\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n  position: relative;\n}\n\n\n.mj-file-viewer-stage[_ngcontent-%COMP%] {\n  flex: 1;\n  position: relative;\n  overflow: auto;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 0;\n}\n\n.mj-file-viewer-loading-overlay[_ngcontent-%COMP%] {\n  position: absolute;\n  inset: 0;\n  z-index: 10;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: opacity 0.3s ease;\n}\n\n.mj-file-media--hidden[_ngcontent-%COMP%] {\n  opacity: 0;\n  pointer-events: none;\n}\n\n.mj-file-media-image-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-image-box[_ngcontent-%COMP%]   img[_ngcontent-%COMP%] {\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-frame-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n}\n\n.mj-file-media-frame-box[_ngcontent-%COMP%]   iframe[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  border: none;\n}\n\n.mj-file-media-video-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-video-box[_ngcontent-%COMP%]   video[_ngcontent-%COMP%] {\n  max-width: 100%;\n  max-height: 100%;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-audio-box[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 20px;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  box-shadow: var(--mj-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1));\n}\n\n.mj-file-audio-visual-icon[_ngcontent-%COMP%] {\n  font-size: 3rem;\n  color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-media-text-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n  overflow: auto;\n  background: var(--mj-bg-surface);\n}\n\n.mj-file-media-text-box[_ngcontent-%COMP%]   pre[_ngcontent-%COMP%] {\n  margin: 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n  font-size: 0.85rem;\n  line-height: 1.5;\n  white-space: pre-wrap;\n  word-break: break-word;\n}\n\n.mj-file-viewer-fallback[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  border: 1px solid var(--mj-border-default);\n  max-width: 480px;\n}\n\n.mj-file-fallback-icon[_ngcontent-%COMP%] {\n  font-size: 3.5rem;\n  margin-bottom: 14px;\n}\n\n.mj-file-viewer-fallback[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 6px 0;\n  font-size: 1.1rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-fallback-meta[_ngcontent-%COMP%] {\n  margin: 0 0 10px 0;\n  font-size: 0.82rem;\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-fallback-desc[_ngcontent-%COMP%] {\n  margin: 0 0 18px 0;\n  font-size: 0.88rem;\n  color: var(--mj-text-secondary);\n  line-height: 1.4;\n}\n\n\n.mj-file-viewer-sidebar[_ngcontent-%COMP%] {\n  width: 380px;\n  flex-shrink: 0;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.mj-file-sidebar-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 14px 18px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-file-sidebar-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 0.95rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-close[_ngcontent-%COMP%] {\n  background: none;\n  border: none;\n  font-size: 0.95rem;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  padding: 4px;\n}\n\n.mj-file-sidebar-close[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.mj-file-sidebar-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken, #f8fafc);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  padding: 12px 14px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.mj-file-meta-row[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  font-size: 0.83rem;\n  gap: 8px;\n}\n\n.mj-file-meta-label[_ngcontent-%COMP%] {\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n  flex-shrink: 0;\n}\n\n.mj-file-meta-val[_ngcontent-%COMP%] {\n  color: var(--mj-text-primary);\n  text-align: right;\n  word-break: break-all;\n}\n\n.mj-file-sidebar-section[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.mj-file-sidebar-section-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 0.88rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.mj-file-relationship-wrapper[_ngcontent-%COMP%] {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  overflow: hidden;\n  min-height: 250px;\n}\n\n\n.mj-file-standard-form-wrapper[_ngcontent-%COMP%] {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.mj-file-mode-switch-bar[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n\n.mj-file-media-office-box[_ngcontent-%COMP%] {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n.mj-file-media-office-box[_ngcontent-%COMP%]    > mj-docx-preview[_ngcontent-%COMP%], \n.mj-file-media-office-box[_ngcontent-%COMP%]    > mj-xlsx-preview[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  display: block;\n}"] }); }
+        } }, dependencies: [i1.DocxPreviewComponent, i1.XlsxPreviewComponent, i2.MJButtonDirective, i3.MjFormFieldComponent, i3.MjCollapsiblePanelComponent, i3.MjRecordFormContainerComponent, i3.FormPanelSlotComponent, i4.LoadingComponent, i5.DatePipe], styles: [".content-margin[_ngcontent-%COMP%] {\n  margin: 10px;\n}\n\n\na[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%] {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group[_ngcontent-%COMP%] {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin-bottom: 10px;\n}\n\n.record-form-row[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > [_ngcontent-%COMP%]:first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form[_ngcontent-%COMP%]   .record-form-row[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row[_ngcontent-%COMP%] {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n\n.form-panels-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]    > .form-card[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n\n.form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n\n@media (min-width: 1400px) {\n  .form-panels-container[_ngcontent-%COMP%]   .related-entity-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card[_ngcontent-%COMP%] {\n  overflow: hidden;\n}\n\n.collapsible-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header[_ngcontent-%COMP%]   .collapse-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body[_ngcontent-%COMP%] {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed[_ngcontent-%COMP%] {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body[_ngcontent-%COMP%] {\n  padding: 24px;\n}\n\n\n.form-card.related-entity[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-header[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity[_ngcontent-%COMP%]   .collapsible-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n\n\n.form-section-controls[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .control-group[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:active {\n  transform: translateY(0);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%] {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-search[_ngcontent-%COMP%]::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls[_ngcontent-%COMP%]   .section-count[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n\n.form-card.search-hidden[_ngcontent-%COMP%] {\n  display: none;\n}\n\n\n.section-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   .search-highlight[_ngcontent-%COMP%] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge[_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n\n.collapsible-title[_ngcontent-%COMP%]   .row-count-badge.zero-rows[_ngcontent-%COMP%] {\n  background: var(--mj-text-muted);\n}", ".mj-file-viewer-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  background: var(--mj-bg-surface);\n  overflow: hidden;\n}\n\n\n.mj-file-viewer-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 20px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.mj-file-viewer-header-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  min-width: 0;\n}\n\n.mj-file-viewer-icon-box[_ngcontent-%COMP%] {\n  width: 38px;\n  height: 38px;\n  border-radius: var(--mj-radius-md, 8px);\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.25rem;\n  flex-shrink: 0;\n}\n\n.mj-file-color-pdf[_ngcontent-%COMP%] { color: var(--mj-status-danger, #ef4444); }\n.mj-file-color-image[_ngcontent-%COMP%] { color: var(--mj-status-success, #10b981); }\n.mj-file-color-video[_ngcontent-%COMP%] { color: var(--mj-status-purple, #8b5cf6); }\n.mj-file-color-audio[_ngcontent-%COMP%] { color: var(--mj-status-warning, #f59e0b); }\n.mj-file-color-text[_ngcontent-%COMP%] { color: var(--mj-status-info, #3b82f6); }\n.mj-file-color-generic[_ngcontent-%COMP%] { color: var(--mj-text-muted, #94a3b8); }\n.mj-file-color-word[_ngcontent-%COMP%] { color: var(--mj-status-info, #2b579a); }\n.mj-file-color-excel[_ngcontent-%COMP%] { color: var(--mj-status-success, #217346); }\n\n.mj-file-viewer-title-group[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.mj-file-viewer-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 1.1rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.mj-file-viewer-badges[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin-top: 3px;\n}\n\n.mj-file-badge[_ngcontent-%COMP%] {\n  font-size: 0.72rem;\n  font-weight: 600;\n  padding: 2px 7px;\n  border-radius: 9999px;\n}\n\n.mj-file-badge--type[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--size[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--status[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n  color: var(--mj-brand-primary);\n}\n\n.mj-file-viewer-header-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n\n.mj-file-viewer-body[_ngcontent-%COMP%] {\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n  position: relative;\n}\n\n\n.mj-file-viewer-stage[_ngcontent-%COMP%] {\n  flex: 1;\n  position: relative;\n  overflow: auto;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 0;\n}\n\n.mj-file-viewer-loading-overlay[_ngcontent-%COMP%] {\n  position: absolute;\n  inset: 0;\n  z-index: 10;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: opacity 0.3s ease;\n}\n\n.mj-file-media--hidden[_ngcontent-%COMP%] {\n  opacity: 0;\n  pointer-events: none;\n}\n\n.mj-file-media-image-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-image-box[_ngcontent-%COMP%]   img[_ngcontent-%COMP%] {\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-frame-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n}\n\n.mj-file-media-frame-box[_ngcontent-%COMP%]   iframe[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  border: none;\n}\n\n.mj-file-media-video-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-video-box[_ngcontent-%COMP%]   video[_ngcontent-%COMP%] {\n  max-width: 100%;\n  max-height: 100%;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-audio-box[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 20px;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  box-shadow: var(--mj-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1));\n}\n\n.mj-file-audio-visual-icon[_ngcontent-%COMP%] {\n  font-size: 3rem;\n  color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-media-text-box[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n  overflow: auto;\n  background: var(--mj-bg-surface);\n}\n\n.mj-file-media-text-box[_ngcontent-%COMP%]   pre[_ngcontent-%COMP%] {\n  margin: 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n  font-size: 0.85rem;\n  line-height: 1.5;\n  white-space: pre-wrap;\n  word-break: break-word;\n}\n\n.mj-file-viewer-fallback[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  border: 1px solid var(--mj-border-default);\n  max-width: 480px;\n}\n\n.mj-file-fallback-icon[_ngcontent-%COMP%] {\n  font-size: 3.5rem;\n  margin-bottom: 14px;\n}\n\n.mj-file-viewer-fallback[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 6px 0;\n  font-size: 1.1rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-fallback-meta[_ngcontent-%COMP%] {\n  margin: 0 0 10px 0;\n  font-size: 0.82rem;\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-fallback-desc[_ngcontent-%COMP%] {\n  margin: 0 0 18px 0;\n  font-size: 0.88rem;\n  color: var(--mj-text-secondary);\n  line-height: 1.4;\n}\n\n\n.mj-file-viewer-sidebar[_ngcontent-%COMP%] {\n  width: 380px;\n  flex-shrink: 0;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.mj-file-sidebar-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 14px 18px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-file-sidebar-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 0.95rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-close[_ngcontent-%COMP%] {\n  background: none;\n  border: none;\n  font-size: 0.95rem;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  padding: 4px;\n}\n\n.mj-file-sidebar-close[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.mj-file-sidebar-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken, #f8fafc);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  padding: 12px 14px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.mj-file-meta-row[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  font-size: 0.83rem;\n  gap: 8px;\n}\n\n.mj-file-meta-label[_ngcontent-%COMP%] {\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n  flex-shrink: 0;\n}\n\n.mj-file-meta-val[_ngcontent-%COMP%] {\n  color: var(--mj-text-primary);\n  text-align: right;\n  word-break: break-all;\n}\n\n.mj-file-sidebar-section[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.mj-file-sidebar-section-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 0.88rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.mj-file-relationship-wrapper[_ngcontent-%COMP%] {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  overflow: hidden;\n  min-height: 250px;\n}\n\n\n.mj-file-standard-form-wrapper[_ngcontent-%COMP%] {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.mj-file-mode-switch-bar[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n\n.mj-file-media-office-box[_ngcontent-%COMP%] {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n.mj-file-media-office-box[_ngcontent-%COMP%]    > mj-docx-preview[_ngcontent-%COMP%], \n.mj-file-media-office-box[_ngcontent-%COMP%]    > mj-xlsx-preview[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  display: block;\n}"] }); }
 };
 MJFileFormComponentExtended = MJFileFormComponentExtended_1 = __decorate([
     RegisterClass(BaseFormComponent, 'MJ: Files', 100)
@@ -734,7 +734,7 @@ MJFileFormComponentExtended = MJFileFormComponentExtended_1 = __decorate([
 export { MJFileFormComponentExtended };
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJFileFormComponentExtended, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-file-form-extended', template: "@if (!ViewStandardForm) {\n  <div class=\"mj-file-viewer-container\">\n    <!-- Top Action & Info Header -->\n    <header class=\"mj-file-viewer-header\">\n      <div class=\"mj-file-viewer-header-left\">\n        <div class=\"mj-file-viewer-icon-box\">\n          <i [class]=\"FileIconClass\"></i>\n        </div>\n        <div class=\"mj-file-viewer-title-group\">\n          <h1 class=\"mj-file-viewer-title\" [title]=\"record.Name\">{{ record.Name }}</h1>\n          <div class=\"mj-file-viewer-badges\">\n            <span class=\"mj-file-badge mj-file-badge--type\">{{ record.ContentType || 'Document' }}</span>\n            @if (FileSizeLabel; as size) {\n              <span class=\"mj-file-badge mj-file-badge--size\">{{ size }}</span>\n            }\n            @if (record.Status) {\n              <span class=\"mj-file-badge mj-file-badge--status\">{{ record.Status }}</span>\n            }\n          </div>\n        </div>\n      </div>\n\n      <div class=\"mj-file-viewer-header-right\">\n        @if (MediaUrl) {\n          <button type=\"button\" mjButton variant=\"secondary\" size=\"sm\" (click)=\"OpenInExternalTab()\" title=\"Open file in new browser tab\">\n            <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n            <span>Open in New Tab</span>\n          </button>\n        }\n        <button type=\"button\" mjButton variant=\"secondary\" size=\"sm\" (click)=\"ToggleDetailsSidebar()\" [title]=\"ShowDetailsSidebar ? 'Hide Details' : 'Show Details'\">\n          <i class=\"fa-solid fa-circle-info\"></i>\n          <span>{{ ShowDetailsSidebar ? 'Hide Details' : 'Details' }}</span>\n        </button>\n        @if (UserCanEdit) {\n          <button type=\"button\" mjButton variant=\"tertiary\" size=\"sm\" (click)=\"ToggleViewMode()\" title=\"Switch to full record editor\">\n            <i class=\"fa-solid fa-pen-to-square\"></i>\n            <span>Edit Record</span>\n          </button>\n        }\n      </div>\n    </header>\n\n    <!-- Body / Split Content Area -->\n    <div class=\"mj-file-viewer-body\">\n      <!-- Media Stage -->\n      <main class=\"mj-file-viewer-stage\">\n        @if (IsLoadingMedia || !IsMediaLoaded) {\n          <div class=\"mj-file-viewer-loading-overlay\">\n            <mj-loading [text]=\"'Loading ' + (record.Name || 'file') + '...'\"></mj-loading>\n          </div>\n        }\n\n        @switch (MediaType) {\n          @case ('image') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-image-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <img [src]=\"MediaUrl\" [alt]=\"record.Name\" (load)=\"OnMediaElementLoaded()\" (error)=\"OnMediaElementLoaded()\" />\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-image mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Image preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('pdf') {\n            @if (SafeMediaUrl) {\n              <div class=\"mj-file-media-frame-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <iframe [src]=\"SafeMediaUrl\" title=\"Document Preview\" (load)=\"OnMediaElementLoaded()\"></iframe>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-pdf mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>PDF preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('video') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-video-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <video controls autoplay [src]=\"MediaUrl\" (loadeddata)=\"OnMediaElementLoaded()\" (error)=\"OnMediaElementLoaded()\"></video>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-video mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Video preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('audio') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-audio-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <div class=\"mj-file-audio-visual-icon\"><i class=\"fa-solid fa-headphones\"></i></div>\n                <audio controls [src]=\"MediaUrl\" (loadeddata)=\"OnMediaElementLoaded()\" (error)=\"OnMediaElementLoaded()\"></audio>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-audio mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Audio preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('text') {\n            <div class=\"mj-file-media-text-box\">\n              <pre><code>{{ TextContent || 'Loading text content...' }}</code></pre>\n            </div>\n          }\n          @case ('docx') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-office-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <mj-docx-preview [Url]=\"MediaUrl\" (Loaded)=\"OnMediaElementLoaded()\" (Failed)=\"OnMediaElementLoaded()\"></mj-docx-preview>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-word mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Document preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('xlsx') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-office-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <mj-xlsx-preview [Url]=\"MediaUrl\" (Loaded)=\"OnMediaElementLoaded()\" (Failed)=\"OnMediaElementLoaded()\"></mj-xlsx-preview>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-excel mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Workbook preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @default {\n            <div class=\"mj-file-viewer-fallback\">\n              <i [class]=\"FileIconClass\" class=\"mj-file-fallback-icon\"></i>\n              <h3>{{ record.Name }}</h3>\n              <p class=\"mj-file-fallback-meta\">{{ record.ContentType || 'Document' }}@if (FileSizeLabel; as size) { &bull; {{ size }}}</p>\n              <p class=\"mj-file-fallback-desc\">{{ record.Description || 'Preview is not available for this file type.' }}</p>\n              @if (MediaUrl) {\n                <button type=\"button\" mjButton variant=\"primary\" (click)=\"OpenInExternalTab()\">\n                  <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n                  <span>Open in Browser</span>\n                </button>\n              }\n            </div>\n          }\n        }\n      </main>\n\n      <!-- Details & Linked Records Sidebar -->\n      @if (ShowDetailsSidebar) {\n        <aside class=\"mj-file-viewer-sidebar\">\n          <div class=\"mj-file-sidebar-header\">\n            <h3>File Details & Links</h3>\n            <button type=\"button\" class=\"mj-file-sidebar-close\" (click)=\"ToggleDetailsSidebar()\" title=\"Collapse Sidebar\">\n              <i class=\"fa-solid fa-xmark\"></i>\n            </button>\n          </div>\n\n          <div class=\"mj-file-sidebar-content\">\n            <!-- Metadata Cards -->\n            <div class=\"mj-file-sidebar-card\">\n              <div class=\"mj-file-meta-row\">\n                <span class=\"mj-file-meta-label\">File Name:</span>\n                <span class=\"mj-file-meta-val font-semibold\">{{ record.Name }}</span>\n              </div>\n              @if (record.Description) {\n                <div class=\"mj-file-meta-row\">\n                  <span class=\"mj-file-meta-label\">Description:</span>\n                  <span class=\"mj-file-meta-val\">{{ record.Description }}</span>\n                </div>\n              }\n              <div class=\"mj-file-meta-row\">\n                <span class=\"mj-file-meta-label\">MIME Type:</span>\n                <span class=\"mj-file-meta-val font-mono\">{{ record.ContentType || 'Unknown' }}</span>\n              </div>\n              @if (FileSizeLabel; as size) {\n                <div class=\"mj-file-meta-row\">\n                  <span class=\"mj-file-meta-label\">Size:</span>\n                  <span class=\"mj-file-meta-val\">{{ size }}</span>\n                </div>\n              }\n              @if (record.Status) {\n                <div class=\"mj-file-meta-row\">\n                  <span class=\"mj-file-meta-label\">Status:</span>\n                  <span class=\"mj-file-meta-val\">{{ record.Status }}</span>\n                </div>\n              }\n              <div class=\"mj-file-meta-row\">\n                <span class=\"mj-file-meta-label\">Created:</span>\n                <span class=\"mj-file-meta-val\">{{ record.__mj_CreatedAt | date:'short' }}</span>\n              </div>\n            </div>\n\n            <!-- Linked Records -->\n            <div class=\"mj-file-sidebar-section\">\n              <h4 class=\"mj-file-sidebar-section-title\">\n                <i class=\"fa-solid fa-link\"></i>\n                <span>Linked Records</span>\n              </h4>\n              <div class=\"mj-file-relationship-wrapper\">\n                <mj-relationship-view \n                  [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: File Entity Record Links', 'FileID')\"\n                  [NewRecordValues]=\"NewRecordValues('MJ: File Entity Record Links', 'FileID')\">\n                </mj-relationship-view>\n              </div>\n            </div>\n          </div>\n        </aside>\n      }\n    </div>\n  </div>\n} @else {\n  <div class=\"mj-file-standard-form-wrapper\">\n    <div class=\"mj-file-mode-switch-bar\">\n      <button type=\"button\" mjButton variant=\"secondary\" size=\"sm\" (click)=\"ToggleViewMode()\">\n        <i class=\"fa-solid fa-arrow-left\"></i>\n        <span>Return to File Preview</span>\n      </button>\n    </div>\n\n    <mj-record-form-container [Record]=\"record\" [FormComponent]=\"this\"\n        (Navigate)=\"OnFormNavigate($event)\"\n        (DeleteRequested)=\"OnDeleteRequested()\"\n        (FavoriteToggled)=\"OnFavoriteToggled()\"\n        (HistoryRequested)=\"OnHistoryRequested()\"\n        (ListManagementRequested)=\"OnListManagementRequested()\">\n\n        <mj-form-panel-slot Entity=\"{{record.EntityInfo.Name}}\" Slot=\"before-fields\" [Record]=\"record\" [FormComponent]=\"this\" [FormContext]=\"formContext\"></mj-form-panel-slot>\n\n        <!-- File Basics Section -->\n        <mj-collapsible-panel\n            SectionKey=\"fileBasics\"\n            SectionName=\"File Basics\"\n            Icon=\"fa fa-file\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"Name\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"Description\"\n                Type=\"textarea\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n        </mj-collapsible-panel>\n\n        <!-- Classification & Status Section -->\n        <mj-collapsible-panel\n            SectionKey=\"classificationStatus\"\n            SectionName=\"Classification & Status\"\n            Icon=\"fa fa-tags\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"CategoryID\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n                LinkType=\"Record\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"Status\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n        </mj-collapsible-panel>\n\n        <!-- Storage Details Section -->\n        <mj-collapsible-panel\n            SectionKey=\"storageDetails\"\n            SectionName=\"Storage Details\"\n            Icon=\"fa fa-database\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"ProviderID\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n                LinkType=\"Record\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"ProviderKey\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"ContentType\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n        </mj-collapsible-panel>\n\n        <!-- Linked Records Section -->\n        <mj-collapsible-panel\n            SectionKey=\"mJFileEntityRecordLinks\"\n            SectionName=\"File Entity Record Links\"\n            Icon=\"fa fa-link\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-relationship-view \n                [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: File Entity Record Links','FileID')\"\n                [NewRecordValues]=\"NewRecordValues('MJ: File Entity Record Links','FileID')\">\n            </mj-relationship-view>\n        </mj-collapsible-panel>\n\n        <mj-form-panel-slot Entity=\"{{record.EntityInfo.Name}}\" Slot=\"after-fields\" [Record]=\"record\" [FormComponent]=\"this\" [FormContext]=\"formContext\"></mj-form-panel-slot>\n    </mj-record-form-container>\n  </div>\n}\n", styles: [".k-pane {\n  background-color: var(--mj-bg-surface);\n}\n\n.content-margin {\n  margin: 10px;\n}\n\n\na {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon {\n  margin-right: 5px;\n}\n\n.record-form {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton {\n  margin-right: 5px;\n}\n\n.record-form h2 {\n  margin-bottom: 10px;\n}\n\n.k-splitter {\n  border-width: 0px;\n}\n\n.record-form-row {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form .record-form-row > :first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form .record-form-row > span {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row label {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n/* Collapsible Panel Styles */\n.form-panels-container {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n/* All field sections take full width */\n.form-panels-container > .form-card {\n  width: 100%;\n}\n\n/* Related entity grid container - responsive layout */\n.form-panels-container .related-entity-grid {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n/* Responsive multi-column layout for related entities on wider screens */\n@media (min-width: 1400px) {\n  .form-panels-container .related-entity-grid {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card {\n  overflow: hidden;\n}\n\n.collapsible-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title i {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header .collapse-icon {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body {\n  padding: 24px;\n}\n\n/* Related Entity Sections - Visual Distinction */\n.form-card.related-entity {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-header {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity .collapsible-header:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-title i {\n  color: var(--mj-brand-primary);\n}\n\n/* Section Controls */\n.form-section-controls {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls .control-group {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls button {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls button:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls button:active {\n  transform: translateY(0);\n}\n\n.form-section-controls button i {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls .section-search {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls .section-search:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls .section-search::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls .section-count {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n/* Hidden sections for search filter */\n.form-card.search-hidden {\n  display: none;\n}\n\n/* Section count badge */\n.section-count-badge {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n/* Search highlighting in section names */\n.collapsible-title h3 .search-highlight {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n/* Row count badge in section headers */\n.collapsible-title .row-count-badge {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n/* Gray badge for zero rows (loaded but empty) */\n.collapsible-title .row-count-badge.zero-rows {\n  background: var(--mj-text-muted);\n}\n", ".mj-file-viewer-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  background: var(--mj-bg-surface);\n  overflow: hidden;\n}\n\n/* Header */\n.mj-file-viewer-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 20px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.mj-file-viewer-header-left {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  min-width: 0;\n}\n\n.mj-file-viewer-icon-box {\n  width: 38px;\n  height: 38px;\n  border-radius: var(--mj-radius-md, 8px);\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.25rem;\n  flex-shrink: 0;\n}\n\n.mj-file-color-pdf { color: var(--mj-status-danger, #ef4444); }\n.mj-file-color-image { color: var(--mj-status-success, #10b981); }\n.mj-file-color-video { color: var(--mj-status-purple, #8b5cf6); }\n.mj-file-color-audio { color: var(--mj-status-warning, #f59e0b); }\n.mj-file-color-text { color: var(--mj-status-info, #3b82f6); }\n.mj-file-color-generic { color: var(--mj-text-muted, #94a3b8); }\n.mj-file-color-word { color: var(--mj-status-info, #2b579a); }\n.mj-file-color-excel { color: var(--mj-status-success, #217346); }\n\n.mj-file-viewer-title-group {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.mj-file-viewer-title {\n  margin: 0;\n  font-size: 1.1rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.mj-file-viewer-badges {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin-top: 3px;\n}\n\n.mj-file-badge {\n  font-size: 0.72rem;\n  font-weight: 600;\n  padding: 2px 7px;\n  border-radius: 9999px;\n}\n\n.mj-file-badge--type {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--size {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--status {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n  color: var(--mj-brand-primary);\n}\n\n.mj-file-viewer-header-right {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n/* Body / Split View */\n.mj-file-viewer-body {\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n  position: relative;\n}\n\n/* Stage (Media Preview) */\n.mj-file-viewer-stage {\n  flex: 1;\n  position: relative;\n  overflow: auto;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 0;\n}\n\n.mj-file-viewer-loading-overlay {\n  position: absolute;\n  inset: 0;\n  z-index: 10;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: opacity 0.3s ease;\n}\n\n.mj-file-media--hidden {\n  opacity: 0;\n  pointer-events: none;\n}\n\n.mj-file-media-image-box {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-image-box img {\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-frame-box {\n  width: 100%;\n  height: 100%;\n}\n\n.mj-file-media-frame-box iframe {\n  width: 100%;\n  height: 100%;\n  border: none;\n}\n\n.mj-file-media-video-box {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-video-box video {\n  max-width: 100%;\n  max-height: 100%;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-audio-box {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 20px;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  box-shadow: var(--mj-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1));\n}\n\n.mj-file-audio-visual-icon {\n  font-size: 3rem;\n  color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-media-text-box {\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n  overflow: auto;\n  background: var(--mj-bg-surface);\n}\n\n.mj-file-media-text-box pre {\n  margin: 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n  font-size: 0.85rem;\n  line-height: 1.5;\n  white-space: pre-wrap;\n  word-break: break-word;\n}\n\n.mj-file-viewer-fallback {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  border: 1px solid var(--mj-border-default);\n  max-width: 480px;\n}\n\n.mj-file-fallback-icon {\n  font-size: 3.5rem;\n  margin-bottom: 14px;\n}\n\n.mj-file-viewer-fallback h3 {\n  margin: 0 0 6px 0;\n  font-size: 1.1rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-fallback-meta {\n  margin: 0 0 10px 0;\n  font-size: 0.82rem;\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-fallback-desc {\n  margin: 0 0 18px 0;\n  font-size: 0.88rem;\n  color: var(--mj-text-secondary);\n  line-height: 1.4;\n}\n\n/* Sidebar */\n.mj-file-viewer-sidebar {\n  width: 380px;\n  flex-shrink: 0;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.mj-file-sidebar-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 14px 18px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-file-sidebar-header h3 {\n  margin: 0;\n  font-size: 0.95rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-close {\n  background: none;\n  border: none;\n  font-size: 0.95rem;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  padding: 4px;\n}\n\n.mj-file-sidebar-close:hover {\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.mj-file-sidebar-card {\n  background: var(--mj-bg-surface-sunken, #f8fafc);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  padding: 12px 14px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.mj-file-meta-row {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  font-size: 0.83rem;\n  gap: 8px;\n}\n\n.mj-file-meta-label {\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n  flex-shrink: 0;\n}\n\n.mj-file-meta-val {\n  color: var(--mj-text-primary);\n  text-align: right;\n  word-break: break-all;\n}\n\n.mj-file-sidebar-section {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.mj-file-sidebar-section-title {\n  margin: 0;\n  font-size: 0.88rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.mj-file-relationship-wrapper {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  overflow: hidden;\n  min-height: 250px;\n}\n\n/* Standard Form Wrapper */\n.mj-file-standard-form-wrapper {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.mj-file-mode-switch-bar {\n  padding: 8px 16px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n/* Word and Excel previews fill the stage; the shared components scroll inside it */\n.mj-file-media-office-box {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n.mj-file-media-office-box > mj-docx-preview,\n.mj-file-media-office-box > mj-xlsx-preview {\n  flex: 1;\n  min-height: 0;\n  display: block;\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-file-form-extended', template: "@if (!ViewStandardForm) {\n  <div class=\"mj-file-viewer-container\">\n    <!-- Top Action & Info Header -->\n    <header class=\"mj-file-viewer-header\">\n      <div class=\"mj-file-viewer-header-left\">\n        <div class=\"mj-file-viewer-icon-box\">\n          <i [class]=\"FileIconClass\"></i>\n        </div>\n        <div class=\"mj-file-viewer-title-group\">\n          <h1 class=\"mj-file-viewer-title\" [title]=\"record.Name\">{{ record.Name }}</h1>\n          <div class=\"mj-file-viewer-badges\">\n            <span class=\"mj-file-badge mj-file-badge--type\">{{ record.ContentType || 'Document' }}</span>\n            @if (FileSizeLabel; as size) {\n              <span class=\"mj-file-badge mj-file-badge--size\">{{ size }}</span>\n            }\n            @if (record.Status) {\n              <span class=\"mj-file-badge mj-file-badge--status\">{{ record.Status }}</span>\n            }\n          </div>\n        </div>\n      </div>\n\n      <div class=\"mj-file-viewer-header-right\">\n        @if (MediaUrl) {\n          <button type=\"button\" mjButton variant=\"secondary\" size=\"sm\" (click)=\"OpenInExternalTab()\" title=\"Open file in new browser tab\">\n            <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n            <span>Open in New Tab</span>\n          </button>\n        }\n        <button type=\"button\" mjButton variant=\"secondary\" size=\"sm\" (click)=\"ToggleDetailsSidebar()\" [title]=\"ShowDetailsSidebar ? 'Hide Details' : 'Show Details'\">\n          <i class=\"fa-solid fa-circle-info\"></i>\n          <span>{{ ShowDetailsSidebar ? 'Hide Details' : 'Details' }}</span>\n        </button>\n        @if (UserCanEdit) {\n          <button type=\"button\" mjButton variant=\"tertiary\" size=\"sm\" (click)=\"ToggleViewMode()\" title=\"Switch to full record editor\">\n            <i class=\"fa-solid fa-pen-to-square\"></i>\n            <span>Edit Record</span>\n          </button>\n        }\n      </div>\n    </header>\n\n    <!-- Body / Split Content Area -->\n    <div class=\"mj-file-viewer-body\">\n      <!-- Media Stage -->\n      <main class=\"mj-file-viewer-stage\">\n        @if (IsLoadingMedia || !IsMediaLoaded) {\n          <div class=\"mj-file-viewer-loading-overlay\">\n            <mj-loading [text]=\"'Loading ' + (record.Name || 'file') + '...'\"></mj-loading>\n          </div>\n        }\n\n        @switch (MediaType) {\n          @case ('image') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-image-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <img [src]=\"MediaUrl\" [alt]=\"record.Name\" (load)=\"OnMediaElementLoaded()\" (error)=\"OnMediaElementLoaded()\" />\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-image mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Image preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('pdf') {\n            @if (SafeMediaUrl) {\n              <div class=\"mj-file-media-frame-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <iframe [src]=\"SafeMediaUrl\" title=\"Document Preview\" (load)=\"OnMediaElementLoaded()\"></iframe>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-pdf mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>PDF preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('video') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-video-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <video controls autoplay [src]=\"MediaUrl\" (loadeddata)=\"OnMediaElementLoaded()\" (error)=\"OnMediaElementLoaded()\"></video>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-video mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Video preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('audio') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-audio-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <div class=\"mj-file-audio-visual-icon\"><i class=\"fa-solid fa-headphones\"></i></div>\n                <audio controls [src]=\"MediaUrl\" (loadeddata)=\"OnMediaElementLoaded()\" (error)=\"OnMediaElementLoaded()\"></audio>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-audio mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Audio preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('text') {\n            <div class=\"mj-file-media-text-box\">\n              <pre><code>{{ TextContent || 'Loading text content...' }}</code></pre>\n            </div>\n          }\n          @case ('docx') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-office-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <mj-docx-preview [Url]=\"MediaUrl\" (Loaded)=\"OnMediaElementLoaded()\" (Failed)=\"OnMediaElementLoaded()\"></mj-docx-preview>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-word mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Document preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @case ('xlsx') {\n            @if (MediaUrl) {\n              <div class=\"mj-file-media-office-box\" [class.mj-file-media--hidden]=\"!IsMediaLoaded\">\n                <mj-xlsx-preview [Url]=\"MediaUrl\" (Loaded)=\"OnMediaElementLoaded()\" (Failed)=\"OnMediaElementLoaded()\"></mj-xlsx-preview>\n              </div>\n            } @else {\n              <div class=\"mj-file-viewer-fallback\">\n                <i class=\"fa-solid fa-file-excel mj-file-fallback-icon\"></i>\n                <h3>{{ record.Name }}</h3>\n                <p>Workbook preview could not be loaded.</p>\n              </div>\n            }\n          }\n          @default {\n            <div class=\"mj-file-viewer-fallback\">\n              <i [class]=\"FileIconClass\" class=\"mj-file-fallback-icon\"></i>\n              <h3>{{ record.Name }}</h3>\n              <p class=\"mj-file-fallback-meta\">{{ record.ContentType || 'Document' }}@if (FileSizeLabel; as size) { &bull; {{ size }}}</p>\n              <p class=\"mj-file-fallback-desc\">{{ record.Description || 'Preview is not available for this file type.' }}</p>\n              @if (MediaUrl) {\n                <button type=\"button\" mjButton variant=\"primary\" (click)=\"OpenInExternalTab()\">\n                  <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n                  <span>Open in Browser</span>\n                </button>\n              }\n            </div>\n          }\n        }\n      </main>\n\n      <!-- Details & Linked Records Sidebar -->\n      @if (ShowDetailsSidebar) {\n        <aside class=\"mj-file-viewer-sidebar\">\n          <div class=\"mj-file-sidebar-header\">\n            <h3>File Details & Links</h3>\n            <button type=\"button\" class=\"mj-file-sidebar-close\" (click)=\"ToggleDetailsSidebar()\" title=\"Collapse Sidebar\">\n              <i class=\"fa-solid fa-xmark\"></i>\n            </button>\n          </div>\n\n          <div class=\"mj-file-sidebar-content\">\n            <!-- Metadata Cards -->\n            <div class=\"mj-file-sidebar-card\">\n              <div class=\"mj-file-meta-row\">\n                <span class=\"mj-file-meta-label\">File Name:</span>\n                <span class=\"mj-file-meta-val font-semibold\">{{ record.Name }}</span>\n              </div>\n              @if (record.Description) {\n                <div class=\"mj-file-meta-row\">\n                  <span class=\"mj-file-meta-label\">Description:</span>\n                  <span class=\"mj-file-meta-val\">{{ record.Description }}</span>\n                </div>\n              }\n              <div class=\"mj-file-meta-row\">\n                <span class=\"mj-file-meta-label\">MIME Type:</span>\n                <span class=\"mj-file-meta-val font-mono\">{{ record.ContentType || 'Unknown' }}</span>\n              </div>\n              @if (FileSizeLabel; as size) {\n                <div class=\"mj-file-meta-row\">\n                  <span class=\"mj-file-meta-label\">Size:</span>\n                  <span class=\"mj-file-meta-val\">{{ size }}</span>\n                </div>\n              }\n              @if (record.Status) {\n                <div class=\"mj-file-meta-row\">\n                  <span class=\"mj-file-meta-label\">Status:</span>\n                  <span class=\"mj-file-meta-val\">{{ record.Status }}</span>\n                </div>\n              }\n              <div class=\"mj-file-meta-row\">\n                <span class=\"mj-file-meta-label\">Created:</span>\n                <span class=\"mj-file-meta-val\">{{ record.__mj_CreatedAt | date:'short' }}</span>\n              </div>\n            </div>\n\n            <!-- Linked Records -->\n            <div class=\"mj-file-sidebar-section\">\n              <h4 class=\"mj-file-sidebar-section-title\">\n                <i class=\"fa-solid fa-link\"></i>\n                <span>Linked Records</span>\n              </h4>\n              <div class=\"mj-file-relationship-wrapper\">\n                <mj-relationship-view \n                  [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: File Entity Record Links', 'FileID')\"\n                  [NewRecordValues]=\"NewRecordValues('MJ: File Entity Record Links', 'FileID')\">\n                </mj-relationship-view>\n              </div>\n            </div>\n          </div>\n        </aside>\n      }\n    </div>\n  </div>\n} @else {\n  <div class=\"mj-file-standard-form-wrapper\">\n    <div class=\"mj-file-mode-switch-bar\">\n      <button type=\"button\" mjButton variant=\"secondary\" size=\"sm\" (click)=\"ToggleViewMode()\">\n        <i class=\"fa-solid fa-arrow-left\"></i>\n        <span>Return to File Preview</span>\n      </button>\n    </div>\n\n    <mj-record-form-container [Record]=\"record\" [FormComponent]=\"this\"\n        (Navigate)=\"OnFormNavigate($event)\"\n        (DeleteRequested)=\"OnDeleteRequested()\"\n        (FavoriteToggled)=\"OnFavoriteToggled()\"\n        (HistoryRequested)=\"OnHistoryRequested()\"\n        (ListManagementRequested)=\"OnListManagementRequested()\">\n\n        <mj-form-panel-slot Entity=\"{{record.EntityInfo.Name}}\" Slot=\"before-fields\" [Record]=\"record\" [FormComponent]=\"this\" [FormContext]=\"formContext\"></mj-form-panel-slot>\n\n        <!-- File Basics Section -->\n        <mj-collapsible-panel\n            SectionKey=\"fileBasics\"\n            SectionName=\"File Basics\"\n            Icon=\"fa fa-file\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"Name\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"Description\"\n                Type=\"textarea\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n        </mj-collapsible-panel>\n\n        <!-- Classification & Status Section -->\n        <mj-collapsible-panel\n            SectionKey=\"classificationStatus\"\n            SectionName=\"Classification & Status\"\n            Icon=\"fa fa-tags\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"CategoryID\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n                LinkType=\"Record\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"Status\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n        </mj-collapsible-panel>\n\n        <!-- Storage Details Section -->\n        <mj-collapsible-panel\n            SectionKey=\"storageDetails\"\n            SectionName=\"Storage Details\"\n            Icon=\"fa fa-database\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"ProviderID\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n                LinkType=\"Record\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"ProviderKey\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n            <mj-form-field \n                [Record]=\"record\"\n                [ShowLabel]=\"true\"\n                FieldName=\"ContentType\"\n                Type=\"textbox\"\n                [EditMode]=\"EditMode\"\n                [FormContext]=\"formContext\"\n            ></mj-form-field>\n        </mj-collapsible-panel>\n\n        <!-- Linked Records Section -->\n        <mj-collapsible-panel\n            SectionKey=\"mJFileEntityRecordLinks\"\n            SectionName=\"File Entity Record Links\"\n            Icon=\"fa fa-link\"\n            [Form]=\"this\"\n            [FormContext]=\"formContext\">\n            <mj-relationship-view \n                [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: File Entity Record Links','FileID')\"\n                [NewRecordValues]=\"NewRecordValues('MJ: File Entity Record Links','FileID')\">\n            </mj-relationship-view>\n        </mj-collapsible-panel>\n\n        <mj-form-panel-slot Entity=\"{{record.EntityInfo.Name}}\" Slot=\"after-fields\" [Record]=\"record\" [FormComponent]=\"this\" [FormContext]=\"formContext\"></mj-form-panel-slot>\n    </mj-record-form-container>\n  </div>\n}\n", styles: [".content-margin {\n  margin: 10px;\n}\n\n\na {\n  font-size: 14px;\n  font-weight: bolder;\n}\n\n.tab-header-icon {\n  margin-right: 5px;\n}\n\n.record-form {\n  display: block;\n  flex-direction: column;\n  background-color: var(--mj-bg-surface);\n  padding: 0;\n  min-height: 100vh;\n}\n\n.record-form-group {\n  margin-top: 0px;\n  background-color: var(--mj-bg-surface);\n}\n\nbutton {\n  margin-right: 5px;\n}\n\n.record-form h2 {\n  margin-bottom: 10px;\n}\n\n.record-form-row {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n  gap: 10px;\n  margin-bottom: 12px;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.record-form .record-form-row > :first-child {\n  font-weight: bold;\n  padding-right: 10px;\n}\n\n.record-form .record-form-row > span {\n  white-space: pre-line;\n  max-height: 300px;\n  overflow: auto;\n}\n\n@media (min-width: 768px) {\n  .record-form-row {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .record-form-row label {\n    width: 240px;\n    margin-bottom: 0;\n  }\n}\n\n/* Collapsible Panel Styles */\n.form-panels-container {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  background-color: var(--mj-bg-surface);\n}\n\n/* All field sections take full width */\n.form-panels-container > .form-card {\n  width: 100%;\n}\n\n/* Related entity grid container - responsive layout */\n.form-panels-container .related-entity-grid {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 16px;\n  width: 100%;\n}\n\n/* Responsive multi-column layout for related entities on wider screens */\n@media (min-width: 1400px) {\n  .form-panels-container .related-entity-grid {\n    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));\n  }\n}\n\n.form-card {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: 0 2px 4px var(--mj-shadow-sm);\n  overflow: hidden;\n}\n\n.collapsible-card {\n  overflow: hidden;\n}\n\n.collapsible-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 24px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  cursor: pointer;\n  user-select: none;\n  transition: all 0.3s ease;\n}\n\n.collapsible-header:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.collapsible-title {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n}\n\n.collapsible-title i {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n.collapsible-title h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.collapsible-header .collapse-icon {\n  color: var(--mj-text-muted);\n  transition: transform 0.3s ease;\n}\n\n.collapsible-body {\n  max-height: 2000px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.3s ease;\n  opacity: 1;\n}\n\n.collapsible-body.collapsed {\n  max-height: 0;\n  padding: 0;\n  opacity: 0;\n}\n\n.form-body {\n  padding: 24px;\n}\n\n/* Related Entity Sections - Visual Distinction */\n.form-card.related-entity {\n  background: var(--mj-bg-surface-card);\n  border-left: 3px solid var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-header {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.form-card.related-entity .collapsible-header:hover {\n  background: var(--mj-bg-surface-card);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.form-card.related-entity .collapsible-title i {\n  color: var(--mj-brand-primary);\n}\n\n/* Section Controls */\n.form-section-controls {\n  display: flex;\n  gap: 10px;\n  padding: 14px 18px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 2px solid var(--mj-border-default);\n  align-items: center;\n  flex-wrap: wrap;\n  box-shadow: 0 1px 3px var(--mj-shadow-sm);\n}\n\n.form-section-controls .control-group {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.form-section-controls button {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.2s;\n  margin-right: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-weight: 500;\n}\n\n.form-section-controls button:hover {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px var(--mj-shadow-md);\n}\n\n.form-section-controls button:active {\n  transform: translateY(0);\n}\n\n.form-section-controls button i {\n  margin-right: 0;\n  font-size: 14px;\n}\n\n.form-section-controls .section-search {\n  padding: 8px 14px;\n  font-size: 13px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  width: 240px;\n  transition: all 0.2s;\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n}\n\n.form-section-controls .section-search:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.form-section-controls .section-search::placeholder {\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n.form-section-controls .section-count {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  margin-left: auto;\n  font-weight: 500;\n}\n\n/* Hidden sections for search filter */\n.form-card.search-hidden {\n  display: none;\n}\n\n/* Section count badge */\n.section-count-badge {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  padding: 2px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n/* Search highlighting in section names */\n.collapsible-title h3 .search-highlight {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-text-primary);\n  padding: 2px 4px;\n  border-radius: 3px;\n  font-weight: 700;\n}\n\n/* Row count badge in section headers */\n.collapsible-title .row-count-badge {\n  background: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n  padding: 3px 6px 2px 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n  margin-left: 8px;\n  vertical-align: middle;\n  position: relative;\n  top: -2px;\n  display: inline-block;\n  line-height: 1;\n}\n\n/* Gray badge for zero rows (loaded but empty) */\n.collapsible-title .row-count-badge.zero-rows {\n  background: var(--mj-text-muted);\n}\n", ".mj-file-viewer-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  background: var(--mj-bg-surface);\n  overflow: hidden;\n}\n\n/* Header */\n.mj-file-viewer-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 20px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.mj-file-viewer-header-left {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  min-width: 0;\n}\n\n.mj-file-viewer-icon-box {\n  width: 38px;\n  height: 38px;\n  border-radius: var(--mj-radius-md, 8px);\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.25rem;\n  flex-shrink: 0;\n}\n\n.mj-file-color-pdf { color: var(--mj-status-danger, #ef4444); }\n.mj-file-color-image { color: var(--mj-status-success, #10b981); }\n.mj-file-color-video { color: var(--mj-status-purple, #8b5cf6); }\n.mj-file-color-audio { color: var(--mj-status-warning, #f59e0b); }\n.mj-file-color-text { color: var(--mj-status-info, #3b82f6); }\n.mj-file-color-generic { color: var(--mj-text-muted, #94a3b8); }\n.mj-file-color-word { color: var(--mj-status-info, #2b579a); }\n.mj-file-color-excel { color: var(--mj-status-success, #217346); }\n\n.mj-file-viewer-title-group {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.mj-file-viewer-title {\n  margin: 0;\n  font-size: 1.1rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.mj-file-viewer-badges {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin-top: 3px;\n}\n\n.mj-file-badge {\n  font-size: 0.72rem;\n  font-weight: 600;\n  padding: 2px 7px;\n  border-radius: 9999px;\n}\n\n.mj-file-badge--type {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--size {\n  background: var(--mj-bg-surface-sunken, #e2e8f0);\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-badge--status {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n  color: var(--mj-brand-primary);\n}\n\n.mj-file-viewer-header-right {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n/* Body / Split View */\n.mj-file-viewer-body {\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n  position: relative;\n}\n\n/* Stage (Media Preview) */\n.mj-file-viewer-stage {\n  flex: 1;\n  position: relative;\n  overflow: auto;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 0;\n}\n\n.mj-file-viewer-loading-overlay {\n  position: absolute;\n  inset: 0;\n  z-index: 10;\n  background: var(--mj-bg-surface-sunken, #f1f5f9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: opacity 0.3s ease;\n}\n\n.mj-file-media--hidden {\n  opacity: 0;\n  pointer-events: none;\n}\n\n.mj-file-media-image-box {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-image-box img {\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-frame-box {\n  width: 100%;\n  height: 100%;\n}\n\n.mj-file-media-frame-box iframe {\n  width: 100%;\n  height: 100%;\n  border: none;\n}\n\n.mj-file-media-video-box {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 24px;\n}\n\n.mj-file-media-video-box video {\n  max-width: 100%;\n  max-height: 100%;\n  border-radius: var(--mj-radius-md, 8px);\n  box-shadow: var(--mj-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.2));\n}\n\n.mj-file-media-audio-box {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 20px;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  box-shadow: var(--mj-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1));\n}\n\n.mj-file-audio-visual-icon {\n  font-size: 3rem;\n  color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-media-text-box {\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n  overflow: auto;\n  background: var(--mj-bg-surface);\n}\n\n.mj-file-media-text-box pre {\n  margin: 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n  font-size: 0.85rem;\n  line-height: 1.5;\n  white-space: pre-wrap;\n  word-break: break-word;\n}\n\n.mj-file-viewer-fallback {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: 40px;\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-lg, 12px);\n  border: 1px solid var(--mj-border-default);\n  max-width: 480px;\n}\n\n.mj-file-fallback-icon {\n  font-size: 3.5rem;\n  margin-bottom: 14px;\n}\n\n.mj-file-viewer-fallback h3 {\n  margin: 0 0 6px 0;\n  font-size: 1.1rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-fallback-meta {\n  margin: 0 0 10px 0;\n  font-size: 0.82rem;\n  color: var(--mj-text-secondary);\n}\n\n.mj-file-fallback-desc {\n  margin: 0 0 18px 0;\n  font-size: 0.88rem;\n  color: var(--mj-text-secondary);\n  line-height: 1.4;\n}\n\n/* Sidebar */\n.mj-file-viewer-sidebar {\n  width: 380px;\n  flex-shrink: 0;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.mj-file-sidebar-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 14px 18px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-file-sidebar-header h3 {\n  margin: 0;\n  font-size: 0.95rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-close {\n  background: none;\n  border: none;\n  font-size: 0.95rem;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  padding: 4px;\n}\n\n.mj-file-sidebar-close:hover {\n  color: var(--mj-text-primary);\n}\n\n.mj-file-sidebar-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.mj-file-sidebar-card {\n  background: var(--mj-bg-surface-sunken, #f8fafc);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  padding: 12px 14px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.mj-file-meta-row {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  font-size: 0.83rem;\n  gap: 8px;\n}\n\n.mj-file-meta-label {\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n  flex-shrink: 0;\n}\n\n.mj-file-meta-val {\n  color: var(--mj-text-primary);\n  text-align: right;\n  word-break: break-all;\n}\n\n.mj-file-sidebar-section {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.mj-file-sidebar-section-title {\n  margin: 0;\n  font-size: 0.88rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.mj-file-relationship-wrapper {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md, 8px);\n  overflow: hidden;\n  min-height: 250px;\n}\n\n/* Standard Form Wrapper */\n.mj-file-standard-form-wrapper {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.mj-file-mode-switch-bar {\n  padding: 8px 16px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n/* Word and Excel previews fill the stage; the shared components scroll inside it */\n.mj-file-media-office-box {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n.mj-file-media-office-box > mj-docx-preview,\n.mj-file-media-office-box > mj-xlsx-preview {\n  flex: 1;\n  min-height: 0;\n  display: block;\n}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJFileFormComponentExtended, { className: "MJFileFormComponentExtended", filePath: "src/lib/custom/Files/file-form.component.ts", lineNumber: 59 }); })();
 //# sourceMappingURL=file-form.component.js.map

package/dist/lib/custom/Lists/list-form.component.d.ts

@@ -3,6 +3,7 @@ import { MJListFormComponent } from '../../generated/Entities/MJList/mjlist.form
 import { MJListEntity, MJListDetailEntity, MJListCategoryEntity, MJUserViewEntityExtended } from '@memberjunction/core-entities';
 import { EntityInfo } from '@memberjunction/core';
 import { ListShareDialogConfig, ListShareDialogResult } from '@memberjunction/ng-list-management';
+import { SectionPickerItem } from '@memberjunction/ng-ui-components';
 import * as i0 from "@angular/core";
 export type ListSection = 'overview' | 'items' | 'sharing' | 'activity' | 'settings';
 export interface ListItemViewModel {
@@ -308,6 +309,10 @@ export declare class MJListFormComponentExtended extends MJListFormComponent imp
     goToPage(page: number): Promise<void>;
     private loadStats;
     private updateNavBadges;
+    /** The enabled rail items as `mj-section-picker` items: same order, the badge as the count. */
+    get SectionPickerItems(): SectionPickerItem[];
+    /** A pick from the phone section sheet; a key that names no rail item is ignored. */
+    OnSectionPicked(key: string): void;
     SetActiveSection(section: ListSection): void;
     /** @deprecated Use {@link SetActiveSection}. */
     setActiveSection(section: ListSection): void;

package/dist/lib/custom/Lists/list-form.component.d.ts.map

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