blixify-ui-web 1.2.120 → 1.2.123

package/lib/components/data/dataTemplate/index.js

@@ -125,6 +125,7 @@ var stepper_1 = require("../../display/stepper");
 var table_1 = require("../../display/table");
 var newTable_1 = require("../../display/newTable");
 var newList_1 = require("../../display/newList");
+var newGrid_1 = require("../../display/newGrid");
 var newKanban_1 = require("../../display/newKanban");
 var newCalendar_1 = require("../../display/newCalendar");
 var address_1 = require("../../input/address");
@@ -199,10 +200,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     // Every read of the view type below uses resolvedType. The distinction matters
     // most in effect dependency arrays — following props.type there would leave
     // the list never refetching while the panel is open, which fails silently.
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68, _69, _70, _71, _72, _73, _74, _75, _76, _77, _78;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68, _69, _70, _71, _72, _73, _74, _75, _76, _77, _78, _79;
     // INFO: the panel cannot navigate its way out — handleNavigate("read") is
     // routed straight back into it — so expand-to-full-page is local state.
-    var _79 = (0, react_1.useState)(false), drawerPageView = _79[0], setDrawerPageView = _79[1];
+    var _80 = (0, react_1.useState)(false), drawerPageView = _80[0], setDrawerPageView = _80[1];
     // INFO: the panel keeps rendering the record it was opened with rather than
     // live props. Without this, navigating back to the list would re-render the
     // still-mounted panel as a second list behind the overlay.
@@ -284,16 +285,18 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             initialFilterReferenceDate: initialFilterReferenceDate,
         };
     };
-    var _80 = intialiseDefaultFilterValues(), initialFilterSearch = _80.initialFilterSearch, initialFilterSearchParams = _80.initialFilterSearchParams, initialFilterSelection = _80.initialFilterSelection, initialFilterReference = _80.initialFilterReference, initialFilterReferenceDate = _80.initialFilterReferenceDate;
+    var _81 = intialiseDefaultFilterValues(), initialFilterSearch = _81.initialFilterSearch, initialFilterSearchParams = _81.initialFilterSearchParams, initialFilterSelection = _81.initialFilterSelection, initialFilterReference = _81.initialFilterReference, initialFilterReferenceDate = _81.initialFilterReferenceDate;
     // INFO: Persist view state hook — handles storage read/write for filter/sort/column state
-    var _81 = (0, viewStatePersistence_1.usePersistedViewState)({
+    var _82 = (0, viewStatePersistence_1.usePersistedViewState)({
         mode: (_b = props.organise) === null || _b === void 0 ? void 0 : _b.persistViewState,
         collectionId: props.collectionId,
         persistKey: (_c = props.organise) === null || _c === void 0 ? void 0 : _c.persistKey,
         type: resolvedType,
-    }), persistedState = _81.persistedState, isPersistEnabled = _81.isEnabled, handleSaveView = _81.handleSaveView;
-    var _82 = (0, react_1.useState)(false), loading = _82[0], setLoading = _82[1];
-    var _83 = (0, react_1.useState)(), notification = _83[0], setNotification = _83[1];
+    }), rawPersistedState = _82.persistedState, isPersistEnabled = _82.isEnabled, handleSaveView = _82.handleSaveView, handleRegisterViewSnapshot = _82.handleRegisterViewSnapshot;
+    // INFO: drop stored filters/sort on removed columns — they would empty the table
+    var persistedState = (0, react_1.useMemo)(function () { return (0, viewStatePersistence_1.handlePruneStaleColumns)(rawPersistedState, props.model); }, [rawPersistedState, props.model]);
+    var _83 = (0, react_1.useState)(false), loading = _83[0], setLoading = _83[1];
+    var _84 = (0, react_1.useState)(), notification = _84[0], setNotification = _84[1];
     // INFO: a success toast is confirmation, not a decision — it clears itself so
     // it never sits on the floating step bar; errors stay until dismissed
     (0, react_1.useEffect)(function () {
@@ -303,59 +306,59 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         return function () { return clearTimeout(timer); };
     }, [notification]);
     //INFO : Used by List
-    var _84 = (0, react_1.useState)((_d = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _d !== void 0 ? _d : initialFilterSearch), filterSearch = _84[0], setFilterSearch = _84[1];
-    var _85 = (0, react_1.useState)((_e = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _e !== void 0 ? _e : initialFilterSearchParams), filterSearchParams = _85[0], setFilterSearchParams = _85[1];
-    var _86 = (0, react_1.useState)((_f = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSelection) !== null && _f !== void 0 ? _f : initialFilterSelection), filterSelection = _86[0], setFilterSelection = _86[1];
-    var _87 = (0, react_1.useState)((_g = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReference) !== null && _g !== void 0 ? _g : initialFilterReference), filterReference = _87[0], setFilterReference = _87[1];
-    var _88 = (0, react_1.useState)({}), filterReferenceSearch = _88[0], setFilterReferenceSearch = _88[1];
-    var _89 = (0, react_1.useState)({}), filterReferenceList = _89[0], setFilterReferenceList = _89[1];
-    var _90 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReferenceDate)
+    var _85 = (0, react_1.useState)((_d = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _d !== void 0 ? _d : initialFilterSearch), filterSearch = _85[0], setFilterSearch = _85[1];
+    var _86 = (0, react_1.useState)((_e = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _e !== void 0 ? _e : initialFilterSearchParams), filterSearchParams = _86[0], setFilterSearchParams = _86[1];
+    var _87 = (0, react_1.useState)((_f = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSelection) !== null && _f !== void 0 ? _f : initialFilterSelection), filterSelection = _87[0], setFilterSelection = _87[1];
+    var _88 = (0, react_1.useState)((_g = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReference) !== null && _g !== void 0 ? _g : initialFilterReference), filterReference = _88[0], setFilterReference = _88[1];
+    var _89 = (0, react_1.useState)({}), filterReferenceSearch = _89[0], setFilterReferenceSearch = _89[1];
+    var _90 = (0, react_1.useState)({}), filterReferenceList = _90[0], setFilterReferenceList = _90[1];
+    var _91 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReferenceDate)
         ? (0, viewStatePersistence_1.parseDateFilterState)(persistedState.filterReferenceDate)
-        : initialFilterReferenceDate), filterReferenceDate = _90[0], setFilterReferenceDate = _90[1];
-    var _91 = (0, react_1.useState)(true), tableLoading = _91[0], setTableLoading = _91[1];
-    var _92 = (0, react_1.useState)(""), cursor = _92[0], setCursor = _92[1];
-    var _93 = (0, react_1.useState)(""), lastCursor = _93[0], setLastCursor = _93[1];
-    var _94 = (0, react_1.useState)([]), tableData = _94[0], setTableData = _94[1];
-    var _95 = (0, react_1.useState)([]), spaceTableData = _95[0], setSpaceTableData = _95[1];
+        : initialFilterReferenceDate), filterReferenceDate = _91[0], setFilterReferenceDate = _91[1];
+    var _92 = (0, react_1.useState)(true), tableLoading = _92[0], setTableLoading = _92[1];
+    var _93 = (0, react_1.useState)(""), cursor = _93[0], setCursor = _93[1];
+    var _94 = (0, react_1.useState)(""), lastCursor = _94[0], setLastCursor = _94[1];
+    var _95 = (0, react_1.useState)([]), tableData = _95[0], setTableData = _95[1];
+    var _96 = (0, react_1.useState)([]), spaceTableData = _96[0], setSpaceTableData = _96[1];
     // INFO: a save resolves after later renders, so it reads the table from here —
     // the state it closed over can predate an earlier save on the same row
     var tableDataRef = (0, react_1.useRef)([]);
     var spaceTableDataRef = (0, react_1.useRef)([]);
     tableDataRef.current = tableData;
     spaceTableDataRef.current = spaceTableData;
-    var _96 = (0, react_1.useState)(0), size = _96[0], setSize = _96[1];
-    var _97 = (0, react_1.useState)((_k = (_h = persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageIndex) !== null && _h !== void 0 ? _h : (_j = props.organise) === null || _j === void 0 ? void 0 : _j.pageIndex) !== null && _k !== void 0 ? _k : 0), pageIndex = _97[0], setPageIndex = _97[1];
-    var _98 = (0, react_1.useState)([]), selectedIds = _98[0], setSelectedIds = _98[1];
-    var _99 = (0, react_1.useState)(false), selectAll = _99[0], setSelectAll = _99[1];
-    var _100 = (0, react_1.useState)(""), deletePasscode = _100[0], setDeletePasscode = _100[1];
-    var _101 = (0, react_1.useState)(""), deletePasscodeInput = _101[0], setDeletePasscodeInput = _101[1];
-    var _102 = (0, react_1.useState)(""), deleteFeedId = _102[0], setDeleteFeedId = _102[1];
+    var _97 = (0, react_1.useState)(0), size = _97[0], setSize = _97[1];
+    var _98 = (0, react_1.useState)((_k = (_h = persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageIndex) !== null && _h !== void 0 ? _h : (_j = props.organise) === null || _j === void 0 ? void 0 : _j.pageIndex) !== null && _k !== void 0 ? _k : 0), pageIndex = _98[0], setPageIndex = _98[1];
+    var _99 = (0, react_1.useState)([]), selectedIds = _99[0], setSelectedIds = _99[1];
+    var _100 = (0, react_1.useState)(false), selectAll = _100[0], setSelectAll = _100[1];
+    var _101 = (0, react_1.useState)(""), deletePasscode = _101[0], setDeletePasscode = _101[1];
+    var _102 = (0, react_1.useState)(""), deletePasscodeInput = _102[0], setDeletePasscodeInput = _102[1];
+    var _103 = (0, react_1.useState)(""), deleteFeedId = _103[0], setDeleteFeedId = _103[1];
     //INFO : Used by List Organise
     // INFO: Internal sort state that overrides props.organise?.sort when
     // persistViewState is enabled and a persisted sort exists
-    var _103 = (0, react_1.useState)((_l = persistedState === null || persistedState === void 0 ? void 0 : persistedState.sort) !== null && _l !== void 0 ? _l : undefined), persistedSort = _103[0], setPersistedSort = _103[1];
-    var _104 = (0, react_1.useState)(false), filterDraft = _104[0], setFilterDraft = _104[1];
-    var _105 = (0, react_1.useState)(false), addTabModal = _105[0], setAddTabModal = _105[1];
+    var _104 = (0, react_1.useState)((_l = persistedState === null || persistedState === void 0 ? void 0 : persistedState.sort) !== null && _l !== void 0 ? _l : undefined), persistedSort = _104[0], setPersistedSort = _104[1];
+    var _105 = (0, react_1.useState)(false), filterDraft = _105[0], setFilterDraft = _105[1];
+    var _106 = (0, react_1.useState)(false), addTabModal = _106[0], setAddTabModal = _106[1];
     //INFO : resolve the initial tab synchronously so the mount cond is already
     // tab-scoped — an empty initial tab caused a second wasted list fetch
-    var _106 = (0, react_1.useState)(function () {
+    var _107 = (0, react_1.useState)(function () {
         var _a, _b;
         return (0, listModule_1.renderSelectedRefreshTab)(props.localURLEndpoint, resolvedType, props.collectionId, props.id, (_a = props.organise) === null || _a === void 0 ? void 0 : _a.extendedTabs, (_b = props.organise) === null || _b === void 0 ? void 0 : _b.viewId);
-    }), selectedTab = _106[0], setSelectedTab = _106[1];
-    var _107 = (0, react_1.useState)("dayGridMonth"), calendarView = _107[0], setCalendarView = _107[1];
+    }), selectedTab = _107[0], setSelectedTab = _107[1];
+    var _108 = (0, react_1.useState)("dayGridMonth"), calendarView = _108[0], setCalendarView = _108[1];
     // INFO: bareNewDTW calendar viewSwitch mode — drives the NewCalendar variant
     // (calendarView above drives the matching range query)
