@rio-cloud/rio-uikit 2.2.0 → 2.3.0-beta.1

package/components/table/layout/useResizableColumns.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizableColumns.js","sources":["../../../../src/components/table/layout/useResizableColumns.ts"],"sourcesContent":["import { useEffect, useState, type PointerEvent as ReactPointerEvent } from 'react';\n\nimport type { TableColumnDefinition } from '../Table.types';\nimport {\n    DEFAULT_MAX_RESIZE_WIDTH_PX,\n    DEFAULT_MIN_RESIZE_WIDTH_PX,\n    MIN_COLUMN_WIDTH_PX,\n} from '../tableSizing.constants';\n\ntype ResizeSession = {\n    columnKey: string;\n    maxResizeWidth: number;\n    minResizeWidth: number;\n    startWidth: number;\n    startX: number;\n};\n\ntype UseResizableColumnsProps<RowType extends Record<string, unknown>> = {\n    columns: TableColumnDefinition<RowType>[];\n    enabled: boolean;\n    onColumnResize?: (columnKey: string, width?: number) => void;\n};\n\nconst parsePixelWidth = (width?: number | string) => {\n    const normalizedWidth = typeof width === 'number' ? `${width}px` : width;\n    const match = normalizedWidth?.trim().match(/^(-?\\d+(?:\\.\\d+)?)px$/);\n\n    if (!match) {\n        return;\n    }\n\n    return Math.round(Number(match[1]));\n};\n\nexport const useResizableColumns = <RowType extends Record<string, unknown>>(\n    props: UseResizableColumnsProps<RowType>\n) => {\n    const { columns, enabled, onColumnResize } = props;\n    const [resizedColumnWidths, setResizedColumnWidths] = useState<Record<string, number>>({});\n    const [resizeSession, setResizeSession] = useState<ResizeSession | undefined>(undefined);\n\n    useEffect(() => {\n        if (!onColumnResize) {\n            return;\n        }\n\n        setResizedColumnWidths(previousWidths => {\n            const nextWidths = Object.fromEntries(\n                Object.entries(previousWidths).flatMap(([columnKey]) => {\n                    const currentColumn = columns.find(column => column.key === columnKey);\n                    const currentPixelWidth = parsePixelWidth(currentColumn?.width);\n\n                    return currentPixelWidth === undefined ? [] : [[columnKey, currentPixelWidth]];\n                })\n            );\n\n            return JSON.stringify(previousWidths) === JSON.stringify(nextWidths) ? previousWidths : nextWidths;\n        });\n    }, [columns, onColumnResize]);\n\n    useEffect(() => {\n        if (!resizeSession) {\n            return;\n        }\n\n        const previousBodyCursor = document.body.style.cursor;\n        const previousBodyUserSelect = document.body.style.userSelect;\n\n        document.body.style.cursor = 'col-resize';\n        document.body.style.userSelect = 'none';\n\n        const handlePointerMove = (event: PointerEvent) => {\n            const nextWidth = Math.min(\n                resizeSession.maxResizeWidth,\n                Math.max(\n                    resizeSession.minResizeWidth,\n                    Math.round(resizeSession.startWidth + event.clientX - resizeSession.startX)\n                )\n            );\n\n            onColumnResize?.(resizeSession.columnKey, nextWidth);\n\n            setResizedColumnWidths(previousWidths =>\n                previousWidths[resizeSession.columnKey] === nextWidth\n                    ? previousWidths\n                    : {\n                          ...previousWidths,\n                          [resizeSession.columnKey]: nextWidth,\n                      }\n            );\n        };\n\n        const stopResize = () => {\n            setResizeSession(undefined);\n        };\n\n        window.addEventListener('pointermove', handlePointerMove);\n        window.addEventListener('pointerup', stopResize);\n        window.addEventListener('pointercancel', stopResize);\n\n        return () => {\n            document.body.style.cursor = previousBodyCursor;\n            document.body.style.userSelect = previousBodyUserSelect;\n            window.removeEventListener('pointermove', handlePointerMove);\n            window.removeEventListener('pointerup', stopResize);\n            window.removeEventListener('pointercancel', stopResize);\n        };\n    }, [onColumnResize, resizeSession]);\n\n    const handleColumnResizeStart = (columnKey: string, event: ReactPointerEvent<HTMLDivElement>) => {\n        if (!enabled || event.button !== 0) {\n            return;\n        }\n\n        const column = columns.find(currentColumn => currentColumn.key === columnKey);\n        const headerCellElement = event.currentTarget.closest<HTMLElement>('.table-head-cell');\n\n        if (!column || !headerCellElement) {\n            return;\n        }\n\n        event.preventDefault();\n        event.stopPropagation();\n\n        const minResizeWidth = Math.max(column.minResizeWidth ?? DEFAULT_MIN_RESIZE_WIDTH_PX, MIN_COLUMN_WIDTH_PX);\n        const maxResizeWidth = Math.max(column.maxResizeWidth ?? DEFAULT_MAX_RESIZE_WIDTH_PX, minResizeWidth);\n\n        setResizeSession({\n            columnKey,\n            maxResizeWidth,\n            minResizeWidth,\n            startWidth: headerCellElement.getBoundingClientRect().width,\n            startX: event.clientX,\n        });\n    };\n\n    const handleColumnResizeReset = (columnKey: string) => {\n        const column = columns.find(currentColumn => currentColumn.key === columnKey);\n        const resetWidth =\n            column?.minResizeWidth !== undefined ? Math.max(column.minResizeWidth, MIN_COLUMN_WIDTH_PX) : undefined;\n\n        setResizeSession(undefined);\n        onColumnResize?.(columnKey, resetWidth);\n        setResizedColumnWidths(previousWidths => {\n            if (resetWidth === undefined) {\n                if (!(columnKey in previousWidths)) {\n                    return previousWidths;\n                }\n\n                const nextWidths = { ...previousWidths };\n                delete nextWidths[columnKey];\n\n                return nextWidths;\n            }\n\n            return previousWidths[columnKey] === resetWidth\n                ? previousWidths\n                : {\n                      ...previousWidths,\n                      [columnKey]: resetWidth,\n                  };\n        });\n    };\n\n    const resizedColumns = columns.map(column => {\n        const resizedWidth = resizedColumnWidths[column.key];\n\n        return resizedWidth === undefined\n            ? column\n            : {\n                  ...column,\n                  width: resizedWidth,\n              };\n    });\n\n    return {\n        handleColumnResizeReset,\n        handleColumnResizeStart,\n        lastResizableColumnKey: columns.at(-1)?.key,\n        resizedColumns,\n    };\n};\n"],"names":["parsePixelWidth","width","match","useResizableColumns","props","columns","enabled","onColumnResize","resizedColumnWidths","setResizedColumnWidths","useState","resizeSession","setResizeSession","useEffect","previousWidths","nextWidths","columnKey","currentColumn","column","currentPixelWidth","previousBodyCursor","previousBodyUserSelect","handlePointerMove","event","nextWidth","stopResize","handleColumnResizeStart","headerCellElement","minResizeWidth","DEFAULT_MIN_RESIZE_WIDTH_PX","MIN_COLUMN_WIDTH_PX","maxResizeWidth","DEFAULT_MAX_RESIZE_WIDTH_PX","handleColumnResizeReset","resetWidth","resizedColumns","resizedWidth"],"mappings":"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"}

package/components/table/layout/useTableLayout.d.ts

