@memobit/libs 3.8.2 → 3.8.3

package/dist/components/DataView/DataView2.js

@@ -1,19 +1,19 @@
 import './DataView.css';
 import { Icon as X } from "../Icon/Icon2.js";
 import { Button as ft } from "../Button/Button2.js";
-import { Tooltip as Te } from "../Tooltip/Tooltip2.js";
+import { Tooltip as Ae } from "../Tooltip/Tooltip2.js";
 import { Checkbox as re } from "../Checkbox/Checkbox2.js";
 import { useBreakpoint as pt } from "../../hooks/useBreakpoint.js";
 import { Dropdown as vt } from "../Dropdown/Dropdown2.js";
 import { getResultsCount as _t } from "../../helpers/Pagination.js";
 import { EmptyState as oe } from "../EmptyState/EmptyState2.js";
-import { Pagination as Ae } from "../Pagination/Pagination2.js";
+import { Pagination as Ee } from "../Pagination/Pagination2.js";
 import { TimelineMarkerDot as wt, calculateTimelineMarkers as gt } from "../TimelineMarkers/TimelineMarkers2.js";
-import { CardView as bt, DEFAULT_PAGE_SIZES as Ee, getColumnLabel as yt, renderCellContent as kt, renderColumnLabel as Ct } from "./DataView.CardView.js";
+import { CardView as bt, DEFAULT_PAGE_SIZES as Ge, getColumnLabel as yt, renderCellContent as kt, renderColumnLabel as Ct } from "./DataView.CardView.js";
 import { DataViewColumnSelector as Nt } from "./DataView.ColumnSelector.js";
 import { DataViewMiniSort as St } from "./DataView.MiniSort.js";
 /* empty css         */