-    var _108 = (0, react_1.useState)("month"), newCalendarViewMode = _108[0], setNewCalendarViewMode = _108[1];
-    var _109 = (0, react_1.useState)(new Date()), calendarTabMonth = _109[0], setCalendarTabMonth = _109[1];
-    var _110 = (0, react_1.useState)(true), kanbanDroppable = _110[0], setKanbanDroppable = _110[1];
-    var _111 = (0, react_1.useState)([]), kanbanOptions = _111[0], setKanbanOptions = _111[1];
-    var _112 = (0, react_1.useState)(false), queryForm = _112[0], setQueryForm = _112[1];
-    var _113 = (0, react_1.useState)(false), batchUpdateModal = _113[0], setBatchUpdateModal = _113[1];
-    var _114 = (0, react_1.useState)({
+    var _109 = (0, react_1.useState)("month"), newCalendarViewMode = _109[0], setNewCalendarViewMode = _109[1];
+    var _110 = (0, react_1.useState)(new Date()), calendarTabMonth = _110[0], setCalendarTabMonth = _110[1];
+    var _111 = (0, react_1.useState)(true), kanbanDroppable = _111[0], setKanbanDroppable = _111[1];
+    var _112 = (0, react_1.useState)([]), kanbanOptions = _112[0], setKanbanOptions = _112[1];
+    var _113 = (0, react_1.useState)(false), queryForm = _113[0], setQueryForm = _113[1];
+    var _114 = (0, react_1.useState)(false), batchUpdateModal = _114[0], setBatchUpdateModal = _114[1];
+    var _115 = (0, react_1.useState)({
         columnId: "",
         columnData: {},
-    }), batchUpdateData = _114[0], setBatchUpdateData = _114[1];
-    var _115 = (0, react_1.useState)(function () {
+    }), batchUpdateData = _115[0], setBatchUpdateData = _115[1];
+    var _116 = (0, react_1.useState)(function () {
         var baseModel = (props === null || props === void 0 ? void 0 : props.model) || [];
         if (!persistedState)
             return baseModel;
@@ -381,8 +384,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             });
         }
         return model;
-    }), structure = _115[0], setStructure = _115[1];
-    var _116 = (0, react_1.useState)(((_m = props === null || props === void 0 ? void 0 : props.organise) === null || _m === void 0 ? void 0 : _m.additionalQuery) || []), additionalQuery = _116[0], setAdditionalQuery = _116[1];
+    }), structure = _116[0], setStructure = _116[1];
+    var _117 = (0, react_1.useState)(((_m = props === null || props === void 0 ? void 0 : props.organise) === null || _m === void 0 ? void 0 : _m.additionalQuery) || []), additionalQuery = _117[0], setAdditionalQuery = _117[1];
     // INFO: State for user-configurable flex filters (Monday.com-style)
     // INFO: Initialize with one empty row so users see inputs immediately without clicking "Add Filter"
     var defaultFlexFilterRow = [
@@ -393,9 +396,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             value: undefined,
         },
     ];
-    var _117 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
+    var _118 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
         ? persistedState.flexFilters
-        : defaultFlexFilterRow), flexFilters = _117[0], setFlexFilters = _117[1];
+        : defaultFlexFilterRow), flexFilters = _118[0], setFlexFilters = _118[1];
     // INFO: always-current mirror of flexFilters, read by the imperative apply/
     // clear methods so chained calls in one tick aren't stale.
     var flexFiltersRef = (0, react_1.useRef)(flexFilters);
@@ -408,108 +411,119 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     }, [flexFilters]);
     // INFO: Debounced version of flexFilters used by renderImpSearchFilterConditions
     // to prevent API calls on every keystroke when typing in value inputs
-    var _118 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
+    var _119 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
         ? persistedState.flexFilters
-        : defaultFlexFilterRow), flexFiltersDebounced = _118[0], setFlexFiltersDebounced = _118[1];
-    var _119 = (0, react_1.useState)({}), flexFilterReferenceOptions = _119[0], setFlexFilterReferenceOptions = _119[1];
-    var _120 = (0, react_1.useState)({}), flexFilterReferenceSearch = _120[0], setFlexFilterReferenceSearch = _120[1];
-    var _121 = (0, react_1.useState)(false), flexFilterModalOpen = _121[0], setFlexFilterModalOpen = _121[1];
-    var _122 = (0, react_1.useState)(false), viewSettingsModalOpen = _122[0], setViewSettingsModalOpen = _122[1];
+        : defaultFlexFilterRow), flexFiltersDebounced = _119[0], setFlexFiltersDebounced = _119[1];
+    var _120 = (0, react_1.useState)({}), flexFilterReferenceOptions = _120[0], setFlexFilterReferenceOptions = _120[1];
+    var _121 = (0, react_1.useState)({}), flexFilterReferenceSearch = _121[0], setFlexFilterReferenceSearch = _121[1];
+    var _122 = (0, react_1.useState)(false), flexFilterModalOpen = _122[0], setFlexFilterModalOpen = _122[1];
+    var _123 = (0, react_1.useState)(false), viewSettingsModalOpen = _123[0], setViewSettingsModalOpen = _123[1];
     // INFO: Columns the end user chose to hide (bareSettings.bareViewSettings).
     // Deliberately kept out of `structure`: the props-sync effect below resets
     // structure to props.model whenever props change, which would wipe the
     // choice, and the persist effect derives schema-level hiddenColumnIds from
     // structure — writing user hides there would blur the two concepts.
-    var _123 = (0, react_1.useState)((_o = persistedState === null || persistedState === void 0 ? void 0 : persistedState.userHiddenColumnIds) !== null && _o !== void 0 ? _o : []), userHiddenColumnIds = _123[0], setUserHiddenColumnIds = _123[1];
-    var _124 = (0, react_1.useState)(""), columnSearch = _124[0], setColumnSearch = _124[1];
-    var _125 = (0, react_1.useState)(null), draggingColumnId = _125[0], setDraggingColumnId = _125[1];
+    var _124 = (0, react_1.useState)((_o = persistedState === null || persistedState === void 0 ? void 0 : persistedState.userHiddenColumnIds) !== null && _o !== void 0 ? _o : []), userHiddenColumnIds = _124[0], setUserHiddenColumnIds = _124[1];
+    var _125 = (0, react_1.useState)(""), columnSearch = _125[0], setColumnSearch = _125[1];
+    var _126 = (0, react_1.useState)(null), draggingColumnId = _126[0], setDraggingColumnId = _126[1];
     var columnRowRefs = (0, react_1.useRef)({});
     //INFO : Used by Auth
-    var _126 = (0, react_1.useState)({
+    var _127 = (0, react_1.useState)({
         email: "",
         google: "",
         phone: "",
         disabled: false,
         create: false,
-    }), authMethods = _126[0], setAuthMethods = _126[1];
-    var _127 = (0, react_1.useState)(""), selectedAuthMethod = _127[0], setSelectedAuthMethod = _127[1];
+    }), authMethods = _127[0], setAuthMethods = _127[1];
+    var _128 = (0, react_1.useState)(""), selectedAuthMethod = _128[0], setSelectedAuthMethod = _128[1];
     // INFO: Used by Activity Log
-    var _128 = (0, react_1.useState)(false), activityModal = _128[0], setActivityModal = _128[1];
-    var _129 = (0, react_1.useState)(""), activityId = _129[0], setActivityId = _129[1];
+    var _129 = (0, react_1.useState)(false), activityModal = _129[0], setActivityModal = _129[1];
+    var _130 = (0, react_1.useState)(""), activityId = _130[0], setActivityId = _130[1];
     //INFO : Used by Export
-    var _130 = (0, react_1.useState)(null), csvFile = _130[0], setCSVFile = _130[1];
-    var _131 = (0, react_1.useState)([]), csvFileData = _131[0], setCSVFileData = _131[1];
-    var _132 = (0, react_1.useState)(0), stepCSVIndex = _132[0], setStepCSVIndex = _132[1];
-    var _133 = (0, react_1.useState)({}), listCSVMapAttribute = _133[0], setListCSVMapAttribute = _133[1];
-    var _134 = (0, react_1.useState)({}), listCSVObjAttribute = _134[0], setListCSVObjAttribute = _134[1];
-    var _135 = (0, react_1.useState)([]), csvAPIAttribute = _135[0], setCSVAPIAttribute = _135[1];
-    var _136 = (0, react_1.useState)(((_p = props.devSettings.currentUser) === null || _p === void 0 ? void 0 : _p.userEmail) || ""), exportCSVEmail = _136[0], setExportCSVEmail = _136[1];
-    var _137 = (0, react_1.useState)(((_r = (_q = props.organise) === null || _q === void 0 ? void 0 : _q.exportSettings) === null || _r === void 0 ? void 0 : _r.defaultExportPDFName) || ""), exportPDFTitle = _137[0], setExportPDFTitle = _137[1];
-    var _138 = (0, react_1.useState)(false), exportPDFLoading = _138[0], setExportPDFLoading = _138[1];
-    var _139 = (0, react_1.useState)(false), exportReadPDFLoading = _139[0], setExportReadPDFLoading = _139[1];
-    var _140 = (0, react_1.useState)((_u = (_t = (_s = props.organise) === null || _s === void 0 ? void 0 : _s.exportSettings) === null || _t === void 0 ? void 0 : _t.sumColumnId) !== null && _u !== void 0 ? _u : []), exportSumAttributeIds = _140[0], setExportSumAttributeIds = _140[1];
-    var _141 = (0, react_1.useState)((_x = (_w = (_v = props.organise) === null || _v === void 0 ? void 0 : _v.exportSettings) === null || _w === void 0 ? void 0 : _w.hideSubItems) !== null && _x !== void 0 ? _x : false), hideSubItems = _141[0], setHideSubItems = _141[1];
-    var _142 = (0, react_1.useState)([]), importTableData = _142[0], setImportTableData = _142[1];
-    var _143 = (0, react_1.useState)([]), queryList = _143[0], setQueryList = _143[1];
-    var _144 = (0, react_1.useState)(undefined), allQueryList = _144[0], setAllQueryList = _144[1];
-    var _145 = (0, react_1.useState)(-1), queryIndex = _145[0], setQueryIndex = _145[1];
-    var _146 = (0, react_1.useState)((_y = props.organise) === null || _y === void 0 ? void 0 : _y.groupBy), groupId = _146[0], setGroupId = _146[1];
-    var _147 = (0, react_1.useState)(""), readTabSection = _147[0], setReadTabSection = _147[1];
-    var _148 = (0, react_1.useState)(false), readFloatingNav = _148[0], setReadFloatingNav = _148[1];
+    var _131 = (0, react_1.useState)(null), csvFile = _131[0], setCSVFile = _131[1];
+    var _132 = (0, react_1.useState)([]), csvFileData = _132[0], setCSVFileData = _132[1];
+    var _133 = (0, react_1.useState)(0), stepCSVIndex = _133[0], setStepCSVIndex = _133[1];
+    var _134 = (0, react_1.useState)({}), listCSVMapAttribute = _134[0], setListCSVMapAttribute = _134[1];
+    var _135 = (0, react_1.useState)({}), listCSVObjAttribute = _135[0], setListCSVObjAttribute = _135[1];
+    var _136 = (0, react_1.useState)([]), csvAPIAttribute = _136[0], setCSVAPIAttribute = _136[1];
+    var _137 = (0, react_1.useState)(((_p = props.devSettings.currentUser) === null || _p === void 0 ? void 0 : _p.userEmail) || ""), exportCSVEmail = _137[0], setExportCSVEmail = _137[1];
+    var _138 = (0, react_1.useState)(((_r = (_q = props.organise) === null || _q === void 0 ? void 0 : _q.exportSettings) === null || _r === void 0 ? void 0 : _r.defaultExportPDFName) || ""), exportPDFTitle = _138[0], setExportPDFTitle = _138[1];
+    var _139 = (0, react_1.useState)(false), exportPDFLoading = _139[0], setExportPDFLoading = _139[1];
+    var _140 = (0, react_1.useState)(false), exportReadPDFLoading = _140[0], setExportReadPDFLoading = _140[1];
+    var _141 = (0, react_1.useState)((_u = (_t = (_s = props.organise) === null || _s === void 0 ? void 0 : _s.exportSettings) === null || _t === void 0 ? void 0 : _t.sumColumnId) !== null && _u !== void 0 ? _u : []), exportSumAttributeIds = _141[0], setExportSumAttributeIds = _141[1];
+    var _142 = (0, react_1.useState)((_x = (_w = (_v = props.organise) === null || _v === void 0 ? void 0 : _v.exportSettings) === null || _w === void 0 ? void 0 : _w.hideSubItems) !== null && _x !== void 0 ? _x : false), hideSubItems = _142[0], setHideSubItems = _142[1];
+    var _143 = (0, react_1.useState)([]), importTableData = _143[0], setImportTableData = _143[1];
+    var _144 = (0, react_1.useState)([]), queryList = _144[0], setQueryList = _144[1];
+    var _145 = (0, react_1.useState)(undefined), allQueryList = _145[0], setAllQueryList = _145[1];
+    var _146 = (0, react_1.useState)(-1), queryIndex = _146[0], setQueryIndex = _146[1];
+    var _147 = (0, react_1.useState)((_y = props.organise) === null || _y === void 0 ? void 0 : _y.groupBy), groupId = _147[0], setGroupId = _147[1];
+    var _148 = (0, react_1.useState)(""), readTabSection = _148[0], setReadTabSection = _148[1];
+    var _149 = (0, react_1.useState)(false), readFloatingNav = _149[0], setReadFloatingNav = _149[1];
     var readTabSectionRefs = (0, react_1.useRef)({});
     //INFO : Used by Read
     //INFO : Used by Update