@@ -0,0 +1,25 @@
+import { CSSProperties } from 'react';
+import { TableCardsStyleSettings } from '../TableCard';
+import { TableColumnDefinition, TableStyle } from '../Table.types';
+export type TableColumnWithArea<RowType extends Record<string, unknown>> = {
+    column: TableColumnDefinition<RowType>;
+    columnIndex: number;
+    areaName: string;
+};
+type UseTableLayoutProps<RowType extends Record<string, unknown>> = {
+    bodyMaxHeight?: string;
+    cardsStyle?: TableCardsStyleSettings;
+    columns: TableColumnDefinition<RowType>[];
+    showSelectionColumn?: boolean;
+    style?: CSSProperties;
+};
+export declare const useTableLayout: <RowType extends Record<string, unknown>>(props: UseTableLayoutProps<RowType>) => {
+    columnsWithAreas: TableColumnWithArea<RowType>[];
+    handleBodyScroll: (event: import('react').UIEvent<HTMLElement> | undefined) => void;
+    tableUseOverflow: boolean;
+    tableWrapperRef: import('react').MutableRefObject<HTMLDivElement | null>;
+    tableFooterRowRef: import('react').RefObject<HTMLDivElement>;
+    tableHeadRowRef: import('react').RefObject<HTMLDivElement>;
+    wrapperStyle: TableStyle;
+};
+export {};

package/components/table/layout/useTableLayout.js

@@ -0,0 +1,56 @@
+import { useMeasuredColumnMaxWidths as v } from "./useMeasuredColumnMaxWidths.js";
+import { MIN_COLUMN_WIDTH_PX as N } from "../tableSizing.constants.js";
+import { toCssSize as c, getColumnTrack as R } from "./columnSizing.js";
+import { useHorizontalSectionSync as z } from "./useHorizontalSectionSync.js";
+import H from "../../../hooks/useResizeObserver.js";
+const u = 50, L = (r) => {
+  if (!r)
+    return;
+  const n = r.trim().match(/^(-?\d+(?:\.\d+)?)px$/);
+  if (n)
+    return Number(n[1]);
+}, I = (r) => {
+  const { bodyMaxHeight: n, cardsStyle: d, columns: a, showSelectionColumn: i, style: h } = r, [l, , { inlineSize: p }] = H(), t = a.map((e, o) => ({
+    column: e,
+    columnIndex: o,
+    areaName: `table-col-${o + 1}`
+  })), s = p ?? l.current?.clientWidth, b = (i ? u : 0) + a.reduce((e, o) => {
+    if (o.width === void 0)
+      return e + N;
+    const _ = L(c(o.width));
+    return e + (_ ?? 0);
+  }, 0), m = s !== void 0 && b > s, f = s !== void 0 ? `${s}px` : "100%", { handleBodyScroll: W, tableFooterRowRef: x, tableHeadRowRef: S } = z({
+    enabled: !!n
+  }), w = v({
+    columns: a,
+    enabled: m,
+    tableWrapperRef: l
+  }), C = t.length > 0 ? [
+    i ? `${u}px` : void 0,
+    ...t.map(({ column: e }) => R(e, w[e.key]))
+  ].filter(Boolean).join(" ") : "minmax(0, 1fr)", M = t.length > 0 ? `"${[
+    i ? "table-selection" : void 0,
+    ...t.map(({ areaName: e }) => e)
+  ].filter(Boolean).join(" ")}"` : "none", T = c(d?.minWidth) ?? "280px", g = c(d?.maxWidth) ?? "1fr", y = {
+    ...h ?? {},
+    "--table-columns": C,
+    "--table-areas": M,
+    "--table-cards-min": T,
+    "--table-cards-max": g,
+    "--table-column-count": String(a.length + (i ? 1 : 0)),
+    "--table-width": f
+  };
+  return {
+    columnsWithAreas: t,
+    handleBodyScroll: W,
+    tableUseOverflow: m,
+    tableWrapperRef: l,
+    tableFooterRowRef: x,
+    tableHeadRowRef: S,
+    wrapperStyle: y
+  };
+};
+export {
+  I as useTableLayout
+};
+//# sourceMappingURL=useTableLayout.js.map

