@memberjunction/ng-explorer-core 6.2.0-edge.0 → 6.2.0-edge.1

package/dist/lib/single-list-detail/single-list-detail.component.js

@@ -836,64 +836,320 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * those numbers drift from reality until a full page reload because the
      * stats component otherwise only loads on init.
      */
-    statsRefreshTrigger = 0;
-    bumpStatsRefresh() { this.statsRefreshTrigger++; }
-    listDetailGrid;
+    StatsRefreshTrigger = 0;
+    /** @deprecated Use {@link StatsRefreshTrigger}. */
+    get statsRefreshTrigger() {
+        return this.StatsRefreshTrigger;
+    }
+    /** @deprecated Use {@link StatsRefreshTrigger}. */
+    set statsRefreshTrigger(value) {
+        this.StatsRefreshTrigger = value;
+    }
+    bumpStatsRefresh() { this.StatsRefreshTrigger++; }
+    ListDetailGrid;
+    /** @deprecated Use {@link ListDetailGrid}. */
+    get listDetailGrid() {
+        return this.ListDetailGrid;
+    }
+    /** @deprecated Use {@link ListDetailGrid}. */
+    set listDetailGrid(value) {
+        this.ListDetailGrid = value;
+    }
     // List record
-    listRecord = null;
-    showLoader = false;
+    ListRecord = null;
+    /** @deprecated Use {@link ListRecord}. */
+    get listRecord() {
+        return this.ListRecord;
+    }
+    /** @deprecated Use {@link ListRecord}. */
+    set listRecord(value) {
+        this.ListRecord = value;
+    }
+    ShowLoader = false;
+    /** @deprecated Use {@link ShowLoader}. */
+    get showLoader() {
+        return this.ShowLoader;
+    }
+    /** @deprecated Use {@link ShowLoader}. */
+    set showLoader(value) {
+        this.ShowLoader = value;
+    }
     // Permission-level gating (Phase 2.8). Resolved lazily after the list
     // loads. Capabilities is exposed to the template for `@if` gating; the
     // server-side enforcement remains the source of truth — these flags
     // are a UX convenience so users don't see buttons they'll be rejected on.
-    capabilities = CapabilitiesForLevel(null);
-    currentLevel = null;
+    Capabilities = CapabilitiesForLevel(null);
+    /** @deprecated Use {@link Capabilities}. */
+    get capabilities() {
+        return this.Capabilities;
+    }
+    /** @deprecated Use {@link Capabilities}. */
+    set capabilities(value) {
+        this.Capabilities = value;
+    }
+    CurrentLevel = null;
+    /** @deprecated Use {@link CurrentLevel}. */
+    get currentLevel() {
+        return this.CurrentLevel;
+    }
+    /** @deprecated Use {@link CurrentLevel}. */
+    set currentLevel(value) {
+        this.CurrentLevel = value;
+    }
     // Lineage / refresh-from-source state. `sourceViewName` is loaded after
     // listRecord so the lineage badge can show a friendly view name; the
     // refresh-mode default falls back to the list's RefreshMode field but
     // can be overridden per-user via localStorage (see `loadLastUsedMode`).
-    sourceViewName = null;
+    SourceViewName = null;
+    /** @deprecated Use {@link SourceViewName}. */
+    get sourceViewName() {
+        return this.SourceViewName;
+    }
+    /** @deprecated Use {@link SourceViewName}. */
+    set sourceViewName(value) {
+        this.SourceViewName = value;
+    }
     // Bulk-edit (Phase 5.2). Status, Move, Copy, Remove. Move flows through
     // the delta-confirm dialog because it produces drops on the source list.
-    bulkStatus = '';
-    isApplyingBulkStatus = false;
+    BulkStatus = '';
+    /** @deprecated Use {@link BulkStatus}. */
+    get bulkStatus() {
+        return this.BulkStatus;
+    }
+    /** @deprecated Use {@link BulkStatus}. */
+    set bulkStatus(value) {
+        this.BulkStatus = value;
+    }
+    IsApplyingBulkStatus = false;
+    /** @deprecated Use {@link IsApplyingBulkStatus}. */
+    get isApplyingBulkStatus() {
+        return this.IsApplyingBulkStatus;
+    }
+    /** @deprecated Use {@link IsApplyingBulkStatus}. */
+    set isApplyingBulkStatus(value) {
+        this.IsApplyingBulkStatus = value;
+    }
     // Move / Copy state (mockups 23, 24). The picker dialog lists candidate
     // target lists scoped to the same entity. We load it lazily on first
     // open and cache for the session — opening the picker twice in a row
     // doesn't re-fetch unless the user explicitly hits "Refresh".
-    showMoveCopyDialog = false;
-    moveCopyMode = 'move';
-    moveCopyTargetSearch = '';
-    moveCopyTargetCandidates = [];
-    moveCopyTargetCandidatesLoading = false;
-    moveCopySelectedTarget = null;
-    isApplyingMoveCopy = false;
-    moveCopyProgress = 0;
-    moveCopyTotal = 0;
+    ShowMoveCopyDialog = false;
+    /** @deprecated Use {@link ShowMoveCopyDialog}. */
+    get showMoveCopyDialog() {
+        return this.ShowMoveCopyDialog;
+    }
+    /** @deprecated Use {@link ShowMoveCopyDialog}. */
+    set showMoveCopyDialog(value) {
+        this.ShowMoveCopyDialog = value;
+    }
+    MoveCopyMode = 'move';
+    /** @deprecated Use {@link MoveCopyMode}. */
+    get moveCopyMode() {
+        return this.MoveCopyMode;
+    }
+    /** @deprecated Use {@link MoveCopyMode}. */
+    set moveCopyMode(value) {
+        this.MoveCopyMode = value;
+    }
+    MoveCopyTargetSearch = '';
+    /** @deprecated Use {@link MoveCopyTargetSearch}. */
+    get moveCopyTargetSearch() {
+        return this.MoveCopyTargetSearch;
+    }
+    /** @deprecated Use {@link MoveCopyTargetSearch}. */
+    set moveCopyTargetSearch(value) {
+        this.MoveCopyTargetSearch = value;
+    }
+    MoveCopyTargetCandidates = [];
+    /** @deprecated Use {@link MoveCopyTargetCandidates}. */
+    get moveCopyTargetCandidates() {
+        return this.MoveCopyTargetCandidates;
+    }
+    /** @deprecated Use {@link MoveCopyTargetCandidates}. */
+    set moveCopyTargetCandidates(value) {
+        this.MoveCopyTargetCandidates = value;
+    }
+    MoveCopyTargetCandidatesLoading = false;
+    /** @deprecated Use {@link MoveCopyTargetCandidatesLoading}. */
+    get moveCopyTargetCandidatesLoading() {
+        return this.MoveCopyTargetCandidatesLoading;
+    }
+    /** @deprecated Use {@link MoveCopyTargetCandidatesLoading}. */
+    set moveCopyTargetCandidatesLoading(value) {
+        this.MoveCopyTargetCandidatesLoading = value;
+    }
+    MoveCopySelectedTarget = null;
+    /** @deprecated Use {@link MoveCopySelectedTarget}. */
+    get moveCopySelectedTarget() {
+        return this.MoveCopySelectedTarget;
+    }
+    /** @deprecated Use {@link MoveCopySelectedTarget}. */
+    set moveCopySelectedTarget(value) {
+        this.MoveCopySelectedTarget = value;
+    }
+    IsApplyingMoveCopy = false;
+    /** @deprecated Use {@link IsApplyingMoveCopy}. */
+    get isApplyingMoveCopy() {
+        return this.IsApplyingMoveCopy;
+    }
+    /** @deprecated Use {@link IsApplyingMoveCopy}. */
+    set isApplyingMoveCopy(value) {
+        this.IsApplyingMoveCopy = value;
+    }
+    MoveCopyProgress = 0;
+    /** @deprecated Use {@link MoveCopyProgress}. */
+    get moveCopyProgress() {
+        return this.MoveCopyProgress;
+    }
+    /** @deprecated Use {@link MoveCopyProgress}. */
+    set moveCopyProgress(value) {
+        this.MoveCopyProgress = value;
+    }
+    MoveCopyTotal = 0;
+    /** @deprecated Use {@link MoveCopyTotal}. */
+    get moveCopyTotal() {
+        return this.MoveCopyTotal;
+    }
+    /** @deprecated Use {@link MoveCopyTotal}. */
+    set moveCopyTotal(value) {
+        this.MoveCopyTotal = value;
+    }
     // Move delta-confirm. Built locally from the in-hand RecordIDs — no
     // server round-trip needed since we already know exactly what will be
     // added to the target and removed from the source. The drop-guard is
     // enforced at confirm time (mode='move' + ack checkbox).
-    moveDeltaConfirmVisible = false;
-    moveDelta = null;
+    MoveDeltaConfirmVisible = false;
+    /** @deprecated Use {@link MoveDeltaConfirmVisible}. */
+    get moveDeltaConfirmVisible() {
+        return this.MoveDeltaConfirmVisible;
+    }
+    /** @deprecated Use {@link MoveDeltaConfirmVisible}. */
+    set moveDeltaConfirmVisible(value) {
+        this.MoveDeltaConfirmVisible = value;
+    }
+    MoveDelta = null;
+    /** @deprecated Use {@link MoveDelta}. */
+    get moveDelta() {
+        return this.MoveDelta;
+    }
+    /** @deprecated Use {@link MoveDelta}. */
+    set moveDelta(value) {
+        this.MoveDelta = value;
+    }
     // Export picker (Phase 5.1, mockup 26). Opens before any export; lets
     // the user pick format + which entity fields to include. Fields are
     // resolved from EntityInfo on the loaded provider — no separate fetch.
-    showExportDialog = false;
-    exportFormat = 'excel';
-    exportFields = [];
-    exportRecordCount = 0;
-    isExporting = false;
-    refreshMode = 'Additive';
-    isPreviewingRefresh = false;
-    isApplyingRefresh = false;
-    refreshDelta = null;
-    refreshConfirmVisible = false;
+    ShowExportDialog = false;
+    /** @deprecated Use {@link ShowExportDialog}. */
+    get showExportDialog() {
+        return this.ShowExportDialog;
+    }
+    /** @deprecated Use {@link ShowExportDialog}. */
+    set showExportDialog(value) {
+        this.ShowExportDialog = value;
+    }
+    ExportFormat = 'excel';
+    /** @deprecated Use {@link ExportFormat}. */
+    get exportFormat() {
+        return this.ExportFormat;
+    }
+    /** @deprecated Use {@link ExportFormat}. */
+    set exportFormat(value) {
+        this.ExportFormat = value;
+    }
+    ExportFields = [];
+    /** @deprecated Use {@link ExportFields}. */
+    get exportFields() {
+        return this.ExportFields;
+    }
+    /** @deprecated Use {@link ExportFields}. */
+    set exportFields(value) {
+        this.ExportFields = value;
+    }
+    ExportRecordCount = 0;
+    /** @deprecated Use {@link ExportRecordCount}. */
+    get exportRecordCount() {
+        return this.ExportRecordCount;
+    }
+    /** @deprecated Use {@link ExportRecordCount}. */
+    set exportRecordCount(value) {
+        this.ExportRecordCount = value;
+    }
+    IsExporting = false;
+    /** @deprecated Use {@link IsExporting}. */
+    get isExporting() {
+        return this.IsExporting;
+    }
+    /** @deprecated Use {@link IsExporting}. */
+    set isExporting(value) {
+        this.IsExporting = value;
+    }
+    RefreshMode = 'Additive';
+    /** @deprecated Use {@link RefreshMode}. */
+    get refreshMode() {
+        return this.RefreshMode;
+    }
+    /** @deprecated Use {@link RefreshMode}. */
+    set refreshMode(value) {
+        this.RefreshMode = value;
+    }
+    IsPreviewingRefresh = false;
+    /** @deprecated Use {@link IsPreviewingRefresh}. */
+    get isPreviewingRefresh() {
+        return this.IsPreviewingRefresh;
+    }
+    /** @deprecated Use {@link IsPreviewingRefresh}. */
+    set isPreviewingRefresh(value) {
+        this.IsPreviewingRefresh = value;
+    }
+    IsApplyingRefresh = false;
+    /** @deprecated Use {@link IsApplyingRefresh}. */
+    get isApplyingRefresh() {
+        return this.IsApplyingRefresh;
+    }
+    /** @deprecated Use {@link IsApplyingRefresh}. */
+    set isApplyingRefresh(value) {
+        this.IsApplyingRefresh = value;
+    }
+    RefreshDelta = null;
+    /** @deprecated Use {@link RefreshDelta}. */
+    get refreshDelta() {
+        return this.RefreshDelta;
+    }
+    /** @deprecated Use {@link RefreshDelta}. */
+    set refreshDelta(value) {
+        this.RefreshDelta = value;
+    }
+    RefreshConfirmVisible = false;
+    /** @deprecated Use {@link RefreshConfirmVisible}. */
+    get refreshConfirmVisible() {
+        return this.RefreshConfirmVisible;
+    }
+    /** @deprecated Use {@link RefreshConfirmVisible}. */
+    set refreshConfirmVisible(value) {
+        this.RefreshConfirmVisible = value;
+    }
     // Grid state
-    selectedKeys = [];
-    rowCount = 0;
+    SelectedKeys = [];
+    /** @deprecated Use {@link SelectedKeys}. */
+    get selectedKeys() {
+        return this.SelectedKeys;
+    }
+    /** @deprecated Use {@link SelectedKeys}. */
+    set selectedKeys(value) {
+        this.SelectedKeys = value;
+    }
+    RowCount = 0;
+    /** @deprecated Use {@link RowCount}. */
+    get rowCount() {
+        return this.RowCount;
+    }
+    /** @deprecated Use {@link RowCount}. */
+    set rowCount(value) {
+        this.RowCount = value;
+    }
     // Toolbar config - hide EDG toolbar, we'll use our own