-    var _149 = (0, react_1.useState)(false), modalVisible = _149[0], setModalVisible = _149[1];
-    var _150 = (0, react_1.useState)(false), deleteModal = _150[0], setDeleteModal = _150[1];
-    var _151 = (0, react_1.useState)(false), excelModal = _151[0], setExcelModal = _151[1];
-    var _152 = (0, react_1.useState)(false), exportExcel = _152[0], setExportExcel = _152[1];
-    var _153 = (0, react_1.useState)(""), exportType = _153[0], setExportType = _153[1];
-    var _154 = (0, react_1.useState)(false), exportQR = _154[0], setExportQR = _154[1];
-    var _155 = (0, react_1.useState)(function () {
+    var _150 = (0, react_1.useState)(false), modalVisible = _150[0], setModalVisible = _150[1];
+    var _151 = (0, react_1.useState)(false), deleteModal = _151[0], setDeleteModal = _151[1];
+    var _152 = (0, react_1.useState)(false), excelModal = _152[0], setExcelModal = _152[1];
+    var _153 = (0, react_1.useState)(false), exportExcel = _153[0], setExportExcel = _153[1];
+    var _154 = (0, react_1.useState)(""), exportType = _154[0], setExportType = _154[1];
+    var _155 = (0, react_1.useState)(false), exportQR = _155[0], setExportQR = _155[1];
+    var _156 = (0, react_1.useState)(function () {
         var _a, _b;
         var firstTabId = (_b = (_a = structure.find(function (item) { return item.tabId; })) === null || _a === void 0 ? void 0 : _a.tabId) !== null && _b !== void 0 ? _b : "";
         return firstTabId;
-    }), activeTab = _155[0], setActiveTab = _155[1];
-    var _156 = (0, react_1.useState)(false), signatureSigning = _156[0], setSignatureSigning = _156[1];
-    var _157 = (0, react_1.useState)({}), selectedData = _157[0], setSelectedData = _157[1];
-    var _158 = (0, react_1.useState)(""), selectedObjectStructureId = _158[0], setSelectedObjectStructureId = _158[1];
-    var _159 = (0, react_1.useState)(""), selectedObjectId = _159[0], setSelectedObjectId = _159[1];
-    var _160 = (0, react_1.useState)(""), selectedListAddressId = _160[0], setSelectedListAddressId = _160[1];
-    var _161 = (0, react_1.useState)(-1), selectedListAddressIndex = _161[0], setSelectedListAddressIndex = _161[1];
-    var _162 = (0, react_1.useState)({
+    }), activeTab = _156[0], setActiveTab = _156[1];
+    var _157 = (0, react_1.useState)(false), signatureSigning = _157[0], setSignatureSigning = _157[1];
+    var _158 = (0, react_1.useState)({}), selectedData = _158[0], setSelectedData = _158[1];
+    var _159 = (0, react_1.useState)(""), selectedObjectStructureId = _159[0], setSelectedObjectStructureId = _159[1];
+    var _160 = (0, react_1.useState)(""), selectedObjectId = _160[0], setSelectedObjectId = _160[1];
+    var _161 = (0, react_1.useState)(""), selectedListAddressId = _161[0], setSelectedListAddressId = _161[1];
+    var _162 = (0, react_1.useState)(-1), selectedListAddressIndex = _162[0], setSelectedListAddressIndex = _162[1];
+    var _163 = (0, react_1.useState)({
         lat: 0,
         lng: 0,
         name: "",
-    }), selectedListAddress = _162[0], setSelectedListAddress = _162[1];
-    var _163 = (0, react_1.useState)({}), selectedObjectData = _163[0], setSelectedObjectData = _163[1];
-    var _164 = (0, react_1.useState)(null), objectCellEdit = _164[0], setObjectCellEdit = _164[1];
-    var _165 = (0, react_1.useState)(false), referenceLoading = _165[0], setReferenceLoading = _165[1];
-    var _166 = (0, react_1.useState)({}), referencesOptions = _166[0], setReferencesOptions = _166[1];
-    var _167 = (0, react_1.useState)({}), referencesDetails = _167[0], setReferencesDetails = _167[1];
-    var _168 = (0, react_1.useState)({}), listReferencesOptions = _168[0], setListReferencesOptions = _168[1];
-    var _169 = (0, react_1.useState)({}), referenceDeleteTableData = _169[0], setReferenceDeleteTableData = _169[1];
-    var _170 = (0, react_1.useState)(0), referenceDeleteIndex = _170[0], setReferenceDeleteIndex = _170[1];
-    var _171 = (0, react_1.useState)({
+    }), selectedListAddress = _163[0], setSelectedListAddress = _163[1];
+    var _164 = (0, react_1.useState)({}), selectedObjectData = _164[0], setSelectedObjectData = _164[1];
+    var _165 = (0, react_1.useState)(null), objectCellEdit = _165[0], setObjectCellEdit = _165[1];
+    var _166 = (0, react_1.useState)(false), referenceLoading = _166[0], setReferenceLoading = _166[1];
+    var _167 = (0, react_1.useState)({}), referencesOptions = _167[0], setReferencesOptions = _167[1];
+    var _168 = (0, react_1.useState)({}), referencesDetails = _168[0], setReferencesDetails = _168[1];
+    var _169 = (0, react_1.useState)({}), listReferencesOptions = _169[0], setListReferencesOptions = _169[1];
+    var _170 = (0, react_1.useState)({}), referenceDeleteTableData = _170[0], setReferenceDeleteTableData = _170[1];
+    var _171 = (0, react_1.useState)(0), referenceDeleteIndex = _171[0], setReferenceDeleteIndex = _171[1];
+    var _172 = (0, react_1.useState)({
         id: "",
         name: "",
         type: "string",
-    }), referenceCreationModal = _171[0], setReferenceCreationModal = _171[1];
-    var _172 = (0, react_1.useState)({}), referenceModelSchema = _172[0], setReferenceSchema = _172[1];
-    var _173 = (0, react_1.useState)([]), kanbanChecked = _173[0], setKanbanChecked = _173[1];
+    }), referenceCreationModal = _172[0], setReferenceCreationModal = _172[1];
+    var _173 = (0, react_1.useState)({}), referenceModelSchema = _173[0], setReferenceSchema = _173[1];
+    var _174 = (0, react_1.useState)([]), kanbanChecked = _174[0], setKanbanChecked = _174[1];
     //INFO : Offline
-    var _174 = (0, react_1.useState)(0), offlineDataLength = _174[0], setOfflineDataLength = _174[1];
-    var _175 = (0, react_1.useState)(false), offlineModal = _175[0], setOfflineModal = _175[1];
+    var _175 = (0, react_1.useState)(0), offlineDataLength = _175[0], setOfflineDataLength = _175[1];
+    var _176 = (0, react_1.useState)(false), offlineModal = _176[0], setOfflineModal = _176[1];
     // INFO: live-stream state — driven by socket connection and navigator.onLine
-    var _176 = (0, react_1.useState)(false), isLive = _176[0], setIsLive = _176[1];
-    var _177 = (0, react_1.useState)(false), isLiveOffline = _177[0], setIsLiveOffline = _177[1];
+    var _177 = (0, react_1.useState)(false), isLive = _177[0], setIsLive = _177[1];
+    var _178 = (0, react_1.useState)(false), isLiveOffline = _178[0], setIsLiveOffline = _178[1];
     // INFO: true when navigator is offline — used to switch ReadQueryHoc between
     // server reads (online, full pagination) and IndexedDB reads (offline, cached data).
     // Independent of SSE status so it works even when bareSocketName is not set.
-    var _178 = (0, react_1.useState)(typeof navigator !== "undefined" ? !navigator.onLine : false), isNetworkOffline = _178[0], setIsNetworkOffline = _178[1];
+    var _179 = (0, react_1.useState)(typeof navigator !== "undefined" ? !navigator.onLine : false), isNetworkOffline = _179[0], setIsNetworkOffline = _179[1];
     var previousType = (0, react_1.useRef)(null);
     var previousSelectedData = (0, react_1.useRef)(null);
     var scrollSentinelRef = (0, react_1.useRef)(null);
     var scrollSentinelDebounce = (0, react_1.useRef)(false);
+    // INFO: a ref, filled in the row click before navigating unmounts the list
+    var scrollCaptureRef = (0, react_1.useRef)({
+        scrollAnchorId: persistedState === null || persistedState === void 0 ? void 0 : persistedState.scrollAnchorId,
+        scrollOffset: persistedState === null || persistedState === void 0 ? void 0 : persistedState.scrollOffset,
+    });
+    // INFO: one restore per mount — polling and SSE refetches must not scroll the user back
+    var scrollRestoredRef = (0, react_1.useRef)(false);
+    // INFO: tells a mount apart from a tab switch on a mounted instance
+    var scrollIdentityRef = (0, react_1.useRef)(null);
+    var scrollScopeStartRef = (0, react_1.useRef)(null);
+    var scrollScopeEndRef = (0, react_1.useRef)(null);
     // INFO: captures the doc exactly as loaded from the server — used by
     // bareUpsertPartialUpdate to diff only the fields the user actually changed.
     // Intentionally separate from previousSelectedData, which advances on every
@@ -620,7 +634,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     var isSchemaHideMode = ((_8 = props.organise) === null || _8 === void 0 ? void 0 : _8.onChangeHide) ? true : false;
     // INFO: rows per page is a view setting the user can change, so it starts from
     // the persisted value and falls back to the consumer's limit
-    var _179 = (0, react_1.useState)((_10 = (_9 = (isPersistEnabled ? persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageLimit : undefined)) !== null && _9 !== void 0 ? _9 : props.limit) !== null && _10 !== void 0 ? _10 : 10), pageLimit = _179[0], setPageLimit = _179[1];
+    var _180 = (0, react_1.useState)((_10 = (_9 = (isPersistEnabled ? persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageLimit : undefined)) !== null && _9 !== void 0 ? _9 : props.limit) !== null && _10 !== void 0 ? _10 : 10), pageLimit = _180[0], setPageLimit = _180[1];
     var limit = pageLimit;
     var activeSortId = (isPersistEnabled && persistedSort) || ((_11 = props.organise) === null || _11 === void 0 ? void 0 : _11.sort);
     var handleSortColumn = function (value) {
@@ -629,7 +643,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             setPersistedSort(value);
         (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.onChangeSort) === null || _b === void 0 ? void 0 : _b.call(_a, value);
     };
-    var _180 = (0, permissions_1.handleResolveDataTemplateWritePermissions)(props.edit), canUpdateRecord = _180.canUpdateRecord, canInlineUpdate = _180.canInlineUpdate, canBatchUpdate = _180.canBatchUpdate, canDeleteRecord = _180.canDeleteRecord;
+    var _181 = (0, permissions_1.handleResolveDataTemplateWritePermissions)(props.edit), canUpdateRecord = _181.canUpdateRecord, canInlineUpdate = _181.canInlineUpdate, canBatchUpdate = _181.canBatchUpdate, canDeleteRecord = _181.canDeleteRecord;
     var isEditor = ((_12 = props.edit) === null || _12 === void 0 ? void 0 : _12.allEditable) ? true : false;
     var isOffline = (_13 = props.bareSettings) === null || _13 === void 0 ? void 0 : _13.bareOffline;
     // INFO: when bareOfflineNetworkAware is true, the save path is also gated on
@@ -1024,6 +1038,61 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         isLive: isLive,
         isLiveOffline: isLiveOffline,
     }); });