package/components/table/layout/useTableLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableLayout.js","sources":["../../../../src/components/table/layout/useTableLayout.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\n\nimport type { TableCardsStyleSettings } from '../TableCard';\nimport type { TableColumnDefinition, TableStyle } from '../Table.types';\nimport { useMeasuredColumnMaxWidths } from './useMeasuredColumnMaxWidths';\nimport { MIN_COLUMN_WIDTH_PX } from '../tableSizing.constants';\nimport { getColumnTrack, toCssSize } from './columnSizing';\nimport { useHorizontalSectionSync } from './useHorizontalSectionSync';\nimport useResizeObserver from '../../../useResizeObserver';\n\nconst TABLE_SELECTION_COLUMN_WIDTH_PX = 50;\n\nconst parsePixelSize = (value?: string) => {\n    if (!value) {\n        return;\n    }\n\n    const match = value.trim().match(/^(-?\\d+(?:\\.\\d+)?)px$/);\n\n    if (!match) {\n        return;\n    }\n\n    return Number(match[1]);\n};\n\nexport type TableColumnWithArea<RowType extends Record<string, unknown>> = {\n    column: TableColumnDefinition<RowType>;\n    columnIndex: number;\n    areaName: string;\n};\n\ntype UseTableLayoutProps<RowType extends Record<string, unknown>> = {\n    bodyMaxHeight?: string;\n    cardsStyle?: TableCardsStyleSettings;\n    columns: TableColumnDefinition<RowType>[];\n    showSelectionColumn?: boolean;\n    style?: CSSProperties;\n};\n\nexport const useTableLayout = <RowType extends Record<string, unknown>>(props: UseTableLayoutProps<RowType>) => {\n    const { bodyMaxHeight, cardsStyle, columns, showSelectionColumn, style } = props;\n    const [tableWrapperRef, , { inlineSize }] = useResizeObserver<HTMLDivElement>();\n\n    const columnsWithAreas: TableColumnWithArea<RowType>[] = columns.map((column, columnIndex) => ({\n        column,\n        columnIndex,\n        areaName: `table-col-${columnIndex + 1}`,\n    }));\n    const wrapperWidth = inlineSize ?? tableWrapperRef.current?.clientWidth;\n    const minWidthTotal =\n        (showSelectionColumn ? TABLE_SELECTION_COLUMN_WIDTH_PX : 0) +\n        columns.reduce((totalWidth, column) => {\n            if (column.width === undefined) {\n                return totalWidth + MIN_COLUMN_WIDTH_PX;\n            }\n\n            const columnWidth = parsePixelSize(toCssSize(column.width));\n\n            return totalWidth + (columnWidth ?? 0);\n        }, 0);\n    const tableUseOverflow = wrapperWidth !== undefined && minWidthTotal > wrapperWidth;\n    const tableWidth = wrapperWidth !== undefined ? `${wrapperWidth}px` : '100%';\n\n    const { handleBodyScroll, tableFooterRowRef, tableHeadRowRef } = useHorizontalSectionSync({\n        enabled: !!bodyMaxHeight,\n    });\n    const measuredColumnMaxWidths = useMeasuredColumnMaxWidths({\n        columns,\n        enabled: tableUseOverflow,\n        tableWrapperRef,\n    });\n\n    const gridTemplateColumns =\n        columnsWithAreas.length > 0\n            ? [\n                  showSelectionColumn ? `${TABLE_SELECTION_COLUMN_WIDTH_PX}px` : undefined,\n                  ...columnsWithAreas.map(({ column }) => getColumnTrack(column, measuredColumnMaxWidths[column.key])),\n              ]\n                  .filter(Boolean)\n                  .join(' ')\n            : 'minmax(0, 1fr)';\n\n    const gridTemplateAreas =\n        columnsWithAreas.length > 0\n            ? `\"${[\n                  showSelectionColumn ? 'table-selection' : undefined,\n                  ...columnsWithAreas.map(({ areaName }) => areaName),\n              ]\n                  .filter(Boolean)\n                  .join(' ')}\"`\n            : 'none';\n\n    const cardsMinWidth = toCssSize(cardsStyle?.minWidth) ?? '280px';\n    const cardsMaxWidth = toCssSize(cardsStyle?.maxWidth) ?? '1fr';\n\n    const wrapperStyle: TableStyle = {\n        ...(style ?? {}),\n        '--table-columns': gridTemplateColumns,\n        '--table-areas': gridTemplateAreas,\n        '--table-cards-min': cardsMinWidth,\n        '--table-cards-max': cardsMaxWidth,\n        '--table-column-count': String(columns.length + (showSelectionColumn ? 1 : 0)),\n        '--table-width': tableWidth,\n    };\n\n    return {\n        columnsWithAreas,\n        handleBodyScroll,\n        tableUseOverflow,\n        tableWrapperRef,\n        tableFooterRowRef,\n        tableHeadRowRef,\n        wrapperStyle,\n    };\n};\n"],"names":["TABLE_SELECTION_COLUMN_WIDTH_PX","parsePixelSize","value","match","useTableLayout","props","bodyMaxHeight","cardsStyle","columns","showSelectionColumn","style","tableWrapperRef","inlineSize","useResizeObserver","columnsWithAreas","column","columnIndex","wrapperWidth","minWidthTotal","totalWidth","MIN_COLUMN_WIDTH_PX","columnWidth","toCssSize","tableUseOverflow","tableWidth","handleBodyScroll","tableFooterRowRef","tableHeadRowRef","useHorizontalSectionSync","measuredColumnMaxWidths","useMeasuredColumnMaxWidths","gridTemplateColumns","getColumnTrack","gridTemplateAreas","areaName","cardsMinWidth","cardsMaxWidth","wrapperStyle"],"mappings":";;;;;AAUA,MAAMA,IAAkC,IAElCC,IAAiB,CAACC,MAAmB;AACvC,MAAI,CAACA;AACD;AAGJ,QAAMC,IAAQD,EAAM,KAAA,EAAO,MAAM,uBAAuB;AAExD,MAAKC;AAIL,WAAO,OAAOA,EAAM,CAAC,CAAC;AAC1B,GAgBaC,IAAiB,CAA0CC,MAAwC;AAC5G,QAAM,EAAE,eAAAC,GAAe,YAAAC,GAAY,SAAAC,GAAS,qBAAAC,GAAqB,OAAAC,MAAUL,GACrE,CAACM,GAAA,EAAmB,EAAE,YAAAC,EAAA,CAAY,IAAIC,EAAA,GAEtCC,IAAmDN,EAAQ,IAAI,CAACO,GAAQC,OAAiB;AAAA,IAC3F,QAAAD;AAAA,IACA,aAAAC;AAAA,IACA,UAAU,aAAaA,IAAc,CAAC;AAAA,EAAA,EACxC,GACIC,IAAeL,KAAcD,EAAgB,SAAS,aACtDO,KACDT,IAAsBT,IAAkC,KACzDQ,EAAQ,OAAO,CAACW,GAAYJ,MAAW;AACnC,QAAIA,EAAO,UAAU;AACjB,aAAOI,IAAaC;AAGxB,UAAMC,IAAcpB,EAAeqB,EAAUP,EAAO,KAAK,CAAC;AAE1D,WAAOI,KAAcE,KAAe;AAAA,EACxC,GAAG,CAAC,GACFE,IAAmBN,MAAiB,UAAaC,IAAgBD,GACjEO,IAAaP,MAAiB,SAAY,GAAGA,CAAY,OAAO,QAEhE,EAAE,kBAAAQ,GAAkB,mBAAAC,GAAmB,iBAAAC,EAAA,IAAoBC,EAAyB;AAAA,IACtF,SAAS,CAAC,CAACtB;AAAA,EAAA,CACd,GACKuB,IAA0BC,EAA2B;AAAA,IACvD,SAAAtB;AAAA,IACA,SAASe;AAAA,IACT,iBAAAZ;AAAA,EAAA,CACH,GAEKoB,IACFjB,EAAiB,SAAS,IACpB;AAAA,IACIL,IAAsB,GAAGT,CAA+B,OAAO;AAAA,IAC/D,GAAGc,EAAiB,IAAI,CAAC,EAAE,QAAAC,EAAA,MAAaiB,EAAejB,GAAQc,EAAwBd,EAAO,GAAG,CAAC,CAAC;AAAA,EAAA,EAElG,OAAO,OAAO,EACd,KAAK,GAAG,IACb,kBAEJkB,IACFnB,EAAiB,SAAS,IACpB,IAAI;AAAA,IACAL,IAAsB,oBAAoB;AAAA,IAC1C,GAAGK,EAAiB,IAAI,CAAC,EAAE,UAAAoB,EAAA,MAAeA,CAAQ;AAAA,EAAA,EAEjD,OAAO,OAAO,EACd,KAAK,GAAG,CAAC,MACd,QAEJC,IAAgBb,EAAUf,GAAY,QAAQ,KAAK,SACnD6B,IAAgBd,EAAUf,GAAY,QAAQ,KAAK,OAEnD8B,IAA2B;AAAA,IAC7B,GAAI3B,KAAS,CAAA;AAAA,IACb,mBAAmBqB;AAAA,IACnB,iBAAiBE;AAAA,IACjB,qBAAqBE;AAAA,IACrB,qBAAqBC;AAAA,IACrB,wBAAwB,OAAO5B,EAAQ,UAAUC,IAAsB,IAAI,EAAE;AAAA,IAC7E,iBAAiBe;AAAA,EAAA;AAGrB,SAAO;AAAA,IACH,kBAAAV;AAAA,IACA,kBAAAW;AAAA,IACA,kBAAAF;AAAA,IACA,iBAAAZ;AAAA,IACA,mBAAAe;AAAA,IACA,iBAAAC;AAAA,IACA,cAAAU;AAAA,EAAA;AAER;"}

package/components/table/layout/useTableVirtualization.d.ts

@@ -0,0 +1,22 @@
+import { TableViewRow } from '../model/tableViewModel.types';
+type TableVirtualScrollContainer = {
+    view?: HTMLDivElement | null;
+};
+type TableVirtualRow<RowType extends Record<string, unknown>> = {
+    index: number;
+    row: TableViewRow<RowType>;
+};
+type UseTableVirtualizationOptions<RowType extends Record<string, unknown>> = {
+    enabled: boolean;
+    overscan: number;
+    rows: TableViewRow<RowType>[];
+    scrollContainer: TableVirtualScrollContainer | null;
+};
+declare const useTableVirtualization: <RowType extends Record<string, unknown>>(options: UseTableVirtualizationOptions<RowType>) => {
+    isVirtualized: boolean;
+    measureRow: (index: number, element: HTMLElement | null) => void;
+    paddingBottom: number;
+    paddingTop: number;
+    virtualRows: TableVirtualRow<RowType>[];
+};
+export default useTableVirtualization;

package/components/table/layout/useTableVirtualization.js