-    gridToolbarConfig = {
+    GridToolbarConfig = {
         showSearch: false,
         showRefresh: false,
         showAdd: false,
@@ -902,39 +1158,191 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         showRowCount: false,
         showSelectionCount: false
     };
+    /** @deprecated Use {@link GridToolbarConfig}. */
+    get gridToolbarConfig() {
+        return this.GridToolbarConfig;
+    }
+    /** @deprecated Use {@link GridToolbarConfig}. */
+    set gridToolbarConfig(value) {
+        this.GridToolbarConfig = value;
+    }
     // Remove from list dialog
-    showRemoveDialog = false;
-    isRemoving = false;
-    removeProgress = 0;
-    removeTotal = 0;
+    ShowRemoveDialog = false;
+    /** @deprecated Use {@link ShowRemoveDialog}. */
+    get showRemoveDialog() {
+        return this.ShowRemoveDialog;
+    }
+    /** @deprecated Use {@link ShowRemoveDialog}. */
+    set showRemoveDialog(value) {
+        this.ShowRemoveDialog = value;
+    }
+    IsRemoving = false;
+    /** @deprecated Use {@link IsRemoving}. */
+    get isRemoving() {
+        return this.IsRemoving;
+    }
+    /** @deprecated Use {@link IsRemoving}. */
+    set isRemoving(value) {
+        this.IsRemoving = value;
+    }
+    RemoveProgress = 0;
+    /** @deprecated Use {@link RemoveProgress}. */
+    get removeProgress() {
+        return this.RemoveProgress;
+    }
+    /** @deprecated Use {@link RemoveProgress}. */
+    set removeProgress(value) {
+        this.RemoveProgress = value;
+    }
+    RemoveTotal = 0;
+    /** @deprecated Use {@link RemoveTotal}. */
+    get removeTotal() {
+        return this.RemoveTotal;
+    }
+    /** @deprecated Use {@link RemoveTotal}. */
+    set removeTotal(value) {
+        this.RemoveTotal = value;
+    }
     // Add records dialog
-    showAddRecordsDialog = false;
-    addDialogLoading = false;
-    addDialogSaving = false;
-    addableRecords = [];
-    addRecordsSearchFilter = "";
+    ShowAddRecordsDialog = false;
+    /** @deprecated Use {@link ShowAddRecordsDialog}. */
+    get showAddRecordsDialog() {
+        return this.ShowAddRecordsDialog;
+    }
+    /** @deprecated Use {@link ShowAddRecordsDialog}. */
+    set showAddRecordsDialog(value) {
+        this.ShowAddRecordsDialog = value;
+    }
+    AddDialogLoading = false;
+    /** @deprecated Use {@link AddDialogLoading}. */
+    get addDialogLoading() {
+        return this.AddDialogLoading;
+    }
+    /** @deprecated Use {@link AddDialogLoading}. */
+    set addDialogLoading(value) {
+        this.AddDialogLoading = value;
+    }
+    AddDialogSaving = false;
+    /** @deprecated Use {@link AddDialogSaving}. */
+    get addDialogSaving() {
+        return this.AddDialogSaving;
+    }
+    /** @deprecated Use {@link AddDialogSaving}. */
+    set addDialogSaving(value) {
+        this.AddDialogSaving = value;
+    }
+    AddableRecords = [];
+    /** @deprecated Use {@link AddableRecords}. */
+    get addableRecords() {
+        return this.AddableRecords;
+    }
+    /** @deprecated Use {@link AddableRecords}. */
+    set addableRecords(value) {
+        this.AddableRecords = value;
+    }
+    AddRecordsSearchFilter = "";
+    /** @deprecated Use {@link AddRecordsSearchFilter}. */
+    get addRecordsSearchFilter() {
+        return this.AddRecordsSearchFilter;
+    }
+    /** @deprecated Use {@link AddRecordsSearchFilter}. */
+    set addRecordsSearchFilter(value) {
+        this.AddRecordsSearchFilter = value;
+    }
     /** Empty-state title shown when an add-records search returns no matches. */
     get AddRecordsNoMatchTitle() {
-        return `No records found matching "${this.addRecordsSearchFilter}"`;
+        return `No records found matching "${this.AddRecordsSearchFilter}"`;
+    }
+    ExistingListDetailIds = new Set();
+    /** @deprecated Use {@link ExistingListDetailIds}. */
+    get existingListDetailIds() {
+        return this.ExistingListDetailIds;
+    }
+    /** @deprecated Use {@link ExistingListDetailIds}. */
+    set existingListDetailIds(value) {
+        this.ExistingListDetailIds = value;
+    }
+    AddProgress = 0;
+    /** @deprecated Use {@link AddProgress}. */
+    get addProgress() {
+        return this.AddProgress;
+    }
+    /** @deprecated Use {@link AddProgress}. */
+    set addProgress(value) {
+        this.AddProgress = value;
+    }
+    AddTotal = 0;
+    /** @deprecated Use {@link AddTotal}. */
+    get addTotal() {
+        return this.AddTotal;
+    }
+    /** @deprecated Use {@link AddTotal}. */
+    set addTotal(value) {
+        this.AddTotal = value;
     }
-    existingListDetailIds = new Set();
-    addProgress = 0;
-    addTotal = 0;
     searchSubject = new Subject();
     destroy$ = new Subject();
     // Add from view dialog (existing)
-    showAddFromViewDialog = false;
-    showAddFromViewLoader = false;
-    userViews = null;
-    userViewsToAdd = [];
+    ShowAddFromViewDialog = false;
+    /** @deprecated Use {@link ShowAddFromViewDialog}. */
+    get showAddFromViewDialog() {
+        return this.ShowAddFromViewDialog;
+    }
+    /** @deprecated Use {@link ShowAddFromViewDialog}. */
+    set showAddFromViewDialog(value) {
+        this.ShowAddFromViewDialog = value;
+    }
+    ShowAddFromViewLoader = false;
+    /** @deprecated Use {@link ShowAddFromViewLoader}. */
+    get showAddFromViewLoader() {
+        return this.ShowAddFromViewLoader;
+    }
+    /** @deprecated Use {@link ShowAddFromViewLoader}. */
+    set showAddFromViewLoader(value) {
+        this.ShowAddFromViewLoader = value;
+    }
+    UserViews = null;
+    /** @deprecated Use {@link UserViews}. */
+    get userViews() {
+        return this.UserViews;
+    }
+    /** @deprecated Use {@link UserViews}. */
+    set userViews(value) {
+        this.UserViews = value;
+    }
+    UserViewsToAdd = [];
+    /** @deprecated Use {@link UserViewsToAdd}. */
+    get userViewsToAdd() {
+        return this.UserViewsToAdd;
+    }
+    /** @deprecated Use {@link UserViewsToAdd}. */
+    set userViewsToAdd(value) {
+        this.UserViewsToAdd = value;
+    }
     /**
      * Normalized-UUID set of the IDs in {@link userViewsToAdd}, kept in sync with that
      * array. Lets {@link isViewSelected} (bound per-row in the dialog's @for, ~2x/row)
      * do an O(1) lookup instead of scanning the array with UUIDsEqual on every check.
      */
     userViewsToAddIds = new Set();
-    addFromViewProgress = 0;
-    addFromViewTotal = 0;
+    AddFromViewProgress = 0;
+    /** @deprecated Use {@link AddFromViewProgress}. */
+    get addFromViewProgress() {
+        return this.AddFromViewProgress;
+    }
+    /** @deprecated Use {@link AddFromViewProgress}. */
+    set addFromViewProgress(value) {
+        this.AddFromViewProgress = value;
+    }
+    AddFromViewTotal = 0;
+    /** @deprecated Use {@link AddFromViewTotal}. */
+    get addFromViewTotal() {
+        return this.AddFromViewTotal;
+    }
+    /** @deprecated Use {@link AddFromViewTotal}. */
+    set addFromViewTotal(value) {
+        this.AddFromViewTotal = value;
+    }
     /**
      * Stored percent (0–100) for the progress bar. Backed instead of computed
      * via getter because the original getter recomputed on every Angular CD
@@ -943,30 +1351,62 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * ExpressionChangedAfterItHasBeenCheckedError floods in the console.
      * Updated via setAddFromViewProgress(...) at controlled points.
      */
-    addFromViewProgressPercent = 0;
-    fetchingRecordsToSave = false;
+    AddFromViewProgressPercent = 0;
+    /** @deprecated Use {@link AddFromViewProgressPercent}. */
+    get addFromViewProgressPercent() {
+        return this.AddFromViewProgressPercent;
+    }
+    /** @deprecated Use {@link AddFromViewProgressPercent}. */
+    set addFromViewProgressPercent(value) {
+        this.AddFromViewProgressPercent = value;
+    }
+    FetchingRecordsToSave = false;
+    /** @deprecated Use {@link FetchingRecordsToSave}. */
+    get fetchingRecordsToSave() {
+        return this.FetchingRecordsToSave;
+    }
+    /** @deprecated Use {@link FetchingRecordsToSave}. */
+    set fetchingRecordsToSave(value) {
+        this.FetchingRecordsToSave = value;
+    }
     // Dropdown button toggle state
-    showAddDropdown = false;
+    ShowAddDropdown = false;
+    /** @deprecated Use {@link ShowAddDropdown}. */
+    get showAddDropdown() {
+        return this.ShowAddDropdown;
+    }
+    /** @deprecated Use {@link ShowAddDropdown}. */
+    set showAddDropdown(value) {
+        this.ShowAddDropdown = value;
+    }
     // Dropdown menu options
-    addOptions = [
+    AddOptions = [
         {
             Text: 'Add Records',
             Description: 'Search and add specific records to this list',
             Icon: 'search',
-            Action: () => this.openAddRecordsDialog()
+            Action: () => this.OpenAddRecordsDialog()
         },
         {
             Text: 'Add From View',
             Description: 'Add all records from a saved view',
             Icon: 'folder',
-            Action: () => this.openAddFromViewDialog()
+            Action: () => this.OpenAddFromViewDialog()
         }
     ];
+    /** @deprecated Use {@link AddOptions}. */
+    get addOptions() {
+        return this.AddOptions;
+    }
+    /** @deprecated Use {@link AddOptions}. */
+    set addOptions(value) {
+        this.AddOptions = value;
+    }
     onDocumentClick(event) {
-        if (this.showAddDropdown) {
+        if (this.ShowAddDropdown) {
             const target = event.target;
             if (!this.elementRef.nativeElement.querySelector('.add-dropdown-wrapper')?.contains(target)) {
-                this.showAddDropdown = false;
+                this.ShowAddDropdown = false;
             }
         }
     }
@@ -1002,7 +1442,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
     async loadListRecord() {
         if (!this.ListID)
             return;
-        this.showLoader = true;
+        this.ShowLoader = true;
         try {
             const md = this.ProviderToUse;
             // Build + load against a LOCAL handle. Only assign to
@@ -1014,20 +1454,20 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             const loadResult = await list.Load(this.ListID);
             if (!loadResult) {
                 LogError("Error loading list with ID " + this.ListID, undefined, list.LatestResult);
-                this.listRecord = null;
+                this.ListRecord = null;
             }
             else {
-                this.listRecord = list;
+                this.ListRecord = list;
                 await this.loadLineageContext();
                 await this.loadCapabilities();
             }
         }
         catch (error) {
             LogError("Error loading list", undefined, error);
-            this.listRecord = null;
+            this.ListRecord = null;
         }
         finally {
-            this.showLoader = false;
+            this.ShowLoader = false;
             this.cdr.detectChanges();
         }
     }
@@ -1040,19 +1480,19 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * rather than blocking the rest of the detail view.
      */
     async loadLineageContext() {
-        if (!this.listRecord?.SourceViewID) {
-            this.sourceViewName = null;
+        if (!this.ListRecord?.SourceViewID) {
+            this.SourceViewName = null;
             return;
         }
-        this.refreshMode = this.loadLastUsedMode() ?? this.listRecord.RefreshMode;
+        this.RefreshMode = this.loadLastUsedMode() ?? this.ListRecord.RefreshMode;
         try {
             const view = await this.ProviderToUse.GetEntityObject('MJ: User Views');
-            const loaded = await view.Load(this.listRecord.SourceViewID);
-            this.sourceViewName = loaded ? view.Name : null;
+            const loaded = await view.Load(this.ListRecord.SourceViewID);
+            this.SourceViewName = loaded ? view.Name : null;
         }
         catch (e) {
             LogError(`Failed to load source view name for list ${this.ListID}: ${e}`);
-            this.sourceViewName = null;
+            this.SourceViewName = null;
         }
     }
     /**
@@ -1062,16 +1502,16 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * so we don't accidentally surface buttons the server will reject.
      */
     async loadCapabilities() {
-        if (!this.listRecord) {
-            this.capabilities = CapabilitiesForLevel(null);
-            this.currentLevel = null;
+        if (!this.ListRecord) {
+            this.Capabilities = CapabilitiesForLevel(null);
+            this.CurrentLevel = null;
             return;
         }
         try {
             const currentUserId = this.ProviderToUse.CurrentUser?.ID;
             if (!currentUserId) {
-                this.capabilities = CapabilitiesForLevel('View');
-                this.currentLevel = 'View';
+                this.Capabilities = CapabilitiesForLevel('View');
+                this.CurrentLevel = 'View';
                 return;
             }
             // Fast path: the list's UserID is its owner. Owners always have full
@@ -1079,25 +1519,29 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             // is implicit), so the permission-row lookup below would return null
             // and incorrectly hide all edit/share/delete buttons. Mirrors the
             // owner short-circuit in the server-side ListSharing.ResolveEffectivePermission.
-            if (UUIDsEqual(this.listRecord.UserID, currentUserId)) {
-                this.currentLevel = 'Owner';
-                this.capabilities = CapabilitiesForLevel('Owner');
+            if (UUIDsEqual(this.ListRecord.UserID, currentUserId)) {
+                this.CurrentLevel = 'Owner';
+                this.Capabilities = CapabilitiesForLevel('Owner');
                 return;
             }
             // Non-owner: resolve via ListSharingService (GraphQL). Never instantiate
             // the server-side `ListSharing` class from a browser bundle.
-            const level = (await this.listSharingService.getUserPermissionLevel(this.listRecord.ID, currentUserId));
-            this.currentLevel = level;
-            this.capabilities = CapabilitiesForLevel(level);
+            const level = (await this.listSharingService.getUserPermissionLevel(this.ListRecord.ID, currentUserId));
+            this.CurrentLevel = level;
+            this.Capabilities = CapabilitiesForLevel(level);
         }
         catch (e) {
             LogError(`loadCapabilities failed: ${e instanceof Error ? e.message : String(e)}`);
-            this.capabilities = CapabilitiesForLevel('View');
-            this.currentLevel = 'View';
+            this.Capabilities = CapabilitiesForLevel('View');
+            this.CurrentLevel = 'View';
         }
     }
+    get HasLineage() {
+        return !!this.ListRecord?.SourceViewID;
+    }
+    /** @deprecated Use {@link HasLineage}. */
     get hasLineage() {
-        return !!this.listRecord?.SourceViewID;
+        return this.HasLineage;
     }
     loadLastUsedMode() {
         try {
@@ -1123,57 +1567,65 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * and opens the confirm dialog when it returns. The dialog enforces the
      * acknowledgement UX; the server enforces the actual drop guard.
      */
-    async onRefreshFromSource() {
-        if (!this.hasLineage || this.isPreviewingRefresh)
+    async OnRefreshFromSource() {
+        if (!this.HasLineage || this.IsPreviewingRefresh)
             return;
-        this.isPreviewingRefresh = true;
-        this.refreshDelta = null;
+        this.IsPreviewingRefresh = true;
+        this.RefreshDelta = null;
         this.cdr.detectChanges();
         try {
             const provider = this.ProviderToUse;
             const client = new GraphQLListsClient(provider);
             const delta = await client.PreviewListDelta({
                 Target: this.ListID,
-                Source: { kind: 'view', viewId: this.listRecord.SourceViewID },
-                Mode: this.refreshMode,
+                Source: { kind: 'view', viewId: this.ListRecord.SourceViewID },
+                Mode: this.RefreshMode,
             });
-            this.refreshDelta = delta;
-            this.refreshConfirmVisible = true;
+            this.RefreshDelta = delta;
+            this.RefreshConfirmVisible = true;
         }
         catch (e) {
             const message = e instanceof Error ? e.message : String(e);
             this.sharedService.CreateSimpleNotification(`Refresh preview failed: ${message}`, 'error', 5000);
         }
         finally {
-            this.isPreviewingRefresh = false;
+            this.IsPreviewingRefresh = false;
             this.cdr.detectChanges();
         }
     }
-    onRefreshConfirmCancel() {
-        this.refreshConfirmVisible = false;
-        this.refreshDelta = null;
+    /** @deprecated Use {@link OnRefreshFromSource}. */
+    async onRefreshFromSource() {
+        return this.OnRefreshFromSource();
+    }
+    OnRefreshConfirmCancel() {
+        this.RefreshConfirmVisible = false;
+        this.RefreshDelta = null;
         this.cdr.detectChanges();
     }
-    async onRefreshConfirmCommit(deltaToken) {
-        if (!this.refreshDelta)
+    /** @deprecated Use {@link OnRefreshConfirmCancel}. */
+    onRefreshConfirmCancel() {
+        return this.OnRefreshConfirmCancel();
+    }
+    async OnRefreshConfirmCommit(deltaToken) {
+        if (!this.RefreshDelta)
             return;
-        this.isApplyingRefresh = true;
+        this.IsApplyingRefresh = true;
         this.cdr.detectChanges();
         try {
             const provider = this.ProviderToUse;
             const client = new GraphQLListsClient(provider);
             const result = await client.ApplyListDelta({
-                Delta: { ...this.refreshDelta, DeltaToken: deltaToken },
-                ConfirmDrops: (this.refreshDelta.Counts.Remove ?? 0) > 0,
+                Delta: { ...this.RefreshDelta, DeltaToken: deltaToken },
+                ConfirmDrops: (this.RefreshDelta.Counts.Remove ?? 0) > 0,
             });
             if (result.Success) {
-                this.saveLastUsedMode(this.refreshMode);
-                this.refreshConfirmVisible = false;
-                this.refreshDelta = null;
+                this.saveLastUsedMode(this.RefreshMode);
+                this.RefreshConfirmVisible = false;
+                this.RefreshDelta = null;
                 this.sharedService.CreateSimpleNotification(`Refresh applied: +${result.Counts?.Added ?? 0} / -${result.Counts?.Removed ?? 0}`, 'success', 3000);
                 // Reload list (for LastRefreshedAt) + grid in parallel.
                 await this.loadListRecord();
-                this.refreshGrid();
+                this.RefreshGrid();
                 this.bumpStatsRefresh();
             }
             else {
@@ -1185,59 +1637,103 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             this.sharedService.CreateSimpleNotification(`Refresh failed: ${message}`, 'error', 5000);
         }
         finally {
-            this.isApplyingRefresh = false;
+            this.IsApplyingRefresh = false;
             this.cdr.detectChanges();
         }
     }
+    /** @deprecated Use {@link OnRefreshConfirmCommit}. */
+    async onRefreshConfirmCommit(deltaToken) {
+        return this.OnRefreshConfirmCommit(deltaToken);
+    }
+    OnRefreshModeChange(mode) {
+        this.RefreshMode = mode;
+    }
+    /** @deprecated Use {@link OnRefreshModeChange}. */
     onRefreshModeChange(mode) {
-        this.refreshMode = mode;
+        return this.OnRefreshModeChange(mode);
     }
     // ==========================================
     // Grid Event Handlers
     // ==========================================
-    onRowClicked(_event) {
+    OnRowClicked(_event) {
         // Selection is handled by the grid
     }
-    onRowDoubleClicked(_event) {
+    /** @deprecated Use {@link OnRowClicked}. */
+    onRowClicked(_event) {
+        return this.OnRowClicked(_event);
+    }
+    OnRowDoubleClicked(_event) {
         // Navigation is handled by mj-list-detail-grid
     }
+    /** @deprecated Use {@link OnRowDoubleClicked}. */
+    onRowDoubleClicked(_event) {
+        return this.OnRowDoubleClicked(_event);
+    }
+    OnSelectionChange(keys) {
+        this.SelectedKeys = keys;
+    }
+    /** @deprecated Use {@link OnSelectionChange}. */
     onSelectionChange(keys) {
-        this.selectedKeys = keys;
+        return this.OnSelectionChange(keys);
+    }
+    OnDataLoaded(event) {
+        this.RowCount = event.totalCount;
     }
+    /** @deprecated Use {@link OnDataLoaded}. */
     onDataLoaded(event) {
-        this.rowCount = event.totalCount;
+        return this.OnDataLoaded(event);
     }
-    refreshGrid() {
-        if (this.listDetailGrid) {
-            this.listDetailGrid.refresh();
+    RefreshGrid() {
+        if (this.ListDetailGrid) {
+            this.ListDetailGrid.refresh();
         }
     }
+    /** @deprecated Use {@link RefreshGrid}. */
+    refreshGrid() {
+        return this.RefreshGrid();
+    }
     // ==========================================
     // Toolbar Actions
     // ==========================================
     // ==========================================
     // Progress Percentage Getters
     // ==========================================
+    get RemoveProgressPercent() {
+        return this.RemoveTotal > 0 ? Math.round((this.RemoveProgress / this.RemoveTotal) * 100) : 0;
+    }
+    /** @deprecated Use {@link RemoveProgressPercent}. */
     get removeProgressPercent() {
-        return this.removeTotal > 0 ? Math.round((this.removeProgress / this.removeTotal) * 100) : 0;
+        return this.RemoveProgressPercent;
+    }
+    get AddProgressPercent() {
+        return this.AddTotal > 0 ? Math.round((this.AddProgress / this.AddTotal) * 100) : 0;
     }
+    /** @deprecated Use {@link AddProgressPercent}. */
     get addProgressPercent() {
-        return this.addTotal > 0 ? Math.round((this.addProgress / this.addTotal) * 100) : 0;
+        return this.AddProgressPercent;
     }
     /** Update progress + recompute the stored percent atomically. Call this
      *  from inside the save loop so the bound value is set in lockstep with
      *  the underlying counter (avoids NG0100). */
     setAddFromViewProgress(progress) {
-        this.addFromViewProgress = progress;
-        this.addFromViewProgressPercent = this.addFromViewTotal > 0
-            ? Math.round((progress / this.addFromViewTotal) * 100)
+        this.AddFromViewProgress = progress;
+        this.AddFromViewProgressPercent = this.AddFromViewTotal > 0
+            ? Math.round((progress / this.AddFromViewTotal) * 100)
             : 0;
     }
+    OnRefreshClick() {
+        this.RefreshGrid();
+    }
+    /** @deprecated Use {@link OnRefreshClick}. */
     onRefreshClick() {
-        this.refreshGrid();
+        return this.OnRefreshClick();
+    }
+    OnExportClick() {
+        this.OpenExportDialog();
     }
+    /** @deprecated Use {@link OnExportClick}. */
     onExportClick() {
-        this.openExportDialog();
+        return this.OnExportClick();
     }
     /**
      * Open the format + column picker (mockup 26). Resolves the candidate
@@ -1245,13 +1741,13 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * RunView. Default selection is every non-virtual entity field, which
      * matches what the underlying grid's "export all" path produced.
      */
-    openExportDialog() {
-        if (!this.listRecord) {
+    OpenExportDialog() {
+        if (!this.ListRecord) {
             this.sharedService.CreateSimpleNotification('Load a list first before exporting.', 'info', 3000);
             return;
         }
         const md = this.ProviderToUse;
-        const entityInfo = md.EntityByID(this.listRecord.EntityID);
+        const entityInfo = md.EntityByID(this.ListRecord.EntityID);
         if (!entityInfo) {
             this.sharedService.CreateSimpleNotification(`Entity for this list not found in metadata.`, 'error', 4000);
             return;
@@ -1260,32 +1756,52 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             this.sharedService.CreateSimpleNotification(`Composite-PK entities ('${entityInfo.Name}') aren't yet supported for List export.`, 'warning', 5000);
             return;
         }
-        this.exportFields = entityInfo.Fields
+        this.ExportFields = entityInfo.Fields
             .filter((f) => f.IsVirtual !== true)
             .map((f) => ({
             Name: f.Name,
             DisplayName: f.DisplayName || f.Name,
             Selected: true,
         }));
-        this.exportRecordCount = this.rowCount;
-        this.exportFormat = 'excel';
-        this.showExportDialog = true;
+        this.ExportRecordCount = this.RowCount;
+        this.ExportFormat = 'excel';
+        this.ShowExportDialog = true;
         this.cdr.detectChanges();
     }
-    closeExportDialog() {
-        this.showExportDialog = false;
+    /** @deprecated Use {@link OpenExportDialog}. */
+    openExportDialog() {
+        return this.OpenExportDialog();
+    }
+    CloseExportDialog() {
+        this.ShowExportDialog = false;
         this.cdr.detectChanges();
     }
-    selectAllExportFields() {
-        for (const f of this.exportFields)
+    /** @deprecated Use {@link CloseExportDialog}. */
+    closeExportDialog() {
+        return this.CloseExportDialog();
+    }
+    SelectAllExportFields() {
+        for (const f of this.ExportFields)
             f.Selected = true;
     }
-    selectNoneExportFields() {
-        for (const f of this.exportFields)
+    /** @deprecated Use {@link SelectAllExportFields}. */
+    selectAllExportFields() {
+        return this.SelectAllExportFields();
+    }
+    SelectNoneExportFields() {
+        for (const f of this.ExportFields)
             f.Selected = false;
     }
+    /** @deprecated Use {@link SelectNoneExportFields}. */
+    selectNoneExportFields() {
+        return this.SelectNoneExportFields();
+    }
+    get SelectedExportFieldCount() {
+        return this.ExportFields.filter((f) => f.Selected).length;
+    }
+    /** @deprecated Use {@link SelectedExportFieldCount}. */
     get selectedExportFieldCount() {
-        return this.exportFields.filter((f) => f.Selected).length;
+        return this.SelectedExportFieldCount;
     }
     /**
      * Run the export with the user's chosen format + columns. Resolves
@@ -1294,27 +1810,27 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * rows restricted to the chosen Fields. Output is projected to
      * exactly the user's selected columns + ordering.
      */
-    async executeExport() {
-        if (!this.listRecord)
+    async ExecuteExport() {
+        if (!this.ListRecord)
             return;
-        const selectedFields = this.exportFields.filter((f) => f.Selected).map((f) => f.Name);
+        const selectedFields = this.ExportFields.filter((f) => f.Selected).map((f) => f.Name);
         if (selectedFields.length === 0)
             return;
-        this.isExporting = true;
+        this.IsExporting = true;
         this.cdr.detectChanges();
         try {
             const md = this.ProviderToUse;
-            const entityInfo = md.EntityByID(this.listRecord.EntityID);
+            const entityInfo = md.EntityByID(this.ListRecord.EntityID);
             // Cheap emptiness check before doing any row work
             const rv = RunView.FromMetadataProvider(md);
             const countResult = await rv.RunView({
                 EntityName: 'MJ: List Details',
-                ExtraFilter: `ListID='${this.listRecord.ID}'`,
+                ExtraFilter: `ListID='${this.ListRecord.ID}'`,
                 ResultType: 'count_only',
             });
             if (countResult.Success && countResult.TotalRowCount === 0) {
                 this.sharedService.CreateSimpleNotification('List is empty — nothing to export.', 'info', 3000);
-                this.showExportDialog = false;
+                this.ShowExportDialog = false;
                 return;
             }
             // Pull underlying entity rows restricted to the chosen fields, with
@@ -1324,7 +1840,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             const fieldsForQuery = Array.from(new Set([...entityInfo.PrimaryKeys.map((pk) => pk.Name), ...selectedFields]));
             const rowResult = await rv.RunView({
                 EntityName: entityInfo.Name,
-                ExtraFilter: await this.buildListMemberFilter(entityInfo, this.listRecord.ID, rv),
+                ExtraFilter: await this.buildListMemberFilter(entityInfo, this.ListRecord.ID, rv),
                 Fields: fieldsForQuery,
                 ResultType: 'simple',
             });
@@ -1340,18 +1856,18 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 return projected;
             });
             const dateStamp = new Date().toISOString().slice(0, 10);
-            const safeName = (this.listRecord.Name || 'list').replace(/[^a-z0-9_-]+/gi, '_');
-            const ext = this.exportFormat === 'excel' ? 'xlsx' : this.exportFormat;
+            const safeName = (this.ListRecord.Name || 'list').replace(/[^a-z0-9_-]+/gi, '_');
+            const ext = this.ExportFormat === 'excel' ? 'xlsx' : this.ExportFormat;
             const fileName = `${safeName}-${dateStamp}.${ext}`;
-            const exportResult = this.exportFormat === 'excel'
+            const exportResult = this.ExportFormat === 'excel'
                 ? await this.exportService.toExcel(rows, { fileName, includeHeaders: true })
-                : this.exportFormat === 'csv'
+                : this.ExportFormat === 'csv'
                     ? await this.exportService.toCSV(rows, { fileName, includeHeaders: true })
                     : await this.exportService.toJSON(rows, { fileName });
             if (exportResult.success) {
                 this.exportService.downloadResult(exportResult);
                 this.sharedService.CreateSimpleNotification(`Exported ${rows.length} record(s)`, 'success', 3000);
-                this.showExportDialog = false;
+                this.ShowExportDialog = false;
             }
             else {
                 this.sharedService.CreateSimpleNotification('Export failed', 'error', 5000);
@@ -1362,19 +1878,31 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             this.sharedService.CreateSimpleNotification(`Export error: ${message}`, 'error', 5000);
         }
         finally {
-            this.isExporting = false;
+            this.IsExporting = false;
             this.cdr.detectChanges();
         }
     }
+    /** @deprecated Use {@link ExecuteExport}. */
+    async executeExport() {
+        return this.ExecuteExport();
+    }
+    ToggleAddDropdown() {
+        this.ShowAddDropdown = !this.ShowAddDropdown;
+    }
+    /** @deprecated Use {@link ToggleAddDropdown}. */
     toggleAddDropdown() {
-        this.showAddDropdown = !this.showAddDropdown;
+        return this.ToggleAddDropdown();
     }
-    onDropdownItemClick(item) {
-        this.showAddDropdown = false;
+    OnDropdownItemClick(item) {
+        this.ShowAddDropdown = false;
         if (item.Action) {
             item.Action();
         }
     }
+    /** @deprecated Use {@link OnDropdownItemClick}. */
+    onDropdownItemClick(item) {
+        return this.OnDropdownItemClick(item);
+    }
     // ==========================================
     /**
      * Predicate selecting the underlying entity rows that are members of a list. For a
@@ -1404,16 +1932,16 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * the existing extract-record-id-from-composite-key logic to map
      * `selectedKeys` to the actual `MJ: List Detail.RecordID` values.
      */
-    async applyBulkStatus() {
-        if (!this.listRecord || this.selectedKeys.length === 0 || !this.bulkStatus)
+    async ApplyBulkStatus() {
+        if (!this.ListRecord || this.SelectedKeys.length === 0 || !this.BulkStatus)
             return;
-        this.isApplyingBulkStatus = true;
+        this.IsApplyingBulkStatus = true;
         this.cdr.detectChanges();
         try {
             const md = this.ProviderToUse;
             const rv = RunView.FromMetadataProvider(md);
-            const entityInfo = md.EntityByID(this.listRecord.EntityID);
-            const recordIds = this.selectedKeys.map((key) => {
+            const entityInfo = md.EntityByID(this.ListRecord.EntityID);
+            const recordIds = this.SelectedKeys.map((key) => {
                 if (entityInfo && entityInfo.PrimaryKeys.length === 1) {
                     const ck = new CompositeKey();
                     ck.LoadFromConcatenatedString(key);
@@ -1421,7 +1949,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 }
                 return key;
             });
-            const filter = `ListID='${this.listRecord.ID}' AND RecordID IN (${recordIds.map((id) => `'${String(id).replace(/'/g, "''")}'`).join(',')})`;
+            const filter = `ListID='${this.ListRecord.ID}' AND RecordID IN (${recordIds.map((id) => `'${String(id).replace(/'/g, "''")}'`).join(',')})`;
             // Two-step: fetch just the IDs via a 'simple' RunView, then load each
             // entity through GetEntityObject(..., CurrentUser) so the entity is
             // born with the user context that Save() requires. RunView with
@@ -1451,7 +1979,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                         failureMessages.push(reason);
                     continue;
                 }
-                detail.Status = this.bulkStatus;
+                detail.Status = this.BulkStatus;
                 const ok = await detail.Save();
                 if (ok) {
                     updated++;
@@ -1465,14 +1993,14 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 }
             }
             this.sharedService.CreateSimpleNotification(failed === 0
-                ? `Updated ${updated} item(s) to '${this.bulkStatus}'`
+                ? `Updated ${updated} item(s) to '${this.BulkStatus}'`
                 : `Updated ${updated}, ${failed} failed: ${failureMessages.join(' | ')}`, failed === 0 ? 'success' : 'warning', failed === 0 ? 3000 : 8000);
-            this.bulkStatus = '';
+            this.BulkStatus = '';
             // Defer the grid refresh to the next microtask — see comment in
             // confirmRemoveFromList for why running it synchronously here
             // triggers NG0100 and silently breaks the UI refresh.
             await Promise.resolve();
-            this.refreshGrid();
+            this.RefreshGrid();
             this.bumpStatsRefresh();
         }
         catch (e) {
@@ -1480,10 +2008,14 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             this.sharedService.CreateSimpleNotification(`Bulk update failed: ${message}`, 'error', 5000);
         }
         finally {
-            this.isApplyingBulkStatus = false;
+            this.IsApplyingBulkStatus = false;
             this.cdr.detectChanges();
         }
     }
+    /** @deprecated Use {@link ApplyBulkStatus}. */
+    async applyBulkStatus() {
+        return this.ApplyBulkStatus();
+    }
     // ==========================================
     // Bulk Move / Copy (mockups 23, 24)
     //
@@ -1497,17 +2029,25 @@ export class SingleListDetailComponent extends BaseAngularComponent {
     // needed for the preview. Apply step uses direct entity Save/Delete
     // inside a single TransactionGroup (same pattern as Remove).
     // ==========================================
-    openMoveDialog() { this.openMoveCopyDialog('move'); }
-    openCopyDialog() { this.openMoveCopyDialog('copy'); }
+    OpenMoveDialog() { this.openMoveCopyDialog('move'); }
+    /** @deprecated Use {@link OpenMoveDialog}. */
+    openMoveDialog() {
+        return this.OpenMoveDialog();
+    }
+    OpenCopyDialog() { this.openMoveCopyDialog('copy'); }
+    /** @deprecated Use {@link OpenCopyDialog}. */
+    openCopyDialog() {
+        return this.OpenCopyDialog();
+    }
     openMoveCopyDialog(mode) {
-        if (!this.listRecord || this.selectedKeys.length === 0) {
+        if (!this.ListRecord || this.SelectedKeys.length === 0) {
             this.sharedService.CreateSimpleNotification('Please select records first', 'warning', 2500);
             return;
         }
-        this.moveCopyMode = mode;
-        this.moveCopySelectedTarget = null;
-        this.moveCopyTargetSearch = '';
-        this.showMoveCopyDialog = true;
+        this.MoveCopyMode = mode;
+        this.MoveCopySelectedTarget = null;
+        this.MoveCopyTargetSearch = '';
+        this.ShowMoveCopyDialog = true;
         // Load candidates once per dialog open. We don't keep them in
         // permanent component state because the user could create/delete
         // lists between opens, and the target picker isn't visible often
@@ -1515,32 +2055,48 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         void this.loadMoveCopyTargets();
         this.cdr.detectChanges();
     }
-    closeMoveCopyDialog() {
-        this.showMoveCopyDialog = false;
-        this.moveCopyTargetCandidates = [];
-        this.moveCopySelectedTarget = null;
+    CloseMoveCopyDialog() {
+        this.ShowMoveCopyDialog = false;
+        this.MoveCopyTargetCandidates = [];
+        this.MoveCopySelectedTarget = null;
         this.cdr.detectChanges();
     }
+    /** @deprecated Use {@link CloseMoveCopyDialog}. */
+    closeMoveCopyDialog() {
+        return this.CloseMoveCopyDialog();
+    }
+    SelectMoveCopyTarget(target) {
+        this.MoveCopySelectedTarget = target;
+    }
+    /** @deprecated Use {@link SelectMoveCopyTarget}. */
     selectMoveCopyTarget(target) {
-        this.moveCopySelectedTarget = target;
+        return this.SelectMoveCopyTarget(target);
     }
-    get filteredMoveCopyTargets() {
-        const term = this.moveCopyTargetSearch.trim().toLowerCase();
+    get FilteredMoveCopyTargets() {
+        const term = this.MoveCopyTargetSearch.trim().toLowerCase();
         if (!term)
-            return this.moveCopyTargetCandidates;
-        return this.moveCopyTargetCandidates.filter((l) => l.Name.toLowerCase().includes(term) ||
+            return this.MoveCopyTargetCandidates;
+        return this.MoveCopyTargetCandidates.filter((l) => l.Name.toLowerCase().includes(term) ||
             (l.Description?.toLowerCase().includes(term) ?? false));
     }
+    /** @deprecated Use {@link FilteredMoveCopyTargets}. */
+    get filteredMoveCopyTargets() {
+        return this.FilteredMoveCopyTargets;
+    }
+    get MoveCopyProgressPercent() {
+        return this.MoveCopyTotal > 0 ? Math.round((this.MoveCopyProgress / this.MoveCopyTotal) * 100) : 0;
+    }
+    /** @deprecated Use {@link MoveCopyProgressPercent}. */
     get moveCopyProgressPercent() {
-        return this.moveCopyTotal > 0 ? Math.round((this.moveCopyProgress / this.moveCopyTotal) * 100) : 0;
+        return this.MoveCopyProgressPercent;
     }
     /** Load candidate target lists — same Entity, owned by or shared with
      *  the current user, excluding the list we're standing on. One RunView
      *  on open; results stay in memory until the dialog closes. */
     async loadMoveCopyTargets() {
-        if (!this.listRecord)
+        if (!this.ListRecord)
             return;
-        this.moveCopyTargetCandidatesLoading = true;
+        this.MoveCopyTargetCandidatesLoading = true;
         this.cdr.detectChanges();
         try {
             const rv = RunView.FromMetadataProvider(this.ProviderToUse);
@@ -1548,7 +2104,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             // would over-restrict (Shared-With-Me lists should be valid targets
             // when the user has Edit there); the server enforces the real
             // permission on the per-row Save, so listing extra entries is fine.
-            const filter = `EntityID='${this.listRecord.EntityID}' AND ID<>'${this.listRecord.ID}'`;
+            const filter = `EntityID='${this.ListRecord.EntityID}' AND ID<>'${this.ListRecord.ID}'`;
             const result = await rv.RunView({
                 EntityName: 'MJ: Lists',
                 ExtraFilter: filter,
@@ -1557,20 +2113,20 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 MaxRows: 500,
             });
             if (result.Success) {
-                this.moveCopyTargetCandidates = (result.Results ?? []);
+                this.MoveCopyTargetCandidates = (result.Results ?? []);
             }
             else {
-                this.moveCopyTargetCandidates = [];
+                this.MoveCopyTargetCandidates = [];
                 this.sharedService.CreateSimpleNotification(`Failed to load target lists: ${result.ErrorMessage}`, 'error', 4000);
             }
         }
         catch (e) {
-            this.moveCopyTargetCandidates = [];
+            this.MoveCopyTargetCandidates = [];
             const message = e instanceof Error ? e.message : String(e);
             this.sharedService.CreateSimpleNotification(`Failed to load target lists: ${message}`, 'error', 4000);
         }
         finally {
-            this.moveCopyTargetCandidatesLoading = false;
+            this.MoveCopyTargetCandidatesLoading = false;
             this.cdr.detectChanges();
         }
     }
@@ -1579,33 +2135,45 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * immediately. For Move we build a local Delta and show the confirm
      * dialog — the actual mutation fires from onMoveConfirmCommit().
      */
-    async confirmMoveCopy() {
-        if (!this.listRecord || !this.moveCopySelectedTarget || this.selectedKeys.length === 0)
+    async ConfirmMoveCopy() {
+        if (!this.ListRecord || !this.MoveCopySelectedTarget || this.SelectedKeys.length === 0)
             return;
-        if (this.moveCopyMode === 'copy') {
+        if (this.MoveCopyMode === 'copy') {
             await this.applyMoveCopy(false);
             return;
         }
         // Move: show delta-confirm so the user explicitly acks the source-side drop.
         const recordIds = this.extractSelectedRecordIds();
-        this.moveDelta = this.buildMoveDelta(recordIds);
-        this.showMoveCopyDialog = false;
-        this.moveDeltaConfirmVisible = true;
+        this.MoveDelta = this.buildMoveDelta(recordIds);
+        this.ShowMoveCopyDialog = false;
+        this.MoveDeltaConfirmVisible = true;
         this.cdr.detectChanges();
     }
-    onMoveConfirmCancel() {
-        this.moveDeltaConfirmVisible = false;
-        this.moveDelta = null;
+    /** @deprecated Use {@link ConfirmMoveCopy}. */
+    async confirmMoveCopy() {
+        return this.ConfirmMoveCopy();
+    }
+    OnMoveConfirmCancel() {
+        this.MoveDeltaConfirmVisible = false;
+        this.MoveDelta = null;
         // Re-open the target picker so the user can change their mind without
         // losing their selection.
-        this.showMoveCopyDialog = true;
+        this.ShowMoveCopyDialog = true;
         this.cdr.detectChanges();
     }
-    async onMoveConfirmCommit(_deltaToken) {
-        this.moveDeltaConfirmVisible = false;
+    /** @deprecated Use {@link OnMoveConfirmCancel}. */
+    onMoveConfirmCancel() {
+        return this.OnMoveConfirmCancel();
+    }
+    async OnMoveConfirmCommit(_deltaToken) {
+        this.MoveDeltaConfirmVisible = false;
         this.cdr.detectChanges();
         await this.applyMoveCopy(true);
     }
+    /** @deprecated Use {@link OnMoveConfirmCommit}. */
+    async onMoveConfirmCommit(_deltaToken) {
+        return this.OnMoveConfirmCommit(_deltaToken);
+    }
     /**
      * Pull RecordIDs out of selectedKeys. selectedKeys arrive from the
      * grid in concatenated-key format ("ID|<value>"). For single-PK entities
@@ -1615,8 +2183,8 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      */
     extractSelectedRecordIds() {
         const md = this.ProviderToUse;
-        const entityInfo = this.listRecord ? md.EntityByID(this.listRecord.EntityID) : null;
-        return this.selectedKeys.map((key) => {
+        const entityInfo = this.ListRecord ? md.EntityByID(this.ListRecord.EntityID) : null;
+        return this.SelectedKeys.map((key) => {
             if (entityInfo && entityInfo.PrimaryKeys.length === 1) {
                 const ck = new CompositeKey();
                 ck.LoadFromConcatenatedString(key);
@@ -1635,8 +2203,8 @@ export class SingleListDetailComponent extends BaseAngularComponent {
     buildMoveDelta(recordIds) {
         const removeCount = recordIds.length;
         return {
-            TargetListId: this.listRecord.ID,
-            EntityName: this.listRecord.Entity ?? '',
+            TargetListId: this.ListRecord.ID,
+            EntityName: this.ListRecord.Entity ?? '',
             ToAdd: [],
             ToRemove: recordIds,
             Unchanged: [],
@@ -1645,11 +2213,11 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 Remove: removeCount,
                 Unchanged: 0,
                 SourceTotal: 0,
-                TargetTotal: this.rowCount,
+                TargetTotal: this.RowCount,
             },
             Warnings: [{
                     Code: 'WILL_REMOVE_RECORDS',
-                    Message: `${removeCount} record(s) will be removed from "${this.listRecord.Name}" as part of the move`,
+                    Message: `${removeCount} record(s) will be removed from "${this.ListRecord.Name}" as part of the move`,
                     Details: { Count: removeCount },
                 }],
             // Sentinel — client-side flow doesn't round-trip this.
@@ -1663,16 +2231,16 @@ export class SingleListDetailComponent extends BaseAngularComponent {
      * leave records duplicated in both lists.
      */
     async applyMoveCopy(isMove) {
-        if (!this.listRecord || !this.moveCopySelectedTarget)
+        if (!this.ListRecord || !this.MoveCopySelectedTarget)
             return;
-        const source = this.listRecord;
-        const target = this.moveCopySelectedTarget;
+        const source = this.ListRecord;
+        const target = this.MoveCopySelectedTarget;
         const recordIds = this.extractSelectedRecordIds();
         if (recordIds.length === 0)
             return;
-        this.isApplyingMoveCopy = true;
-        this.moveCopyTotal = recordIds.length;
-        this.moveCopyProgress = 0;
+        this.IsApplyingMoveCopy = true;
+        this.MoveCopyTotal = recordIds.length;
+        this.MoveCopyProgress = 0;
         this.cdr.detectChanges();
         const md = this.ProviderToUse;
         const rv = RunView.FromMetadataProvider(md);
@@ -1720,7 +2288,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 }
             }
             const ok = await tg.Submit();
-            this.moveCopyProgress = this.moveCopyTotal;
+            this.MoveCopyProgress = this.MoveCopyTotal;
             if (!ok) {
                 this.sharedService.CreateSimpleNotification(`${isMove ? 'Move' : 'Copy'} partially failed — some changes may not have applied`, 'error', 5000);
                 return;
@@ -1733,11 +2301,11 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             // refresh by a microtask so the dialog/visibility flips happen in
             // a fresh change-detection cycle.
             await Promise.resolve();
-            this.closeMoveCopyDialog();
-            this.moveDelta = null;
+            this.CloseMoveCopyDialog();
+            this.MoveDelta = null;
             if (isMove) {
-                this.listDetailGrid?.clearSelection();
-                this.refreshGrid();
+                this.ListDetailGrid?.clearSelection();
+                this.RefreshGrid();
                 this.bumpStatsRefresh();
             }
             this.cdr.detectChanges();
@@ -1748,40 +2316,48 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             this.sharedService.CreateSimpleNotification(`${isMove ? 'Move' : 'Copy'} failed: ${message}`, 'error', 5000);
         }
         finally {
-            this.isApplyingMoveCopy = false;
+            this.IsApplyingMoveCopy = false;
             this.cdr.detectChanges();
         }
     }
     // ==========================================
     // Remove from List Dialog
     // ==========================================
-    openRemoveDialog() {
-        if (this.selectedKeys.length === 0) {
+    OpenRemoveDialog() {
+        if (this.SelectedKeys.length === 0) {
             this.sharedService.CreateSimpleNotification("Please select records to remove", 'warning', 2500);
             return;
         }
-        this.showRemoveDialog = true;
+        this.ShowRemoveDialog = true;
     }
+    /** @deprecated Use {@link OpenRemoveDialog}. */
+    openRemoveDialog() {
+        return this.OpenRemoveDialog();
+    }
+    CloseRemoveDialog() {
+        this.ShowRemoveDialog = false;
+        this.IsRemoving = false;
+        this.RemoveProgress = 0;
+        this.RemoveTotal = 0;
+    }
+    /** @deprecated Use {@link CloseRemoveDialog}. */
     closeRemoveDialog() {
-        this.showRemoveDialog = false;
-        this.isRemoving = false;
-        this.removeProgress = 0;
-        this.removeTotal = 0;
+        return this.CloseRemoveDialog();
     }
-    async confirmRemoveFromList() {
-        if (!this.listRecord || this.selectedKeys.length === 0)
+    async ConfirmRemoveFromList() {
+        if (!this.ListRecord || this.SelectedKeys.length === 0)
             return;
-        this.isRemoving = true;
-        this.removeTotal = this.selectedKeys.length;
-        this.removeProgress = 0;
+        this.IsRemoving = true;
+        this.RemoveTotal = this.SelectedKeys.length;
+        this.RemoveProgress = 0;
         const md = this.ProviderToUse;
         const rv = RunView.FromMetadataProvider(this.ProviderToUse);
-        const entityInfo = md.EntityByID(this.listRecord.EntityID);
+        const entityInfo = md.EntityByID(this.ListRecord.EntityID);
         // selectedKeys from grid are in concatenated format (ID|value)
         // For single PK entities, RecordID in DB is just the raw value
         // For composite PK entities, RecordID in DB is the concatenated format
         // Extract the appropriate format for the query
-        const selectedRecordIds = this.selectedKeys.map(key => {
+        const selectedRecordIds = this.SelectedKeys.map(key => {
             if (entityInfo && entityInfo.PrimaryKeys.length === 1) {
                 // Single PK: extract just the value from concatenated format
                 const compositeKey = new CompositeKey();
@@ -1793,7 +2369,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 return key;
             }
         });
-        const listDetailsFilter = `ListID = '${this.listRecord.ID}' AND RecordID IN (${selectedRecordIds.map(id => `'${id}'`).join(',')})`;
+        const listDetailsFilter = `ListID = '${this.ListRecord.ID}' AND RecordID IN (${selectedRecordIds.map(id => `'${id}'`).join(',')})`;
         const listDetailsResult = await rv.RunView({
             EntityName: 'MJ: List Details',
             ExtraFilter: listDetailsFilter,
@@ -1802,7 +2378,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         if (!listDetailsResult.Success) {
             LogError("Error loading list details for removal", undefined, listDetailsResult.ErrorMessage);
             this.sharedService.CreateSimpleNotification("Failed to remove records", 'error', 2500);
-            this.isRemoving = false;
+            this.IsRemoving = false;
             return;
         }
         // Use transaction group for bulk delete
@@ -1814,7 +2390,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         }
         const success = await tg.Submit();
         if (success) {
-            this.removeProgress = this.removeTotal;
+            this.RemoveProgress = this.RemoveTotal;
             this.sharedService.CreateSimpleNotification(`Removed ${listDetails.length} record${listDetails.length !== 1 ? 's' : ''} from list`, 'success', 2500);
             // Defer cleanup + refresh to the next microtask. Running these
             // synchronously inside the current change-detection cycle
@@ -1823,79 +2399,99 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             // stale state — the deletion succeeds server-side but the UI
             // doesn't re-fetch until the user navigates away and back.
             await Promise.resolve();
-            this.closeRemoveDialog();
-            this.listDetailGrid?.clearSelection();
-            this.refreshGrid();
+            this.CloseRemoveDialog();
+            this.ListDetailGrid?.clearSelection();
+            this.RefreshGrid();
             this.bumpStatsRefresh();
             this.cdr.detectChanges();
         }
         else {
             LogError("Error removing records from list");
             this.sharedService.CreateSimpleNotification("Failed to remove some records", 'error', 2500);
-            this.isRemoving = false;
+            this.IsRemoving = false;
         }
     }
+    /** @deprecated Use {@link ConfirmRemoveFromList}. */
+    async confirmRemoveFromList() {
+        return this.ConfirmRemoveFromList();
+    }
     // ==========================================
     // Add Records Dialog
     // ==========================================
-    async openAddRecordsDialog() {
-        this.showAddRecordsDialog = true;
-        this.addableRecords = [];
-        this.addRecordsSearchFilter = "";
-        this.addDialogLoading = true;
-        this.addDialogSaving = false;
+    async OpenAddRecordsDialog() {
+        this.ShowAddRecordsDialog = true;
+        this.AddableRecords = [];
+        this.AddRecordsSearchFilter = "";
+        this.AddDialogLoading = true;
+        this.AddDialogSaving = false;
         // Load existing list detail IDs to mark which records are already in the list
         await this.loadExistingListDetailIds();
-        this.addDialogLoading = false;
+        this.AddDialogLoading = false;
         // Explicit CD: the GraphQL promise resolution doesn't reliably produce an
         // Angular tick, so without this the spinner stays up until the next user
         // event (click/keystroke) forces a change-detection cycle.
         this.cdr.detectChanges();
     }
+    /** @deprecated Use {@link OpenAddRecordsDialog}. */
+    async openAddRecordsDialog() {
+        return this.OpenAddRecordsDialog();
+    }
+    CloseAddRecordsDialog() {
+        this.ShowAddRecordsDialog = false;
+        this.AddableRecords = [];
+        this.AddRecordsSearchFilter = "";
+        this.ExistingListDetailIds.clear();
+        this.AddDialogSaving = false;
+        this.AddProgress = 0;
+        this.AddTotal = 0;
+    }
+    /** @deprecated Use {@link CloseAddRecordsDialog}. */
     closeAddRecordsDialog() {
-        this.showAddRecordsDialog = false;
-        this.addableRecords = [];
-        this.addRecordsSearchFilter = "";
-        this.existingListDetailIds.clear();
-        this.addDialogSaving = false;
-        this.addProgress = 0;
-        this.addTotal = 0;
+        return this.CloseAddRecordsDialog();
     }
     async loadExistingListDetailIds() {
-        if (!this.listRecord)
+        if (!this.ListRecord)
             return;
         const md = this.ProviderToUse;
         const rv = RunView.FromMetadataProvider(this.ProviderToUse);
         const result = await rv.RunView({
             EntityName: 'MJ: List Details',
-            ExtraFilter: `ListID = '${this.listRecord.ID}'`,
+            ExtraFilter: `ListID = '${this.ListRecord.ID}'`,
             Fields: ['RecordID'],
             ResultType: 'simple'
         }, md.CurrentUser);
         if (result.Success) {
-            this.existingListDetailIds = new Set(result.Results.map(r => NormalizeUUID(r.RecordID)));
+            this.ExistingListDetailIds = new Set(result.Results.map(r => NormalizeUUID(r.RecordID)));
         }
     }
-    onAddRecordsSearchInputEvent(event) {
+    OnAddRecordsSearchInputEvent(event) {
         const value = event.target.value;
-        this.onAddRecordsSearchChange(value);
+        this.OnAddRecordsSearchChange(value);
     }
-    onAddRecordsSearchChange(value) {
-        this.addRecordsSearchFilter = value;
+    /** @deprecated Use {@link OnAddRecordsSearchInputEvent}. */
+    onAddRecordsSearchInputEvent(event) {
+        return this.OnAddRecordsSearchInputEvent(event);
+    }
+    OnAddRecordsSearchChange(value) {
+        this.AddRecordsSearchFilter = value;
         this.searchSubject.next(value);
     }
+    /** @deprecated Use {@link OnAddRecordsSearchChange}. */
+    onAddRecordsSearchChange(value) {
+        return this.OnAddRecordsSearchChange(value);
+    }
     async searchRecords(searchText) {
-        if (!this.listRecord || !searchText || searchText.length < 2) {
-            this.addableRecords = [];
+        if (!this.ListRecord || !searchText || searchText.length < 2) {
+            this.AddableRecords = [];
             this.cdr.detectChanges();
             return;
         }
-        this.addDialogLoading = true;
+        this.AddDialogLoading = true;
         this.cdr.detectChanges();
         const md = this.ProviderToUse;
-        const sourceEntityInfo = md.EntityByID(this.listRecord.EntityID);
+        const sourceEntityInfo = md.EntityByID(this.ListRecord.EntityID);
         if (!sourceEntityInfo) {
-            this.addDialogLoading = false;
+            this.AddDialogLoading = false;
             this.cdr.detectChanges();
             return;
         }
@@ -1909,13 +2505,13 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         }
         const rv = RunView.FromMetadataProvider(this.ProviderToUse);
         const result = await rv.RunView({
-            EntityName: this.listRecord.Entity,
+            EntityName: this.ListRecord.Entity,
             ExtraFilter: filter,
             MaxRows: 100,
             ResultType: 'simple'
         });
         if (result.Success) {
-            this.addableRecords = result.Results.map((record) => {
+            this.AddableRecords = result.Results.map((record) => {
                 // Compact key segment (raw value, or "F1|v1||F2|v2" for a composite key) — the form ListDetail.RecordID stores
                 const recordId = CompositeKey.FromEntityRecord(sourceEntityInfo, record).ToCompactURLSegment();
                 return {
@@ -1923,39 +2519,55 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                     Name: displayField.Field
                         ? FormatRecordDisplayValue(recordId, record[displayField.Field.Name], displayField)
                         : recordId,
-                    isInList: this.existingListDetailIds.has(NormalizeUUID(recordId)),
+                    isInList: this.ExistingListDetailIds.has(NormalizeUUID(recordId)),
                     isSelected: false
                 };
             });
         }
-        this.addDialogLoading = false;
+        this.AddDialogLoading = false;
         this.cdr.detectChanges();
     }
-    toggleRecordSelection(record) {
+    ToggleRecordSelection(record) {
         if (record.isInList)
             return; // Can't select records already in list
         record.isSelected = !record.isSelected;
     }
+    /** @deprecated Use {@link ToggleRecordSelection}. */
+    toggleRecordSelection(record) {
+        return this.ToggleRecordSelection(record);
+    }
+    get SelectedAddableRecords() {
+        return this.AddableRecords.filter(r => r.isSelected);
+    }
+    /** @deprecated Use {@link SelectedAddableRecords}. */
     get selectedAddableRecords() {
-        return this.addableRecords.filter(r => r.isSelected);
+        return this.SelectedAddableRecords;
     }
-    selectAllAddable() {
-        this.addableRecords.forEach(r => {
+    SelectAllAddable() {
+        this.AddableRecords.forEach(r => {
             if (!r.isInList)
                 r.isSelected = true;
         });
     }
+    /** @deprecated Use {@link SelectAllAddable}. */
+    selectAllAddable() {
+        return this.SelectAllAddable();
+    }
+    DeselectAllAddable() {
+        this.AddableRecords.forEach(r => r.isSelected = false);
+    }
+    /** @deprecated Use {@link DeselectAllAddable}. */
     deselectAllAddable() {
-        this.addableRecords.forEach(r => r.isSelected = false);
+        return this.DeselectAllAddable();
     }
-    async confirmAddRecords() {
-        const recordsToAdd = this.selectedAddableRecords;
-        if (recordsToAdd.length === 0 || !this.listRecord)
+    async ConfirmAddRecords() {
+        const recordsToAdd = this.SelectedAddableRecords;
+        if (recordsToAdd.length === 0 || !this.ListRecord)
             return;
-        this.addDialogSaving = true;
+        this.AddDialogSaving = true;
         // Reserve 20% of progress for tg.Submit()
-        this.addTotal = recordsToAdd.length;
-        this.addProgress = 0;
+        this.AddTotal = recordsToAdd.length;
+        this.AddProgress = 0;
         const progressPerRecord = 0.8 / recordsToAdd.length; // 80% for individual saves
         const md = this.ProviderToUse;
         // Use transaction group for bulk insert
@@ -1963,7 +2575,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         for (let i = 0; i < recordsToAdd.length; i++) {
             const record = recordsToAdd[i];
             const listDetail = await md.GetEntityObject("MJ: List Details", md.CurrentUser);
-            listDetail.ListID = this.listRecord.ID;
+            listDetail.ListID = this.ListRecord.ID;
             listDetail.RecordID = record.ID;
             listDetail.TransactionGroup = tg;
             const result = await listDetail.Save();
@@ -1973,86 +2585,106 @@ export class SingleListDetailComponent extends BaseAngularComponent {
                 });
             }
             // Update progress (0-80%)
-            this.addProgress = Math.round((i + 1) * progressPerRecord * this.addTotal);
+            this.AddProgress = Math.round((i + 1) * progressPerRecord * this.AddTotal);
         }
         // Show 80% complete before submit
-        this.addProgress = Math.round(this.addTotal * 0.8);
+        this.AddProgress = Math.round(this.AddTotal * 0.8);
         const success = await tg.Submit();
         if (success) {
-            this.addProgress = this.addTotal;
+            this.AddProgress = this.AddTotal;
             this.sharedService.CreateSimpleNotification(`Added ${recordsToAdd.length} record${recordsToAdd.length !== 1 ? 's' : ''} to list`, 'success', 2500);
             // Defer dialog close + grid refresh to the next microtask. See
             // confirmRemoveFromList for the NG0100 background.
             await Promise.resolve();
-            this.closeAddRecordsDialog();
-            this.refreshGrid();
+            this.CloseAddRecordsDialog();
+            this.RefreshGrid();
             this.bumpStatsRefresh();
             this.cdr.detectChanges();
         }
         else {
             LogError("Error adding records to list");
             this.sharedService.CreateSimpleNotification("Failed to add some records", 'error', 2500);
-            this.addDialogSaving = false;
+            this.AddDialogSaving = false;
         }
     }
+    /** @deprecated Use {@link ConfirmAddRecords}. */
+    async confirmAddRecords() {
+        return this.ConfirmAddRecords();
+    }
     // ==========================================
     // Add From View Dialog (existing functionality, cleaned up)
     // ==========================================
-    async openAddFromViewDialog() {
-        this.showAddFromViewDialog = true;
-        this.userViewsToAdd = [];
+    async OpenAddFromViewDialog() {
+        this.ShowAddFromViewDialog = true;
+        this.UserViewsToAdd = [];
         this.userViewsToAddIds.clear();
-        if (!this.userViews) {
+        if (!this.UserViews) {
             await this.loadEntityViews();
         }
     }
-    closeAddFromViewDialog() {
-        this.showAddFromViewDialog = false;
-        this.userViewsToAdd = [];
+    /** @deprecated Use {@link OpenAddFromViewDialog}. */
+    async openAddFromViewDialog() {
+        return this.OpenAddFromViewDialog();
+    }
+    CloseAddFromViewDialog() {
+        this.ShowAddFromViewDialog = false;
+        this.UserViewsToAdd = [];
         this.userViewsToAddIds.clear();
-        this.showAddFromViewLoader = false;
-        this.addFromViewTotal = 0;
+        this.ShowAddFromViewLoader = false;
+        this.AddFromViewTotal = 0;
         this.setAddFromViewProgress(0);
     }
+    /** @deprecated Use {@link CloseAddFromViewDialog}. */
+    closeAddFromViewDialog() {
+        return this.CloseAddFromViewDialog();
+    }
     async loadEntityViews() {
-        if (!this.listRecord || !this.listRecord.Entity)
+        if (!this.ListRecord || !this.ListRecord.Entity)
             return;
-        this.showAddFromViewLoader = true;
+        this.ShowAddFromViewLoader = true;
         const rv = RunView.FromMetadataProvider(this.ProviderToUse);
         const md = this.ProviderToUse;
         const runViewResult = await rv.RunView({
             EntityName: "MJ: User Views",
-            ExtraFilter: `UserID = '${md.CurrentUser.ID}' AND EntityID = '${this.listRecord.EntityID}'`,
+            ExtraFilter: `UserID = '${md.CurrentUser.ID}' AND EntityID = '${this.ListRecord.EntityID}'`,
             ResultType: 'entity_object'
         }, md.CurrentUser);
         if (!runViewResult.Success) {
-            LogError(`Error loading User Views for entity ${this.listRecord.Entity}`);
+            LogError(`Error loading User Views for entity ${this.ListRecord.Entity}`);
         }
         else {
-            this.userViews = runViewResult.Results;
+            this.UserViews = runViewResult.Results;
         }
-        this.showAddFromViewLoader = false;
+        this.ShowAddFromViewLoader = false;
         this.cdr.detectChanges();
     }
-    toggleViewSelection(view) {
-        const index = this.userViewsToAdd.findIndex(v => UUIDsEqual(v.ID, view.ID));
+    ToggleViewSelection(view) {
+        const index = this.UserViewsToAdd.findIndex(v => UUIDsEqual(v.ID, view.ID));
         if (index >= 0) {
-            this.userViewsToAdd.splice(index, 1);
+            this.UserViewsToAdd.splice(index, 1);
             this.userViewsToAddIds.delete(NormalizeUUID(view.ID));
         }
         else {
-            this.userViewsToAdd.push(view);
+            this.UserViewsToAdd.push(view);
             this.userViewsToAddIds.add(NormalizeUUID(view.ID));
         }
     }
-    isViewSelected(view) {
+    /** @deprecated Use {@link ToggleViewSelection}. */
+    toggleViewSelection(view) {
+        return this.ToggleViewSelection(view);
+    }
+    IsViewSelected(view) {
         return this.userViewsToAddIds.has(NormalizeUUID(view.ID));
     }
-    async confirmAddFromView() {
-        if (!this.listRecord || this.userViewsToAdd.length === 0)
+    /** @deprecated Use {@link IsViewSelected}. */
+    isViewSelected(view) {
+        return this.IsViewSelected(view);
+    }
+    async ConfirmAddFromView() {
+        if (!this.ListRecord || this.UserViewsToAdd.length === 0)
             return;
-        this.showAddFromViewLoader = true;
-        this.fetchingRecordsToSave = true;
+        this.ShowAddFromViewLoader = true;
+        this.FetchingRecordsToSave = true;
         this.cdr.detectChanges();
         const rv = RunView.FromMetadataProvider(this.ProviderToUse);
         const md = this.ProviderToUse;
@@ -2061,7 +2693,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         // sequential RunView per view (N round-trips → 1). Each view has a distinct ViewID,
         // so this can't collapse to one query, but RunViews parallelizes the round trips.
         const recordIdSet = new Set();
-        const viewResults = await rv.RunViews(this.userViewsToAdd.map(userView => ({
+        const viewResults = await rv.RunViews(this.UserViewsToAdd.map(userView => ({
             ViewID: userView.ID,
             ViewEntity: userView,
             Fields: ["ID"]
@@ -2074,15 +2706,15 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         }
         // Filter out records already in the list
         await this.loadExistingListDetailIds();
-        const recordsToAdd = [...recordIdSet].filter(id => !this.existingListDetailIds.has(id));
-        this.addFromViewTotal = recordsToAdd.length;
+        const recordsToAdd = [...recordIdSet].filter(id => !this.ExistingListDetailIds.has(id));
+        this.AddFromViewTotal = recordsToAdd.length;
         this.setAddFromViewProgress(0);
-        this.fetchingRecordsToSave = false;
+        this.FetchingRecordsToSave = false;
         this.cdr.detectChanges();
         const progressPerRecord = 0.8 / Math.max(recordsToAdd.length, 1); // 80% for individual saves
         if (recordsToAdd.length === 0) {
             this.sharedService.CreateSimpleNotification("All records already in list", 'info', 2500);
-            this.showAddFromViewLoader = false;
+            this.ShowAddFromViewLoader = false;
             this.cdr.detectChanges();
             return;
         }
@@ -2092,7 +2724,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         for (let i = 0; i < recordsToAdd.length; i++) {
             const recordID = recordsToAdd[i];
             const listDetail = await md.GetEntityObject("MJ: List Details", md.CurrentUser);
-            listDetail.ListID = this.listRecord.ID;
+            listDetail.ListID = this.ListRecord.ID;
             listDetail.RecordID = recordID;
             listDetail.TransactionGroup = tg;
             const result = await listDetail.Save();
@@ -2106,36 +2738,40 @@ export class SingleListDetailComponent extends BaseAngularComponent {
             // CD cycle on this iteration. Without detectChanges() the next await
             // can yield in the middle of a cycle and Angular's dev-mode re-check
             // catches the percent changing → NG0100 flood.
-            this.setAddFromViewProgress(Math.round((i + 1) * progressPerRecord * this.addFromViewTotal));
+            this.setAddFromViewProgress(Math.round((i + 1) * progressPerRecord * this.AddFromViewTotal));
             this.cdr.detectChanges();
         }
         // Show 80% complete before submit
-        this.setAddFromViewProgress(Math.round(this.addFromViewTotal * 0.8));
+        this.setAddFromViewProgress(Math.round(this.AddFromViewTotal * 0.8));
         this.cdr.detectChanges();
         const success = await tg.Submit();
         if (success) {
-            this.setAddFromViewProgress(this.addFromViewTotal);
+            this.setAddFromViewProgress(this.AddFromViewTotal);
             this.sharedService.CreateSimpleNotification(`Added ${recordsToAdd.length} record${recordsToAdd.length !== 1 ? 's' : ''} to list`, 'success', 2500);
             // Defer dialog close + grid refresh to the next microtask. See
             // confirmRemoveFromList for the NG0100 background.
             await Promise.resolve();
-            this.closeAddFromViewDialog();
-            this.refreshGrid();
+            this.CloseAddFromViewDialog();
+            this.RefreshGrid();
             this.bumpStatsRefresh();
             this.cdr.detectChanges();
         }
         else {
             LogError("Error adding records from view to list");
             this.sharedService.CreateSimpleNotification("Failed to add some records", 'error', 2500);
-            this.showAddFromViewLoader = false;
+            this.ShowAddFromViewLoader = false;
         }
     }
+    /** @deprecated Use {@link ConfirmAddFromView}. */
+    async confirmAddFromView() {
+        return this.ConfirmAddFromView();
+    }
     static ɵfac = function SingleListDetailComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SingleListDetailComponent)(i0.ɵɵdirectiveInject(i1.SharedService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i2.ExportService), i0.ɵɵdirectiveInject(i3.ListSharingService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SingleListDetailComponent, selectors: [["mj-list-detail"]], viewQuery: function SingleListDetailComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0, 5);
         } if (rf & 2) {
             let _t;
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.listDetailGrid = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.ListDetailGrid = _t.first);
         } }, hostBindings: function SingleListDetailComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("click", function SingleListDetailComponent_click_HostBindingHandler($event) { return ctx.onDocumentClick($event); }, i0.ɵɵresolveDocument);
         } }, inputs: { ListID: "ListID" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 19, vars: 20, consts: [["listDetailGrid", ""], [1, "list-detail-container"], [1, "list-header"], [1, "list-header__titleblock"], [1, "lineage-badge", 3, "title"], [1, "list-detail__tags"], [1, "add-dropdown-wrapper"], [1, "permission-badge", "permission-badge--viewer"], [1, "custom-toolbar"], [1, "loading-container"], [1, "grid-with-stats"], [3, "Confirm", "Cancel", "Visible", "Delta", "TargetListName", "SourceLabel"], [3, "Visible", "Title", "MinWidth", "Width", "Height"], ["Title", "Remove from List", 3, "Visible", "MinWidth", "Width"], ["Title", "Add Records from Views", 3, "Visible", "MinWidth", "Width", "Height"], [1, "fa-solid", "fa-link"], [1, "lineage-badge__refreshed"], ["EntityName", "MJ: Lists", 3, "Provider", "RecordID", "Editable", "MaxDisplay"], ["mjButton", "", "variant", "primary", 1, "add-btn", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "fa-solid", "fa-chevron-down", "add-dropdown-arrow"], [1, "add-dropdown-panel"], [1, "add-dropdown-item"], [1, "add-dropdown-item", 3, "click"], [1, "add-dropdown-item-text"], [1, "add-dropdown-item-desc"], [1, "fa-solid", "fa-eye"], [1, "toolbar-left"], [1, "row-count"], [1, "selection-count"], [1, "toolbar-right"], ["mjButton", "", "variant", "flat", 1, "toolbar-button", 3, "click"], [1, "fa-solid", "fa-rotate"], [1, "fa-solid", "fa-file-export"], ["mjButton", "", "variant", "flat", "title", "Move selected records to another list", 1, "toolbar-button", 3, "click"], [1, "fa-solid", "fa-arrow-right-arrow-left"], ["mjButton", "", "variant", "flat", "title", "Copy selected records to another list (keeps them here too)", 1, "toolbar-button", 3, "click"], [1, "fa-solid", "fa-copy"], ["title", "Set status on selected items", 1, "mj-input", "mj-select", "bulk-status-select", 3, "ngModelChange", "ngModel", "disabled"], ["value", ""], ["value", "Active"], ["value", "Complete"], ["value", "Pending"], ["value", "Disabled"], ["value", "Rejected"], ["mjButton", "", "variant", "flat", 1, "toolbar-button", 3, "click", "disabled"], ["mjButton", "", "variant", "flat", 1, "toolbar-button", "remove-btn", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-pen-to-square"], ["title", "Refresh mode", 1, "mj-input", "mj-select", "refresh-mode-select", 3, "ngModelChange", "ngModel", "disabled"], ["value", "Additive"], ["value", "Sync"], [1, "fa-solid", "fa-cloud-arrow-down"], ["text", "Loading list...", "size", "medium"], [1, "grid-container"], [3, "rowClicked", "rowDoubleClicked", "selectionChange", "dataLoaded", "listId", "listEntity", "autoNavigate", "height", "showToolbar", "toolbarConfig", "selectionMode"], [1, "list-detail__stats"], [3, "Provider", "ListID", "RefreshTrigger"], [3, "Close", "Visible", "Title", "MinWidth", "Width", "Height"], [1, "dialog-content", "move-copy-dialog"], [1, "dialog-loading"], ["mjButton", "", "variant", "primary", 3, "click", "disabled"], ["mjButton", "", "variant", "outline", 3, "click", "disabled"], ["size", "small", 3, "text"], [1, "progress-bar", 3, "Value"], [1, "dialog-instruction"], [1, "search-section"], [1, "search-input-wrapper"], [1, "fa-solid", "fa-search", "search-icon"], ["type", "text", "placeholder", "Filter lists by name\u2026", 1, "mj-input", "search-input", 3, "ngModelChange", "ngModel"], [1, "list-loading"], ["Size", "compact", "Icon", "fa-solid fa-list", "Title", "No other lists found for this entity."], [1, "records-scroll", "move-copy-targets"], ["text", "Loading lists...", "size", "small"], [1, "dialog-note"], [1, "record-item", 3, "selected"], [1, "record-item", 3, "click"], [1, "record-checkbox"], ["type", "radio", "name", "moveCopyTarget", 3, "click", "change", "checked"], [1, "record-name"], [1, "target-desc"], ["Title", "Remove from List", 3, "Close", "Visible", "MinWidth", "Width"], [1, "dialog-content"], [1, "dialog-message"], ["mjButton", "", "variant", "danger", 3, "click", "disabled"], ["text", "Removing records...", "size", "small"], [1, "fa-solid", "fa-triangle-exclamation", "warning-icon"], [1, "dialog-content", "add-records-dialog"], ["text", "Adding records to list...", "size", "small"], ["type", "text", 1, "mj-input", "search-input", 3, "input", "placeholder", "value"], [1, "search-hint"], [1, "records-list"], ["Variant", "no-results", "Size", "compact", "Icon", "fa-solid fa-magnifying-glass", 3, "Title"], ["Size", "compact", "Icon", "fa-solid fa-list", "Title", "Search for records to add to this list"], ["size", "small", 3, "showText"], [1, "selection-controls"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "click"], [1, "selection-info"], [1, "records-scroll"], [1, "record-item", 3, "in-list", "selected"], ["title", "Already in list", 1, "fa-solid", "fa-check", "in-list-icon"], ["type", "checkbox", 3, "checked"], [1, "in-list-badge"], ["type", "checkbox", 3, "click", "change", "checked"], [1, "dialog-content", "export-dialog"], [1, "export-section-label"], [1, "export-format-row"], [1, "export-format-option", 3, "click"], ["type", "radio", "name", "exportFormat", "value", "excel", 3, "ngModelChange", "ngModel"], [1, "fa-solid", "fa-file-excel", 2, "color", "var(--mj-status-success)"], ["type", "radio", "name", "exportFormat", "value", "csv", 3, "ngModelChange", "ngModel"], [1, "fa-solid", "fa-file-csv", 2, "color", "var(--mj-text-secondary)"], ["type", "radio", "name", "exportFormat", "value", "json", 3, "ngModelChange", "ngModel"], [1, "fa-solid", "fa-file-code", 2, "color", "var(--mj-brand-primary)"], [1, "export-section-divider"], [1, "export-fields-list"], [1, "export-field-row"], [1, "export-field-actions"], ["href", "#", 3, "click"], [1, "muted"], ["type", "checkbox", 3, "ngModelChange", "ngModel"], [1, "fa-solid", "fa-download"], ["Title", "Add Records from Views", 3, "Close", "Visible", "MinWidth", "Width", "Height"], ["text", "Loading records from views...", "size", "small"], ["text", "Loading views...", "size", "small"], [1, "views-list"], ["Size", "compact", "Icon", "fa-solid fa-folder-open", "Title", "No saved views found for this entity"], [1, "view-item", 3, "selected"], [1, "view-item", 3, "click"], [1, "fa-solid", "fa-table-list", "view-icon"], [1, "view-name"]], template: function SingleListDetailComponent_Template(rf, ctx) { if (rf & 1) {
@@ -2196,7 +2832,7 @@ export class SingleListDetailComponent extends BaseAngularComponent {
         args: [{ standalone: false, selector: 'mj-list-detail', template: "<div class=\"list-detail-container\">\n  <!-- Header with title and Add button -->\n  <div class=\"list-header\">\n    <div class=\"list-header__titleblock\">\n      @if (listRecord) {\n        <h1>{{ listRecord.Name }}</h1>\n      } @else {\n        <h1>List</h1>\n      }\n      @if (hasLineage) {\n        <div class=\"lineage-badge\" [title]=\"'Source view: ' + (sourceViewName ?? 'unknown')\">\n          <i class=\"fa-solid fa-link\"></i>\n          <span>\n            @if (listRecord?.UseSnapshot) {\n              Snapshot of: <strong>{{ sourceViewName ?? '(unknown view)' }}</strong>\n            } @else {\n              Live view: <strong>{{ sourceViewName ?? '(unknown view)' }}</strong>\n            }\n          </span>\n          @if (listRecord?.LastRefreshedAt) {\n            <span class=\"lineage-badge__refreshed\">\n              \u00B7 last refreshed {{ listRecord!.LastRefreshedAt | date:'medium' }}\n            </span>\n          }\n        </div>\n      }\n      @if (listRecord) {\n        <!-- Tags section (Phase 4.2). Editable on the detail view. -->\n        <div class=\"list-detail__tags\">\n          <mj-tag-chips\n            [Provider]=\"Provider\"\n            EntityName=\"MJ: Lists\"\n            [RecordID]=\"listRecord.ID\"\n            [Editable]=\"capabilities.CanEdit\"\n            [MaxDisplay]=\"20\">\n          </mj-tag-chips>\n        </div>\n      }\n    </div>\n    @if (capabilities.CanEdit) {\n      <div class=\"add-dropdown-wrapper\">\n        <button mjButton variant=\"primary\" class=\"add-btn\" (click)=\"toggleAddDropdown()\">\n          <span class=\"fa-solid fa-plus\"></span>\n          Add to List\n          <span class=\"fa-solid fa-chevron-down add-dropdown-arrow\"></span>\n        </button>\n        @if (showAddDropdown) {\n          <div class=\"add-dropdown-panel\">\n            @for (option of addOptions; track option.Text) {\n              <div class=\"add-dropdown-item\" (click)=\"onDropdownItemClick(option)\">\n                <span class=\"add-dropdown-item-text\">{{ option.Text }}</span>\n                @if (option.Description) {\n                  <span class=\"add-dropdown-item-desc\">{{ option.Description }}</span>\n                }\n              </div>\n            }\n          </div>\n        }\n      </div>\n    } @else if (currentLevel) {\n      <!-- Viewer-perspective badge so users understand why mutation\n           controls are absent. Mirrors mockup 19. -->\n      <span class=\"permission-badge permission-badge--viewer\">\n        <i class=\"fa-solid fa-eye\"></i>\n        Viewer access\n      </span>\n    }\n  </div>\n\n  <!-- Custom Toolbar -->\n  @if (!showLoader && listRecord) {\n    <div class=\"custom-toolbar\">\n      <div class=\"toolbar-left\">\n        <span class=\"row-count\">{{ rowCount }} row{{ rowCount !== 1 ? 's' : '' }}</span>\n        @if (selectedKeys.length > 0) {\n          <span class=\"selection-count\">({{ selectedKeys.length }} selected)</span>\n        }\n      </div>\n      <div class=\"toolbar-right\">\n        @if (selectedKeys.length > 0 && capabilities.CanEdit) {\n          <!-- Bulk-edit toolbar (Phase 5.2, mockups 23/24).\n               Move/Copy open the target-list picker. Move then routes\n               through the delta-confirm dialog because the source side\n               drops; Copy is additive and applies directly. -->\n          <button mjButton\n            (click)=\"openMoveDialog()\"\n            variant=\"flat\"\n            class=\"toolbar-button\"\n            title=\"Move selected records to another list\">\n            <span class=\"fa-solid fa-arrow-right-arrow-left\"></span>\n            Move\u2026\n          </button>\n          <button mjButton\n            (click)=\"openCopyDialog()\"\n            variant=\"flat\"\n            class=\"toolbar-button\"\n            title=\"Copy selected records to another list (keeps them here too)\">\n            <span class=\"fa-solid fa-copy\"></span>\n            Copy\u2026\n          </button>\n          <select\n            class=\"mj-input mj-select bulk-status-select\"\n            [(ngModel)]=\"bulkStatus\"\n            [disabled]=\"isApplyingBulkStatus\"\n            title=\"Set status on selected items\">\n            <option value=\"\">Set status\u2026</option>\n            <option value=\"Active\">Active</option>\n            <option value=\"Complete\">Complete</option>\n            <option value=\"Pending\">Pending</option>\n            <option value=\"Disabled\">Disabled</option>\n            <option value=\"Rejected\">Rejected</option>\n          </select>\n          <button mjButton\n            (click)=\"applyBulkStatus()\"\n            [disabled]=\"!bulkStatus || isApplyingBulkStatus\"\n            variant=\"flat\"\n            class=\"toolbar-button\">\n            @if (isApplyingBulkStatus) {\n              <span class=\"fa-solid fa-spinner fa-spin\"></span>\n              Applying\u2026\n            } @else {\n              <span class=\"fa-solid fa-pen-to-square\"></span>\n              Apply Status\n            }\n          </button>\n          <button mjButton\n            (click)=\"openRemoveDialog()\"\n            variant=\"flat\"\n            class=\"toolbar-button remove-btn\">\n            <span class=\"fa-solid fa-trash\"></span>\n            Remove from List\n          </button>\n        }\n        @if (hasLineage && capabilities.CanRefresh) {\n          <select\n            class=\"mj-input mj-select refresh-mode-select\"\n            [ngModel]=\"refreshMode\"\n            (ngModelChange)=\"onRefreshModeChange($event)\"\n            [disabled]=\"isPreviewingRefresh || isApplyingRefresh\"\n            title=\"Refresh mode\">\n            <option value=\"Additive\">Additive</option>\n            <option value=\"Sync\">Sync</option>\n          </select>\n          <button mjButton\n            (click)=\"onRefreshFromSource()\"\n            [disabled]=\"isPreviewingRefresh || isApplyingRefresh\"\n            variant=\"flat\"\n            class=\"toolbar-button\">\n            @if (isPreviewingRefresh) {\n              <span class=\"fa-solid fa-spinner fa-spin\"></span>\n              Previewing...\n            } @else {\n              <span class=\"fa-solid fa-cloud-arrow-down\"></span>\n              Refresh from Source\n            }\n          </button>\n        }\n        <button mjButton\n          (click)=\"onRefreshClick()\"\n          variant=\"flat\"\n          class=\"toolbar-button\">\n          <span class=\"fa-solid fa-rotate\"></span>\n          Refresh\n        </button>\n        <button mjButton\n          (click)=\"onExportClick()\"\n          variant=\"flat\"\n          class=\"toolbar-button\">\n          <span class=\"fa-solid fa-file-export\"></span>\n          Export\n        </button>\n      </div>\n    </div>\n  }\n\n  <!-- Loading State -->\n  @if (showLoader) {\n    <div class=\"loading-container\">\n      <mj-loading text=\"Loading list...\" size=\"medium\"></mj-loading>\n    </div>\n  }\n\n  <!-- Grid + side stats panel (Phase 5.4). -->\n  @if (!showLoader && listRecord) {\n    <div class=\"grid-with-stats\">\n      <div class=\"grid-container\">\n        <mj-list-detail-grid\n          #listDetailGrid\n          [listId]=\"ListID\"\n          [listEntity]=\"listRecord\"\n          [autoNavigate]=\"true\"\n          [height]=\"'auto'\"\n          [showToolbar]=\"false\"\n          [toolbarConfig]=\"gridToolbarConfig\"\n          [selectionMode]=\"'checkbox'\"\n          (rowClicked)=\"onRowClicked($event)\"\n          (rowDoubleClicked)=\"onRowDoubleClicked($event)\"\n          (selectionChange)=\"onSelectionChange($event)\"\n          (dataLoaded)=\"onDataLoaded($event)\">\n        </mj-list-detail-grid>\n      </div>\n      <aside class=\"list-detail__stats\">\n        <mj-list-stats [Provider]=\"Provider\" [ListID]=\"listRecord.ID\" [RefreshTrigger]=\"statsRefreshTrigger\"></mj-list-stats>\n      </aside>\n    </div>\n  }\n\n  <!-- Refresh-from-source delta-confirm dialog -->\n  <mj-list-delta-confirm\n    [Visible]=\"refreshConfirmVisible && !!refreshDelta\"\n    [Delta]=\"refreshDelta\"\n    [TargetListName]=\"listRecord?.Name ?? null\"\n    [SourceLabel]=\"sourceViewName\"\n    (Confirm)=\"onRefreshConfirmCommit($event)\"\n    (Cancel)=\"onRefreshConfirmCancel()\">\n  </mj-list-delta-confirm>\n\n  <!-- Move delta-confirm dialog (mockup 24). Shown only for Move,\n       never for Copy. Drops on the source side require the user to\n       acknowledge before Confirm enables. -->\n  <mj-list-delta-confirm\n    [Visible]=\"moveDeltaConfirmVisible && !!moveDelta\"\n    [Delta]=\"moveDelta\"\n    [TargetListName]=\"listRecord?.Name ?? null\"\n    [SourceLabel]=\"'Move to ' + (moveCopySelectedTarget?.Name ?? 'target list')\"\n    (Confirm)=\"onMoveConfirmCommit($event)\"\n    (Cancel)=\"onMoveConfirmCancel()\">\n  </mj-list-delta-confirm>\n</div>\n\n<!-- Move/Copy target picker (mockup 23). Lists every list owned by /\n     shared with the current user that targets the same entity. -->\n@if (showMoveCopyDialog) {\n  <mj-dialog\n    [Visible]=\"true\"\n    [Title]=\"(moveCopyMode === 'move' ? 'Move ' : 'Copy ') + selectedKeys.length + ' record' + (selectedKeys.length === 1 ? '' : 's') + ' to\u2026'\"\n    (Close)=\"closeMoveCopyDialog()\"\n    [MinWidth]=\"480\"\n    [Width]=\"640\"\n    [Height]=\"560\">\n    <div class=\"dialog-content move-copy-dialog\">\n      @if (isApplyingMoveCopy) {\n        <div class=\"dialog-loading\">\n          <mj-loading [text]=\"(moveCopyMode === 'move' ? 'Moving' : 'Copying') + ' records...'\" size=\"small\"></mj-loading>\n          @if (moveCopyTotal > 0) {\n            <mj-progress-bar\n              [Value]=\"moveCopyProgressPercent\"\n              class=\"progress-bar\">\n            </mj-progress-bar>\n          }\n        </div>\n      } @else {\n        <p class=\"dialog-instruction\">\n          Choose the target list. Both lists must hold the same entity ({{ listRecord?.Entity ?? 'records' }}).\n        </p>\n        <div class=\"search-section\">\n          <div class=\"search-input-wrapper\">\n            <span class=\"fa-solid fa-search search-icon\"></span>\n            <input\n              class=\"mj-input search-input\"\n              type=\"text\"\n              placeholder=\"Filter lists by name\u2026\"\n              [(ngModel)]=\"moveCopyTargetSearch\" />\n          </div>\n        </div>\n        @if (moveCopyTargetCandidatesLoading) {\n          <div class=\"list-loading\">\n            <mj-loading text=\"Loading lists...\" size=\"small\"></mj-loading>\n          </div>\n        } @else if (filteredMoveCopyTargets.length === 0) {\n          <mj-empty-state\n            Size=\"compact\"\n            Icon=\"fa-solid fa-list\"\n            Title=\"No other lists found for this entity.\">\n            <p class=\"dialog-note\">Create a new list first if you need a new target.</p>\n          </mj-empty-state>\n        } @else {\n          <div class=\"records-scroll move-copy-targets\">\n            @for (target of filteredMoveCopyTargets; track target.ID) {\n              <div class=\"record-item\"\n                [class.selected]=\"moveCopySelectedTarget?.ID === target.ID\"\n                (click)=\"selectMoveCopyTarget(target)\">\n                <div class=\"record-checkbox\">\n                  <input type=\"radio\"\n                    name=\"moveCopyTarget\"\n                    [checked]=\"moveCopySelectedTarget?.ID === target.ID\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"selectMoveCopyTarget(target)\">\n                </div>\n                <div class=\"record-name\">\n                  <strong>{{ target.Name }}</strong>\n                  @if (target.Description) {\n                    <span class=\"target-desc\"> \u2014 {{ target.Description }}</span>\n                  }\n                </div>\n              </div>\n            }\n          </div>\n        }\n      }\n    </div>\n    <mj-dialog-actions>\n      <button mjButton\n        (click)=\"confirmMoveCopy()\"\n        [disabled]=\"!moveCopySelectedTarget || isApplyingMoveCopy\"\n        variant=\"primary\">\n        @if (moveCopyMode === 'move') {\n          <span class=\"fa-solid fa-arrow-right-arrow-left\"></span>\n          Continue\n        } @else {\n          <span class=\"fa-solid fa-copy\"></span>\n          Copy {{ selectedKeys.length }}\n        }\n      </button>\n      <button mjButton\n        (click)=\"closeMoveCopyDialog()\"\n        [disabled]=\"isApplyingMoveCopy\"\n        variant=\"outline\">\n        Cancel\n      </button>\n    </mj-dialog-actions>\n  </mj-dialog>\n}\n\n<!-- Remove from List Confirmation Dialog -->\n@if (showRemoveDialog) {\n  <mj-dialog\n    [Visible]=\"true\"\n    Title=\"Remove from List\"\n    (Close)=\"closeRemoveDialog()\"\n    [MinWidth]=\"350\"\n    [Width]=\"450\">\n    <div class=\"dialog-content\">\n      @if (isRemoving) {\n        <div class=\"dialog-loading\">\n          <mj-loading text=\"Removing records...\" size=\"small\"></mj-loading>\n          @if (removeTotal > 0) {\n            <mj-progress-bar\n              [Value]=\"removeProgressPercent\"\n              class=\"progress-bar\">\n            </mj-progress-bar>\n          }\n        </div>\n      } @else {\n        <div class=\"dialog-message\">\n          <span class=\"fa-solid fa-triangle-exclamation warning-icon\"></span>\n          <p>Are you sure you want to remove <strong>{{ selectedKeys.length }}</strong> record{{ selectedKeys.length !== 1 ? 's' : '' }} from this list?</p>\n          <p class=\"dialog-note\">This will not delete the records, only remove them from this list.</p>\n        </div>\n      }\n    </div>\n    <mj-dialog-actions>\n      <button mjButton\n        (click)=\"confirmRemoveFromList()\"\n        [disabled]=\"isRemoving\"\n        variant=\"danger\">\n        Remove\n      </button>\n      <button mjButton\n        (click)=\"closeRemoveDialog()\"\n        [disabled]=\"isRemoving\"\n        variant=\"outline\">\n        Cancel\n      </button>\n    </mj-dialog-actions>\n  </mj-dialog>\n}\n\n<!-- Add Records Dialog -->\n@if (showAddRecordsDialog) {\n  <mj-dialog\n    [Visible]=\"true\"\n    [Title]=\"'Add ' + (listRecord?.Entity || 'Records') + ' to List'\"\n    (Close)=\"closeAddRecordsDialog()\"\n    [MinWidth]=\"500\"\n    [Width]=\"700\"\n    [Height]=\"650\">\n    <div class=\"dialog-content add-records-dialog\">\n      @if (addDialogSaving) {\n        <div class=\"dialog-loading\">\n          <mj-loading text=\"Adding records to list...\" size=\"small\"></mj-loading>\n          @if (addTotal > 0) {\n            <mj-progress-bar\n              [Value]=\"addProgressPercent\"\n              class=\"progress-bar\">\n            </mj-progress-bar>\n          }\n        </div>\n      } @else {\n        <!-- Search Input -->\n        <div class=\"search-section\">\n          <div class=\"search-input-wrapper\">\n            <span class=\"fa-solid fa-search search-icon\"></span>\n            <input\n              class=\"mj-input search-input\"\n              type=\"text\"\n              [placeholder]=\"'Search ' + (listRecord?.Entity || 'records') + '...'\"\n              [value]=\"addRecordsSearchFilter\"\n              (input)=\"onAddRecordsSearchInputEvent($event)\" />\n          </div>\n          <span class=\"search-hint\">Type at least 2 characters to search</span>\n        </div>\n        <!-- Records List -->\n        <div class=\"records-list\">\n          @if (addDialogLoading) {\n            <div class=\"list-loading\">\n              <mj-loading [showText]=\"false\" size=\"small\"></mj-loading>\n            </div>\n          } @else if (addableRecords.length === 0 && addRecordsSearchFilter.length >= 2) {\n            <mj-empty-state\n              Variant=\"no-results\"\n              Size=\"compact\"\n              Icon=\"fa-solid fa-magnifying-glass\"\n              [Title]=\"AddRecordsNoMatchTitle\" />\n          } @else if (addableRecords.length === 0) {\n            <mj-empty-state\n              Size=\"compact\"\n              Icon=\"fa-solid fa-list\"\n              Title=\"Search for records to add to this list\" />\n          } @else {\n            <!-- Selection controls -->\n            <div class=\"selection-controls\">\n              <button mjButton variant=\"flat\" size=\"sm\" (click)=\"selectAllAddable()\">Select All</button>\n              <button mjButton variant=\"flat\" size=\"sm\" (click)=\"deselectAllAddable()\">Deselect All</button>\n              <span class=\"selection-info\">{{ selectedAddableRecords.length }} selected</span>\n            </div>\n            <!-- Records -->\n            <div class=\"records-scroll\">\n              @for (record of addableRecords; track record.ID) {\n                <div class=\"record-item\"\n                  [class.in-list]=\"record.isInList\"\n                  [class.selected]=\"record.isSelected\"\n                  (click)=\"toggleRecordSelection(record)\">\n                  <div class=\"record-checkbox\">\n                    @if (record.isInList) {\n                      <span class=\"fa-solid fa-check in-list-icon\" title=\"Already in list\"></span>\n                    } @else {\n                      <input type=\"checkbox\"\n                        [checked]=\"record.isSelected\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"toggleRecordSelection(record)\">\n                    }\n                  </div>\n                  <div class=\"record-name\">{{ record.Name }}</div>\n                  @if (record.isInList) {\n                    <span class=\"in-list-badge\">In List</span>\n                  }\n                </div>\n              }\n            </div>\n          }\n        </div>\n      }\n    </div>\n    <mj-dialog-actions>\n      <button mjButton\n        (click)=\"confirmAddRecords()\"\n        [disabled]=\"addDialogSaving || selectedAddableRecords.length === 0\"\n        variant=\"primary\">\n        Add {{ selectedAddableRecords.length > 0 ? selectedAddableRecords.length : '' }} Record{{ selectedAddableRecords.length !== 1 ? 's' : '' }}\n      </button>\n      <button mjButton\n        (click)=\"closeAddRecordsDialog()\"\n        [disabled]=\"addDialogSaving\"\n        variant=\"outline\">\n        Cancel\n      </button>\n    </mj-dialog-actions>\n  </mj-dialog>\n}\n\n<!-- Export Dialog (mockup 26) \u2014 format + column picker -->\n@if (showExportDialog && listRecord) {\n  <mj-dialog\n    [Visible]=\"true\"\n    [Title]=\"'Export ' + exportRecordCount + ' Record' + (exportRecordCount === 1 ? '' : 's')\"\n    (Close)=\"closeExportDialog()\"\n    [MinWidth]=\"520\"\n    [Width]=\"640\"\n    [Height]=\"640\">\n    <div class=\"dialog-content export-dialog\">\n      <label class=\"export-section-label\">Format</label>\n      <div class=\"export-format-row\">\n        <label class=\"export-format-option\"\n          [class.export-format-option--selected]=\"exportFormat === 'excel'\"\n          (click)=\"exportFormat = 'excel'\">\n          <input type=\"radio\" name=\"exportFormat\" value=\"excel\" [(ngModel)]=\"exportFormat\">\n          <i class=\"fa-solid fa-file-excel\" style=\"color: var(--mj-status-success);\"></i>\n          <span>Excel (.xlsx)</span>\n        </label>\n        <label class=\"export-format-option\"\n          [class.export-format-option--selected]=\"exportFormat === 'csv'\"\n          (click)=\"exportFormat = 'csv'\">\n          <input type=\"radio\" name=\"exportFormat\" value=\"csv\" [(ngModel)]=\"exportFormat\">\n          <i class=\"fa-solid fa-file-csv\" style=\"color: var(--mj-text-secondary);\"></i>\n          <span>CSV</span>\n        </label>\n        <label class=\"export-format-option\"\n          [class.export-format-option--selected]=\"exportFormat === 'json'\"\n          (click)=\"exportFormat = 'json'\">\n          <input type=\"radio\" name=\"exportFormat\" value=\"json\" [(ngModel)]=\"exportFormat\">\n          <i class=\"fa-solid fa-file-code\" style=\"color: var(--mj-brand-primary);\"></i>\n          <span>JSON</span>\n        </label>\n      </div>\n\n      <div class=\"export-section-divider\"></div>\n\n      <label class=\"export-section-label\">Columns to include</label>\n      <div class=\"export-fields-list\">\n        @for (f of exportFields; track f.Name) {\n          <label class=\"export-field-row\">\n            <input type=\"checkbox\" [(ngModel)]=\"f.Selected\">\n            <span>{{ f.DisplayName }}</span>\n          </label>\n        }\n      </div>\n      <div class=\"export-field-actions\">\n        <a href=\"#\" (click)=\"selectAllExportFields(); $event.preventDefault()\">Select All</a>\n        <a href=\"#\" (click)=\"selectNoneExportFields(); $event.preventDefault()\">Select None</a>\n        <span class=\"muted\">{{ selectedExportFieldCount }} of {{ exportFields.length }} selected</span>\n      </div>\n    </div>\n    <mj-dialog-actions>\n      <button mjButton variant=\"primary\"\n        [disabled]=\"selectedExportFieldCount === 0 || isExporting\"\n        (click)=\"executeExport()\">\n        @if (isExporting) {\n          <i class=\"fa-solid fa-spinner fa-spin\"></i>\n          Exporting\u2026\n        } @else {\n          <i class=\"fa-solid fa-download\"></i>\n          Export {{ exportRecordCount }} Record{{ exportRecordCount === 1 ? '' : 's' }}\n        }\n      </button>\n      <button mjButton variant=\"outline\" [disabled]=\"isExporting\" (click)=\"closeExportDialog()\">Cancel</button>\n    </mj-dialog-actions>\n  </mj-dialog>\n}\n\n<!-- Add From View Dialog -->\n@if (showAddFromViewDialog) {\n  <mj-dialog\n    [Visible]=\"true\"\n    Title=\"Add Records from Views\"\n    (Close)=\"closeAddFromViewDialog()\"\n    [MinWidth]=\"400\"\n    [Width]=\"600\"\n    [Height]=\"500\">\n    <div class=\"dialog-content\">\n      @if (showAddFromViewLoader && fetchingRecordsToSave) {\n        <div class=\"dialog-loading\">\n          <mj-loading text=\"Loading records from views...\" size=\"small\"></mj-loading>\n        </div>\n      } @else if (showAddFromViewLoader && addFromViewTotal > 0) {\n        <div class=\"dialog-loading\">\n          <mj-loading text=\"Adding records to list...\" size=\"small\"></mj-loading>\n          <mj-progress-bar\n            [Value]=\"addFromViewProgressPercent\"\n            class=\"progress-bar\">\n          </mj-progress-bar>\n        </div>\n      } @else if (showAddFromViewLoader) {\n        <div class=\"dialog-loading\">\n          <mj-loading text=\"Loading views...\" size=\"small\"></mj-loading>\n        </div>\n      } @else {\n        <p class=\"dialog-instruction\">Select views to add their records to this list:</p>\n        <div class=\"views-list\">\n          @if (!userViews || userViews.length === 0) {\n            <mj-empty-state\n              Size=\"compact\"\n              Icon=\"fa-solid fa-folder-open\"\n              Title=\"No saved views found for this entity\" />\n          } @else {\n            @for (view of userViews; track view.ID) {\n              <div class=\"view-item\"\n                [class.selected]=\"isViewSelected(view)\"\n                (click)=\"toggleViewSelection(view)\">\n                <input type=\"checkbox\"\n                  [checked]=\"isViewSelected(view)\"\n                  (click)=\"$event.stopPropagation()\"\n                  (change)=\"toggleViewSelection(view)\">\n                <span class=\"fa-solid fa-table-list view-icon\"></span>\n                <span class=\"view-name\">{{ view.Name }}</span>\n              </div>\n            }\n          }\n        </div>\n      }\n    </div>\n    <mj-dialog-actions>\n      <button mjButton\n        (click)=\"confirmAddFromView()\"\n        [disabled]=\"showAddFromViewLoader || userViewsToAdd.length === 0\"\n        variant=\"primary\">\n        Add from {{ userViewsToAdd.length }} View{{ userViewsToAdd.length !== 1 ? 's' : '' }}\n      </button>\n      <button mjButton\n        (click)=\"closeAddFromViewDialog()\"\n        [disabled]=\"showAddFromViewLoader\"\n        variant=\"outline\">\n        Cancel\n      </button>\n    </mj-dialog-actions>\n  </mj-dialog>\n}\n", styles: [".list-detail-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  padding: 20px;\n  background: var(--mj-bg-surface-card);\n}\n\n.list-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-bottom: 16px;\n  flex-shrink: 0;\n  gap: 16px;\n}\n\n.list-header__titleblock {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  min-width: 0;\n}\n\n.list-header h1 {\n  margin: 0;\n  font-size: 24px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.lineage-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 3px 10px;\n  border-radius: 999px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 25%, var(--mj-border-default));\n  color: var(--mj-text-secondary);\n  font-size: 12px;\n  width: fit-content;\n}\n\n.lineage-badge i {\n  color: var(--mj-brand-primary);\n}\n\n.lineage-badge__refreshed {\n  color: var(--mj-text-muted);\n}\n\n.refresh-mode-select {\n  min-width: 100px;\n  font-size: 13px;\n}\n\n.bulk-status-select {\n  min-width: 130px;\n  font-size: 13px;\n}\n\n/* Viewer-perspective badge (mockup 19) \u2014 surfaced in the header when the\n   user has read-only access so the missing mutation controls don't feel\n   broken. */\n.permission-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  border-radius: 999px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.permission-badge--viewer {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n/* Tags section on the list detail header (Phase 4.2). */\n.list-detail__tags {\n  margin-top: 8px;\n}\n\n/* Grid + side stats two-column layout (Phase 5.4). Stats hides on\n   narrow screens so the grid keeps its breathing room. */\n.grid-with-stats {\n  display: grid;\n  grid-template-columns: 1fr 280px;\n  gap: 16px;\n  flex: 1;\n  min-height: 0;\n}\n\n.list-detail__stats {\n  min-width: 0;\n  overflow-y: auto;\n}\n\n@media (max-width: 900px) {\n  .grid-with-stats {\n    grid-template-columns: 1fr;\n  }\n  .list-detail__stats {\n    display: none;\n  }\n}\n\n/* Custom Toolbar */\n.custom-toolbar {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 12px 16px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-bottom: none;\n  border-radius: 8px 8px 0 0;\n  flex-shrink: 0;\n}\n\n.toolbar-left {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.toolbar-right {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.row-count {\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--mj-text-primary);\n}\n\n.selection-count {\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n}\n\n.toolbar-button {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 13px;\n}\n\n.toolbar-button span {\n  font-size: 14px;\n}\n\n.remove-btn {\n  color: var(--mj-status-error);\n}\n\n.loading-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 1;\n  min-height: 200px;\n}\n\n.grid-container {\n  flex: 1;\n  min-height: 0;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 0 0 8px 8px;\n  overflow: hidden;\n}\n\n/* Add Dropdown Button */\n.add-dropdown-wrapper {\n  position: relative;\n}\n\n.add-btn {\n  font-size: 16px;\n  padding: 8px 25px;\n  border-radius: 10px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.add-dropdown-arrow {\n  font-size: 12px;\n  margin-left: 4px;\n}\n\n.add-dropdown-panel {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  margin-top: 4px;\n  min-width: 240px;\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);\n  z-index: 100;\n  overflow: hidden;\n}\n\n.add-dropdown-item {\n  display: flex;\n  flex-direction: column;\n  padding: 10px 16px;\n  cursor: pointer;\n  transition: background-color 0.15s;\n}\n\n.add-dropdown-item:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.add-dropdown-item-text {\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--mj-text-primary);\n}\n\n.add-dropdown-item-desc {\n  font-size: 12px;\n  color: var(--mj-text-secondary);\n  margin-top: 2px;\n}\n\n/* ==========================================\n   Dialog Styles\n   ========================================== */\n\n.dialog-content {\n  padding: 8px 0;\n}\n\n.dialog-loading {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 20px;\n  gap: 20px;\n}\n\n.dialog-message {\n  text-align: center;\n  padding: 20px;\n}\n\n.warning-icon {\n  font-size: 48px;\n  color: var(--mj-status-warning);\n  margin-bottom: 16px;\n  display: block;\n}\n\n.dialog-message p {\n  margin: 8px 0;\n  font-size: 15px;\n  color: var(--mj-text-primary);\n}\n\n.dialog-note {\n  color: var(--mj-text-secondary) !important;\n  font-size: 13px !important;\n}\n\n.progress-bar {\n  width: 100%;\n  max-width: 300px;\n}\n\n/* ==========================================\n   Add Records Dialog\n   ========================================== */\n\n.add-records-dialog {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n\n.search-section {\n  padding-bottom: 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n  margin-bottom: 12px;\n}\n\n.search-input-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.search-input-wrapper .search-icon {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-disabled);\n  font-size: 14px;\n  pointer-events: none;\n}\n\n.search-input-wrapper .search-input {\n  width: 100%;\n  padding-left: 32px;\n}\n\n.search-hint {\n  display: block;\n  font-size: 12px;\n  color: var(--mj-text-disabled);\n  margin-top: 6px;\n}\n\n.records-list {\n  flex: 1;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n}\n\n.list-loading {\n  display: flex;\n  justify-content: center;\n  padding: 40px;\n}\n\n.selection-controls {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 0;\n  border-bottom: 1px solid var(--mj-border-default);\n  margin-bottom: 8px;\n}\n\n.selection-info {\n  margin-left: auto;\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n}\n\n.records-scroll {\n  flex: 1;\n  overflow-y: auto;\n  max-height: 280px;\n}\n\n.record-item {\n  display: flex;\n  align-items: center;\n  padding: 10px 12px;\n  border-radius: 6px;\n  cursor: pointer;\n  transition: background-color 0.15s;\n  gap: 12px;\n}\n\n.record-item:hover:not(.in-list) {\n  background: var(--mj-bg-surface-card);\n}\n\n.record-item.selected {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.record-item.in-list {\n  background: var(--mj-bg-surface-card);\n  cursor: default;\n  opacity: 0.7;\n}\n\n.record-checkbox {\n  width: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.record-checkbox input[type=\"checkbox\"] {\n  width: 16px;\n  height: 16px;\n  cursor: pointer;\n}\n\n.in-list-icon {\n  color: var(--mj-status-success);\n  font-size: 14px;\n}\n\n.record-name {\n  flex: 1;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n.in-list-badge {\n  font-size: 11px;\n  padding: 2px 8px;\n  background: color-mix(in srgb, var(--mj-status-success) 10%, var(--mj-bg-surface));\n  color: var(--mj-status-success);\n  border-radius: 10px;\n  font-weight: 500;\n}\n\n/* ==========================================\n   Add From View Dialog\n   ========================================== */\n\n.dialog-instruction {\n  margin: 0 0 16px 0;\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n}\n\n.views-list {\n  max-height: 320px;\n  overflow-y: auto;\n}\n\n.view-item {\n  display: flex;\n  align-items: center;\n  padding: 12px;\n  border-radius: 6px;\n  cursor: pointer;\n  transition: background-color 0.15s;\n  gap: 12px;\n}\n\n.view-item:hover {\n  background: var(--mj-bg-surface-card);\n}\n\n.view-item.selected {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.view-item input[type=\"checkbox\"] {\n  width: 16px;\n  height: 16px;\n  cursor: pointer;\n}\n\n.view-icon {\n  color: var(--mj-text-secondary);\n  font-size: 16px;\n}\n\n.view-name {\n  flex: 1;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n/* Export dialog (Phase 5.1, mockup 26) */\n.export-dialog { display: flex; flex-direction: column; gap: 8px; }\n.export-section-label {\n  display: block;\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  margin-bottom: 8px;\n}\n.export-format-row { display: flex; gap: 8px; }\n.export-format-option {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 12px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  cursor: pointer;\n  font-size: 13px;\n  background: var(--mj-bg-surface);\n}\n.export-format-option--selected {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 6%, transparent);\n}\n.export-format-option input[type=\"radio\"] { margin: 0; }\n.export-section-divider {\n  height: 1px;\n  background: var(--mj-border-default);\n  margin: 16px 0;\n}\n.export-fields-list {\n  max-height: 280px;\n  overflow-y: auto;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n}\n.export-field-row {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n  font-size: 13px;\n  cursor: pointer;\n}\n.export-field-row:last-child { border-bottom: none; }\n.export-field-row:hover { background: var(--mj-bg-surface-hover); }\n.export-field-actions {\n  display: flex;\n  gap: 12px;\n  margin-top: 8px;\n  align-items: center;\n  font-size: 11.5px;\n}\n.export-field-actions a { color: var(--mj-text-link); }\n.export-field-actions .muted {\n  margin-left: auto;\n  color: var(--mj-text-muted);\n}\n"] }]
     }], () => [{ type: i1.SharedService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i2.ExportService }, { type: i3.ListSharingService }], { ListID: [{
             type: Input
-        }], listDetailGrid: [{
+        }], ListDetailGrid: [{
             type: ViewChild,
             args: ['listDetailGrid']
         }], onDocumentClick: [{