+    // INFO: only a gridScroll grid scrolls horizontally
+    var handleResolveScrollScope = function () { return ({
+        start: scrollScopeStartRef.current,
+        end: scrollScopeEndRef.current,
+    }); };
+    var handleResolveScrollAxis = function () {
+        var isGridTab = (selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.viewType) === "grid";
+        return isGridTab && renderCheckScrollMode() ? "horizontal" : "vertical";
+    };
+    // INFO: one payload builder for the save effect, the drill-in capture and the flush
+    var handleBuildViewSnapshot = function () {
+        var _a;
+        return (__assign({ filterSearchParams: filterSearchParams, filterSelection: filterSelection, filterReference: filterReference, filterReferenceDate: (0, viewStatePersistence_1.serializeDateFilterState)(filterReferenceDate), flexFilters: flexFiltersDebounced.some(function (eachFilter) {
+                return (0, flexFilter_1.isFlexFilterActive)(eachFilter, structure);
+            })
+                ? flexFiltersDebounced.filter(function (eachFilter) {
+                    return (0, flexFilter_1.isFlexFilterActive)(eachFilter, structure);
+                })
+                : undefined, sort: persistedSort !== null && persistedSort !== void 0 ? persistedSort : (_a = props.organise) === null || _a === void 0 ? void 0 : _a.sort, 
+            // INFO: scroll mode reloads from page 0; the anchor restores the position
+            pageIndex: renderCheckScrollMode() ? 0 : pageIndex, hiddenColumnIds: structure.filter(function (col) { return col.hide; }).map(function (col) { return col.id; }), 
+            // INFO: raw, so switching bareViewSettings off does not wipe the user's choice
+            userHiddenColumnIds: userHiddenColumnIds, columnOrder: structure.map(function (col) { return col.id; }) }, scrollCaptureRef.current));
+    };
+    handleRegisterViewSnapshot(handleBuildViewSnapshot);
+    // INFO: called in the row click, while the list is still mounted and scrolled
+    var handleCaptureListScroll = function (recordId) {
+        var _a, _b;
+        if (!isPersistEnabled)
+            return;
+        scrollCaptureRef.current = (0, viewStatePersistence_1.handleCaptureScrollPosition)(recordId, handleResolveScrollAxis(), handleResolveScrollScope());
+        handleSaveView(handleBuildViewSnapshot());
+        (0, viewStatePersistence_1.handleMarkLastDrill)((_a = props.organise) === null || _a === void 0 ? void 0 : _a.persistViewState, props.collectionId, (_b = props.organise) === null || _b === void 0 ? void 0 : _b.persistKey);
+    };
+    // INFO: a filter, sort or page change shows different rows, so the old position is dropped
+    var scrollCaptureResetInitialised = (0, react_1.useRef)(false);
+    (0, react_1.useEffect)(function () {
+        if (!isPersistEnabled)
+            return;
+        if (!scrollCaptureResetInitialised.current) {
+            scrollCaptureResetInitialised.current = true;
+            return;
+        }
+        scrollCaptureRef.current = {};
+        /* eslint-disable */
+    }, [
+        filterSearchParams,
+        filterSelection,
+        filterReference,
+        filterReferenceDate,
+        flexFiltersDebounced,
+        pageIndex,
+        persistedSort,
+    ]);
+    /* eslint-enable */
     // INFO: notify the consumer whenever the applied flex filters change, so a
     // parent can observe live filter state. Uses the debounced state so it fires
     // on committed changes, not every keystroke.
@@ -1035,7 +1104,6 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     // or column visibility change. Active for both "persistent" and "session" modes.
     var persistSaveInitialised = (0, react_1.useRef)(false);
     (0, react_1.useEffect)(function () {
-        var _a;
         if (!isPersistEnabled)
             return;
         // INFO: Skip the first invocation — deps have hydrated initial values from storage,
@@ -1044,26 +1112,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             persistSaveInitialised.current = true;
             return;
         }
-        var activeFlexFilters = flexFiltersDebounced.filter(function (eachFilter) {
-            return (0, flexFilter_1.isFlexFilterActive)(eachFilter, structure);
-        });
-        handleSaveView({
-            filterSearchParams: filterSearchParams,
-            filterSelection: filterSelection,
-            filterReference: filterReference,
-            filterReferenceDate: (0, viewStatePersistence_1.serializeDateFilterState)(filterReferenceDate),
-            flexFilters: activeFlexFilters.length ? activeFlexFilters : undefined,
-            sort: persistedSort !== null && persistedSort !== void 0 ? persistedSort : (_a = props.organise) === null || _a === void 0 ? void 0 : _a.sort,
-            // INFO: scroll mode always starts from page 0 on reload — persisting
-            // a mid-scroll pageIndex would skip rows on next hydration.
-            pageIndex: renderCheckScrollMode() ? 0 : pageIndex,
-            hiddenColumnIds: structure.filter(function (col) { return col.hide; }).map(function (col) { return col.id; }),
-            // INFO: stored raw rather than through getActiveUserHiddenColumnIds so a
-            // consumer temporarily switching bareViewSettings off does not wipe the
-            // user's saved choice.
-            userHiddenColumnIds: userHiddenColumnIds,
-            columnOrder: structure.map(function (col) { return col.id; }),
-        });
+        handleSaveView(handleBuildViewSnapshot());
+        /* eslint-disable */
     }, [
         filterSearchParams,
         filterSelection,
@@ -1075,6 +1125,51 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         persistedSort,
         userHiddenColumnIds,
     ]);
+    /* eslint-enable */
+    // INFO: re-arm on leaving the list, so each return from a record restores once
+    (0, react_1.useEffect)(function () {
+        if (props.type !== "list")
+            scrollRestoredRef.current = false;
+    }, [props.type]);
+    // INFO: restore only on mount, and only for the list a record was last opened from —
+    // not on a tab switch, and not for the other lists on the page
+    (0, react_1.useEffect)(function () {
+        var _a, _b, _c;
+        var identity = "".concat(props.collectionId, "|").concat((_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.persistKey) !== null && _b !== void 0 ? _b : "");
+        var isSwitch = scrollIdentityRef.current !== null &&
+            scrollIdentityRef.current !== identity;
+        scrollIdentityRef.current = identity;
+        scrollCaptureRef.current = {
+            scrollAnchorId: persistedState === null || persistedState === void 0 ? void 0 : persistedState.scrollAnchorId,
+            scrollOffset: persistedState === null || persistedState === void 0 ? void 0 : persistedState.scrollOffset,
+        };
+        var isOtherListReturn = !(0, viewStatePersistence_1.handleIsLastDrill)(props.collectionId, (_c = props.organise) === null || _c === void 0 ? void 0 : _c.persistKey);
+        scrollRestoredRef.current = isSwitch || isOtherListReturn;
+        /* eslint-disable */
+    }, [props.collectionId, (_54 = props.organise) === null || _54 === void 0 ? void 0 : _54.persistKey]);
+    /* eslint-enable */
+    // INFO: wait a frame — rows land in state one tick before layout
+    (0, react_1.useEffect)(function () {
+        if (!isPersistEnabled)
+            return;
+        if (scrollRestoredRef.current)
+            return;
+        if (props.type !== "list")
+            return;
+        if (tableLoading || spaceTableData.length === 0)
+            return;
+        var frame = requestAnimationFrame(function () {
+            if (scrollRestoredRef.current)
+                return;
+            // INFO: done even if nothing applied, so later data changes do not scroll
+            scrollRestoredRef.current = true;
+            // INFO: the ref, not persistedState — returning from a record often does not remount
+            (0, viewStatePersistence_1.handleRestoreScrollPosition)(scrollCaptureRef.current, handleResolveScrollAxis(), handleResolveScrollScope());
+        });
+        return function () { return cancelAnimationFrame(frame); };
+        /* eslint-disable */
+    }, [isPersistEnabled, props.type, tableLoading, spaceTableData.length]);
+    /* eslint-enable */
     (0, react_1.useEffect)(function () {
         handleCheckOfflineDataLength();
         /* eslint-disable */
@@ -1086,7 +1181,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     (0, react_1.useEffect)(function () {
         handleOfflinePrefetch();
         /* eslint-disable */
-    }, [props.collectionId, (_54 = props.bareSettings) === null || _54 === void 0 ? void 0 : _54.bareOffline]);
+    }, [props.collectionId, (_55 = props.bareSettings) === null || _55 === void 0 ? void 0 : _55.bareOffline]);
     /* eslint-enable */
     // INFO: MRQ polling — calls handleRefresh every N ms (e.g. 1500) as a fallback.
     // Calls through handleRefreshRef so the interval always dispatches the latest
@@ -1106,7 +1201,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         }, interval);
         return function () { return clearInterval(timer); };
         /* eslint-disable */
-    }, [(_55 = props.bareSettings) === null || _55 === void 0 ? void 0 : _55.barePollingInterval, isLive, isNetworkOffline]);
+    }, [(_56 = props.bareSettings) === null || _56 === void 0 ? void 0 : _56.barePollingInterval, isLive, isNetworkOffline]);
     /* eslint-enable */
     // INFO: Pub/Sub → SSE live-stream — driven by bareSettings.bareSocketName
     // EventSource URL: {sseEndpoint}/{room}?bm_apiToken={token}
@@ -1148,7 +1243,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         };
         /* eslint-disable */
     }, [
-        (_56 = props.bareSettings) === null || _56 === void 0 ? void 0 : _56.bareSocketName,
+        (_57 = props.bareSettings) === null || _57 === void 0 ? void 0 : _57.bareSocketName,
         props.collectionId,
         props.devSettings.sseEndpoint,
         props.devSettings.dbAPIToken,
@@ -1393,10 +1488,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         props.collectionId,
         props.model,
         props.localURLEndpoint,
-        (_57 = props.organise) === null || _57 === void 0 ? void 0 : _57.extendedTabs,
-        (_58 = props.organise) === null || _58 === void 0 ? void 0 : _58.viewId,
-        (_59 = props.organise) === null || _59 === void 0 ? void 0 : _59.additionalQuery,
-        (_60 = props.organise) === null || _60 === void 0 ? void 0 : _60.groupBy,
+        (_58 = props.organise) === null || _58 === void 0 ? void 0 : _58.extendedTabs,
+        (_59 = props.organise) === null || _59 === void 0 ? void 0 : _59.viewId,
+        (_60 = props.organise) === null || _60 === void 0 ? void 0 : _60.additionalQuery,
+        (_61 = props.organise) === null || _61 === void 0 ? void 0 : _61.groupBy,
         resolvedType,
     ]);
     /**
@@ -1493,7 +1588,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     changedAttributeIds.forEach(function (id) { return dirtyFieldsRef.current.add(id); });
                 }
             }
-            props.bareSettings.bareUpdateHandleData(selectedData, changedAttributeIds);
+            props.bareSettings.bareUpdateHandleData(selectedData, changedAttributeIds, handleResolveRawData());
         }
         previousSelectedData.current = selectedData;
     }, [selectedData]);
@@ -1537,7 +1632,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             };
         }, 100);
         return function () { return clearTimeout(timeoutId); };
-    }, [(_61 = props.organise) === null || _61 === void 0 ? void 0 : _61.showReadFloatingNav, resolvedType, props.id, loading]);
+    }, [(_62 = props.organise) === null || _62 === void 0 ? void 0 : _62.showReadFloatingNav, resolvedType, props.id, loading]);
     (0, react_1.useEffect)(function () {
         if (resolvedType !== "read")
             return;
@@ -2792,6 +2887,15 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         handlePopUpModal(false);
     };
     //TODO: Bug - try to solve clicking List Object too fast
+    // INFO: the stored document as loaded, only while it belongs to the current id —
+    // a switch to another record keeps the previous doc until the new fetch lands
+    var handleResolveRawData = function () {
+        var _a;
+        var raw = rawReadData.current;
+        if (!props.id || props.id === "new" || !raw)
+            return undefined;
+        return String((_a = raw._id) !== null && _a !== void 0 ? _a : raw.id) === String(props.id) ? raw : undefined;
+    };
     var handleSelectListObjectData = function (id, structureId, objectIndex) {
         var _a;
         var filterObjectModel = structure.find(function (eachModel) {
@@ -3704,7 +3808,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     if (deleteIds && deleteIds.length <= 0)
                         deletable = false;
                     if (!(deletable && ((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdateHandlePreComplete))) return [3 /*break*/, 3];
-                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePreComplete({})];
+                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePreComplete({}, handleResolveRawData())];
                 case 2:
                     deletable = _k.sent();
                     _k.label = 3;
@@ -3763,7 +3867,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 case 9:
                     if (!res) return [3 /*break*/, 12];
                     if (!((_e = props.bareSettings) === null || _e === void 0 ? void 0 : _e.bareUpdateHandlePostComplete)) return [3 /*break*/, 11];
-                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePostComplete({})];
+                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePostComplete({}, handleResolveRawData())];
                 case 10:
                     _k.sent();
                     _k.label = 11;