@@ -0,0 +1,125 @@
+import { useState as O, useCallback as c, useEffect as p, useMemo as V } from "react";
+const k = 50, T = (m, i) => m.start === i.start && m.end === i.end, F = (m) => {
+  const { enabled: i, overscan: d, rows: r, scrollContainer: v } = m, [l, H] = O({
+    itemHeights: {},
+    scrollTop: 0,
+    viewportHeight: 0,
+    visibleRange: { start: 0, end: 10 }
+  }), b = c(() => v?.view ?? null, [v]), w = c(() => {
+    const e = Object.values(l.itemHeights);
+    return e.length === 0 ? k : e.reduce((t, n) => t + n, 0) / e.length;
+  }, [l.itemHeights]), g = c(
+    (e) => l.itemHeights[e] ?? w(),
+    [w, l.itemHeights]
+  ), f = c(
+    (e) => {
+      let t = 0;
+      for (let n = 0; n < e; n++)
+        t += g(n);
+      return t;
+    },
+    [g]
+  ), E = c(() => {
+    let e = 0;
+    for (let t = 0; t < r.length; t++)
+      e += g(t);
+    return e;
+  }, [g, r.length]), h = c(
+    (e, t) => {
+      if (!i || r.length === 0)
+        return { start: 0, end: r.length };
+      let n = 0, a = 0;
+      for (; n < r.length; ) {
+        const o = g(n);
+        if (a + o > e - d * o)
+          break;
+        a += o, n++;
+      }
+      let s = n;
+      for (; s < r.length; ) {
+        const o = g(s);
+        if (a > e + t + d * o)
+          break;
+        a += o, s++;
+      }
+      return {
+        start: Math.max(0, n - d),
+        end: Math.min(r.length, s + d)
+      };
+    },
+    [i, g, d, r.length]
+  ), u = c(() => {
+    const e = b();
+    if (!e)
+      return;
+    const t = e.clientHeight, n = e.scrollTop, a = h(n, t);
+    H(
+      (s) => s.scrollTop === n && s.viewportHeight === t && T(s.visibleRange, a) ? s : {
+        ...s,
+        scrollTop: n,
+        viewportHeight: t,
+        visibleRange: a
+      }
+    );
+  }, [h, b]);
+  p(() => {
+    if (!i)
+      return;
+    const e = b();
+    if (!e)
+      return;
+    u(), e.addEventListener("scroll", u, { passive: !0 });
+    const t = new ResizeObserver(u);
+    return t.observe(e), () => {
+      e.removeEventListener("scroll", u), t.disconnect();
+    };
+  }, [i, b, u]), p(() => {
+    i && H((e) => {
+      const t = h(e.scrollTop, e.viewportHeight);
+      return T(e.visibleRange, t) ? e : {
+        ...e,
+        visibleRange: t
+      };
+    });
+  }, [h, i, r]);
+  const x = c(
+    (e, t) => {
+      if (!t)
+        return;
+      const n = t.getBoundingClientRect(), a = window.getComputedStyle(t), s = n.height + Number.parseFloat(a.marginTop || "0") + Number.parseFloat(a.marginBottom || "0");
+      H((o) => {
+        if (o.itemHeights[e] === s)
+          return o;
+        const R = {
+          ...o,
+          itemHeights: {
+            ...o.itemHeights,
+            [e]: s
+          }
+        };
+        return {
+          ...R,
+          visibleRange: h(R.scrollTop, R.viewportHeight)
+        };
+      });
+    },
+    [h]
+  ), z = V(
+    () => i ? r.slice(l.visibleRange.start, l.visibleRange.end).map((e, t) => ({
+      index: l.visibleRange.start + t,
+      row: e
+    })) : [],
+    [i, r, l.visibleRange.end, l.visibleRange.start]
+  ), C = i ? f(l.visibleRange.start) : 0, M = i ? Math.max(0, E() - f(l.visibleRange.end)) : 0;
+  return {
+    isVirtualized: i,
+    measureRow: x,
+    paddingBottom: M,
+    paddingTop: C,
+    virtualRows: z
+  };
+};
+export {
+  F as default
+};
+//# sourceMappingURL=useTableVirtualization.js.map

package/components/table/layout/useTableVirtualization.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableVirtualization.js","sources":["../../../../src/components/table/layout/useTableVirtualization.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport type { TableViewRow } from '../model/tableViewModel.types';\n\ntype TableVirtualScrollContainer = {\n    view?: HTMLDivElement | null;\n};\n\ntype TableVirtualRow<RowType extends Record<string, unknown>> = {\n    index: number;\n    row: TableViewRow<RowType>;\n};\n\ntype UseTableVirtualizationOptions<RowType extends Record<string, unknown>> = {\n    enabled: boolean;\n    overscan: number;\n    rows: TableViewRow<RowType>[];\n    scrollContainer: TableVirtualScrollContainer | null;\n};\n\ntype TableVirtualizationState = {\n    itemHeights: Record<number, number>;\n    scrollTop: number;\n    viewportHeight: number;\n    visibleRange: {\n        start: number;\n        end: number;\n    };\n};\n\nconst DEFAULT_ROW_HEIGHT = 50;\n\nconst areVisibleRangesEqual = (\n    left: TableVirtualizationState['visibleRange'],\n    right: TableVirtualizationState['visibleRange']\n) => left.start === right.start && left.end === right.end;\n\nconst useTableVirtualization = <RowType extends Record<string, unknown>>(\n    options: UseTableVirtualizationOptions<RowType>\n) => {\n    const { enabled, overscan, rows, scrollContainer } = options;\n    const [state, setState] = useState<TableVirtualizationState>({\n        itemHeights: {},\n        scrollTop: 0,\n        viewportHeight: 0,\n        visibleRange: { start: 0, end: 10 },\n    });\n\n    const getScrollElement = useCallback(() => scrollContainer?.view ?? null, [scrollContainer]);\n\n    const getEstimatedRowHeight = useCallback(() => {\n        const measuredHeights = Object.values(state.itemHeights);\n\n        if (measuredHeights.length === 0) {\n            return DEFAULT_ROW_HEIGHT;\n        }\n\n        return measuredHeights.reduce((sum, height) => sum + height, 0) / measuredHeights.length;\n    }, [state.itemHeights]);\n\n    const getRowHeight = useCallback(\n        (index: number) => state.itemHeights[index] ?? getEstimatedRowHeight(),\n        [getEstimatedRowHeight, state.itemHeights]\n    );\n\n    const getItemPosition = useCallback(\n        (index: number) => {\n            let position = 0;\n\n            for (let currentIndex = 0; currentIndex < index; currentIndex++) {\n                position += getRowHeight(currentIndex);\n            }\n\n            return position;\n        },\n        [getRowHeight]\n    );\n\n    const getTotalHeight = useCallback(() => {\n        let totalHeight = 0;\n\n        for (let index = 0; index < rows.length; index++) {\n            totalHeight += getRowHeight(index);\n        }\n\n        return totalHeight;\n    }, [getRowHeight, rows.length]);\n\n    const calculateVisibleRange = useCallback(\n        (scrollTop: number, viewportHeight: number) => {\n            if (!enabled || rows.length === 0) {\n                return { start: 0, end: rows.length };\n            }\n\n            let start = 0;\n            let currentPosition = 0;\n\n            while (start < rows.length) {\n                const rowHeight = getRowHeight(start);\n\n                if (currentPosition + rowHeight > scrollTop - overscan * rowHeight) {\n                    break;\n                }\n\n                currentPosition += rowHeight;\n                start++;\n            }\n\n            let end = start;\n\n            while (end < rows.length) {\n                const rowHeight = getRowHeight(end);\n\n                if (currentPosition > scrollTop + viewportHeight + overscan * rowHeight) {\n                    break;\n                }\n\n                currentPosition += rowHeight;\n                end++;\n            }\n\n            return {\n                start: Math.max(0, start - overscan),\n                end: Math.min(rows.length, end + overscan),\n            };\n        },\n        [enabled, getRowHeight, overscan, rows.length]\n    );\n\n    const handleScroll = useCallback(() => {\n        const scrollElement = getScrollElement();\n\n        if (!scrollElement) {\n            return;\n        }\n\n        const viewportHeight = scrollElement.clientHeight;\n        const scrollTop = scrollElement.scrollTop;\n        const visibleRange = calculateVisibleRange(scrollTop, viewportHeight);\n\n        setState(previousState =>\n            previousState.scrollTop === scrollTop &&\n            previousState.viewportHeight === viewportHeight &&\n            areVisibleRangesEqual(previousState.visibleRange, visibleRange)\n                ? previousState\n                : {\n                      ...previousState,\n                      scrollTop,\n                      viewportHeight,\n                      visibleRange,\n                  }\n        );\n    }, [calculateVisibleRange, getScrollElement]);\n\n    useEffect(() => {\n        if (!enabled) {\n            return;\n        }\n\n        const scrollElement = getScrollElement();\n\n        if (!scrollElement) {\n            return;\n        }\n\n        handleScroll();\n        scrollElement.addEventListener('scroll', handleScroll, { passive: true });\n\n        const resizeObserver = new ResizeObserver(handleScroll);\n        resizeObserver.observe(scrollElement);\n\n        return () => {\n            scrollElement.removeEventListener('scroll', handleScroll);\n            resizeObserver.disconnect();\n        };\n    }, [enabled, getScrollElement, handleScroll]);\n\n    useEffect(() => {\n        if (!enabled) {\n            return;\n        }\n\n        setState(previousState => {\n            const visibleRange = calculateVisibleRange(previousState.scrollTop, previousState.viewportHeight);\n\n            return areVisibleRangesEqual(previousState.visibleRange, visibleRange)\n                ? previousState\n                : {\n                      ...previousState,\n                      visibleRange,\n                  };\n        });\n    }, [calculateVisibleRange, enabled, rows]);\n\n    const measureRow = useCallback(\n        (index: number, element: HTMLElement | null) => {\n            if (!element) {\n                return;\n            }\n\n            const rect = element.getBoundingClientRect();\n            const computedStyle = window.getComputedStyle(element);\n            const height =\n                rect.height +\n                Number.parseFloat(computedStyle.marginTop || '0') +\n                Number.parseFloat(computedStyle.marginBottom || '0');\n\n            setState(previousState => {\n                if (previousState.itemHeights[index] === height) {\n                    return previousState;\n                }\n\n                const nextState = {\n                    ...previousState,\n                    itemHeights: {\n                        ...previousState.itemHeights,\n                        [index]: height,\n                    },\n                };\n\n                return {\n                    ...nextState,\n                    visibleRange: calculateVisibleRange(nextState.scrollTop, nextState.viewportHeight),\n                };\n            });\n        },\n        [calculateVisibleRange]\n    );\n\n    const virtualRows = useMemo<TableVirtualRow<RowType>[]>(\n        () =>\n            enabled\n                ? rows.slice(state.visibleRange.start, state.visibleRange.end).map((row, offset) => {\n                      const index = state.visibleRange.start + offset;\n\n                      return {\n                          index,\n                          row,\n                      };\n                  })\n                : [],\n        [enabled, rows, state.visibleRange.end, state.visibleRange.start]\n    );\n\n    const paddingTop = enabled ? getItemPosition(state.visibleRange.start) : 0;\n    const paddingBottom = enabled ? Math.max(0, getTotalHeight() - getItemPosition(state.visibleRange.end)) : 0;\n\n    return {\n        isVirtualized: enabled,\n        measureRow,\n        paddingBottom,\n        paddingTop,\n        virtualRows,\n    };\n};\n\nexport default useTableVirtualization;\n"],"names":["DEFAULT_ROW_HEIGHT","areVisibleRangesEqual","left","right","useTableVirtualization","options","enabled","overscan","rows","scrollContainer","state","setState","useState","getScrollElement","useCallback","getEstimatedRowHeight","measuredHeights","sum","height","getRowHeight","index","getItemPosition","position","currentIndex","getTotalHeight","totalHeight","calculateVisibleRange","scrollTop","viewportHeight","start","currentPosition","rowHeight","end","handleScroll","scrollElement","visibleRange","previousState","useEffect","resizeObserver","measureRow","element","rect","computedStyle","nextState","virtualRows","useMemo","row","offset","paddingTop","paddingBottom"],"mappings":"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"}