-import Ge, { useMemo as L, useState as P } from "react";
+import Le, { useMemo as L, useState as P } from "react";
 import { Fragment as Mt, jsx as t, jsxs as c } from "react/jsx-runtime";
 function Pt({ state: h }) {
   return /* @__PURE__ */ t("span", {
@@ -21,43 +21,43 @@ function Pt({ state: h }) {
     children: /* @__PURE__ */ t(X, { name: h === "asc" ? "arrow-up" : h === "desc" ? "arrow-down" : "arrow-bidirectional-vertical" })
   });
 }
-function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1, onSelectionChange: Ve, selectedIds: le, pageSizeOptions: ce = Ee, initialPageSize: xe = Ee[1], showPageSize: $ = !0, card: Be, actions: k, actionsWidth: K, timeline: C, onRowClick: R, rowHref: de, rowClassName: he, rowDetail: Fe, empty: N, initialSortKey: Ie = null, initialSortDirection: Ke = "asc", sortKey: Z, sortDirection: ue, onSortChange: Re, miniSort: z, showCardSortControls: ze = !0, desktopView: me = "table", cardMaxWidth: Ue, className: D, onPageChange: We, onPageSizeChange: fe, currentPage: pe, totalItems: ve, group: o, showResultsCount: je = !0, totalCount: Oe, itemNoun: Xe, columnSelector: q }) {
-  const { isMobile: Ze } = pt(), [qe, Je] = P(Ie), [Qe, Ye] = P(Ke), [He, et] = P([]), f = le ?? He, [tt, at] = P(1), nt = pe ?? tt, [T, _e] = P(xe), [S, st] = P(() => h.reduce((e, a) => (a.width && (e[a.key] = a.width), e), {})), [we, it] = P(/* @__PURE__ */ new Set()), ge = (e) => {
-    it((a) => {
-      const i = new Set(a);
-      return i.has(e) ? i.delete(e) : i.add(e), i;
+function Wt({ columns: h, data: I, rowKey: Ve, pinnedIds: y, selectable: w = !1, onSelectionChange: xe, selectedIds: le, pageSizeOptions: ce = Ge, initialPageSize: Be = Ge[1], showPageSize: $ = !0, card: Fe, actions: k, actionsWidth: K, timeline: C, onRowClick: R, rowHref: de, rowClassName: he, rowDetail: Ie, empty: N, initialSortKey: Ke = null, initialSortDirection: Re = "asc", sortKey: Z, sortDirection: ue, onSortChange: ze, miniSort: z, showCardSortControls: Ue = !0, desktopView: me = "table", cardMaxWidth: We, className: D, onPageChange: je, onPageSizeChange: fe, currentPage: pe, totalItems: ve, group: o, showResultsCount: Oe = !0, totalCount: Xe, itemNoun: Ze, columnSelector: q }) {
+  const { isMobile: _e } = pt(), [qe, Je] = P(Ke), [Qe, Ye] = P(Re), [He, et] = P([]), f = le ?? He, [tt, at] = P(1), nt = pe ?? tt, [T, we] = P(Be), [S, it] = P(() => h.reduce((e, a) => (a.width && (e[a.key] = a.width), e), {})), [ge, st] = P(/* @__PURE__ */ new Set()), be = (e) => {
+    st((a) => {
+      const s = new Set(a);
+      return s.has(e) ? s.delete(e) : s.add(e), s;
     });
-  }, M = (e, a) => Le?.(e, a) ?? a, V = (e) => {
-    pe === void 0 && at(e), We?.(e);
+  }, M = (e, a) => Ve?.(e, a) ?? a, V = (e) => {
+    pe === void 0 && at(e), je?.(e);
   }, p = Z !== void 0 ? Z : qe, v = ue ?? Qe, A = (e, a) => {
-    Z === void 0 && Je(e), ue === void 0 && Ye(a), Re?.({
+    Z === void 0 && Je(e), ue === void 0 && Ye(a), ze?.({
       key: e,
       direction: a
     }), V(1);
   }, U = L(() => new Set(y ?? []), [y]), W = L(() => {
     let e = I;
     if (p) {
-      const n = h.find((s) => s.key === p);
+      const n = h.find((i) => i.key === p);
       if (n) {
-        const s = n.sortAccessor || n.accessor || ((m) => {
+        const i = n.sortAccessor || n.accessor || ((m) => {
           const u = m[n.key];
           return typeof u == "string" || typeof u == "number" ? u : "";
         }), r = [...I].sort((m, u) => {
-          const _ = s(m), d = s(u);
+          const _ = i(m), d = i(u);
           return typeof _ == "number" && typeof d == "number" ? _ - d : String(_).localeCompare(String(d));
         });
         e = v === "asc" ? r : r.reverse();
       }
     }
     if (U.size === 0) return e;
-    const a = [], i = [];
-    if (e.forEach((n, s) => {
-      U.has(M(n, s)) ? a.push(n) : i.push(n);
+    const a = [], s = [];
+    if (e.forEach((n, i) => {
+      U.has(M(n, i)) ? a.push(n) : s.push(n);
     }), y && y.length > 1 && a.length > 1) {
-      const n = new Map(y.map((s, r) => [s, r]));
-      a.sort((s, r) => (n.get(M(s, 0)) ?? 0) - (n.get(M(r, 0)) ?? 0));
+      const n = new Map(y.map((i, r) => [i, r]));
+      a.sort((i, r) => (n.get(M(i, 0)) ?? 0) - (n.get(M(r, 0)) ?? 0));
     }
-    return [...a, ...i];
+    return [...a, ...s];
   }, [
     h,
     I,
@@ -69,49 +69,49 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
     if (!o || j) return W;
     const e = /* @__PURE__ */ new Map(), a = [];
     W.forEach((n) => {
-      const s = o.groupBy(n), r = e.get(s);
-      r ? r.push(n) : (e.set(s, [n]), a.push(s));
+      const i = o.groupBy(n), r = e.get(i);
+      r ? r.push(n) : (e.set(i, [n]), a.push(i));
     });
-    const i = a.map((n) => {
-      const s = e.get(n);
+    const s = a.map((n) => {
+      const i = e.get(n);
       return {
         key: n,
         label: o.groupLabel(n),
-        items: s,
-        totalCount: s.length
+        items: i,
+        totalCount: i.length
       };
     });
-    return o.sortGroups ? i.sort(o.sortGroups) : i.sort((n, s) => n.key === null ? 1 : s.key === null ? -1 : 0), i.flatMap((n) => n.items);
+    return o.sortGroups ? s.sort(o.sortGroups) : s.sort((n, i) => n.key === null ? 1 : i.key === null ? -1 : 0), s.flatMap((n) => n.items);
   }, [
     o,
     j,
     W
-  ]), O = j ? ve : x.length, J = Math.max(1, Math.ceil(O / T)), B = Math.min(nt, J), g = j ? x : x.slice((B - 1) * T, B * T), Q = je ? _t(T, O, Oe ?? O, B, Xe) : null, Y = L(() => {
+  ]), O = j ? ve : x.length, J = Math.max(1, Math.ceil(O / T)), B = Math.min(nt, J), g = j ? x : x.slice((B - 1) * T, B * T), Q = Oe ? _t(T, O, Xe ?? O, B, Ze) : null, Y = L(() => {
     if (!o) return null;
     const e = /* @__PURE__ */ new Map();
     return x.forEach((a) => {
-      const i = o.groupBy(a);
-      e.set(i, (e.get(i) ?? 0) + 1);
+      const s = o.groupBy(a);
+      e.set(s, (e.get(s) ?? 0) + 1);
     }), e;
   }, [o, x]), H = L(() => {
     if (!o || !Y) return null;
     const e = /* @__PURE__ */ new Map(), a = [];
     g.forEach((n) => {
-      const s = o.groupBy(n), r = e.get(s);
-      r ? r.push(n) : (e.set(s, [n]), a.push(s));
+      const i = o.groupBy(n), r = e.get(i);
+      r ? r.push(n) : (e.set(i, [n]), a.push(i));
     });
-    const i = a.map((n) => ({
+    const s = a.map((n) => ({
       key: n,
       label: o.groupLabel(n),
       items: e.get(n),
       totalCount: Y.get(n) ?? 0
     }));
-    return o.sortGroups ? i.sort(o.sortGroups) : i.sort((n, s) => n.key === null ? 1 : s.key === null ? -1 : 0), i;
+    return o.sortGroups ? s.sort(o.sortGroups) : s.sort((n, i) => n.key === null ? 1 : i.key === null ? -1 : 0), s;
   }, [
     o,
     Y,
     g
-  ]), be = L(() => {
+  ]), ye = L(() => {
     if (!C) return /* @__PURE__ */ new Map();
     const e = g.map((a) => ({
       id: C.idAccessor(a),
@@ -119,40 +119,40 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
     }));
     return gt(e, C.granularity);
   }, [g, C]), E = (e) => {
-    le === void 0 && et(e), Ve?.(I.filter((a, i) => e.includes(M(a, i))));
+    le === void 0 && et(e), xe?.(I.filter((a, s) => e.includes(M(a, s))));
   }, rt = (e) => {
     e.sortable && (p === e.key ? A(e.key, v === "asc" ? "desc" : "asc") : A(e.key, "asc"));
   }, ot = (e, a) => {
     e.preventDefault();
-    const i = e.clientX, n = S[a] ?? 150, s = (m) => {
-      const u = m.clientX - i, _ = h.find((d) => d.key === a)?.minWidth ?? 120;
-      st((d) => ({
+    const s = e.clientX, n = S[a] ?? 150, i = (m) => {
+      const u = m.clientX - s, _ = h.find((d) => d.key === a)?.minWidth ?? 120;
+      it((d) => ({
         ...d,
         [a]: Math.max(_, n + u)
       }));
     }, r = () => {
-      window.removeEventListener("mousemove", s), window.removeEventListener("mouseup", r);
+      window.removeEventListener("mousemove", i), window.removeEventListener("mouseup", r);
     };
-    window.addEventListener("mousemove", s), window.addEventListener("mouseup", r);
-  }, ye = h.some((e) => e.filter), ee = h.filter((e) => e.sortable), lt = ee.map((e) => ({
+    window.addEventListener("mousemove", i), window.addEventListener("mouseup", r);
+  }, ke = h.some((e) => e.filter), ee = h.filter((e) => e.sortable), lt = ee.map((e) => ({
     label: yt(e),
     value: e.key
-  })), ct = ee.length > 0, te = p ? ee.find((e) => e.key === p) : void 0, dt = z?.align ?? "left", ke = (z?.columns ?? z?.column ?? []).length > 0 ? /* @__PURE__ */ t(St, {
+  })), ct = ee.length > 0, te = p ? ee.find((e) => e.key === p) : void 0, dt = z?.align ?? "left", Ce = (z?.columns ?? z?.column ?? []).length > 0 ? /* @__PURE__ */ t(St, {
     columns: h,
     config: z,
     sortKey: p,
     sortDirection: v,
     onSort: A
-  }) : null, Ce = q && q.options.length > 0 ? /* @__PURE__ */ t(Nt, { config: q }) : null, b = g.map(M), ae = b.filter((e) => f.includes(e)).length, ne = !!w && b.length > 0 && ae === b.length, Ne = !!w && ae > 0 && ae < b.length, Se = (e) => {
+  }) : null, Ne = q && q.options.length > 0 ? /* @__PURE__ */ t(Nt, { config: q }) : null, b = g.map(M), ae = b.filter((e) => f.includes(e)).length, ne = !!w && b.length > 0 && ae === b.length, Se = !!w && ae > 0 && ae < b.length, Me = (e) => {
     E(e ? [...f, ...b.filter((a) => !f.includes(a))] : f.filter((a) => !b.includes(a)));
   }, ht = w && b.length > 0 ? /* @__PURE__ */ c("label", {
     className: "data-view__select-all",
     children: [/* @__PURE__ */ t(re, {
       checked: ne,
-      indeterminate: Ne,
-      onChange: Se
+      indeterminate: Se,
+      onChange: Me
     }), /* @__PURE__ */ t("span", { children: ne ? "Clear selection" : `Select these ${b.length}` })]
-  }) : null, Me = (e) => Q || ke || Ce || e ? /* @__PURE__ */ c("div", {
+  }) : null, Pe = (e) => Q || Ce || Ne || e ? /* @__PURE__ */ c("div", {
     className: `data-view__top-row data-view__top-row--mini-${dt}`,
     children: [
       Q && /* @__PURE__ */ t("div", {
@@ -160,13 +160,13 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
         children: Q
       }),
       e,
-      ke,
-      Ce
+      Ce,
+      Ne
     ]
-  }) : null, Pe = Me();
+  }) : null, $e = Pe();
   if (me !== "cards" && h.length === 0) return /* @__PURE__ */ c("div", {
     className: `data-view${D ? ` ${D}` : ""}`,
-    children: [Pe, /* @__PURE__ */ t("div", {
+    children: [$e, /* @__PURE__ */ t("div", {
       className: "data-view__wrapper data-view__wrapper--empty",
       children: /* @__PURE__ */ t(oe, {
         title: "No columns selected",
@@ -177,8 +177,8 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
   if (me === "cards") return /* @__PURE__ */ c("div", {
     className: `data-view data-view--cards${D ? ` ${D}` : ""}`,
     children: [
-      Me(ht),
-      ze && ct && /* @__PURE__ */ c("div", {
+      Pe(ht),
+      Ue && ct && /* @__PURE__ */ c("div", {
         className: "data-view__card-sort-bar",
         children: [/* @__PURE__ */ t("div", {
           className: "data-view__card-sort-field",
@@ -199,7 +199,7 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
               A(a, p === a ? v : "asc");
             }
           })
-        }), /* @__PURE__ */ t(Te, {
+        }), /* @__PURE__ */ t(Ae, {
           title: v === "asc" ? "Sort descending" : "Sort ascending",
           children: /* @__PURE__ */ t(ft, {
             className: "data-view__card-sort-direction",
@@ -212,7 +212,7 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
           })
         })]
       }),
-      ye && /* @__PURE__ */ t("div", {
+      ke && /* @__PURE__ */ t("div", {
         className: "data-view__filter-bar",
         children: h.filter((e) => e.filter).map((e) => /* @__PURE__ */ t("div", {
           className: "data-view__filter-bar-item",
@@ -223,7 +223,7 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
         data: g,
         columns: h,
         rowKey: M,
-        card: Be,
+        card: Fe,
         actions: k,
         timeline: C,
         onRowClick: R,
@@ -233,18 +233,18 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
         selectable: w,
         selectedIds: f,
         pinnedIds: y,
-        cardMaxWidth: Ue,
-        isMobile: Ze,
+        cardMaxWidth: We,
+        isMobile: _e,
         groups: H ?? void 0,
         showGroupCount: o?.showCount !== !1,
         collapsible: o?.collapsible,
-        collapsedGroups: we,
-        onToggleGroup: ge,
+        collapsedGroups: ge,
+        onToggleGroup: be,
         onToggleSelect: (e, a) => {
-          E(a ? [...f, e] : f.filter((i) => i !== e));
+          E(a ? [...f, e] : f.filter((s) => s !== e));
         }
       }),
-      /* @__PURE__ */ t(Ae, {
+      /* @__PURE__ */ t(Ee, {
         currentPage: B,
         totalPages: J,
         totalItems: O,
@@ -252,13 +252,13 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
         pageSizeOptions: $ ? ce : void 0,
         pageSize: $ ? T : void 0,
         onPageSizeChange: $ ? (e) => {
-          _e(e), V(1), fe?.(e);
+          we(e), V(1), fe?.(e);
         } : void 0
       })
     ]
   });
-  const F = h.filter((e) => !e.hideInTable), G = C && be.size > 0, $e = /* @__PURE__ */ c(Mt, { children: [
-    Pe,
+  const F = h.filter((e) => !e.hideInTable && !(_e && e.hideInMobile)), G = C && ye.size > 0, De = /* @__PURE__ */ c(Mt, { children: [
+    $e,
     /* @__PURE__ */ t("div", {
       className: "data-view__wrapper",
       children: /* @__PURE__ */ c("table", { children: [/* @__PURE__ */ c("thead", { children: [/* @__PURE__ */ c("tr", { children: [
@@ -267,8 +267,8 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
           className: "data-view__checkbox",
           children: /* @__PURE__ */ t(re, {
             checked: ne,
-            indeterminate: Ne,
-            onChange: Se
+            indeterminate: Se,
+            onChange: Me
           })
         }),
         F.map((e) => {
@@ -282,8 +282,8 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
               children: [Ct(e), e.sortable && /* @__PURE__ */ t(Pt, { state: p === e.key ? v : "unsorted" })]
             }), /* @__PURE__ */ t("span", {
               className: "data-view__resizer",
-              onMouseDown: (i) => ot(i, e.key),
-              onClick: (i) => i.stopPropagation()
+              onMouseDown: (s) => ot(s, e.key),
+              onClick: (s) => s.stopPropagation()
             })]
           }, e.key);
         }),
@@ -292,7 +292,7 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
           style: K ? { width: K } : void 0,
           children: "Actions"
         })
-      ] }), ye && /* @__PURE__ */ c("tr", {
+      ] }), ke && /* @__PURE__ */ c("tr", {
         className: "data-view__filter-row",
         children: [
           G && /* @__PURE__ */ t("td", { className: "data-view__filter-cell data-view__filter-cell--spacer" }),
@@ -316,8 +316,8 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
             secondary: N.secondary
           }) : /* @__PURE__ */ t(oe, { title: "No data available" })
         }) });
-        const e = F.length + (G ? 1 : 0) + (w ? 1 : 0) + (k ? 1 : 0), a = o?.showCount !== !1, i = (n, s) => {
-          const r = M(n, s), m = f.includes(r), u = U.has(r), _ = be.get(s), d = de?.(n), De = !!R || !!d, ut = (l) => {
+        const e = F.length + (G ? 1 : 0) + (w ? 1 : 0) + (k ? 1 : 0), a = o?.showCount !== !1, s = (n, i) => {
+          const r = M(n, i), m = f.includes(r), u = U.has(r), _ = ye.get(i), d = de?.(n), Te = !!R || !!d, ut = (l) => {
             if (d && (l.metaKey || l.ctrlKey || l.shiftKey)) {
               window.open(d, "_blank", "noopener,noreferrer");
               return;
@@ -329,10 +329,10 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
             d && window.location.assign(d);
           }, mt = (l) => {
             l.button !== 1 || !d || (l.preventDefault(), window.open(d, "_blank", "noopener,noreferrer"));
-          }, se = Fe?.(n);
-          return /* @__PURE__ */ c(Ge.Fragment, { children: [/* @__PURE__ */ c("tr", {
-            className: `${m ? "is-selected" : ""} ${De ? "data-view__row--clickable" : ""} ${u ? "data-view__row--pinned" : ""} ${he?.(n) || ""}`,
-            onClick: De ? ut : void 0,
+          }, ie = Ie?.(n);
+          return /* @__PURE__ */ c(Le.Fragment, { children: [/* @__PURE__ */ c("tr", {
+            className: `${m ? "is-selected" : ""} ${Te ? "data-view__row--clickable" : ""} ${u ? "data-view__row--pinned" : ""} ${he?.(n) || ""}`,
+            onClick: Te ? ut : void 0,
             onAuxClick: d ? mt : void 0,
             children: [
               G && /* @__PURE__ */ t("td", {
@@ -344,13 +344,13 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
                 children: /* @__PURE__ */ t(re, {
                   checked: m,
                   onChange: (l) => {
-                    E(l ? [...f, r] : f.filter((ie) => ie !== r));
+                    E(l ? [...f, r] : f.filter((se) => se !== r));
                   }
                 })
               }),
-              F.map((l, ie) => /* @__PURE__ */ c("td", {
+              F.map((l, se) => /* @__PURE__ */ c("td", {
                 style: S[l.key] ? { width: S[l.key] } : void 0,
-                children: [ie === 0 && u && /* @__PURE__ */ t(Te, {
+                children: [se === 0 && u && /* @__PURE__ */ t(Ae, {
                   title: "Pinned",
                   children: /* @__PURE__ */ t(X, {
                     className: "data-view__pin-indicator",
@@ -369,35 +369,35 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
                 })
               })
             ]
-          }), se != null && se !== !1 && /* @__PURE__ */ t("tr", {
+          }), ie != null && ie !== !1 && /* @__PURE__ */ t("tr", {
             className: "data-view__row-detail",
             children: /* @__PURE__ */ t("td", {
               colSpan: e,
               onClick: (l) => l.stopPropagation(),
-              children: se
+              children: ie
             })
           })] }, r);
         };
         if (H) {
           let n = 0;
-          return H.map((s) => {
+          return H.map((i) => {
             const r = n;
-            n += s.items.length;
-            const m = o?.collapsible && we.has(s.key);
-            return /* @__PURE__ */ c(Ge.Fragment, { children: [/* @__PURE__ */ t("tr", {
+            n += i.items.length;
+            const m = o?.collapsible && ge.has(i.key);
+            return /* @__PURE__ */ c(Le.Fragment, { children: [/* @__PURE__ */ t("tr", {
               className: `data-view__group-row${o?.collapsible ? " data-view__group-row--collapsible" : ""}`,
-              onClick: o?.collapsible ? () => ge(s.key) : void 0,
+              onClick: o?.collapsible ? () => be(i.key) : void 0,
               children: /* @__PURE__ */ c("td", {
                 colSpan: e,
                 className: "data-view__group-cell",
                 children: [
                   /* @__PURE__ */ t("span", {
                     className: "data-view__group-label",
-                    children: s.label
+                    children: i.label
                   }),
                   a && /* @__PURE__ */ t("span", {
                     className: "data-view__group-count",
-                    children: s.items.length === s.totalCount ? s.totalCount : `${s.items.length} of ${s.totalCount}`
+                    children: i.items.length === i.totalCount ? i.totalCount : `${i.items.length} of ${i.totalCount}`
                   }),
                   o?.collapsible && /* @__PURE__ */ t(X, {
                     className: "data-view__group-chevron",
@@ -406,13 +406,13 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
                   })
                 ]
               })
-            }), !m && s.items.map((u, _) => i(u, r + _))] }, s.key ?? "__null__");
+            }), !m && i.items.map((u, _) => s(u, r + _))] }, i.key ?? "__null__");
           });
         }
-        return g.map((n, s) => i(n, s));
+        return g.map((n, i) => s(n, i));
       })() })] })
     }),
-    /* @__PURE__ */ t(Ae, {
+    /* @__PURE__ */ t(Ee, {
       currentPage: B,
       totalPages: J,
       totalItems: W.length,
@@ -420,7 +420,7 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
       pageSizeOptions: $ ? ce : void 0,
       pageSize: $ ? T : void 0,
       onPageSizeChange: $ ? (e) => {
-        _e(e), V(1), fe?.(e);
+        we(e), V(1), fe?.(e);
       } : void 0
     })
   ] });
@@ -428,8 +428,8 @@ function Wt({ columns: h, data: I, rowKey: Le, pinnedIds: y, selectable: w = !1,
     className: `data-view${D ? ` ${D}` : ""}`,
     children: G ? /* @__PURE__ */ c("div", {
       className: "timeline-markers",
-      children: [/* @__PURE__ */ t("div", { className: "timeline-markers__track" }), $e]
-    }) : $e
+      children: [/* @__PURE__ */ t("div", { className: "timeline-markers__track" }), De]
+    }) : De
   });
 }
 export {

package/dist/helpers/VersionInfo.js

@@ -23,7 +23,7 @@ var r = (i) => {
   const o = {
     ...i,
     lib: d,
-    libBuildNumber: 493,
+    libBuildNumber: 3,
     libCommit: n,
     libBuildDate: t
   };

package/dist/index.d.ts

@@ -1072,7 +1072,7 @@ export declare interface DataViewColumn<T> {
     minWidth?: number;
     hideInCard?: boolean;
     hideInTable?: boolean;
-    /** Hide this column only on mobile breakpoint (not when cards are used on desktop). */
+    /** Hide this column only on mobile breakpoint, in both table and card views (not when cards are used on desktop). */
     hideInMobile?: boolean;
 }
 

package/dist/styles/base.scss

@@ -1,36 +1,36 @@
-// Universal body painting + sizing. Consumed via themes.scss so every memobit
-// app picks it up automatically.
-//
-// Why this lives here:
-// Theme backgrounds are gradients (multi-stop linear/radial). If the body is
-// shorter than the viewport during initial render — empty content, loading
-// state — the gradient gets tiled vertically by default, producing visible
-// horizontal banding. `min-height: 100vh` ensures the body is at least as tall
-// as the viewport so the gradient renders at full size on first paint;
-// `background-repeat: no-repeat` is a defensive guard for edge cases (zoom,
-// tall viewport with short content after HMR).
-//
-// Do NOT use the `background` shorthand in consumer App.scss — it resets
-// `background-repeat` to its initial `repeat` value and re-introduces the
-// banding. Set `background-image` long-hand if a per-project override is
-// needed; otherwise omit and let this rule own it.
-
-html,
-body {
-    background: var(--body-background);
-    background-repeat: no-repeat;
-    margin: 0;
-    padding: 0;
-    min-height: 100vh;
-}
-
-// Ambient glow overlay — themes opt in via `--body-background-glow`. Pinned to
-// the viewport so it stays put on scroll; z-index: -1 keeps it behind app content.
-body::before {
-    content: '';
-    position: fixed;
-    inset: 0;
-    z-index: -1;
-    background: var(--body-background-glow, none);
-    pointer-events: none;
-}
+// Universal body painting + sizing. Consumed via themes.scss so every memobit
+// app picks it up automatically.
+//
+// Why this lives here:
+// Theme backgrounds are gradients (multi-stop linear/radial). If the body is
+// shorter than the viewport during initial render — empty content, loading
+// state — the gradient gets tiled vertically by default, producing visible
+// horizontal banding. `min-height: 100vh` ensures the body is at least as tall
+// as the viewport so the gradient renders at full size on first paint;
+// `background-repeat: no-repeat` is a defensive guard for edge cases (zoom,
+// tall viewport with short content after HMR).
+//
+// Do NOT use the `background` shorthand in consumer App.scss — it resets
+// `background-repeat` to its initial `repeat` value and re-introduces the
+// banding. Set `background-image` long-hand if a per-project override is
+// needed; otherwise omit and let this rule own it.
+
+html,
+body {
+    background: var(--body-background);
+    background-repeat: no-repeat;
+    margin: 0;
+    padding: 0;
+    min-height: 100vh;
+}
+
+// Ambient glow overlay — themes opt in via `--body-background-glow`. Pinned to
+// the viewport so it stays put on scroll; z-index: -1 keeps it behind app content.
+body::before {
+    content: '';
+    position: fixed;
+    inset: 0;
+    z-index: -1;
+    background: var(--body-background-glow, none);
+    pointer-events: none;
+}