@@ -4401,7 +4505,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     });
                     uniqueColumnId = uniqueDataStructure.length > 0 ? uniqueDataStructure[0].id : undefined;
                     if ((_g = props.bareSettings) === null || _g === void 0 ? void 0 : _g.bareUpdatePrefill) {
-                        props.bareSettings.bareUpdatePrefill(selectedData).map(function (eachField) {
+                        props.bareSettings
+                            .bareUpdatePrefill(selectedData, handleResolveRawData())
+                            .map(function (eachField) {
                             var key = eachField.key, value = eachField.value;
                             createSelectedData_1[key] = value;
                             return null;
@@ -4750,7 +4856,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         !offlineId &&
                         (!isOffline || (isOfflineNetworkListener && !isNetworkOffline));
                     if (!(wentToServer && ((_v = props.bareSettings) === null || _v === void 0 ? void 0 : _v.bareUpdateHandlePostComplete))) return [3 /*break*/, 37];
-                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePostComplete(__assign((_e = {}, _e[serverId] = id, _e), createSelectedData_1))];
+                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePostComplete(__assign((_e = {}, _e[serverId] = id, _e), createSelectedData_1), handleResolveRawData())];
                 case 36:
                     _y.sent();
                     _y.label = 37;
@@ -4914,16 +5020,15 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     setModalVisible(true);
                     preComplete = true;
                     if (!((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdateHandlePreComplete)) return [3 /*break*/, 3];
-                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePreComplete(selectedData)];
+                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePreComplete(selectedData, handleResolveRawData())];
                 case 2:
-                    preComplete =
-                        _m.sent();
+                    preComplete = _m.sent();
                     _m.label = 3;
                 case 3:
                     if (!preComplete)
                         throw "Error";
                     if (!((_b = props.bareSettings) === null || _b === void 0 ? void 0 : _b.bareUpdateHandleComplete)) return [3 /*break*/, 5];
-                    return [4 /*yield*/, props.bareSettings.bareUpdateHandleComplete(selectedData)];
+                    return [4 /*yield*/, props.bareSettings.bareUpdateHandleComplete(selectedData, handleResolveRawData())];
                 case 4:
                     _m.sent();
                     return [3 /*break*/, 7];
@@ -5679,7 +5784,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     excelFormData.append("data[spaceId]", props.collectionId);
                     excelFormData.append("file", csvFile);
                     if ((_j = props.bareSettings) === null || _j === void 0 ? void 0 : _j.bareCSVImportSettings) {
-                        updateFields = (_l = (_k = props.bareSettings) === null || _k === void 0 ? void 0 : _k.bareUpdatePrefill) === null || _l === void 0 ? void 0 : _l.call(_k, selectedData);
+                        updateFields = (_l = (_k = props.bareSettings) === null || _k === void 0 ? void 0 : _k.bareUpdatePrefill) === null || _l === void 0 ? void 0 : _l.call(_k, selectedData, handleResolveRawData());
                         excelFormData.append("prefillValue", JSON.stringify(updateFields));
                     }
                     return [4 /*yield*/, ((_m = props.lib) === null || _m === void 0 ? void 0 : _m.axios({
@@ -6257,9 +6362,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     };
     var handleDeleteModal = function () {
         if ((selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.viewType) !== "feeds") {
-            if (resolvedType === "read" &&
-                props.id &&
-                props.id !== "new") {
+            if (resolvedType === "read" && props.id && props.id !== "new") {
                 setDeleteModal(true);
             }
             else if (resolvedType === "update" && props.id) {
@@ -6710,7 +6813,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 if (((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdatePrefill) && type === "update") {
                     var present_1 = false;
                     props.bareSettings
-                        .bareUpdatePrefill(selectedData)
+                        .bareUpdatePrefill(selectedData, handleResolveRawData())
                         .map(function (eachField) {
                         if (eachField.key === eachAttribute.id)
                             present_1 = true;
@@ -6907,7 +7010,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 }
             });
         }); };
-        var bareActionComponent = (_e = (_d = (_c = props.bareSettings) === null || _c === void 0 ? void 0 : _c.bareUpdateActionComponent) === null || _d === void 0 ? void 0 : _d.call(_c, selectedData, formRef)) !== null && _e !== void 0 ? _e : undefined;
+        var bareActionComponent = (_e = (_d = (_c = props.bareSettings) === null || _c === void 0 ? void 0 : _c.bareUpdateActionComponent) === null || _d === void 0 ? void 0 : _d.call(_c, selectedData, formRef, handleResolveRawData())) !== null && _e !== void 0 ? _e : undefined;
         var hasCustomActions = !!bareActionComponent && !handleIsEmptyElement(bareActionComponent);
         var hasActions = bareActionComponent ? hasCustomActions : true;
         var showDelete = canDeleteRecord && props.id !== "new";
@@ -6975,7 +7078,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         var _a, _b, _c, _d, _e;
         if (resolvedType !== "read")
             return null;
-        var bareActionComponent = (_c = (_b = (_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdateActionComponent) === null || _b === void 0 ? void 0 : _b.call(_a, selectedData, formRef)) !== null && _c !== void 0 ? _c : undefined;
+        var bareActionComponent = (_c = (_b = (_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdateActionComponent) === null || _b === void 0 ? void 0 : _b.call(_a, selectedData, formRef, handleResolveRawData())) !== null && _c !== void 0 ? _c : undefined;
         var hasCustomActions = !!bareActionComponent && !handleIsEmptyElement(bareActionComponent);
         var showUpdate = !bareActionComponent && canUpdateRecord;
         var showExport = !!((_e = (_d = props.organise) === null || _d === void 0 ? void 0 : _d.exportSettings) === null || _e === void 0 ? void 0 : _e.enableExportReadPDF);
@@ -7013,7 +7116,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     // should not sit at the end of a "continue, continue" flow.
     var renderActionButtons = function (type, _hasTabAlign, _uniqueTabIds) {
         var _a, _b, _c, _d, _e, _f;
-        var bareActionComponent = (_c = (_b = (_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdateActionComponent) === null || _b === void 0 ? void 0 : _b.call(_a, selectedData, formRef)) !== null && _c !== void 0 ? _c : undefined;
+        var bareActionComponent = (_c = (_b = (_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdateActionComponent) === null || _b === void 0 ? void 0 : _b.call(_a, selectedData, formRef, handleResolveRawData())) !== null && _c !== void 0 ? _c : undefined;
         // INFO: every update form carries Save / Submit in the floating bar, so
         // the header keeps only Delete
         var isTabbedUpdate = type === "update";
@@ -7290,7 +7393,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     }
                     if ((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdatePrefill) {
                         props.bareSettings
-                            .bareUpdatePrefill(selectedData)
+                            .bareUpdatePrefill(selectedData, handleResolveRawData())
                             .map(function (eachField) {
                             if (eachField.key === eachModel.id)
                                 present = true;
@@ -7474,7 +7577,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 } })),
                             ((_11 = props.bareSettings) === null || _11 === void 0 ? void 0 : _11.bareUpdateComponentAbove) &&
                                 ((_12 = props.bareSettings) === null || _12 === void 0 ? void 0 : _12.bareUpdateComponent) &&
-                                ((_13 = props.bareSettings) === null || _13 === void 0 ? void 0 : _13.bareUpdateComponent(selectedData)),
+                                ((_13 = props.bareSettings) === null || _13 === void 0 ? void 0 : _13.bareUpdateComponent(selectedData, handleResolveRawData())),
                             ((_14 = props.bareSettings) === null || _14 === void 0 ? void 0 : _14.bareUpdateActionTop) &&
                                 renderStepBar(uniqueTabIds_2),
                             react_1.default.createElement(form_1.Form, { className: "mt-6", ref: formRef, refList: __spreadArray(__spreadArray([], modalFormInputRefs, true), flexTableRefs, true), handleComplete: handleSubmit, disabledOnEnter: disabledOnEnter_1, handleOnFailValidation: handleOnFailValidation },
@@ -7505,7 +7608,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 // the grid, so a consumer's own col-span, a fragment of several cells,
                                 // or a null return all lay out exactly as before; only children with no
                                 // col-span of their own are given the full row.
-                                react_1.default.createElement("div", { className: "contents [&>*:not([class*=col-span])]:col-span-12" }, props.bareSettings.bareUpdateComponent(selectedData)))),
+                                react_1.default.createElement("div", { className: "contents [&>*:not([class*=col-span])]:col-span-12" }, props.bareSettings.bareUpdateComponent(selectedData, handleResolveRawData())))),
                             react_1.default.createElement("div", { className: "mt-8" }, renderListAddress(resolvedType)),
                             react_1.default.createElement("div", { className: "mt-8" }, renderListObject(resolvedType)),
                             !((_17 = props.bareSettings) === null || _17 === void 0 ? void 0 : _17.bareUpdateActionTop) &&
@@ -7515,7 +7618,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 renderActionButtons(resolvedType, hasTabAlign_1, uniqueTabIds_2)))) : (react_1.default.createElement("div", null,
                         ((_18 = props.bareSettings) === null || _18 === void 0 ? void 0 : _18.bareUpdateComponentAbove) &&
                             ((_19 = props.bareSettings) === null || _19 === void 0 ? void 0 : _19.bareUpdateComponent) &&
-                            ((_20 = props.bareSettings) === null || _20 === void 0 ? void 0 : _20.bareUpdateComponent(selectedData)),
+                            ((_20 = props.bareSettings) === null || _20 === void 0 ? void 0 : _20.bareUpdateComponent(selectedData, handleResolveRawData())),
                         ((_21 = props.bareSettings) === null || _21 === void 0 ? void 0 : _21.bareUpdateActionTop) &&
                             renderStepBar(uniqueTabIds_2),
                         react_1.default.createElement(form_1.Form, { className: "grid ".concat(formColumn, " ").concat(gridGap, " mt-6"), ref: formRef, refList: __spreadArray(__spreadArray([], modalFormInputRefs, true), flexTableRefs, true), handleComplete: handleSubmit, disabledOnEnter: disabledOnEnter_1, handleOnFailValidation: handleOnFailValidation },
@@ -7528,7 +7631,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             // the grid, so a consumer's own col-span, a fragment of several cells,
                             // or a null return all lay out exactly as before; only children with no
                             // col-span of their own are given the full row.
-                            react_1.default.createElement("div", { className: "contents [&>*:not([class*=col-span])]:col-span-12" }, props.bareSettings.bareUpdateComponent(selectedData)))),
+                            react_1.default.createElement("div", { className: "contents [&>*:not([class*=col-span])]:col-span-12" }, props.bareSettings.bareUpdateComponent(selectedData, handleResolveRawData())))),
                         react_1.default.createElement("div", { className: "mt-8" }, renderListAddress(resolvedType)),
                         react_1.default.createElement("div", { className: "mt-8" }, renderListObject(resolvedType)),
                         !((_24 = props.bareSettings) === null || _24 === void 0 ? void 0 : _24.bareUpdateActionTop) &&
@@ -7536,7 +7639,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             case "list":
             case "union":
                 var filterComponent_1 = renderSearchContent();
-                var dataComponent = renderTabContent(tabs, resolvedType, viewType);
+                var dataComponent = renderScopedTabContent(tabs, resolvedType, viewType);
                 var actionComponent = renderActionButtons(resolvedType);
                 // INFO: active flex filter count for the icon badge + floating search.
                 // Counts query output so the badge matches what's actually filtered.
@@ -7787,7 +7890,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             renderListActionElements())),
                     renderListNewRowFilterElements(),
                     (schemaPresent || ((_35 = props.bareSettings) === null || _35 === void 0 ? void 0 : _35.bareReadListTabs)) && (react_1.default.createElement(tabs_1.Tabs, { tabs: tabs, selectedId: viewType, linkType: props.linkType, custom: props.custom, onClick: function (id) { return handleSelectTab(id); }, darkMode: (_36 = props.organise) === null || _36 === void 0 ? void 0 : _36.darkMode })),
-                    renderTabContent(tabs, resolvedType, viewType),
+                    renderScopedTabContent(tabs, resolvedType, viewType),
                     ((_37 = props.bareSettings) === null || _37 === void 0 ? void 0 : _37.bareListMobileFloatingSearch) && (react_1.default.createElement("div", { className: "h-28 md:hidden", "aria-hidden": "true" })),
                     ((_38 = props.bareSettings) === null || _38 === void 0 ? void 0 : _38.bareListMobileFloatingSearch) &&
                         (0, listModule_1.renderFloatingMobileSearch)({
@@ -7868,7 +7971,12 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             renderObjectTags: renderObjectTags,
             setSelectedData: setSelectedData,
             flexTableRefs: flexTableRefs,
-        }, { signing: signatureSigning, setSigning: setSignatureSigning }, props.onComplete ? true : false, (_j = props.bareSettings) === null || _j === void 0 ? void 0 : _j.bareOffline, (_l = (_k = props.bareSettings) === null || _k === void 0 ? void 0 : _k.bareUpdateColumnType) !== null && _l !== void 0 ? _l : "two", (_m = props.bareSettings) === null || _m === void 0 ? void 0 : _m.bareUpdateIndividualComponent, (_o = props.bareSettings) === null || _o === void 0 ? void 0 : _o.bareUpdateMobileView);
+        }, { signing: signatureSigning, setSigning: setSignatureSigning }, props.onComplete ? true : false, (_j = props.bareSettings) === null || _j === void 0 ? void 0 : _j.bareOffline, (_l = (_k = props.bareSettings) === null || _k === void 0 ? void 0 : _k.bareUpdateColumnType) !== null && _l !== void 0 ? _l : "two", ((_m = props.bareSettings) === null || _m === void 0 ? void 0 : _m.bareUpdateIndividualComponent)
+            ? function (columnId, ref, data, setData) {
+                var _a, _b, _c;
+                return (_c = (_b = (_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareUpdateIndividualComponent) === null || _b === void 0 ? void 0 : _b.call(_a, columnId, ref, data, setData, handleResolveRawData())) !== null && _c !== void 0 ? _c : null;
+            }
+            : undefined, (_o = props.bareSettings) === null || _o === void 0 ? void 0 : _o.bareUpdateMobileView);
     };
     var renderGridAndListData = function (imageTag, type, kanbanGroupId, useColumnName) {
         var gridData = [];
@@ -7891,7 +7999,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 !eachModel.disabled;
         });
         spaceTableData.forEach(function (eachData, index) {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
             var clonedEachData = JSON.parse(JSON.stringify(eachData));
             var allValues = Object.values(clonedEachData);
             var title = "";
@@ -7977,9 +8085,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 }
                 return null;
             });