package/components/table/model/buildTableViewModel.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+import { TableColumnWithArea } from '../layout/useTableLayout';
+import { TableCellClassName, TableParsedFooter, TableParsedHeaderColumn, TableRowId, TableParsedRow, TableRowClassName, TableSortDirection } from '../Table.types';
+import { TableViewModel } from './tableViewModel.types';
+type BuildTableViewModelProps<RowType extends Record<string, unknown>> = {
+    columnsWithAreas: TableColumnWithArea<RowType>[];
+    resolvedHeaderColumns: TableParsedHeaderColumn<RowType>[];
+    resolvedRows: TableParsedRow<RowType>[];
+    resolvedFooter?: TableParsedFooter;
+    rowKey?: keyof RowType | ((row: RowType, rowIndex: number) => string | number);
+    rowClassName?: TableRowClassName<RowType>;
+    cellClassName?: TableCellClassName<RowType>;
+    activeRowId?: TableRowId;
+    noRowsState: ReactNode;
+    isClickable: boolean;
+    isTableView: boolean;
+    selectedRowIds?: TableRowId[];
+    sortBy?: string | string[];
+    sortDirection?: TableSortDirection;
+    cardClasses: {
+        rowClassName?: string;
+        cellClassName?: string;
+        labelClassName?: string;
+        contentClassName?: string;
+    };
+};
+export declare const buildTableViewModel: <RowType extends Record<string, unknown>>(props: BuildTableViewModelProps<RowType>) => TableViewModel<RowType>;
+export {};

package/components/table/model/buildTableViewModel.js