-            if (booleanModels.length &&
-                isKanban &&
-                isListEditable) {
+            if (booleanModels.length && isKanban && isListEditable) {
                 booleanModels.map(function (eachModel) {
                     return listDescArray.push(react_1.default.createElement("div", { className: "flex space-x-1 items-center", key: "kanban-checkbox-".concat(eachModel.id) },
                         react_1.default.createElement("p", null,
@@ -8012,12 +8118,11 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             if (type === "grid" || type === "kanban") {
                 if (kanbanGroupId)
                     data[kanbanGroupId] = selectedTData[kanbanGroupId];
-                if ((_c = (_b = props.bareSettings) === null || _b === void 0 ? void 0 : _b.bareListGridComponent) === null || _c === void 0 ? void 0 : _c.call(_b, eachData)) {
-                    data[type === "grid" ? "extra" : "action"] =
-                        (_e = (_d = props.bareSettings) === null || _d === void 0 ? void 0 : _d.bareListGridComponent) === null || _e === void 0 ? void 0 : _e.call(_d, eachData);
-                }
-                if ((_g = (_f = props.bareSettings) === null || _f === void 0 ? void 0 : _f.bareListGridTags) === null || _g === void 0 ? void 0 : _g.call(_f, eachData)) {
-                    var eachDataTags = (_j = (_h = props.bareSettings) === null || _h === void 0 ? void 0 : _h.bareListGridTags) === null || _j === void 0 ? void 0 : _j.call(_h, eachData);
+                var gridComponent = (_c = (_b = props.bareSettings) === null || _b === void 0 ? void 0 : _b.bareListGridComponent) === null || _c === void 0 ? void 0 : _c.call(_b, eachData, selectedTData);
+                if (gridComponent)
+                    data[type === "grid" ? "extra" : "action"] = gridComponent;
+                var eachDataTags = (_e = (_d = props.bareSettings) === null || _d === void 0 ? void 0 : _d.bareListGridTags) === null || _e === void 0 ? void 0 : _e.call(_d, eachData, selectedTData);
+                if (eachDataTags) {
                     if (Array.isArray(eachDataTags)) {
                         var gridTagList_1 = [];
                         eachDataTags.forEach(function (eachTag) {
@@ -8029,14 +8134,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         data["tags"] = gridTagList_1;
                     }
                 }
-                if ((_l = (_k = props.bareSettings) === null || _k === void 0 ? void 0 : _k.bareListGridRibbonText) === null || _l === void 0 ? void 0 : _l.call(_k, eachData)) {
-                    data["ribbonText"] =
-                        props.bareSettings.bareListGridRibbonText(eachData);
-                }
+                var ribbonText = (_g = (_f = props.bareSettings) === null || _f === void 0 ? void 0 : _f.bareListGridRibbonText) === null || _g === void 0 ? void 0 : _g.call(_f, eachData, selectedTData);
+                if (ribbonText)
+                    data["ribbonText"] = ribbonText;
                 var eachDataGridImage = "";
-                var gridFallbackImg = (_o = (_m = props.bareSettings) === null || _m === void 0 ? void 0 : _m.bareListGridFallbackImg) === null || _o === void 0 ? void 0 : _o.call(_m, eachData);
+                var gridFallbackImg = (_j = (_h = props.bareSettings) === null || _h === void 0 ? void 0 : _h.bareListGridFallbackImg) === null || _j === void 0 ? void 0 : _j.call(_h, eachData, selectedTData);
                 if (clonedEachData[imageTag] && clonedEachData[imageTag] !== " - ") {
-                    eachDataGridImage = (_q = (_p = clonedEachData[imageTag]) === null || _p === void 0 ? void 0 : _p.props) === null || _q === void 0 ? void 0 : _q.src;
+                    eachDataGridImage = (_l = (_k = clonedEachData[imageTag]) === null || _k === void 0 ? void 0 : _k.props) === null || _l === void 0 ? void 0 : _l.src;
                 }
                 else if (gridFallbackImg) {
                     if (typeof gridFallbackImg === "string") {
@@ -8051,7 +8155,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }
             else {
                 data["img"] = clonedEachData[imageTag]
-                    ? (_s = (_r = clonedEachData[imageTag]) === null || _r === void 0 ? void 0 : _r.props) === null || _s === void 0 ? void 0 : _s.src
+                    ? (_o = (_m = clonedEachData[imageTag]) === null || _m === void 0 ? void 0 : _m.props) === null || _o === void 0 ? void 0 : _o.src
                     : "";
             }
             gridData.push(data);
@@ -8327,6 +8431,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                             } }));
                                     }))), handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, header: renderTableHeader(), onClickRow: function (id) {
                                 var _a, _b;
+                                handleCaptureListScroll(id);
                                 (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
                             }, linkType: props.linkType, custom: props.custom, newTabUrl: (_k = (_j = props.newTabUrl) === null || _j === void 0 ? void 0 : _j.default) !== null && _k !== void 0 ? _k : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_m = (_l = props.newTabUrl) === null || _l === void 0 ? void 0 : _l.addons) !== null && _m !== void 0 ? _m : "&type=read&collection=".concat(props.collectionId, "&view=general"), className: "mt-5", lib: { axios: (_o = props.lib) === null || _o === void 0 ? void 0 : _o.axios }, devSettings: props.devSettings, bareSettings: props.bareSettings, fixedPagination: (_p = props.organise) === null || _p === void 0 ? void 0 : _p.fixedPagination, advSettings: {
                                 addColumnEnabled: (_q = props.organise) === null || _q === void 0 ? void 0 : _q.addColumnEnabled,
@@ -8446,6 +8551,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         }); })
                         : []), true), multiActionFloatingOffset: (_l = props.bareSettings) === null || _l === void 0 ? void 0 : _l.bareListFloatingActionOffset, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, header: renderTableHeader(), pageIndex: pageIndex !== null && pageIndex !== void 0 ? pageIndex : 0, onClickRow: function (id) {
                         var _a, _b;
+                        handleCaptureListScroll(id);
                         (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
                     }, linkType: props.linkType, custom: props.custom, newTabUrl: (_o = (_m = props.newTabUrl) === null || _m === void 0 ? void 0 : _m.default) !== null && _o !== void 0 ? _o : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_q = (_p = props.newTabUrl) === null || _p === void 0 ? void 0 : _p.addons) !== null && _q !== void 0 ? _q : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                         handlePagination(value);
@@ -8559,6 +8665,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 } }));
                         }))), handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, header: renderTableHeader(), pageIndex: pageIndex !== null && pageIndex !== void 0 ? pageIndex : 0, onClickRow: function (id) {
                     var _a, _b;
+                    handleCaptureListScroll(id);
                     (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
                 }, linkType: props.linkType, custom: props.custom, newTabUrl: (_15 = (_14 = props.newTabUrl) === null || _14 === void 0 ? void 0 : _14.default) !== null && _15 !== void 0 ? _15 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_17 = (_16 = props.newTabUrl) === null || _16 === void 0 ? void 0 : _16.addons) !== null && _17 !== void 0 ? _17 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                     handlePagination(value);
@@ -8628,8 +8735,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 }, darkMode: (_25 = props.organise) === null || _25 === void 0 ? void 0 : _25.darkMode, hidePagination: (_26 = props.organise) === null || _26 === void 0 ? void 0 : _26.hidePagination, customPaginationSize: customPaginationSize, disableEllipsisOnLongWord: (_27 = props.organise) === null || _27 === void 0 ? void 0 : _27.disableEllipsisOnLongWord }));
         }
     };
+    // INFO: `hidden` keeps the markers out of space-y spacing
+    var renderScopedTabContent = function (tabs, dataType, requestedViewType) { return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("span", { ref: scrollScopeStartRef, hidden: true, "aria-hidden": "true" }),
+        renderTabContent(tabs, dataType, requestedViewType),
+        react_1.default.createElement("span", { ref: scrollScopeEndRef, hidden: true, "aria-hidden": "true" }))); };
     var renderTabContent = function (tabs, dataType, requestedViewType) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57;
         var matchedTab = tabs.find(function (eachTab) { return eachTab.id === requestedViewType; });
         /**
          * INFO: a list tab must not supply the content of a read view. The selected
@@ -8836,6 +8948,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                     setBatchUpdateModal(true);
                                 } }))), onClickRow: function (id) {
                             var _a, _b;
+                            handleCaptureListScroll(id);
                             (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
                         }, linkType: props.linkType, custom: props.custom, newTabUrl: (_z = (_y = props.newTabUrl) === null || _y === void 0 ? void 0 : _y.default) !== null && _z !== void 0 ? _z : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_1 = (_0 = props.newTabUrl) === null || _0 === void 0 ? void 0 : _0.addons) !== null && _1 !== void 0 ? _1 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
@@ -8858,6 +8971,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                     setBatchUpdateModal(true);
                                 } }))), onClickRow: function (id) {
                             var _a, _b;
+                            handleCaptureListScroll(id);
                             (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
                         }, linkType: props.linkType, custom: props.custom, newTabUrl: (_9 = (_8 = props.newTabUrl) === null || _8 === void 0 ? void 0 : _8.default) !== null && _9 !== void 0 ? _9 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_11 = (_10 = props.newTabUrl) === null || _10 === void 0 ? void 0 : _10.addons) !== null && _11 !== void 0 ? _11 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
@@ -8956,22 +9070,26 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }
             else if (selectedTabData.viewType === "grid") {
                 var isScrollMode = renderCheckScrollMode();
-                return (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(grid_1.Grid, { darkMode: (_18 = props.organise) === null || _18 === void 0 ? void 0 : _18.darkMode, darkModeBg: (_19 = props.organise) === null || _19 === void 0 ? void 0 : _19.darkModeBg, paginationType: renderResolvedPaginationType(), data: renderGridAndListData(selectedTabData.viewImage, "grid"), size: size, limit: limit, cursor: cursor, loading: tableLoading, horizontalScroll: isScrollMode, pageIndex: pageIndex, onClickData: function (id) {
+                // INFO: when bareNewDTW is enabled, render NewGrid instead of legacy Grid
+                if ((_18 = props.bareSettings) === null || _18 === void 0 ? void 0 : _18.bareNewDTW) {
+                    return (react_1.default.createElement(newGrid_1.NewGrid, { darkMode: (_19 = props.organise) === null || _19 === void 0 ? void 0 : _19.darkMode, darkModeBg: (_20 = props.organise) === null || _20 === void 0 ? void 0 : _20.darkModeBg, paginationType: renderResolvedPaginationType(), data: renderGridAndListData(selectedTabData.viewImage, "grid"), size: size, limit: limit, cursor: cursor, loading: tableLoading, horizontalScroll: isScrollMode, pageIndex: pageIndex, onClickData: function (id) {
                             var _a, _b;
+                            // INFO: before handleNavigate, which unmounts the grid
+                            handleCaptureListScroll(id);
                             (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
-                        }, linkType: props.linkType, custom: props.custom, newTabUrl: (_21 = (_20 = props.newTabUrl) === null || _20 === void 0 ? void 0 : _20.default) !== null && _21 !== void 0 ? _21 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_23 = (_22 = props.newTabUrl) === null || _22 === void 0 ? void 0 : _22.addons) !== null && _23 !== void 0 ? _23 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                        }, linkType: props.linkType, custom: props.custom, newTabUrl: (_22 = (_21 = props.newTabUrl) === null || _21 === void 0 ? void 0 : _21.default) !== null && _22 !== void 0 ? _22 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_24 = (_23 = props.newTabUrl) === null || _23 === void 0 ? void 0 : _23.addons) !== null && _24 !== void 0 ? _24 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        }, imgContain: selectedTabData === null || selectedTabData === void 0 ? void 0 : selectedTabData.gridContain, gridColClassName: (_24 = props.bareSettings) === null || _24 === void 0 ? void 0 : _24.bareListGridColClassName, className: "mt-5", 
-                        // INFO: under the new DTW the grid keeps the same footer as the
-                        // table and list views instead of its own legacy page buttons
-                        hidePagination: ((_25 = props.organise) === null || _25 === void 0 ? void 0 : _25.hidePagination) ||
-                            !!((_26 = props.bareSettings) === null || _26 === void 0 ? void 0 : _26.bareNewDTW), customPaginationSize: customPaginationSize }),
-                    ((_27 = props.bareSettings) === null || _27 === void 0 ? void 0 : _27.bareNewDTW) &&
-                        !((_28 = props.organise) === null || _28 === void 0 ? void 0 : _28.hidePagination) && (react_1.default.createElement(newPagination_1.NewPagination, { paginationType: renderResolvedPaginationType(), pageIndex: pageIndex, limit: limit, size: size, cursor: cursor, resultCount: renderGridAndListData(selectedTabData.viewImage, "grid")
-                            .length, customPaginationSize: customPaginationSize, darkMode: (_29 = props.organise) === null || _29 === void 0 ? void 0 : _29.darkMode, darkModeBg: (_30 = props.organise) === null || _30 === void 0 ? void 0 : _30.darkModeBg, handleUpdatePageIndex: function (value) {
+                        }, imgContain: selectedTabData === null || selectedTabData === void 0 ? void 0 : selectedTabData.gridContain, gridColClassName: (_25 = props.bareSettings) === null || _25 === void 0 ? void 0 : _25.bareListGridColClassName, className: "mt-5", hidePagination: (_26 = props.organise) === null || _26 === void 0 ? void 0 : _26.hidePagination, customPaginationSize: customPaginationSize }));
+                }
+                return (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(grid_1.Grid, { darkMode: (_27 = props.organise) === null || _27 === void 0 ? void 0 : _27.darkMode, darkModeBg: (_28 = props.organise) === null || _28 === void 0 ? void 0 : _28.darkModeBg, paginationType: renderResolvedPaginationType(), data: renderGridAndListData(selectedTabData.viewImage, "grid"), size: size, limit: limit, cursor: cursor, loading: tableLoading, horizontalScroll: isScrollMode, pageIndex: pageIndex, onClickData: function (id) {
+                            var _a, _b;
+                            // INFO: before handleNavigate, which unmounts the grid
+                            handleCaptureListScroll(id);
+                            (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
+                        }, linkType: props.linkType, custom: props.custom, newTabUrl: (_30 = (_29 = props.newTabUrl) === null || _29 === void 0 ? void 0 : _29.default) !== null && _30 !== void 0 ? _30 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_32 = (_31 = props.newTabUrl) === null || _31 === void 0 ? void 0 : _31.addons) !== null && _32 !== void 0 ? _32 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        } }))));
+                        }, imgContain: selectedTabData === null || selectedTabData === void 0 ? void 0 : selectedTabData.gridContain, gridColClassName: (_33 = props.bareSettings) === null || _33 === void 0 ? void 0 : _33.bareListGridColClassName, className: "mt-5", hidePagination: (_34 = props.organise) === null || _34 === void 0 ? void 0 : _34.hidePagination, customPaginationSize: customPaginationSize })));
             }
             else if (selectedTabData.viewType === "calendar") {
                 var calendarSettings_1 = selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.calendarSettings;
@@ -9071,7 +9189,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     return eventAvailabilities;
                 };
                 // INFO: when bareNewDTW is enabled, render NewCalendar instead of legacy Calendar
-                if ((_31 = props.bareSettings) === null || _31 === void 0 ? void 0 : _31.bareNewDTW) {
+                if ((_35 = props.bareSettings) === null || _35 === void 0 ? void 0 : _35.bareNewDTW) {
                     var newCalendarEvents = renderEventAvailabilities().map(function (ev) {
                         var _a, _b, _c, _d;
                         return ({
@@ -9091,13 +9209,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     // INFO: viewSwitch — optional Month/Week/Agenda toggle. The range
                     // query follows via calendarView ("dayGridMonth" ↔ "timeGridWeek");
                     // agenda lists the fetched month chronologically.
-                    var viewSwitchOptions = (_32 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.viewSwitch) !== null && _32 !== void 0 ? _32 : [];
+                    var viewSwitchOptions = (_36 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.viewSwitch) !== null && _36 !== void 0 ? _36 : [];
                     var VIEW_VARIANT_MAP = {
                         month: "fullMonth",
                         week: "weekTimeGrid",
                         agenda: "agenda",
                     };
-                    var activeVariant = (_33 = VIEW_VARIANT_MAP[newCalendarViewMode]) !== null && _33 !== void 0 ? _33 : "fullMonth";
+                    var activeVariant = (_37 = VIEW_VARIANT_MAP[newCalendarViewMode]) !== null && _37 !== void 0 ? _37 : "fullMonth";
                     return (react_1.default.createElement("div", { className: "mt-4" },
                         viewSwitchOptions.length > 1 && (react_1.default.createElement("div", { className: "mb-2 flex justify-end" },
                             react_1.default.createElement("div", { className: "inline-flex rounded-lg border border-gray-200 bg-white p-0.5" }, viewSwitchOptions.map(function (view) { return (react_1.default.createElement("button", { key: view, type: "button", onClick: function () {
@@ -9139,9 +9257,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 var _a, _b;
                                 if (event.id)
                                     (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", event.id, "general");
-                            }, darkMode: (_34 = props.organise) === null || _34 === void 0 ? void 0 : _34.darkMode, className: "w-full" }))));
+                            }, darkMode: (_38 = props.organise) === null || _38 === void 0 ? void 0 : _38.darkMode, className: "w-full" }))));
                 }
-                return (react_1.default.createElement("div", { className: "mt-4" }, tableLoading ? (react_1.default.createElement(loading_1.Loading, null)) : (react_1.default.createElement(calendar_1.Calendar, { currentDate: calendarTabMonth, calendarView: (_35 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.defaultView) !== null && _35 !== void 0 ? _35 : calendarView, handleMonthChange: function (date) {
+                return (react_1.default.createElement("div", { className: "mt-4" }, tableLoading ? (react_1.default.createElement(loading_1.Loading, null)) : (react_1.default.createElement(calendar_1.Calendar, { currentDate: calendarTabMonth, calendarView: (_39 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.defaultView) !== null && _39 !== void 0 ? _39 : calendarView, handleMonthChange: function (date) {
                         var startOfMonth = (0, dayjs_1.default)(calendarTabMonth).startOf("month");
                         var endOfMonth = (0, dayjs_1.default)(calendarTabMonth).endOf("month");
                         if (!(0, dayjs_1.default)(date).isBetween(startOfMonth, endOfMonth)) {
@@ -9159,7 +9277,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             else if (selectedTabData.viewType === "feeds") {
                 var contentList_1 = [];
                 var feedsSettings_1 = selectedTabData.feedsSettings;
-                var customFeedsData = (_36 = feedsSettings_1 === null || feedsSettings_1 === void 0 ? void 0 : feedsSettings_1.customFeedsData) === null || _36 === void 0 ? void 0 : _36.call(feedsSettings_1, tableData, spaceTableData);
+                var customFeedsData = (_40 = feedsSettings_1 === null || feedsSettings_1 === void 0 ? void 0 : feedsSettings_1.customFeedsData) === null || _40 === void 0 ? void 0 : _40.call(feedsSettings_1, tableData, spaceTableData);
                 if (customFeedsData && customFeedsData.length > 0) {
                     customFeedsData.map(function (eachData) {
                         var _a, _b, _c, _d;
@@ -9204,21 +9322,25 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 return (react_1.default.createElement("div", { className: "mt-4" }, tableLoading ? (react_1.default.createElement(loading_1.Loading, null)) : (react_1.default.createElement("div", { 
                     // INFO: NewFeeds is already a card like the table and list, so the new
                     // DTW renders it bare; the legacy feed still needs its own surface
-                    className: ((_37 = props.bareSettings) === null || _37 === void 0 ? void 0 : _37.bareNewDTW)
+                    className: ((_41 = props.bareSettings) === null || _41 === void 0 ? void 0 : _41.bareNewDTW)
                         ? ""
-                        : "p-4 rounded-lg ".concat(((_38 = props.organise) === null || _38 === void 0 ? void 0 : _38.darkMode) ? "bg-white/5" : "bg-white") },
-                    ((_39 = props.bareSettings) === null || _39 === void 0 ? void 0 : _39.bareNewDTW) ? (react_1.default.createElement(newFeeds_1.NewFeeds, { bold: true, content: contentList_1, darkMode: (_40 = props.organise) === null || _40 === void 0 ? void 0 : _40.darkMode, onClickItem: function (id) { var _a, _b; return (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general"); } })) : (react_1.default.createElement(feeds_1.Feeds, { bold: true, content: contentList_1, darkMode: (_41 = props.organise) === null || _41 === void 0 ? void 0 : _41.darkMode })),
+                        : "p-4 rounded-lg ".concat(((_42 = props.organise) === null || _42 === void 0 ? void 0 : _42.darkMode) ? "bg-white/5" : "bg-white") },
+                    ((_43 = props.bareSettings) === null || _43 === void 0 ? void 0 : _43.bareNewDTW) ? (react_1.default.createElement(newFeeds_1.NewFeeds, { bold: true, content: contentList_1, darkMode: (_44 = props.organise) === null || _44 === void 0 ? void 0 : _44.darkMode, onClickItem: function (id) {
+                            var _a, _b;
+                            handleCaptureListScroll(id);
+                            (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
+                        } })) : (react_1.default.createElement(feeds_1.Feeds, { bold: true, content: contentList_1, darkMode: (_45 = props.organise) === null || _45 === void 0 ? void 0 : _45.darkMode })),
                     react_1.default.createElement("div", { className: "my-10" }),
                     contentList_1.length > 0 &&
-                        !((_42 = props.organise) === null || _42 === void 0 ? void 0 : _42.hidePagination) &&
-                        ((_43 = props.bareSettings) === null || _43 === void 0 ? void 0 : _43.bareNewDTW) && (react_1.default.createElement(newPagination_1.NewPagination, { paginationType: renderResolvedPaginationType(), pageIndex: pageIndex, limit: limit, size: size, cursor: cursor, resultCount: tableData.length, customPaginationSize: customPaginationSize, darkMode: (_44 = props.organise) === null || _44 === void 0 ? void 0 : _44.darkMode, darkModeBg: (_45 = props.organise) === null || _45 === void 0 ? void 0 : _45.darkModeBg, handleUpdatePageIndex: function (value) {
+                        !((_46 = props.organise) === null || _46 === void 0 ? void 0 : _46.hidePagination) &&
+                        ((_47 = props.bareSettings) === null || _47 === void 0 ? void 0 : _47.bareNewDTW) && (react_1.default.createElement(newPagination_1.NewPagination, { paginationType: renderResolvedPaginationType(), pageIndex: pageIndex, limit: limit, size: size, cursor: cursor, resultCount: tableData.length, customPaginationSize: customPaginationSize, darkMode: (_48 = props.organise) === null || _48 === void 0 ? void 0 : _48.darkMode, darkModeBg: (_49 = props.organise) === null || _49 === void 0 ? void 0 : _49.darkModeBg, handleUpdatePageIndex: function (value) {
                             handlePagination(value);
                         } })),
                     contentList_1.length > 0 &&
-                        !((_46 = props.organise) === null || _46 === void 0 ? void 0 : _46.hidePagination) &&
-                        !((_47 = props.bareSettings) === null || _47 === void 0 ? void 0 : _47.bareNewDTW) && (react_1.default.createElement(pagination_1.Pagination, { data: tableData, size: size, limit: limit, cursor: cursor, pageIndex: pageIndex, paginationType: renderResolvedPaginationType(), handleUpdatePageIndex: function (value) {
+                        !((_50 = props.organise) === null || _50 === void 0 ? void 0 : _50.hidePagination) &&
+                        !((_51 = props.bareSettings) === null || _51 === void 0 ? void 0 : _51.bareNewDTW) && (react_1.default.createElement(pagination_1.Pagination, { data: tableData, size: size, limit: limit, cursor: cursor, pageIndex: pageIndex, paginationType: renderResolvedPaginationType(), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        }, darkMode: (_48 = props.organise) === null || _48 === void 0 ? void 0 : _48.darkMode, customPaginationSize: customPaginationSize }))))));
+                        }, darkMode: (_52 = props.organise) === null || _52 === void 0 ? void 0 : _52.darkMode, customPaginationSize: customPaginationSize }))))));
             }
             else if (selectedTabData.viewType === "map") {
                 var mapSettings_1 = selectedTabData.mapSettings;
@@ -9321,7 +9443,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }
             else if (selectedTabData.viewType === "kanban") {
                 var kanbanSettings = selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.kanbanSettings;
-                var kanbanTitle_2 = (_49 = kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.title) !== null && _49 !== void 0 ? _49 : "";
+                var kanbanTitle_2 = (_53 = kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.title) !== null && _53 !== void 0 ? _53 : "";
                 var nullColumn_1 = false;
                 var groupBy_1 = [];
                 var groupLabel_1 = [];
@@ -9342,10 +9464,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 });
                 var kanbanData = renderGridAndListData("", "kanban", kanbanTitle_2, kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.useColumnName);
                 // INFO: when bareNewDTW is enabled, render NewKanban instead of legacy Kanban
-                if ((_50 = props.bareSettings) === null || _50 === void 0 ? void 0 : _50.bareNewDTW) {
+                if ((_54 = props.bareSettings) === null || _54 === void 0 ? void 0 : _54.bareNewDTW) {
                     return (react_1.default.createElement(newKanban_1.NewKanban, { className: "inline-flex", data: kanbanData, loading: tableLoading, groupBy: groupBy_1, groupId: kanbanTitle_2 !== null && kanbanTitle_2 !== void 0 ? kanbanTitle_2 : "", groupLabel: groupLabel_1.length > 0 ? groupLabel_1 : undefined, nullColumn: nullColumn_1, alertMessage: kanbanData.length === limit
                             ? "Data has exceeded limit, please apply filters"
-                            : "", groupCluster: kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.groupCluster, draggable: canUpdateRecord, droppable: canUpdateRecord && kanbanDroppable, mobileView: (_51 = props.bareSettings) === null || _51 === void 0 ? void 0 : _51.bareListMobileView, onUpdateData: canUpdateRecord
+                            : "", groupCluster: kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.groupCluster, draggable: canUpdateRecord, droppable: canUpdateRecord && kanbanDroppable, mobileView: (_55 = props.bareSettings) === null || _55 === void 0 ? void 0 : _55.bareListMobileView, onUpdateData: canUpdateRecord
                             ? function (cardId, _fromCol, toCol) { return __awaiter(void 0, void 0, void 0, function () {
                                 var _a;
                                 return __generator(this, function (_b) {
@@ -9355,7 +9477,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                             _b.label = 1;
                                         case 1:
                                             _b.trys.push([1, , 3, 4]);
-                                            return [4 /*yield*/, handleSubmitData("update", cardId, kanbanTitle_2, (_a = {}, _a[kanbanTitle_2] = toCol, _a))];
+                                            return [4 /*yield*/, handleSubmitData("update", cardId, kanbanTitle_2, (_a = {},
+                                                    _a[kanbanTitle_2] = toCol,
+                                                    _a))];
                                         case 2:
                                             _b.sent();
                                             return [3 /*break*/, 4];