@@ -0,0 +1,221 @@
+import k from "../../../utils/classNames.js";
+import { getMobileLabel as m } from "./resolveCellContent.js";
+import { resolveRowKey as W, resolveRowClassName as j } from "./resolveRowMeta.js";
+const f = (g, s) => g.cellsByKey?.[s], P = (g) => {
+  const {
+    columnsWithAreas: s,
+    resolvedHeaderColumns: v,
+    resolvedRows: b,
+    resolvedFooter: d,
+    rowKey: O,
+    rowClassName: R,
+    cellClassName: N,
+    activeRowId: H,
+    noRowsState: u,
+    isClickable: B,
+    isTableView: L,
+    selectedRowIds: D,
+    sortBy: y,
+    sortDirection: S,
+    cardClasses: w
+  } = g, F = new Set(D), K = new Set(Array.isArray(y) ? y : y ? [y] : []), T = s.map(({ column: e, areaName: n }) => ({
+    key: e.key,
+    label: e.label,
+    mobileLabel: m(e),
+    horizontalAlign: e.horizontalAlign,
+    className: e.className,
+    headerClassName: e.headerClassName,
+    hideOnMobile: e.hideOnMobile,
+    sortable: e.sortable,
+    sortDirection: K.has(e.key) ? S : void 0,
+    areaName: n,
+    source: e
+  })), p = new Map(s.map(({ column: e }, n) => [e.key, n + 1])), A = (() => {
+    if (v.length === 0)
+      return;
+    const e = Math.max(...v.map((a) => a.row + a.rowSpan - 1)), n = Array.from({ length: e }, () => Array(s.length).fill(!1)), i = (a, r) => {
+      for (let t = 1; t <= s.length - r + 1; t += 1)
+        if (n[a - 1].slice(t - 1, t - 1 + r).every((o) => !o))
+          return t;
+      return 1;
+    }, l = v.map((a) => {
+      const r = a.columnKey ? p.get(a.columnKey) ?? 1 : i(a.row, a.colSpan);
+      for (let t = a.row - 1; t < a.row - 1 + a.rowSpan; t += 1)
+        for (let c = r - 1; c < r - 1 + a.colSpan; c += 1)
+          n[t]?.[c] !== void 0 && (n[t][c] = !0);
+      return {
+        key: a.key,
+        columnKey: a.columnKey,
+        label: a.label,
+        icon: a.icon,
+        filter: a.filter,
+        hideLabel: a.hideLabel,
+        horizontalAlign: a.horizontalAlign,
+        verticalAlign: a.verticalAlign,
+        className: a.className,
+        headerClassName: a.headerClassName,
+        hideOnMobile: a.hideOnMobile,
+        draggable: a.draggable,
+        resizeable: a.resizeable,
+        sortable: a.sortable,
+        sortDirection: a.columnKey && K.has(a.columnKey) ? S : void 0,
+        rowStart: a.row,
+        rowSpan: a.rowSpan,
+        columnStart: r,
+        colSpan: a.colSpan,
+        source: a.columnKey ? s.find(({ column: t }) => t.key === a.columnKey)?.column : void 0
+      };
+    });
+    return {
+      rowCount: e,
+      totalColumnCount: s.length,
+      columns: l
+    };
+  })(), V = new Map(
+    A?.columns.filter((e) => !!e.columnKey).map((e) => [
+      e.columnKey,
+      {
+        horizontalAlign: e.horizontalAlign,
+        verticalAlign: e.verticalAlign
+      }
+    ]) ?? []
+  ), h = (e) => e ? V.get(e) : void 0, E = (e, n) => {
+    const i = W(e.data, n, O), l = e.cellsByKey && (() => {
+      const a = [];
+      let r = -1;
+      return s.forEach(({ column: t, columnIndex: c }) => {
+        if (c <= r)
+          return;
+        const o = f(e, t.key), C = h(t.key), M = o?.colSpan ?? 1;
+        o && (r = c + M - 1), a.push({
+          key: String(o?.key ?? t.key),
+          mobileLabel: m(t),
+          content: o?.content ?? "",
+          horizontalAlign: o?.horizontalAlign ?? C?.horizontalAlign ?? t.horizontalAlign,
+          verticalAlign: o?.verticalAlign ?? C?.verticalAlign,
+          className: k(t.className, o?.className),
+          contentClassName: o?.contentClassName,
+          resolvedClassName: N?.(e.data, t, n, c),
+          hideOnMobile: t.hideOnMobile,
+          columnStart: c + 1,
+          colSpan: M,
+          preventRowClick: o?.preventRowClick
+        });
+      }), a;
+    })();
+    return {
+      kind: e.kind,
+      key: i,
+      parentKey: e.kind === "expanded" ? e.parentKey : void 0,
+      rowIndex: n,
+      data: e.data,
+      active: i === H,
+      disabled: e.disabled,
+      className: e.className,
+      noHover: e.noHover,
+      resolvedClassName: j(R, e.data, n),
+      selected: F.has(i),
+      cells: l && l.length > 0 ? l : s.map(({ column: a, columnIndex: r }) => {
+        const t = h(a.key);
+        return {
+          key: a.key,
+          mobileLabel: m(a),
+          content: "",
+          horizontalAlign: t?.horizontalAlign ?? a.horizontalAlign,
+          verticalAlign: t?.verticalAlign,
+          className: a.className,
+          contentClassName: void 0,
+          resolvedClassName: N?.(e.data, a, n, r),
+          hideOnMobile: a.hideOnMobile,
+          columnStart: r + 1,
+          colSpan: 1,
+          preventRowClick: !1
+        };
+      })
+    };
+  }, U = b.length > 0 ? b.map((e, n) => {
+    switch (e.kind) {
+      case "spacer":
+        return e;
+      case "group":
+        return {
+          kind: "group",
+          key: e.key,
+          content: e.content,
+          sticky: e.sticky,
+          className: e.className,
+          noHover: e.noHover
+        };
+      case "group-footer":
+        return {
+          kind: "group-footer",
+          key: e.key,
+          content: e.content,
+          className: e.className,
+          noHover: e.noHover
+        };
+      case "expanded-full-width":
+        return {
+          kind: "expanded-full-width",
+          key: e.key,
+          parentKey: e.parentKey,
+          content: e.content,
+          className: e.className,
+          noHover: e.noHover
+        };
+      default:
+        return E(e, n);
+    }
+  }) : [
+    {
+      kind: "empty",
+      key: "empty",
+      content: u
+    }
+  ], z = d ? {
+    className: d.className,
+    content: d.content,
+    cells: d.cells ? d.cells.map((e, n) => {
+      const i = e.columnKey ? (p.get(e.columnKey) ?? n + 1) - 1 : n, l = s[i]?.column, a = h(e.columnKey ?? l?.key);
+      return {
+        key: String(e.key ?? l?.key ?? n),
+        content: e.content,
+        horizontalAlign: e.horizontalAlign ?? a?.horizontalAlign ?? l?.horizontalAlign,
+        verticalAlign: e.verticalAlign ?? a?.verticalAlign,
+        className: k(l?.className, e.className),
+        hideOnMobile: l?.hideOnMobile,
+        columnStart: e.columnKey ? p.get(e.columnKey) ?? n + 1 : n + 1,
+        colSpan: e.colSpan
+      };
+    }) : d.cellsByIndex || d.cellsByKey ? s.map(({ column: e, columnIndex: n }) => {
+      const i = f(d, e.key), l = h(e.key);
+      return {
+        key: e.key,
+        content: i?.content ?? "",
+        horizontalAlign: i?.horizontalAlign ?? l?.horizontalAlign ?? e.horizontalAlign,
+        verticalAlign: i?.verticalAlign ?? l?.verticalAlign,
+        className: k(e.className, i?.className),
+        hideOnMobile: e.hideOnMobile,
+        columnStart: n + 1,
+        colSpan: 1
+      };
+    }) : void 0
+  } : void 0;
+  return {
+    columns: T,
+    header: A,
+    rows: U,
+    footer: z,
+    flags: {
+      hasHeader: !!A,
+      hasFooter: !!z,
+      isClickable: B,
+      isTableView: L
+    },
+    cardClasses: w
+  };
+};
+export {
+  P as buildTableViewModel
+};
+//# sourceMappingURL=buildTableViewModel.js.map