@@ -9368,8 +9492,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             }); }
                             : undefined, onClickData: function (id) {
                             var _a, _b;
+                            handleCaptureListScroll(id);
                             (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
-                        }, darkMode: (_52 = props.organise) === null || _52 === void 0 ? void 0 : _52.darkMode }));
+                        }, darkMode: (_56 = props.organise) === null || _56 === void 0 ? void 0 : _56.darkMode, darkModeBg: (_57 = props.organise) === null || _57 === void 0 ? void 0 : _57.darkModeBg }));
                 }
                 return (react_1.default.createElement(kanban_1.Kanban, { className: "inline-flex", data: kanbanData, loading: tableLoading, groupBy: groupBy_1, groupId: kanbanTitle_2 !== null && kanbanTitle_2 !== void 0 ? kanbanTitle_2 : "", groupLabel: groupLabel_1.length > 0 ? groupLabel_1 : undefined, nullColumn: nullColumn_1, alertMessage: kanbanData.length === limit
                         ? "Data has exceeded limit, please apply filters"
@@ -9398,6 +9523,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         }); }
                         : undefined, onClickData: function (id) {
                         var _a, _b;
+                        handleCaptureListScroll(id);
                         (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
                     } }));
             }
@@ -9436,7 +9562,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         return null;
     };
     var renderModalContent = function () {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4;
         if (loading) {
             return (react_1.default.createElement("div", { className: "mt-5" },
                 react_1.default.createElement(loading_1.Loading, null),
@@ -9668,10 +9794,12 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         : selectedObjectId
                             ? "update"
                             : "new";
-                    (_0 = (_z = props.bareSettings) === null || _z === void 0 ? void 0 : _z.bareListObjectHandleData) === null || _0 === void 0 ? void 0 : _0.call(_z, listObjectViewType, selectedObjectData);
+                    (_0 = (_z = props.bareSettings) === null || _z === void 0 ? void 0 : _z.bareListObjectHandleData) === null || _0 === void 0 ? void 0 : _0.call(_z, listObjectViewType, selectedObjectData, selectedObjectId
+                        ? (_3 = (_2 = (_1 = handleResolveRawData()) === null || _1 === void 0 ? void 0 : _1[selectedObjectStructureId]) === null || _2 === void 0 ? void 0 : _2.find) === null || _3 === void 0 ? void 0 : _3.call(_2, function (eachRow) { return (eachRow === null || eachRow === void 0 ? void 0 : eachRow.id) === selectedObjectId; })
+                        : undefined);
                 }
                 return (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(form_1.Form, { className: "grid ".concat(formColumn, " ").concat(gridGap, " pb-32 mt-6 sm:pb-36"), ref: objectFormRef, refList: objectFormInputRefs, handleComplete: handleSubmitObjectDataType, disabledOnEnter: disabledOnEnter_2, handleOnFailValidation: handleOnFailValidation }, renderDataTemplateFormContent(selectedObjectData, (_1 = filterObjectModel === null || filterObjectModel === void 0 ? void 0 : filterObjectModel.objectData) !== null && _1 !== void 0 ? _1 : [], objectFormInputRefs, true, filterObjectModel.type === "listObject", undefined, filterObjectModel.type === "listObject"
+                    react_1.default.createElement(form_1.Form, { className: "grid ".concat(formColumn, " ").concat(gridGap, " pb-32 mt-6 sm:pb-36"), ref: objectFormRef, refList: objectFormInputRefs, handleComplete: handleSubmitObjectDataType, disabledOnEnter: disabledOnEnter_2, handleOnFailValidation: handleOnFailValidation }, renderDataTemplateFormContent(selectedObjectData, (_4 = filterObjectModel === null || filterObjectModel === void 0 ? void 0 : filterObjectModel.objectData) !== null && _4 !== void 0 ? _4 : [], objectFormInputRefs, true, filterObjectModel.type === "listObject", undefined, filterObjectModel.type === "listObject"
                         ? selectedData
                         : undefined)),
                     react_1.default.createElement("div", { className: "flex justify-end pt-8" },
@@ -9879,7 +10007,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     };
     return (react_1.default.createElement(react_1.default.Fragment, null,
         renderNotification("root"),
-        ((_63 = (_62 = props.renderSettings) === null || _62 === void 0 ? void 0 : _62.renderLoadingUI) === null || _63 === void 0 ? void 0 : _63.call(_62)) && loading ? ((_64 = props.renderSettings) === null || _64 === void 0 ? void 0 : _64.renderLoadingUI()) : (react_1.default.createElement(modal_1.Modal, { darkMode: (_65 = props.organise) === null || _65 === void 0 ? void 0 : _65.darkMode, darkModeBg: (_66 = props.organise) === null || _66 === void 0 ? void 0 : _66.darkModeBg, maxWidth: selectedObjectStructureId || excelModal ? "2xl" : undefined, open: modalVisible, title: renderModalTitle(), renderContent: renderModalContent, onClose: function () {
+        ((_64 = (_63 = props.renderSettings) === null || _63 === void 0 ? void 0 : _63.renderLoadingUI) === null || _64 === void 0 ? void 0 : _64.call(_63)) && loading ? ((_65 = props.renderSettings) === null || _65 === void 0 ? void 0 : _65.renderLoadingUI()) : (react_1.default.createElement(modal_1.Modal, { darkMode: (_66 = props.organise) === null || _66 === void 0 ? void 0 : _66.darkMode, darkModeBg: (_67 = props.organise) === null || _67 === void 0 ? void 0 : _67.darkModeBg, maxWidth: selectedObjectStructureId || excelModal ? "2xl" : undefined, open: modalVisible, title: renderModalTitle(), renderContent: renderModalContent, onClose: function () {
                 var _a, _b;
                 if (loading)
                     return;
@@ -9890,7 +10018,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     setExportCSVEmail((_b = (_a = props.devSettings.currentUser) === null || _a === void 0 ? void 0 : _a.userEmail) !== null && _b !== void 0 ? _b : "");
                 }
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) })),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_67 = props.organise) === null || _67 === void 0 ? void 0 : _67.darkMode, darkModeBg: (_68 = props.organise) === null || _68 === void 0 ? void 0 : _68.darkModeBg, maxWidth: "2xl", open: referenceCreationModal.id ? true : false, renderContent: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_68 = props.organise) === null || _68 === void 0 ? void 0 : _68.darkMode, darkModeBg: (_69 = props.organise) === null || _69 === void 0 ? void 0 : _69.darkModeBg, maxWidth: "2xl", open: referenceCreationModal.id ? true : false, renderContent: function () {
                 return (react_1.default.createElement(referenceModal_1.ReferenceModal, { referenceModelSchema: referenceModelSchema, referenceDataStructure: referenceCreationModal, devSettings: props.devSettings, handleCreateRefId: function (dataId) {
                         if (dataId) {
                             var currentValue = selectedData[referenceCreationModal.id];
@@ -9906,19 +10034,19 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }, onClose: function () {
                 setReferenceCreationModal({ id: "", name: "", type: "string" });
             } }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_69 = props.organise) === null || _69 === void 0 ? void 0 : _69.darkMode, darkModeBg: (_70 = props.organise) === null || _70 === void 0 ? void 0 : _70.darkModeBg, maxWidth: "2xl", open: Object.keys(referenceDeleteTableData).length > 0, renderContent: renderReferenceDeleteTable, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_70 = props.organise) === null || _70 === void 0 ? void 0 : _70.darkMode, darkModeBg: (_71 = props.organise) === null || _71 === void 0 ? void 0 : _71.darkModeBg, maxWidth: "2xl", open: Object.keys(referenceDeleteTableData).length > 0, renderContent: renderReferenceDeleteTable, onClose: function () {
                 setReferenceDeleteTableData({});
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_71 = props.organise) === null || _71 === void 0 ? void 0 : _71.darkMode, darkModeBg: (_72 = props.organise) === null || _72 === void 0 ? void 0 : _72.darkModeBg, open: deleteModal, renderContent: renderDeleteModalContent, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_72 = props.organise) === null || _72 === void 0 ? void 0 : _72.darkMode, darkModeBg: (_73 = props.organise) === null || _73 === void 0 ? void 0 : _73.darkModeBg, open: deleteModal, renderContent: renderDeleteModalContent, onClose: function () {
                 setDeletePasscodeInput("");
                 setDeleteModal(!deleteModal);
                 setDeleteFeedId("");
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_73 = props.organise) === null || _73 === void 0 ? void 0 : _73.darkMode, darkModeBg: (_74 = props.organise) === null || _74 === void 0 ? void 0 : _74.darkModeBg, open: batchUpdateModal, renderContent: renderBatchUpdateModalContent, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_74 = props.organise) === null || _74 === void 0 ? void 0 : _74.darkMode, darkModeBg: (_75 = props.organise) === null || _75 === void 0 ? void 0 : _75.darkModeBg, open: batchUpdateModal, renderContent: renderBatchUpdateModalContent, onClose: function () {
                 setBatchUpdateData({ columnId: "", columnData: {} });
                 setBatchUpdateModal(false);
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_75 = props.organise) === null || _75 === void 0 ? void 0 : _75.darkMode, darkModeBg: (_76 = props.organise) === null || _76 === void 0 ? void 0 : _76.darkModeBg, title: "Edit Auth Method", open: selectedAuthMethod ? true : false, renderContent: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_76 = props.organise) === null || _76 === void 0 ? void 0 : _76.darkMode, darkModeBg: (_77 = props.organise) === null || _77 === void 0 ? void 0 : _77.darkModeBg, title: "Edit Auth Method", open: selectedAuthMethod ? true : false, renderContent: function () {
                 var _a;
                 if (props.space)
                     return (react_1.default.createElement(authModal_1.AuthModal, { space: props.space, userId: (_a = props.id) !== null && _a !== void 0 ? _a : "", type: selectedAuthMethod, authMethods: authMethods, onComplete: handleAuthComplete }));
@@ -9926,7 +10054,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }, onClose: function () {
                 setSelectedAuthMethod("");
             } }),
-        isActivityLog && (react_1.default.createElement(modal_1.Modal, { darkMode: (_77 = props.organise) === null || _77 === void 0 ? void 0 : _77.darkMode, darkModeBg: (_78 = props.organise) === null || _78 === void 0 ? void 0 : _78.darkModeBg, open: activityModal, title: "Activity Log", renderContent: function () {
+        isActivityLog && (react_1.default.createElement(modal_1.Modal, { darkMode: (_78 = props.organise) === null || _78 === void 0 ? void 0 : _78.darkMode, darkModeBg: (_79 = props.organise) === null || _79 === void 0 ? void 0 : _79.darkModeBg, open: activityModal, title: "Activity Log", renderContent: function () {
                 var _a, _b;
                 return (react_1.default.createElement(activityModal_1.ActivityModal, { title: props.title && typeof props.title === "string"
                         ? props.title