package/components/table/model/buildTableViewModel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buildTableViewModel.js","sources":["../../../../src/components/table/model/buildTableViewModel.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport classNames from '../../../utils/classNames';\nimport type { TableColumnWithArea } from '../layout/useTableLayout';\nimport { getMobileLabel } from './resolveCellContent';\nimport { resolveRowClassName, resolveRowKey } from './resolveRowMeta';\nimport type {\n    TableCellClassName,\n    TableParsedDataRow,\n    TableParsedExpandedDataRow,\n    TableParsedCells,\n    TableParsedFooter,\n    TableParsedHeaderColumn,\n    TableRowId,\n    TableParsedRow,\n    TableRowClassName,\n    TableSortDirection,\n} from '../Table.types';\nimport type {\n    TableDataViewRow,\n    TableExpandedContentViewRow,\n    TableExpandedDataViewRow,\n    TableGroupFooterViewRow,\n    TableGroupViewRow,\n    TableViewHeader,\n    TableViewHeaderColumn,\n    TableViewCell,\n    TableViewFooter,\n    TableViewFooterCell,\n    TableViewModel,\n    TableViewRow,\n} from './tableViewModel.types';\n\nconst resolveDeclarativeCell = (resolvedCells: TableParsedCells, columnKey: string) =>\n    resolvedCells.cellsByKey?.[columnKey];\n\ntype BuildTableViewModelProps<RowType extends Record<string, unknown>> = {\n    columnsWithAreas: TableColumnWithArea<RowType>[];\n    resolvedHeaderColumns: TableParsedHeaderColumn<RowType>[];\n    resolvedRows: TableParsedRow<RowType>[];\n    resolvedFooter?: TableParsedFooter;\n    rowKey?: keyof RowType | ((row: RowType, rowIndex: number) => string | number);\n    rowClassName?: TableRowClassName<RowType>;\n    cellClassName?: TableCellClassName<RowType>;\n    activeRowId?: TableRowId;\n    noRowsState: ReactNode;\n    isClickable: boolean;\n    isTableView: boolean;\n    selectedRowIds?: TableRowId[];\n    sortBy?: string | string[];\n    sortDirection?: TableSortDirection;\n    cardClasses: {\n        rowClassName?: string;\n        cellClassName?: string;\n        labelClassName?: string;\n        contentClassName?: string;\n    };\n};\n\nexport const buildTableViewModel = <RowType extends Record<string, unknown>>(\n    props: BuildTableViewModelProps<RowType>\n): TableViewModel<RowType> => {\n    const {\n        columnsWithAreas,\n        resolvedHeaderColumns,\n        resolvedRows,\n        resolvedFooter,\n        rowKey,\n        rowClassName,\n        cellClassName,\n        activeRowId,\n        noRowsState,\n        isClickable,\n        isTableView,\n        selectedRowIds,\n        sortBy,\n        sortDirection,\n        cardClasses,\n    } = props;\n\n    const selectedRowIdSet = new Set(selectedRowIds);\n    const sortedColumnKeys = new Set(Array.isArray(sortBy) ? sortBy : sortBy ? [sortBy] : []);\n\n    const columns = columnsWithAreas.map(({ column, areaName }) => ({\n        key: column.key,\n        label: column.label,\n        mobileLabel: getMobileLabel(column),\n        horizontalAlign: column.horizontalAlign,\n        className: column.className,\n        headerClassName: column.headerClassName,\n        hideOnMobile: column.hideOnMobile,\n        sortable: column.sortable,\n        sortDirection: sortedColumnKeys.has(column.key) ? sortDirection : undefined,\n        areaName,\n        source: column,\n    }));\n\n    const columnStartByKey = new Map(columnsWithAreas.map(({ column }, index) => [column.key, index + 1]));\n\n    const header = (() => {\n        if (resolvedHeaderColumns.length === 0) {\n            return;\n        }\n\n        const rowCount = Math.max(...resolvedHeaderColumns.map(column => column.row + column.rowSpan - 1));\n        const occupied = Array.from({ length: rowCount }, () => Array(columnsWithAreas.length).fill(false));\n\n        const findColumnStart = (rowStart: number, colSpan: number) => {\n            for (let candidate = 1; candidate <= columnsWithAreas.length - colSpan + 1; candidate += 1) {\n                const hasFreeSlot = occupied[rowStart - 1]\n                    .slice(candidate - 1, candidate - 1 + colSpan)\n                    .every(isUsed => !isUsed);\n\n                if (hasFreeSlot) {\n                    return candidate;\n                }\n            }\n\n            return 1;\n        };\n\n        const columns = resolvedHeaderColumns.map<TableViewHeaderColumn<RowType>>(column => {\n            const columnStart = column.columnKey\n                ? (columnStartByKey.get(column.columnKey) ?? 1)\n                : findColumnStart(column.row, column.colSpan);\n\n            for (let rowIndex = column.row - 1; rowIndex < column.row - 1 + column.rowSpan; rowIndex += 1) {\n                for (\n                    let columnIndex = columnStart - 1;\n                    columnIndex < columnStart - 1 + column.colSpan;\n                    columnIndex += 1\n                ) {\n                    if (occupied[rowIndex]?.[columnIndex] !== undefined) {\n                        occupied[rowIndex][columnIndex] = true;\n                    }\n                }\n            }\n\n            return {\n                key: column.key,\n                columnKey: column.columnKey,\n                label: column.label,\n                icon: column.icon,\n                filter: column.filter,\n                hideLabel: column.hideLabel,\n                horizontalAlign: column.horizontalAlign,\n                verticalAlign: column.verticalAlign,\n                className: column.className,\n                headerClassName: column.headerClassName,\n                hideOnMobile: column.hideOnMobile,\n                draggable: column.draggable,\n                resizeable: column.resizeable,\n                sortable: column.sortable,\n                sortDirection: column.columnKey && sortedColumnKeys.has(column.columnKey) ? sortDirection : undefined,\n                rowStart: column.row,\n                rowSpan: column.rowSpan,\n                columnStart,\n                colSpan: column.colSpan,\n                source: column.columnKey\n                    ? columnsWithAreas.find(({ column: sourceColumn }) => sourceColumn.key === column.columnKey)?.column\n                    : undefined,\n            };\n        });\n\n        return {\n            rowCount,\n            totalColumnCount: columnsWithAreas.length,\n            columns,\n        } satisfies TableViewHeader<RowType>;\n    })();\n\n    const headerAlignmentByColumnKey = new Map(\n        header?.columns\n            .filter((column): column is TableViewHeaderColumn<RowType> & { columnKey: string } => !!column.columnKey)\n            .map(column => [\n                column.columnKey,\n                {\n                    horizontalAlign: column.horizontalAlign,\n                    verticalAlign: column.verticalAlign,\n                },\n            ]) ?? []\n    );\n\n    const resolveHeaderAlignment = (columnKey?: string) =>\n        columnKey ? headerAlignmentByColumnKey.get(columnKey) : undefined;\n\n    const createDataRow = (\n        row: TableParsedDataRow<RowType> | TableParsedExpandedDataRow<RowType>,\n        rowIndex: number\n    ): TableDataViewRow<RowType> | TableExpandedDataViewRow<RowType> => {\n        const resolvedRowId = resolveRowKey(row.data, rowIndex, rowKey);\n        const declarativeCells =\n            row.cellsByKey &&\n            (() => {\n                const nextCells: TableViewCell[] = [];\n                let coveredUntilColumnIndex = -1;\n\n                columnsWithAreas.forEach(({ column, columnIndex }) => {\n                    if (columnIndex <= coveredUntilColumnIndex) {\n                        return;\n                    }\n\n                    const declarativeCell = resolveDeclarativeCell(row, column.key);\n                    const headerAlignment = resolveHeaderAlignment(column.key);\n                    const colSpan = declarativeCell?.colSpan ?? 1;\n\n                    if (declarativeCell) {\n                        coveredUntilColumnIndex = columnIndex + colSpan - 1;\n                    }\n\n                    nextCells.push({\n                        key: String(declarativeCell?.key ?? column.key),\n                        mobileLabel: getMobileLabel(column),\n                        content: declarativeCell?.content ?? '',\n                        horizontalAlign:\n                            declarativeCell?.horizontalAlign ??\n                            headerAlignment?.horizontalAlign ??\n                            column.horizontalAlign,\n                        verticalAlign: declarativeCell?.verticalAlign ?? headerAlignment?.verticalAlign,\n                        className: classNames(column.className, declarativeCell?.className),\n                        contentClassName: declarativeCell?.contentClassName,\n                        resolvedClassName: cellClassName?.(row.data, column, rowIndex, columnIndex),\n                        hideOnMobile: column.hideOnMobile,\n                        columnStart: columnIndex + 1,\n                        colSpan,\n                        preventRowClick: declarativeCell?.preventRowClick,\n                    });\n                });\n\n                return nextCells;\n            })();\n\n        return {\n            kind: row.kind,\n            key: resolvedRowId,\n            parentKey: row.kind === 'expanded' ? row.parentKey : undefined,\n            rowIndex,\n            data: row.data,\n            active: resolvedRowId === activeRowId,\n            disabled: row.disabled,\n            className: row.className,\n            noHover: row.noHover,\n            resolvedClassName: resolveRowClassName(rowClassName, row.data, rowIndex),\n            selected: selectedRowIdSet.has(resolvedRowId),\n            cells:\n                declarativeCells && declarativeCells.length > 0\n                    ? declarativeCells\n                    : columnsWithAreas.map(({ column, columnIndex }) => {\n                          const headerAlignment = resolveHeaderAlignment(column.key);\n\n                          return {\n                              key: column.key,\n                              mobileLabel: getMobileLabel(column),\n                              content: '',\n                              horizontalAlign: headerAlignment?.horizontalAlign ?? column.horizontalAlign,\n                              verticalAlign: headerAlignment?.verticalAlign,\n                              className: column.className,\n                              contentClassName: undefined,\n                              resolvedClassName: cellClassName?.(row.data, column, rowIndex, columnIndex),\n                              hideOnMobile: column.hideOnMobile,\n                              columnStart: columnIndex + 1,\n                              colSpan: 1,\n                              preventRowClick: false,\n                          };\n                      }),\n        };\n    };\n\n    const rows: TableViewRow<RowType>[] =\n        resolvedRows.length > 0\n            ? resolvedRows.map((row, rowIndex) => {\n                  switch (row.kind) {\n                      case 'spacer':\n                          return row;\n                      case 'group':\n                          return {\n                              kind: 'group',\n                              key: row.key,\n                              content: row.content,\n                              sticky: row.sticky,\n                              className: row.className,\n                              noHover: row.noHover,\n                          } satisfies TableGroupViewRow;\n                      case 'group-footer':\n                          return {\n                              kind: 'group-footer',\n                              key: row.key,\n                              content: row.content,\n                              className: row.className,\n                              noHover: row.noHover,\n                          } satisfies TableGroupFooterViewRow;\n                      case 'expanded-full-width':\n                          return {\n                              kind: 'expanded-full-width',\n                              key: row.key,\n                              parentKey: row.parentKey,\n                              content: row.content,\n                              className: row.className,\n                              noHover: row.noHover,\n                          } satisfies TableExpandedContentViewRow<RowType>;\n                      default:\n                          return createDataRow(row, rowIndex);\n                  }\n              })\n            : [\n                  {\n                      kind: 'empty',\n                      key: 'empty',\n                      content: noRowsState,\n                  },\n              ];\n\n    const footer: TableViewFooter | undefined = resolvedFooter\n        ? {\n              className: resolvedFooter.className,\n              content: resolvedFooter.content,\n              cells: resolvedFooter.cells\n                  ? resolvedFooter.cells.map((footerCell, footerCellIndex) => {\n                        const baseColumnIndex = footerCell.columnKey\n                            ? (columnStartByKey.get(footerCell.columnKey) ?? footerCellIndex + 1) - 1\n                            : footerCellIndex;\n                        const sourceColumn = columnsWithAreas[baseColumnIndex]?.column;\n                        const headerAlignment = resolveHeaderAlignment(footerCell.columnKey ?? sourceColumn?.key);\n\n                        return {\n                            key: String(footerCell.key ?? sourceColumn?.key ?? footerCellIndex),\n                            content: footerCell.content,\n                            horizontalAlign:\n                                footerCell.horizontalAlign ??\n                                headerAlignment?.horizontalAlign ??\n                                sourceColumn?.horizontalAlign,\n                            verticalAlign: footerCell.verticalAlign ?? headerAlignment?.verticalAlign,\n                            className: classNames(sourceColumn?.className, footerCell.className),\n                            hideOnMobile: sourceColumn?.hideOnMobile,\n                            columnStart: footerCell.columnKey\n                                ? (columnStartByKey.get(footerCell.columnKey) ?? footerCellIndex + 1)\n                                : footerCellIndex + 1,\n                            colSpan: footerCell.colSpan,\n                        } satisfies TableViewFooterCell;\n                    })\n                  : resolvedFooter.cellsByIndex || resolvedFooter.cellsByKey\n                    ? columnsWithAreas.map(({ column, columnIndex }) => {\n                          const footerCell = resolveDeclarativeCell(resolvedFooter, column.key);\n                          const headerAlignment = resolveHeaderAlignment(column.key);\n\n                          return {\n                              key: column.key,\n                              content: footerCell?.content ?? '',\n                              horizontalAlign:\n                                  footerCell?.horizontalAlign ??\n                                  headerAlignment?.horizontalAlign ??\n                                  column.horizontalAlign,\n                              verticalAlign: footerCell?.verticalAlign ?? headerAlignment?.verticalAlign,\n                              className: classNames(column.className, footerCell?.className),\n                              hideOnMobile: column.hideOnMobile,\n                              columnStart: columnIndex + 1,\n                              colSpan: 1,\n                          } satisfies TableViewFooterCell;\n                      })\n                    : undefined,\n          }\n        : undefined;\n\n    return {\n        columns,\n        header,\n        rows,\n        footer,\n        flags: {\n            hasHeader: !!header,\n            hasFooter: !!footer,\n            isClickable,\n            isTableView,\n        },\n        cardClasses,\n    };\n};\n"],"names":["resolveDeclarativeCell","resolvedCells","columnKey","buildTableViewModel","props","columnsWithAreas","resolvedHeaderColumns","resolvedRows","resolvedFooter","rowKey","rowClassName","cellClassName","activeRowId","noRowsState","isClickable","isTableView","selectedRowIds","sortBy","sortDirection","cardClasses","selectedRowIdSet","sortedColumnKeys","columns","column","areaName","getMobileLabel","columnStartByKey","index","header","rowCount","occupied","findColumnStart","rowStart","colSpan","candidate","isUsed","columnStart","rowIndex","columnIndex","sourceColumn","headerAlignmentByColumnKey","resolveHeaderAlignment","createDataRow","row","resolvedRowId","resolveRowKey","declarativeCells","nextCells","coveredUntilColumnIndex","declarativeCell","headerAlignment","classNames","resolveRowClassName","rows","footer","footerCell","footerCellIndex","baseColumnIndex"],"mappings":"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"}

package/components/table/model/resolveCellContent.d.ts

@@ -0,0 +1,2 @@
+import { TableColumnDefinition } from '../Table.types';
+export declare const getMobileLabel: <RowType extends Record<string, unknown>>(column: TableColumnDefinition<RowType>) => string;

package/components/table/model/resolveCellContent.js

@@ -0,0 +1,5 @@
+const b = (e) => e.mobileLabel !== void 0 ? e.mobileLabel : typeof e.label == "string" ? e.label : "";
+export {
+  b as getMobileLabel
+};
+//# sourceMappingURL=resolveCellContent.js.map

package/components/table/model/resolveCellContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveCellContent.js","sources":["../../../../src/components/table/model/resolveCellContent.ts"],"sourcesContent":["import type { TableColumnDefinition } from '../Table.types';\n\nexport const getMobileLabel = <RowType extends Record<string, unknown>>(column: TableColumnDefinition<RowType>) => {\n    if (column.mobileLabel !== undefined) {\n        return column.mobileLabel;\n    }\n\n    return typeof column.label === 'string' ? column.label : '';\n};\n"],"names":["getMobileLabel","column"],"mappings":"AAEO,MAAMA,IAAiB,CAA0CC,MAChEA,EAAO,gBAAgB,SAChBA,EAAO,cAGX,OAAOA,EAAO,SAAU,WAAWA,EAAO,QAAQ;"}

package/components/table/model/resolveRowMeta.d.ts

@@ -0,0 +1,2 @@
+export declare const resolveRowClassName: <RowType extends Record<string, unknown>>(rowClassName: string | ((row: RowType, rowIndex: number) => string) | undefined, row: RowType, rowIndex: number) => string | undefined;
+export declare const resolveRowKey: <RowType extends Record<string, unknown>>(row: RowType, rowIndex: number, rowKey: keyof RowType | ((row: RowType, rowIndex: number) => string | number) | undefined) => string | number;

package/components/table/model/resolveRowMeta.js

@@ -0,0 +1,15 @@
+const r = (t, e, n) => typeof t == "function" ? t(e, n) : t, u = (t, e, n) => {
+  if (typeof n == "function")
+    return n(t, e);
+  if (n) {
+    const f = t[n];
+    if (typeof f == "string" || typeof f == "number")
+      return f;
+  }
+  return e;
+};
+export {
+  r as resolveRowClassName,
+  u as resolveRowKey
+};
+//# sourceMappingURL=resolveRowMeta.js.map

package/components/table/model/resolveRowMeta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveRowMeta.js","sources":["../../../../src/components/table/model/resolveRowMeta.ts"],"sourcesContent":["export const resolveRowClassName = <RowType extends Record<string, unknown>>(\n    rowClassName: string | ((row: RowType, rowIndex: number) => string) | undefined,\n    row: RowType,\n    rowIndex: number\n) => {\n    if (typeof rowClassName === 'function') {\n        return rowClassName(row, rowIndex);\n    }\n\n    return rowClassName;\n};\n\nexport const resolveRowKey = <RowType extends Record<string, unknown>>(\n    row: RowType,\n    rowIndex: number,\n    rowKey: keyof RowType | ((row: RowType, rowIndex: number) => string | number) | undefined\n) => {\n    if (typeof rowKey === 'function') {\n        return rowKey(row, rowIndex);\n    }\n\n    if (rowKey) {\n        const rowValue = row[rowKey];\n        if (typeof rowValue === 'string' || typeof rowValue === 'number') {\n            return rowValue;\n        }\n    }\n\n    return rowIndex;\n};\n"],"names":["resolveRowClassName","rowClassName","row","rowIndex","resolveRowKey","rowKey","rowValue"],"mappings":"AAAO,MAAMA,IAAsB,CAC/BC,GACAC,GACAC,MAEI,OAAOF,KAAiB,aACjBA,EAAaC,GAAKC,CAAQ,IAG9BF,GAGEG,IAAgB,CACzBF,GACAC,GACAE,MACC;AACD,MAAI,OAAOA,KAAW;AAClB,WAAOA,EAAOH,GAAKC,CAAQ;AAG/B,MAAIE,GAAQ;AACR,UAAMC,IAAWJ,EAAIG,CAAM;AAC3B,QAAI,OAAOC,KAAa,YAAY,OAAOA,KAAa;AACpD,aAAOA;AAAA,EAEf;AAEA,SAAOH;AACX;"}