@rio-cloud/rio-uikit 2.3.0-beta.2 → 2.3.0

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

@@ -1 +1 @@
-{"version":3,"file":"useTableVirtualization.js","sources":["../../../../src/components/table/layout/useTableVirtualization.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react';\n\ntype TableVirtualScrollContainer = {\n    view?: HTMLDivElement | null;\n};\n\ntype TableVirtualRow<RowType> = {\n    index: number;\n    row: RowType;\n};\n\ntype UseTableVirtualizationOptions<RowType> = {\n    enabled: boolean;\n    overscan: number;\n    rows: RowType[];\n    scrollContainer: TableVirtualScrollContainer | null;\n    viewportHeightFallback?: number;\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    currentRange: TableVirtualizationState['visibleRange'],\n    nextRange: TableVirtualizationState['visibleRange']\n) => currentRange.start === nextRange.start && currentRange.end === nextRange.end;\n\nconst useTableVirtualization = <RowType>(options: UseTableVirtualizationOptions<RowType>) => {\n    const { enabled, overscan, rows, scrollContainer, viewportHeightFallback } = 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 || viewportHeightFallback || 0;\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, viewportHeightFallback]);\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            if (height <= 0) {\n                return;\n            }\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","currentRange","nextRange","useTableVirtualization","options","enabled","overscan","rows","scrollContainer","viewportHeightFallback","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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"}
+{"version":3,"file":"useTableVirtualization.js","sources":["../../../../src/components/table/layout/useTableVirtualization.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport useResizeObserver from '../../../useResizeObserver';\n\ntype TableVirtualScrollContainer = {\n    view?: HTMLDivElement | null;\n};\n\ntype TableVirtualRow<RowType> = {\n    index: number;\n    row: RowType;\n};\n\ntype UseTableVirtualizationOptions<RowType> = {\n    enabled: boolean;\n    overscan: number;\n    rows: RowType[];\n    scrollContainer: TableVirtualScrollContainer | null;\n    viewportHeightFallback?: number;\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    currentRange: TableVirtualizationState['visibleRange'],\n    nextRange: TableVirtualizationState['visibleRange']\n) => currentRange.start === nextRange.start && currentRange.end === nextRange.end;\n\nconst useTableVirtualization = <RowType>(options: UseTableVirtualizationOptions<RowType>) => {\n    const { enabled, overscan, rows, scrollContainer, viewportHeightFallback } = options;\n    const scrollElement = scrollContainer?.view ?? null;\n    const [, , { blockSize: observedViewportHeight }] = useResizeObserver(scrollElement);\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(() => scrollElement, [scrollElement]);\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 || observedViewportHeight || viewportHeightFallback || 0;\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, observedViewportHeight, viewportHeightFallback]);\n\n    useEffect(() => {\n        if (!enabled) {\n            return;\n        }\n\n        if (!scrollElement) {\n            return;\n        }\n\n        handleScroll();\n        scrollElement.addEventListener('scroll', handleScroll, { passive: true });\n\n        return () => {\n            scrollElement.removeEventListener('scroll', handleScroll);\n        };\n    }, [enabled, handleScroll, scrollElement]);\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            if (height <= 0) {\n                return;\n            }\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","currentRange","nextRange","useTableVirtualization","options","enabled","overscan","rows","scrollContainer","viewportHeightFallback","scrollElement","observedViewportHeight","useResizeObserver","state","setState","useState","getScrollElement","useCallback","getEstimatedRowHeight","measuredHeights","sum","height","getRowHeight","index","getItemPosition","position","currentIndex","getTotalHeight","totalHeight","calculateVisibleRange","scrollTop","viewportHeight","start","currentPosition","rowHeight","end","handleScroll","visibleRange","previousState","useEffect","measureRow","element","rect","computedStyle","nextState","virtualRows","useMemo","row","offset","paddingTop","paddingBottom"],"mappings":"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"}

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

@@ -0,0 +1,2 @@
+import { TableResponsiveBreakpoint, TableViewType } from '../Table.types';
+export declare const resolveResponsiveViewType: (viewType: TableViewType, wrapperWidth: number | undefined, responsiveBreakpoint: TableResponsiveBreakpoint | undefined) => TableViewType;

package/components/table/model/resolveResponsiveViewType.js

@@ -0,0 +1,27 @@
+import s from "../shared/parsePixelSize.js";
+const r = (i) => {
+  if (typeof i == "number")
+    return Number.isFinite(i) ? i : void 0;
+  const t = i.trim();
+  if (!t || typeof window > "u" || typeof document > "u")
+    return;
+  const o = s(t);
+  if (o !== void 0)
+    return o;
+  const e = document.createElement("div");
+  e.style.position = "absolute", e.style.visibility = "hidden", e.style.pointerEvents = "none", e.style.boxSizing = "border-box", e.style.width = t, e.style.height = "0", e.style.padding = "0", e.style.border = "0", document.body.appendChild(e);
+  const n = e.getBoundingClientRect().width;
+  return e.remove(), Number.isFinite(n) ? n : void 0;
+}, d = (i) => i ? {
+  multiCardsMaxWidth: i.cards !== void 0 ? r(i.cards) : void 0,
+  singleCardMaxWidth: i.list !== void 0 ? r(i.list) : void 0
+} : {}, m = (i, t, o) => {
+  if (t === void 0)
+    return i;
+  const { multiCardsMaxWidth: e, singleCardMaxWidth: n } = d(o);
+  return n !== void 0 && t < n ? "SINGLE_CARD" : e !== void 0 && t < e ? "MULTI_CARDS" : i;
+};
+export {
+  m as resolveResponsiveViewType
+};
+//# sourceMappingURL=resolveResponsiveViewType.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"resolveResponsiveViewType.js","sources":["../../../../src/components/table/model/resolveResponsiveViewType.ts"],"sourcesContent":["import type { TableResponsiveBreakpoint, TableViewType } from '../Table.types';\nimport parsePixelSize from '../shared/parsePixelSize';\n\nconst resolveResponsiveBreakpointPx = (value: number | string): number | undefined => {\n    if (typeof value === 'number') {\n        return Number.isFinite(value) ? value : undefined;\n    }\n\n    const trimmedValue = value.trim();\n\n    if (!trimmedValue) {\n        return;\n    }\n\n    if (typeof window === 'undefined' || typeof document === 'undefined') {\n        return;\n    }\n    const pixelSize = parsePixelSize(trimmedValue);\n\n    if (pixelSize !== undefined) {\n        return pixelSize;\n    }\n\n    const measurementElement = document.createElement('div');\n    measurementElement.style.position = 'absolute';\n    measurementElement.style.visibility = 'hidden';\n    measurementElement.style.pointerEvents = 'none';\n    measurementElement.style.boxSizing = 'border-box';\n    measurementElement.style.width = trimmedValue;\n    measurementElement.style.height = '0';\n    measurementElement.style.padding = '0';\n    measurementElement.style.border = '0';\n    document.body.appendChild(measurementElement);\n\n    const resolvedWidth = measurementElement.getBoundingClientRect().width;\n\n    measurementElement.remove();\n\n    return Number.isFinite(resolvedWidth) ? resolvedWidth : undefined;\n};\n\nconst resolveResponsiveBreakpointsPx = (value: TableResponsiveBreakpoint | undefined) => {\n    if (!value) {\n        return {};\n    }\n\n    return {\n        multiCardsMaxWidth: value.cards !== undefined ? resolveResponsiveBreakpointPx(value.cards) : undefined,\n        singleCardMaxWidth: value.list !== undefined ? resolveResponsiveBreakpointPx(value.list) : undefined,\n    };\n};\n\nexport const resolveResponsiveViewType = (\n    viewType: TableViewType,\n    wrapperWidth: number | undefined,\n    responsiveBreakpoint: TableResponsiveBreakpoint | undefined\n): TableViewType => {\n    if (viewType !== 'TABLE' || wrapperWidth === undefined) {\n        return viewType;\n    }\n\n    const { multiCardsMaxWidth, singleCardMaxWidth } = resolveResponsiveBreakpointsPx(responsiveBreakpoint);\n\n    if (singleCardMaxWidth !== undefined && wrapperWidth < singleCardMaxWidth) {\n        return 'SINGLE_CARD';\n    }\n\n    if (multiCardsMaxWidth !== undefined && wrapperWidth < multiCardsMaxWidth) {\n        return 'MULTI_CARDS';\n    }\n\n    return viewType;\n};\n"],"names":["resolveResponsiveBreakpointPx","value","trimmedValue","pixelSize","parsePixelSize","measurementElement","resolvedWidth","resolveResponsiveBreakpointsPx","resolveResponsiveViewType","viewType","wrapperWidth","responsiveBreakpoint","multiCardsMaxWidth","singleCardMaxWidth"],"mappings":";AAGA,MAAMA,IAAgC,CAACC,MAA+C;AAClF,MAAI,OAAOA,KAAU;AACjB,WAAO,OAAO,SAASA,CAAK,IAAIA,IAAQ;AAG5C,QAAMC,IAAeD,EAAM,KAAA;AAM3B,MAJI,CAACC,KAID,OAAO,SAAW,OAAe,OAAO,WAAa;AACrD;AAEJ,QAAMC,IAAYC,EAAeF,CAAY;AAE7C,MAAIC,MAAc;AACd,WAAOA;AAGX,QAAME,IAAqB,SAAS,cAAc,KAAK;AACvD,EAAAA,EAAmB,MAAM,WAAW,YACpCA,EAAmB,MAAM,aAAa,UACtCA,EAAmB,MAAM,gBAAgB,QACzCA,EAAmB,MAAM,YAAY,cACrCA,EAAmB,MAAM,QAAQH,GACjCG,EAAmB,MAAM,SAAS,KAClCA,EAAmB,MAAM,UAAU,KACnCA,EAAmB,MAAM,SAAS,KAClC,SAAS,KAAK,YAAYA,CAAkB;AAE5C,QAAMC,IAAgBD,EAAmB,sBAAA,EAAwB;AAEjE,SAAAA,EAAmB,OAAA,GAEZ,OAAO,SAASC,CAAa,IAAIA,IAAgB;AAC5D,GAEMC,IAAiC,CAACN,MAC/BA,IAIE;AAAA,EACH,oBAAoBA,EAAM,UAAU,SAAYD,EAA8BC,EAAM,KAAK,IAAI;AAAA,EAC7F,oBAAoBA,EAAM,SAAS,SAAYD,EAA8BC,EAAM,IAAI,IAAI;AAAA,IALpF,CAAA,GASFO,IAA4B,CACrCC,GACAC,GACAC,MACgB;AAChB,MAA4BD,MAAiB;AACzC,WAAOD;AAGX,QAAM,EAAE,oBAAAG,GAAoB,oBAAAC,MAAuBN,EAA+BI,CAAoB;AAEtG,SAAIE,MAAuB,UAAaH,IAAeG,IAC5C,gBAGPD,MAAuB,UAAaF,IAAeE,IAC5C,gBAGJH;AACX;"}

package/components/table/render/header/TableDraggableHeaderCell.js

@@ -1,64 +1,66 @@
-import { jsxs as y, jsx as s } from "react/jsx-runtime";
+import { jsxs as R, jsx as m } from "react/jsx-runtime";
 import { useSortable as A } from "@dnd-kit/sortable";
-import h from "./TableHeaderCellContent.js";
+import k from "./TableHeaderCellContent.js";
 import H from "./TableHeaderCellResizeHandle.js";
-import { resolveAriaSort as R } from "./resolveAriaSort.js";
-import { resolveHeaderCellClassName as w } from "./resolveHeaderCellClassName.js";
-import { resolveHeaderCellStyle as k } from "./resolveHeaderCellStyle.js";
-import { resolveAriaSpan as n, resolveAriaColIndex as D } from "../../shared/resolveTableAria.js";
-const P = (r) => {
+import { resolveAriaSort as w } from "./resolveAriaSort.js";
+import { resolveHeaderCellClassName as D } from "./resolveHeaderCellClassName.js";
+import { resolveHeaderCellStyle as N } from "./resolveHeaderCellStyle.js";
+import { resolveAriaSpan as c, resolveAriaColIndex as L } from "../../shared/resolveTableAria.js";
+const _ = (t) => {
   const {
     column: e,
-    header: m,
-    hideWhileDragging: t,
-    htmlAttributes: c,
+    header: r,
+    hideWhileDragging: a,
+    htmlAttributes: u,
     isResizable: d,
-    showSelectionColumn: a,
-    stickyLeftColumnCount: u
-  } = r, l = u ?? 0, i = e.columnKey ?? String(e.key), { attributes: f, listeners: p, setActivatorNodeRef: g, setNodeRef: v, transform: o, transition: C, isDragging: b } = A({
-    id: i
-  }), { role: N, ...S } = f, x = {
-    ...S,
+    showSelectionColumn: l,
+    stickyLeftColumnCount: C,
+    stickyRightColumnCount: f
+  } = t, i = C ?? 0, n = f ?? 0, s = e.columnKey ?? String(e.key), { attributes: g, listeners: p, setActivatorNodeRef: S, setNodeRef: v, transform: o, transition: b, isDragging: y } = A({
+    id: s
+  }), { role: T, ...h } = g, x = {
+    ...h,
     ...p
   };
-  return /* @__PURE__ */ y(
+  return /* @__PURE__ */ R(
     "div",
     {
       ref: v,
-      ...c,
-      className: w(e, m, {
+      ...u,
+      className: D(e, r, {
         isDraggable: !0,
-        isDragging: b,
+        isDragging: y,
         isResizable: d,
-        isStickyLeftColumn: l > 0 && e.columnStart <= l
+        isStickyLeftColumn: i > 0 && e.columnStart <= i,
+        isStickyRightColumn: n > 0 && e.columnStart + e.colSpan - 1 > r.totalColumnCount - n
       }),
-      "data-column": i,
+      "data-column": s,
       role: "columnheader",
-      "aria-colindex": D(e.columnStart, a),
-      "aria-colspan": n(e.colSpan),
+      "aria-colindex": L(e.columnStart, l),
+      "aria-colspan": c(e.colSpan),
       "aria-rowindex": e.rowStart,
-      "aria-rowspan": n(e.rowSpan),
-      "aria-sort": R(e),
-      style: k(e, a, {
-        pointerEvents: t ? "none" : void 0,
-        transform: t ? void 0 : o ? `translate3d(${o.x}px, ${o.y}px, 0)` : void 0,
-        transition: C
+      "aria-rowspan": c(e.rowSpan),
+      "aria-sort": w(e),
+      style: N(e, l, {
+        pointerEvents: a ? "none" : void 0,
+        transform: a ? void 0 : o ? `translate3d(${o.x}px, ${o.y}px, 0)` : void 0,
+        transition: b
       }),
       children: [
-        /* @__PURE__ */ s(
-          h,
+        /* @__PURE__ */ m(
+          k,
           {
-            ...r,
+            ...t,
             dragActivatorProps: x,
-            dragActivatorRef: g
+            dragActivatorRef: S
           }
         ),
-        /* @__PURE__ */ s(H, { ...r })
+        /* @__PURE__ */ m(H, { ...t })
       ]
     }
   );
 };
 export {
-  P as default
+  _ as default
 };
 //# sourceMappingURL=TableDraggableHeaderCell.js.map

package/components/table/render/header/TableDraggableHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableDraggableHeaderCell.js","sources":["../../../../../src/components/table/render/header/TableDraggableHeaderCell.tsx"],"sourcesContent":["import { useSortable } from '@dnd-kit/sortable';\n\nimport type { TableRowData } from '../../Table.types';\nimport TableHeaderCellContent from './TableHeaderCellContent';\nimport TableHeaderCellResizeHandle from './TableHeaderCellResizeHandle';\nimport { resolveAriaSort } from './resolveAriaSort';\nimport { resolveHeaderCellClassName } from './resolveHeaderCellClassName';\nimport { resolveHeaderCellStyle } from './resolveHeaderCellStyle';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\nimport { resolveAriaColIndex, resolveAriaSpan } from '../../shared/resolveTableAria';\n\nconst TableDraggableHeaderCell = (props: SharedHeaderCellProps<TableRowData>) => {\n    const {\n        column,\n        header,\n        hideWhileDragging,\n        htmlAttributes,\n        isResizable,\n        showSelectionColumn,\n        stickyLeftColumnCount,\n    } = props;\n\n    const stickyLeftColumns = stickyLeftColumnCount ?? 0;\n\n    const columnKey = column.columnKey ?? String(column.key);\n\n    const { attributes, listeners, setActivatorNodeRef, setNodeRef, transform, transition, isDragging } = useSortable({\n        id: columnKey,\n    });\n\n    const { role: _sortableRole, ...sortableAttributes } = attributes;\n\n    const dragActivatorProps = {\n        ...sortableAttributes,\n        ...listeners,\n    };\n\n    return (\n        <div\n            ref={setNodeRef}\n            {...htmlAttributes}\n            className={resolveHeaderCellClassName(column, header, {\n                isDraggable: true,\n                isDragging,\n                isResizable,\n                isStickyLeftColumn: stickyLeftColumns > 0 && column.columnStart <= stickyLeftColumns,\n            })}\n            data-column={columnKey}\n            role='columnheader'\n            aria-colindex={resolveAriaColIndex(column.columnStart, showSelectionColumn)}\n            aria-colspan={resolveAriaSpan(column.colSpan)}\n            aria-rowindex={column.rowStart}\n            aria-rowspan={resolveAriaSpan(column.rowSpan)}\n            aria-sort={resolveAriaSort(column)}\n            style={resolveHeaderCellStyle(column, showSelectionColumn, {\n                pointerEvents: hideWhileDragging ? 'none' : undefined,\n                transform: hideWhileDragging\n                    ? undefined\n                    : transform\n                      ? `translate3d(${transform.x}px, ${transform.y}px, 0)`\n                      : undefined,\n                transition,\n            })}\n        >\n            <TableHeaderCellContent\n                {...props}\n                dragActivatorProps={dragActivatorProps}\n                dragActivatorRef={setActivatorNodeRef}\n            />\n            <TableHeaderCellResizeHandle {...props} />\n        </div>\n    );\n};\n\nexport default TableDraggableHeaderCell;\n"],"names":["TableDraggableHeaderCell","props","column","header","hideWhileDragging","htmlAttributes","isResizable","showSelectionColumn","stickyLeftColumnCount","stickyLeftColumns","columnKey","attributes","listeners","setActivatorNodeRef","setNodeRef","transform","transition","isDragging","useSortable","_sortableRole","sortableAttributes","dragActivatorProps","jsxs","resolveHeaderCellClassName","resolveAriaColIndex","resolveAriaSpan","resolveAriaSort","resolveHeaderCellStyle","jsx","TableHeaderCellContent","TableHeaderCellResizeHandle"],"mappings":";;;;;;;;AAWA,MAAMA,IAA2B,CAACC,MAA+C;AAC7E,QAAM;AAAA,IACF,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,uBAAAC;AAAA,EAAA,IACAP,GAEEQ,IAAoBD,KAAyB,GAE7CE,IAAYR,EAAO,aAAa,OAAOA,EAAO,GAAG,GAEjD,EAAE,YAAAS,GAAY,WAAAC,GAAW,qBAAAC,GAAqB,YAAAC,GAAY,WAAAC,GAAW,YAAAC,GAAY,YAAAC,EAAA,IAAeC,EAAY;AAAA,IAC9G,IAAIR;AAAA,EAAA,CACP,GAEK,EAAE,MAAMS,GAAe,GAAGC,MAAuBT,GAEjDU,IAAqB;AAAA,IACvB,GAAGD;AAAA,IACH,GAAGR;AAAA,EAAA;AAGP,SACI,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAKR;AAAA,MACJ,GAAGT;AAAA,MACJ,WAAWkB,EAA2BrB,GAAQC,GAAQ;AAAA,QAClD,aAAa;AAAA,QACb,YAAAc;AAAA,QACA,aAAAX;AAAA,QACA,oBAAoBG,IAAoB,KAAKP,EAAO,eAAeO;AAAA,MAAA,CACtE;AAAA,MACD,eAAaC;AAAA,MACb,MAAK;AAAA,MACL,iBAAec,EAAoBtB,EAAO,aAAaK,CAAmB;AAAA,MAC1E,gBAAckB,EAAgBvB,EAAO,OAAO;AAAA,MAC5C,iBAAeA,EAAO;AAAA,MACtB,gBAAcuB,EAAgBvB,EAAO,OAAO;AAAA,MAC5C,aAAWwB,EAAgBxB,CAAM;AAAA,MACjC,OAAOyB,EAAuBzB,GAAQK,GAAqB;AAAA,QACvD,eAAeH,IAAoB,SAAS;AAAA,QAC5C,WAAWA,IACL,SACAW,IACE,eAAeA,EAAU,CAAC,OAAOA,EAAU,CAAC,WAC5C;AAAA,QACR,YAAAC;AAAA,MAAA,CACH;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAY;AAAA,UAACC;AAAA,UAAA;AAAA,YACI,GAAG5B;AAAA,YACJ,oBAAAoB;AAAA,YACA,kBAAkBR;AAAA,UAAA;AAAA,QAAA;AAAA,QAEtB,gBAAAe,EAACE,GAAA,EAA6B,GAAG7B,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}
+{"version":3,"file":"TableDraggableHeaderCell.js","sources":["../../../../../src/components/table/render/header/TableDraggableHeaderCell.tsx"],"sourcesContent":["import { useSortable } from '@dnd-kit/sortable';\n\nimport type { TableRowData } from '../../Table.types';\nimport TableHeaderCellContent from './TableHeaderCellContent';\nimport TableHeaderCellResizeHandle from './TableHeaderCellResizeHandle';\nimport { resolveAriaSort } from './resolveAriaSort';\nimport { resolveHeaderCellClassName } from './resolveHeaderCellClassName';\nimport { resolveHeaderCellStyle } from './resolveHeaderCellStyle';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\nimport { resolveAriaColIndex, resolveAriaSpan } from '../../shared/resolveTableAria';\n\nconst TableDraggableHeaderCell = (props: SharedHeaderCellProps<TableRowData>) => {\n    const {\n        column,\n        header,\n        hideWhileDragging,\n        htmlAttributes,\n        isResizable,\n        showSelectionColumn,\n        stickyLeftColumnCount,\n        stickyRightColumnCount,\n    } = props;\n\n    const stickyLeftColumns = stickyLeftColumnCount ?? 0;\n    const stickyRightColumns = stickyRightColumnCount ?? 0;\n\n    const columnKey = column.columnKey ?? String(column.key);\n\n    const { attributes, listeners, setActivatorNodeRef, setNodeRef, transform, transition, isDragging } = useSortable({\n        id: columnKey,\n    });\n\n    const { role: _sortableRole, ...sortableAttributes } = attributes;\n\n    const dragActivatorProps = {\n        ...sortableAttributes,\n        ...listeners,\n    };\n\n    return (\n        <div\n            ref={setNodeRef}\n            {...htmlAttributes}\n            className={resolveHeaderCellClassName(column, header, {\n                isDraggable: true,\n                isDragging,\n                isResizable,\n                isStickyLeftColumn: stickyLeftColumns > 0 && column.columnStart <= stickyLeftColumns,\n                isStickyRightColumn:\n                    stickyRightColumns > 0 &&\n                    column.columnStart + column.colSpan - 1 > header.totalColumnCount - stickyRightColumns,\n            })}\n            data-column={columnKey}\n            role='columnheader'\n            aria-colindex={resolveAriaColIndex(column.columnStart, showSelectionColumn)}\n            aria-colspan={resolveAriaSpan(column.colSpan)}\n            aria-rowindex={column.rowStart}\n            aria-rowspan={resolveAriaSpan(column.rowSpan)}\n            aria-sort={resolveAriaSort(column)}\n            style={resolveHeaderCellStyle(column, showSelectionColumn, {\n                pointerEvents: hideWhileDragging ? 'none' : undefined,\n                transform: hideWhileDragging\n                    ? undefined\n                    : transform\n                      ? `translate3d(${transform.x}px, ${transform.y}px, 0)`\n                      : undefined,\n                transition,\n            })}\n        >\n            <TableHeaderCellContent\n                {...props}\n                dragActivatorProps={dragActivatorProps}\n                dragActivatorRef={setActivatorNodeRef}\n            />\n            <TableHeaderCellResizeHandle {...props} />\n        </div>\n    );\n};\n\nexport default TableDraggableHeaderCell;\n"],"names":["TableDraggableHeaderCell","props","column","header","hideWhileDragging","htmlAttributes","isResizable","showSelectionColumn","stickyLeftColumnCount","stickyRightColumnCount","stickyLeftColumns","stickyRightColumns","columnKey","attributes","listeners","setActivatorNodeRef","setNodeRef","transform","transition","isDragging","useSortable","_sortableRole","sortableAttributes","dragActivatorProps","jsxs","resolveHeaderCellClassName","resolveAriaColIndex","resolveAriaSpan","resolveAriaSort","resolveHeaderCellStyle","jsx","TableHeaderCellContent","TableHeaderCellResizeHandle"],"mappings":";;;;;;;;AAWA,MAAMA,IAA2B,CAACC,MAA+C;AAC7E,QAAM;AAAA,IACF,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,wBAAAC;AAAA,EAAA,IACAR,GAEES,IAAoBF,KAAyB,GAC7CG,IAAqBF,KAA0B,GAE/CG,IAAYV,EAAO,aAAa,OAAOA,EAAO,GAAG,GAEjD,EAAE,YAAAW,GAAY,WAAAC,GAAW,qBAAAC,GAAqB,YAAAC,GAAY,WAAAC,GAAW,YAAAC,GAAY,YAAAC,EAAA,IAAeC,EAAY;AAAA,IAC9G,IAAIR;AAAA,EAAA,CACP,GAEK,EAAE,MAAMS,GAAe,GAAGC,MAAuBT,GAEjDU,IAAqB;AAAA,IACvB,GAAGD;AAAA,IACH,GAAGR;AAAA,EAAA;AAGP,SACI,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAKR;AAAA,MACJ,GAAGX;AAAA,MACJ,WAAWoB,EAA2BvB,GAAQC,GAAQ;AAAA,QAClD,aAAa;AAAA,QACb,YAAAgB;AAAA,QACA,aAAAb;AAAA,QACA,oBAAoBI,IAAoB,KAAKR,EAAO,eAAeQ;AAAA,QACnE,qBACIC,IAAqB,KACrBT,EAAO,cAAcA,EAAO,UAAU,IAAIC,EAAO,mBAAmBQ;AAAA,MAAA,CAC3E;AAAA,MACD,eAAaC;AAAA,MACb,MAAK;AAAA,MACL,iBAAec,EAAoBxB,EAAO,aAAaK,CAAmB;AAAA,MAC1E,gBAAcoB,EAAgBzB,EAAO,OAAO;AAAA,MAC5C,iBAAeA,EAAO;AAAA,MACtB,gBAAcyB,EAAgBzB,EAAO,OAAO;AAAA,MAC5C,aAAW0B,EAAgB1B,CAAM;AAAA,MACjC,OAAO2B,EAAuB3B,GAAQK,GAAqB;AAAA,QACvD,eAAeH,IAAoB,SAAS;AAAA,QAC5C,WAAWA,IACL,SACAa,IACE,eAAeA,EAAU,CAAC,OAAOA,EAAU,CAAC,WAC5C;AAAA,QACR,YAAAC;AAAA,MAAA,CACH;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAY;AAAA,UAACC;AAAA,UAAA;AAAA,YACI,GAAG9B;AAAA,YACJ,oBAAAsB;AAAA,YACA,kBAAkBR;AAAA,UAAA;AAAA,QAAA;AAAA,QAEtB,gBAAAe,EAACE,GAAA,EAA6B,GAAG/B,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}

package/components/table/render/header/TableHeader.types.d.ts

@@ -17,6 +17,7 @@ export type TableHeaderSectionProps<RowType extends TableRowData = TableRowData>
     selectionHeaderContent?: ReactNode;
     showSelectionColumn?: boolean;
     stickyLeftColumnCount?: number;
+    stickyRightColumnCount?: number;
     tableHeadRowRef: Ref<HTMLDivElement>;
     onSortChange?: (columnKey: string, direction: TableSortDirection, event: ReactMouseEvent<HTMLButtonElement>) => void;
 };
@@ -34,4 +35,5 @@ export type SharedHeaderCellProps<RowType extends TableRowData = TableRowData> =
     onSortChange?: (columnKey: string, direction: TableSortDirection, event: ReactMouseEvent<HTMLButtonElement>) => void;
     showSelectionColumn?: boolean;
     stickyLeftColumnCount?: number;
+    stickyRightColumnCount?: number;
 };

package/components/table/render/header/TableHeaderCellContent.js

@@ -7,7 +7,7 @@ const u = (c) => {
     /* @__PURE__ */ a("span", { children: e.label })
   ] }) : e.label, o = s === null ? null : /* @__PURE__ */ a("span", { className: "table-head-label", children: s });
   return /* @__PURE__ */ a("div", { className: l("table-head-cell-content", d && "table-head-cell-content-hidden"), children: /* @__PURE__ */ r("div", { className: "table-head-cell-content-row", children: [
-    e.sortable ? /* @__PURE__ */ r(
+    e.sortable ? /* @__PURE__ */ a(
       "button",
       {
         type: "button",
@@ -18,21 +18,21 @@ const u = (c) => {
           e.sortDirection === "asc" ? "desc" : "asc",
           h
         ),
-        children: [
-          /* @__PURE__ */ a(p, { direction: e.sortDirection }),
-          /* @__PURE__ */ a(
-            "span",
-            {
-              ref: n,
-              className: l(
-                "table-head-button-label",
-                t && "table-head-drag-label"
-              ),
-              ...t,
-              children: o
-            }
-          )
-        ]
+        children: /* @__PURE__ */ r(
+          "span",
+          {
+            ref: n,
+            className: l(
+              "table-head-button-label",
+              t && "table-head-drag-label"
+            ),
+            ...t,
+            children: [
+              /* @__PURE__ */ a(p, { direction: e.sortDirection }),
+              o
+            ]
+          }
+        )
       }
     ) : /* @__PURE__ */ a(
       "span",

package/components/table/render/header/TableHeaderCellContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeaderCellContent.js","sources":["../../../../../src/components/table/render/header/TableHeaderCellContent.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport SortArrows from '../../SortArrows';\nimport type { TableRowData } from '../../Table.types';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\n\nconst TableHeaderCellContent = (props: SharedHeaderCellProps<TableRowData>) => {\n    const { column, dragActivatorProps, dragActivatorRef, hideWhileDragging, onSortChange } = props;\n\n    const ariaLabel = column.hideLabel && typeof column.label === 'string' ? column.label : undefined;\n\n    const labelContent = column.hideLabel ? null : column.icon ? (\n        <span className='display-inline-flex align-items-center gap-5'>\n            <span className={classNames('text-color-dark rioglyph', column.icon)} />\n            <span>{column.label}</span>\n        </span>\n    ) : (\n        column.label\n    );\n\n    const wrappedLabelContent = labelContent === null ? null : <span className='table-head-label'>{labelContent}</span>;\n\n    return (\n        <div className={classNames('table-head-cell-content', hideWhileDragging && 'table-head-cell-content-hidden')}>\n            <div className='table-head-cell-content-row'>\n                {column.sortable ? (\n                    <button\n                        type='button'\n                        className={classNames('table-head-button', column.filter && 'table-head-button-has-filter')}\n                        aria-label={ariaLabel}\n                        onClick={event =>\n                            onSortChange?.(\n                                column.columnKey ?? String(column.key),\n                                column.sortDirection === 'asc' ? 'desc' : 'asc',\n                                event\n                            )\n                        }\n                    >\n                        <SortArrows direction={column.sortDirection} />\n                        <span\n                            ref={dragActivatorRef}\n                            className={classNames(\n                                'table-head-button-label',\n                                dragActivatorProps && 'table-head-drag-label'\n                            )}\n                            {...dragActivatorProps}\n                        >\n                            {wrappedLabelContent}\n                        </span>\n                    </button>\n                ) : (\n                    <span\n                        ref={dragActivatorRef}\n                        className={classNames(\n                            'table-head-label-wrapper',\n                            column.filter && 'table-head-label-wrapper-has-filter',\n                            dragActivatorProps && 'table-head-drag-label'\n                        )}\n                        aria-label={ariaLabel}\n                        {...dragActivatorProps}\n                    >\n                        {wrappedLabelContent}\n                    </span>\n                )}\n                {column.filter && <span className='table-head-filter'>{column.filter}</span>}\n            </div>\n        </div>\n    );\n};\n\nexport default TableHeaderCellContent;\n"],"names":["TableHeaderCellContent","props","column","dragActivatorProps","dragActivatorRef","hideWhileDragging","onSortChange","ariaLabel","labelContent","jsxs","jsx","classNames","wrappedLabelContent","event","SortArrows"],"mappings":";;;AAKA,MAAMA,IAAyB,CAACC,MAA+C;AAC3E,QAAM,EAAE,QAAAC,GAAQ,oBAAAC,GAAoB,kBAAAC,GAAkB,mBAAAC,GAAmB,cAAAC,MAAiBL,GAEpFM,IAAYL,EAAO,aAAa,OAAOA,EAAO,SAAU,WAAWA,EAAO,QAAQ,QAElFM,IAAeN,EAAO,YAAY,OAAOA,EAAO,OAClD,gBAAAO,EAAC,QAAA,EAAK,WAAU,gDACZ,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,4BAA4BT,EAAO,IAAI,GAAG;AAAA,IACtE,gBAAAQ,EAAC,QAAA,EAAM,UAAAR,EAAO,MAAA,CAAM;AAAA,EAAA,EAAA,CACxB,IAEAA,EAAO,OAGLU,IAAsBJ,MAAiB,OAAO,yBAAQ,QAAA,EAAK,WAAU,oBAAoB,UAAAA,EAAA,CAAa;AAE5G,SACI,gBAAAE,EAAC,OAAA,EAAI,WAAWC,EAAW,2BAA2BN,KAAqB,gCAAgC,GACvG,UAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,+BACV,UAAA;AAAA,IAAAP,EAAO,WACJ,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,WAAWE,EAAW,qBAAqBT,EAAO,UAAU,8BAA8B;AAAA,QAC1F,cAAYK;AAAA,QACZ,SAAS,CAAAM,MACLP;AAAA,UACIJ,EAAO,aAAa,OAAOA,EAAO,GAAG;AAAA,UACrCA,EAAO,kBAAkB,QAAQ,SAAS;AAAA,UAC1CW;AAAA,QAAA;AAAA,QAIR,UAAA;AAAA,UAAA,gBAAAH,EAACI,GAAA,EAAW,WAAWZ,EAAO,cAAA,CAAe;AAAA,UAC7C,gBAAAQ;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,KAAKN;AAAA,cACL,WAAWO;AAAA,gBACP;AAAA,gBACAR,KAAsB;AAAA,cAAA;AAAA,cAEzB,GAAGA;AAAA,cAEH,UAAAS;AAAA,YAAA;AAAA,UAAA;AAAA,QACL;AAAA,MAAA;AAAA,IAAA,IAGJ,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAKN;AAAA,QACL,WAAWO;AAAA,UACP;AAAA,UACAT,EAAO,UAAU;AAAA,UACjBC,KAAsB;AAAA,QAAA;AAAA,QAE1B,cAAYI;AAAA,QACX,GAAGJ;AAAA,QAEH,UAAAS;AAAA,MAAA;AAAA,IAAA;AAAA,IAGRV,EAAO,UAAU,gBAAAQ,EAAC,UAAK,WAAU,qBAAqB,YAAO,OAAA,CAAO;AAAA,EAAA,EAAA,CACzE,EAAA,CACJ;AAER;"}
+{"version":3,"file":"TableHeaderCellContent.js","sources":["../../../../../src/components/table/render/header/TableHeaderCellContent.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport SortArrows from '../../SortArrows';\nimport type { TableRowData } from '../../Table.types';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\n\nconst TableHeaderCellContent = (props: SharedHeaderCellProps<TableRowData>) => {\n    const { column, dragActivatorProps, dragActivatorRef, hideWhileDragging, onSortChange } = props;\n\n    const ariaLabel = column.hideLabel && typeof column.label === 'string' ? column.label : undefined;\n\n    const labelContent = column.hideLabel ? null : column.icon ? (\n        <span className='display-inline-flex align-items-center gap-5'>\n            <span className={classNames('text-color-dark rioglyph', column.icon)} />\n            <span>{column.label}</span>\n        </span>\n    ) : (\n        column.label\n    );\n\n    const wrappedLabelContent = labelContent === null ? null : <span className='table-head-label'>{labelContent}</span>;\n\n    return (\n        <div className={classNames('table-head-cell-content', hideWhileDragging && 'table-head-cell-content-hidden')}>\n            <div className='table-head-cell-content-row'>\n                {column.sortable ? (\n                    <button\n                        type='button'\n                        className={classNames('table-head-button', column.filter && 'table-head-button-has-filter')}\n                        aria-label={ariaLabel}\n                        onClick={event =>\n                            onSortChange?.(\n                                column.columnKey ?? String(column.key),\n                                column.sortDirection === 'asc' ? 'desc' : 'asc',\n                                event\n                            )\n                        }\n                    >\n                        <span\n                            ref={dragActivatorRef}\n                            className={classNames(\n                                'table-head-button-label',\n                                dragActivatorProps && 'table-head-drag-label'\n                            )}\n                            {...dragActivatorProps}\n                        >\n                            <SortArrows direction={column.sortDirection} />\n                            {wrappedLabelContent}\n                        </span>\n                    </button>\n                ) : (\n                    <span\n                        ref={dragActivatorRef}\n                        className={classNames(\n                            'table-head-label-wrapper',\n                            column.filter && 'table-head-label-wrapper-has-filter',\n                            dragActivatorProps && 'table-head-drag-label'\n                        )}\n                        aria-label={ariaLabel}\n                        {...dragActivatorProps}\n                    >\n                        {wrappedLabelContent}\n                    </span>\n                )}\n                {column.filter && <span className='table-head-filter'>{column.filter}</span>}\n            </div>\n        </div>\n    );\n};\n\nexport default TableHeaderCellContent;\n"],"names":["TableHeaderCellContent","props","column","dragActivatorProps","dragActivatorRef","hideWhileDragging","onSortChange","ariaLabel","labelContent","jsxs","jsx","classNames","wrappedLabelContent","event","SortArrows"],"mappings":";;;AAKA,MAAMA,IAAyB,CAACC,MAA+C;AAC3E,QAAM,EAAE,QAAAC,GAAQ,oBAAAC,GAAoB,kBAAAC,GAAkB,mBAAAC,GAAmB,cAAAC,MAAiBL,GAEpFM,IAAYL,EAAO,aAAa,OAAOA,EAAO,SAAU,WAAWA,EAAO,QAAQ,QAElFM,IAAeN,EAAO,YAAY,OAAOA,EAAO,OAClD,gBAAAO,EAAC,QAAA,EAAK,WAAU,gDACZ,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,4BAA4BT,EAAO,IAAI,GAAG;AAAA,IACtE,gBAAAQ,EAAC,QAAA,EAAM,UAAAR,EAAO,MAAA,CAAM;AAAA,EAAA,EAAA,CACxB,IAEAA,EAAO,OAGLU,IAAsBJ,MAAiB,OAAO,yBAAQ,QAAA,EAAK,WAAU,oBAAoB,UAAAA,EAAA,CAAa;AAE5G,SACI,gBAAAE,EAAC,OAAA,EAAI,WAAWC,EAAW,2BAA2BN,KAAqB,gCAAgC,GACvG,UAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,+BACV,UAAA;AAAA,IAAAP,EAAO,WACJ,gBAAAQ;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,WAAWC,EAAW,qBAAqBT,EAAO,UAAU,8BAA8B;AAAA,QAC1F,cAAYK;AAAA,QACZ,SAAS,CAAAM,MACLP;AAAA,UACIJ,EAAO,aAAa,OAAOA,EAAO,GAAG;AAAA,UACrCA,EAAO,kBAAkB,QAAQ,SAAS;AAAA,UAC1CW;AAAA,QAAA;AAAA,QAIR,UAAA,gBAAAJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,KAAKL;AAAA,YACL,WAAWO;AAAA,cACP;AAAA,cACAR,KAAsB;AAAA,YAAA;AAAA,YAEzB,GAAGA;AAAA,YAEJ,UAAA;AAAA,cAAA,gBAAAO,EAACI,GAAA,EAAW,WAAWZ,EAAO,cAAA,CAAe;AAAA,cAC5CU;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACL;AAAA,IAAA,IAGJ,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAKN;AAAA,QACL,WAAWO;AAAA,UACP;AAAA,UACAT,EAAO,UAAU;AAAA,UACjBC,KAAsB;AAAA,QAAA;AAAA,QAE1B,cAAYI;AAAA,QACX,GAAGJ;AAAA,QAEH,UAAAS;AAAA,MAAA;AAAA,IAAA;AAAA,IAGRV,EAAO,UAAU,gBAAAQ,EAAC,UAAK,WAAU,qBAAqB,YAAO,OAAA,CAAO;AAAA,EAAA,EAAA,CACzE,EAAA,CACJ;AAER;"}

package/components/table/render/header/TableHeaderSelectionCell.d.ts

@@ -2,6 +2,7 @@ type TableHeaderSelectionCellProps = {
     isAllSelected?: boolean;
     isSomeRowsSelected?: boolean;
     onToggleAllSelection?: () => void;
+    disabled?: boolean;
     rowCount: number;
     selectionHeaderContent?: React.ReactNode;
 };

package/components/table/render/header/TableHeaderSelectionCell.js

@@ -1,31 +1,32 @@
 import { jsx as o } from "react/jsx-runtime";
-import c from "../../../checkbox/Checkbox.js";
-import s from "../../../../utils/classNames.js";
-import { resolveAriaSpan as d } from "../../shared/resolveTableAria.js";
-const h = (a) => {
-  const { isAllSelected: l, isSomeRowsSelected: r, onToggleAllSelection: i, rowCount: n, selectionHeaderContent: t } = a;
+import s from "../../../checkbox/Checkbox.js";
+import d from "../../../../utils/classNames.js";
+import { resolveAriaSpan as m } from "../../shared/resolveTableAria.js";
+const C = (t) => {
+  const { isAllSelected: l, isSomeRowsSelected: r, onToggleAllSelection: i, disabled: c, rowCount: a, selectionHeaderContent: n } = t;
   return /* @__PURE__ */ o(
     "div",
     {
-      className: s(
+      className: d(
         "table-head-cell table-selection-cell table-align-center",
-        t && "table-selection-cell-custom-content"
+        n && "table-selection-cell-custom-content"
       ),
       role: "columnheader",
       "aria-colindex": 1,
       "aria-rowindex": 1,
-      "aria-rowspan": d(n),
-      style: { gridColumn: "1 / span 1", gridRow: `1 / span ${n}` },
+      "aria-rowspan": m(a),
+      style: { gridColumn: "1 / span 1", gridRow: `1 / span ${a}` },
       children: /* @__PURE__ */ o(
         "div",
         {
           className: "table-selection-control",
           onClick: (e) => e.stopPropagation(),
           onKeyDown: (e) => e.stopPropagation(),
-          children: t ?? /* @__PURE__ */ o(
-            c,
+          children: n ?? /* @__PURE__ */ o(
+            s,
             {
               checked: l,
+              disabled: c,
               indeterminate: !l && !!r,
               onChange: () => i?.()
             }
@@ -36,6 +37,6 @@ const h = (a) => {
   );
 };
 export {
-  h as default
+  C as default
 };
 //# sourceMappingURL=TableHeaderSelectionCell.js.map

package/components/table/render/header/TableHeaderSelectionCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeaderSelectionCell.js","sources":["../../../../../src/components/table/render/header/TableHeaderSelectionCell.tsx"],"sourcesContent":["import Checkbox from '../../../checkbox/Checkbox';\nimport classNames from '../../../../utils/classNames';\nimport { resolveAriaSpan } from '../../shared/resolveTableAria';\n\ntype TableHeaderSelectionCellProps = {\n    isAllSelected?: boolean;\n    isSomeRowsSelected?: boolean;\n    onToggleAllSelection?: () => void;\n    rowCount: number;\n    selectionHeaderContent?: React.ReactNode;\n};\n\nconst TableHeaderSelectionCell = (props: TableHeaderSelectionCellProps) => {\n    const { isAllSelected, isSomeRowsSelected, onToggleAllSelection, rowCount, selectionHeaderContent } = props;\n\n    return (\n        <div\n            className={classNames(\n                'table-head-cell table-selection-cell table-align-center',\n                selectionHeaderContent && 'table-selection-cell-custom-content'\n            )}\n            role='columnheader'\n            aria-colindex={1}\n            aria-rowindex={1}\n            aria-rowspan={resolveAriaSpan(rowCount)}\n            style={{ gridColumn: '1 / span 1', gridRow: `1 / span ${rowCount}` }}\n        >\n            <div\n                className='table-selection-control'\n                onClick={event => event.stopPropagation()}\n                onKeyDown={event => event.stopPropagation()}\n            >\n                {selectionHeaderContent ?? (\n                    <Checkbox\n                        checked={isAllSelected}\n                        indeterminate={!isAllSelected && !!isSomeRowsSelected}\n                        onChange={() => onToggleAllSelection?.()}\n                    />\n                )}\n            </div>\n        </div>\n    );\n};\n\nexport default TableHeaderSelectionCell;\n"],"names":["TableHeaderSelectionCell","props","isAllSelected","isSomeRowsSelected","onToggleAllSelection","rowCount","selectionHeaderContent","jsx","classNames","resolveAriaSpan","event","Checkbox"],"mappings":";;;;AAYA,MAAMA,IAA2B,CAACC,MAAyC;AACvE,QAAM,EAAE,eAAAC,GAAe,oBAAAC,GAAoB,sBAAAC,GAAsB,UAAAC,GAAU,wBAAAC,MAA2BL;AAEtG,SACI,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC;AAAA,QACP;AAAA,QACAF,KAA0B;AAAA,MAAA;AAAA,MAE9B,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,gBAAcG,EAAgBJ,CAAQ;AAAA,MACtC,OAAO,EAAE,YAAY,cAAc,SAAS,YAAYA,CAAQ,GAAA;AAAA,MAEhE,UAAA,gBAAAE;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAU;AAAA,UACV,SAAS,CAAAG,MAASA,EAAM,gBAAA;AAAA,UACxB,WAAW,CAAAA,MAASA,EAAM,gBAAA;AAAA,UAEzB,UAAAJ,KACG,gBAAAC;AAAA,YAACI;AAAA,YAAA;AAAA,cACG,SAAST;AAAA,cACT,eAAe,CAACA,KAAiB,CAAC,CAACC;AAAA,cACnC,UAAU,MAAMC,IAAA;AAAA,YAAuB;AAAA,UAAA;AAAA,QAC3C;AAAA,MAAA;AAAA,IAER;AAAA,EAAA;AAGZ;"}
+{"version":3,"file":"TableHeaderSelectionCell.js","sources":["../../../../../src/components/table/render/header/TableHeaderSelectionCell.tsx"],"sourcesContent":["import Checkbox from '../../../checkbox/Checkbox';\nimport classNames from '../../../../utils/classNames';\nimport { resolveAriaSpan } from '../../shared/resolveTableAria';\n\ntype TableHeaderSelectionCellProps = {\n    isAllSelected?: boolean;\n    isSomeRowsSelected?: boolean;\n    onToggleAllSelection?: () => void;\n    disabled?: boolean;\n    rowCount: number;\n    selectionHeaderContent?: React.ReactNode;\n};\n\nconst TableHeaderSelectionCell = (props: TableHeaderSelectionCellProps) => {\n    const { isAllSelected, isSomeRowsSelected, onToggleAllSelection, disabled, rowCount, selectionHeaderContent } =\n        props;\n\n    return (\n        <div\n            className={classNames(\n                'table-head-cell table-selection-cell table-align-center',\n                selectionHeaderContent && 'table-selection-cell-custom-content'\n            )}\n            role='columnheader'\n            aria-colindex={1}\n            aria-rowindex={1}\n            aria-rowspan={resolveAriaSpan(rowCount)}\n            style={{ gridColumn: '1 / span 1', gridRow: `1 / span ${rowCount}` }}\n        >\n            <div\n                className='table-selection-control'\n                onClick={event => event.stopPropagation()}\n                onKeyDown={event => event.stopPropagation()}\n            >\n                {selectionHeaderContent ?? (\n                    <Checkbox\n                        checked={isAllSelected}\n                        disabled={disabled}\n                        indeterminate={!isAllSelected && !!isSomeRowsSelected}\n                        onChange={() => onToggleAllSelection?.()}\n                    />\n                )}\n            </div>\n        </div>\n    );\n};\n\nexport default TableHeaderSelectionCell;\n"],"names":["TableHeaderSelectionCell","props","isAllSelected","isSomeRowsSelected","onToggleAllSelection","disabled","rowCount","selectionHeaderContent","jsx","classNames","resolveAriaSpan","event","Checkbox"],"mappings":";;;;AAaA,MAAMA,IAA2B,CAACC,MAAyC;AACvE,QAAM,EAAE,eAAAC,GAAe,oBAAAC,GAAoB,sBAAAC,GAAsB,UAAAC,GAAU,UAAAC,GAAU,wBAAAC,MACjFN;AAEJ,SACI,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC;AAAA,QACP;AAAA,QACAF,KAA0B;AAAA,MAAA;AAAA,MAE9B,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,gBAAcG,EAAgBJ,CAAQ;AAAA,MACtC,OAAO,EAAE,YAAY,cAAc,SAAS,YAAYA,CAAQ,GAAA;AAAA,MAEhE,UAAA,gBAAAE;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAU;AAAA,UACV,SAAS,CAAAG,MAASA,EAAM,gBAAA;AAAA,UACxB,WAAW,CAAAA,MAASA,EAAM,gBAAA;AAAA,UAEzB,UAAAJ,KACG,gBAAAC;AAAA,YAACI;AAAA,YAAA;AAAA,cACG,SAASV;AAAA,cACT,UAAAG;AAAA,cACA,eAAe,CAACH,KAAiB,CAAC,CAACC;AAAA,cACnC,UAAU,MAAMC,IAAA;AAAA,YAAuB;AAAA,UAAA;AAAA,QAC3C;AAAA,MAAA;AAAA,IAER;AAAA,EAAA;AAGZ;"}

package/components/table/render/header/TableStaticHeaderCell.js

@@ -1,48 +1,50 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
-import u from "../../../../utils/classNames.js";
-import C from "./TableHeaderCellContent.js";
-import f from "./TableHeaderCellResizeHandle.js";
-import { resolveAriaSort as S } from "./resolveAriaSort.js";
-import { resolveHeaderCellClassName as p } from "./resolveHeaderCellClassName.js";
-import { resolveHeaderCellStyle as h } from "./resolveHeaderCellStyle.js";
-import { resolveAriaSpan as t, resolveAriaColIndex as y } from "../../shared/resolveTableAria.js";
-const L = (r) => {
+import { jsxs as C, jsx as i } from "react/jsx-runtime";
+import S from "../../../../utils/classNames.js";
+import f from "./TableHeaderCellContent.js";
+import h from "./TableHeaderCellResizeHandle.js";
+import { resolveAriaSort as p } from "./resolveAriaSort.js";
+import { resolveHeaderCellClassName as y } from "./resolveHeaderCellClassName.js";
+import { resolveHeaderCellStyle as g } from "./resolveHeaderCellStyle.js";
+import { resolveAriaSpan as n, resolveAriaColIndex as k } from "../../shared/resolveTableAria.js";
+const N = (o) => {
   const {
     column: e,
-    header: i,
+    header: l,
     hideWhileDragging: m,
-    htmlAttributes: n,
-    isResizable: s,
-    showSelectionColumn: l,
-    stickyLeftColumnCount: c
-  } = r, a = c ?? 0;
-  return /* @__PURE__ */ d(
+    htmlAttributes: s,
+    isResizable: c,
+    showSelectionColumn: t,
+    stickyLeftColumnCount: u,
+    stickyRightColumnCount: d
+  } = o, r = u ?? 0, a = d ?? 0;
+  return /* @__PURE__ */ C(
     "div",
     {
-      ...n,
-      className: u(
-        p(e, i, {
-          isResizable: s,
-          isStickyLeftColumn: a > 0 && e.columnStart <= a
+      ...s,
+      className: S(
+        y(e, l, {
+          isResizable: c,
+          isStickyLeftColumn: r > 0 && e.columnStart <= r,
+          isStickyRightColumn: a > 0 && e.columnStart + e.colSpan - 1 > l.totalColumnCount - a
         }),
         m && "table-head-cell-drag-placeholder"
       ),
       "data-column": e.columnKey ?? String(e.key),
       role: "columnheader",
-      "aria-colindex": y(e.columnStart, l),
-      "aria-colspan": t(e.colSpan),
+      "aria-colindex": k(e.columnStart, t),
+      "aria-colspan": n(e.colSpan),
       "aria-rowindex": e.rowStart,
-      "aria-rowspan": t(e.rowSpan),
-      "aria-sort": S(e),
-      style: h(e, l),
+      "aria-rowspan": n(e.rowSpan),
+      "aria-sort": p(e),
+      style: g(e, t),
       children: [
-        /* @__PURE__ */ o(C, { ...r }),
-        /* @__PURE__ */ o(f, { ...r })
+        /* @__PURE__ */ i(f, { ...o }),
+        /* @__PURE__ */ i(h, { ...o })
       ]
     }
   );
 };
 export {
-  L as default
+  N as default
 };
 //# sourceMappingURL=TableStaticHeaderCell.js.map

package/components/table/render/header/TableStaticHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableStaticHeaderCell.js","sources":["../../../../../src/components/table/render/header/TableStaticHeaderCell.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport type { TableRowData } from '../../Table.types';\nimport TableHeaderCellContent from './TableHeaderCellContent';\nimport TableHeaderCellResizeHandle from './TableHeaderCellResizeHandle';\nimport { resolveAriaSort } from './resolveAriaSort';\nimport { resolveHeaderCellClassName } from './resolveHeaderCellClassName';\nimport { resolveHeaderCellStyle } from './resolveHeaderCellStyle';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\nimport { resolveAriaColIndex, resolveAriaSpan } from '../../shared/resolveTableAria';\n\nconst TableStaticHeaderCell = (props: SharedHeaderCellProps<TableRowData>) => {\n    const {\n        column,\n        header,\n        hideWhileDragging,\n        htmlAttributes,\n        isResizable,\n        showSelectionColumn,\n        stickyLeftColumnCount,\n    } = props;\n\n    const stickyLeftColumns = stickyLeftColumnCount ?? 0;\n\n    return (\n        <div\n            {...htmlAttributes}\n            className={classNames(\n                resolveHeaderCellClassName(column, header, {\n                    isResizable,\n                    isStickyLeftColumn: stickyLeftColumns > 0 && column.columnStart <= stickyLeftColumns,\n                }),\n                hideWhileDragging && 'table-head-cell-drag-placeholder'\n            )}\n            data-column={column.columnKey ?? String(column.key)}\n            role='columnheader'\n            aria-colindex={resolveAriaColIndex(column.columnStart, showSelectionColumn)}\n            aria-colspan={resolveAriaSpan(column.colSpan)}\n            aria-rowindex={column.rowStart}\n            aria-rowspan={resolveAriaSpan(column.rowSpan)}\n            aria-sort={resolveAriaSort(column)}\n            style={resolveHeaderCellStyle(column, showSelectionColumn)}\n        >\n            <TableHeaderCellContent {...props} />\n            <TableHeaderCellResizeHandle {...props} />\n        </div>\n    );\n};\n\nexport default TableStaticHeaderCell;\n"],"names":["TableStaticHeaderCell","props","column","header","hideWhileDragging","htmlAttributes","isResizable","showSelectionColumn","stickyLeftColumnCount","stickyLeftColumns","jsxs","classNames","resolveHeaderCellClassName","resolveAriaColIndex","resolveAriaSpan","resolveAriaSort","resolveHeaderCellStyle","jsx","TableHeaderCellContent","TableHeaderCellResizeHandle"],"mappings":";;;;;;;;AAUA,MAAMA,IAAwB,CAACC,MAA+C;AAC1E,QAAM;AAAA,IACF,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,uBAAAC;AAAA,EAAA,IACAP,GAEEQ,IAAoBD,KAAyB;AAEnD,SACI,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGL;AAAA,MACJ,WAAWM;AAAA,QACPC,EAA2BV,GAAQC,GAAQ;AAAA,UACvC,aAAAG;AAAA,UACA,oBAAoBG,IAAoB,KAAKP,EAAO,eAAeO;AAAA,QAAA,CACtE;AAAA,QACDL,KAAqB;AAAA,MAAA;AAAA,MAEzB,eAAaF,EAAO,aAAa,OAAOA,EAAO,GAAG;AAAA,MAClD,MAAK;AAAA,MACL,iBAAeW,EAAoBX,EAAO,aAAaK,CAAmB;AAAA,MAC1E,gBAAcO,EAAgBZ,EAAO,OAAO;AAAA,MAC5C,iBAAeA,EAAO;AAAA,MACtB,gBAAcY,EAAgBZ,EAAO,OAAO;AAAA,MAC5C,aAAWa,EAAgBb,CAAM;AAAA,MACjC,OAAOc,EAAuBd,GAAQK,CAAmB;AAAA,MAEzD,UAAA;AAAA,QAAA,gBAAAU,EAACC,GAAA,EAAwB,GAAGjB,GAAO;AAAA,QACnC,gBAAAgB,EAACE,GAAA,EAA6B,GAAGlB,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}
+{"version":3,"file":"TableStaticHeaderCell.js","sources":["../../../../../src/components/table/render/header/TableStaticHeaderCell.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport type { TableRowData } from '../../Table.types';\nimport TableHeaderCellContent from './TableHeaderCellContent';\nimport TableHeaderCellResizeHandle from './TableHeaderCellResizeHandle';\nimport { resolveAriaSort } from './resolveAriaSort';\nimport { resolveHeaderCellClassName } from './resolveHeaderCellClassName';\nimport { resolveHeaderCellStyle } from './resolveHeaderCellStyle';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\nimport { resolveAriaColIndex, resolveAriaSpan } from '../../shared/resolveTableAria';\n\nconst TableStaticHeaderCell = (props: SharedHeaderCellProps<TableRowData>) => {\n    const {\n        column,\n        header,\n        hideWhileDragging,\n        htmlAttributes,\n        isResizable,\n        showSelectionColumn,\n        stickyLeftColumnCount,\n        stickyRightColumnCount,\n    } = props;\n\n    const stickyLeftColumns = stickyLeftColumnCount ?? 0;\n    const stickyRightColumns = stickyRightColumnCount ?? 0;\n\n    return (\n        <div\n            {...htmlAttributes}\n            className={classNames(\n                resolveHeaderCellClassName(column, header, {\n                    isResizable,\n                    isStickyLeftColumn: stickyLeftColumns > 0 && column.columnStart <= stickyLeftColumns,\n                    isStickyRightColumn:\n                        stickyRightColumns > 0 &&\n                        column.columnStart + column.colSpan - 1 > header.totalColumnCount - stickyRightColumns,\n                }),\n                hideWhileDragging && 'table-head-cell-drag-placeholder'\n            )}\n            data-column={column.columnKey ?? String(column.key)}\n            role='columnheader'\n            aria-colindex={resolveAriaColIndex(column.columnStart, showSelectionColumn)}\n            aria-colspan={resolveAriaSpan(column.colSpan)}\n            aria-rowindex={column.rowStart}\n            aria-rowspan={resolveAriaSpan(column.rowSpan)}\n            aria-sort={resolveAriaSort(column)}\n            style={resolveHeaderCellStyle(column, showSelectionColumn)}\n        >\n            <TableHeaderCellContent {...props} />\n            <TableHeaderCellResizeHandle {...props} />\n        </div>\n    );\n};\n\nexport default TableStaticHeaderCell;\n"],"names":["TableStaticHeaderCell","props","column","header","hideWhileDragging","htmlAttributes","isResizable","showSelectionColumn","stickyLeftColumnCount","stickyRightColumnCount","stickyLeftColumns","stickyRightColumns","jsxs","classNames","resolveHeaderCellClassName","resolveAriaColIndex","resolveAriaSpan","resolveAriaSort","resolveHeaderCellStyle","jsx","TableHeaderCellContent","TableHeaderCellResizeHandle"],"mappings":";;;;;;;;AAUA,MAAMA,IAAwB,CAACC,MAA+C;AAC1E,QAAM;AAAA,IACF,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,wBAAAC;AAAA,EAAA,IACAR,GAEES,IAAoBF,KAAyB,GAC7CG,IAAqBF,KAA0B;AAErD,SACI,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGP;AAAA,MACJ,WAAWQ;AAAA,QACPC,EAA2BZ,GAAQC,GAAQ;AAAA,UACvC,aAAAG;AAAA,UACA,oBAAoBI,IAAoB,KAAKR,EAAO,eAAeQ;AAAA,UACnE,qBACIC,IAAqB,KACrBT,EAAO,cAAcA,EAAO,UAAU,IAAIC,EAAO,mBAAmBQ;AAAA,QAAA,CAC3E;AAAA,QACDP,KAAqB;AAAA,MAAA;AAAA,MAEzB,eAAaF,EAAO,aAAa,OAAOA,EAAO,GAAG;AAAA,MAClD,MAAK;AAAA,MACL,iBAAea,EAAoBb,EAAO,aAAaK,CAAmB;AAAA,MAC1E,gBAAcS,EAAgBd,EAAO,OAAO;AAAA,MAC5C,iBAAeA,EAAO;AAAA,MACtB,gBAAcc,EAAgBd,EAAO,OAAO;AAAA,MAC5C,aAAWe,EAAgBf,CAAM;AAAA,MACjC,OAAOgB,EAAuBhB,GAAQK,CAAmB;AAAA,MAEzD,UAAA;AAAA,QAAA,gBAAAY,EAACC,GAAA,EAAwB,GAAGnB,GAAO;AAAA,QACnC,gBAAAkB,EAACE,GAAA,EAA6B,GAAGpB,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}

package/components/table/render/header/resolveHeaderCellClassName.d.ts

@@ -9,4 +9,5 @@ export declare const resolveHeaderCellClassName: (column: HeaderColumn<TableRowD
     isDragging?: boolean;
     isResizable: boolean;
     isStickyLeftColumn?: boolean;
+    isStickyRightColumn?: boolean;
 }) => string;

package/components/table/render/header/resolveHeaderCellClassName.js

@@ -1,18 +1,19 @@
-import o from "../../../../utils/classNames.js";
-import { getVerticalAlignClassName as b, getHorizontalAlignClassName as d } from "../../shared/getAlignClassName.js";
-const n = (e, a, l) => {
-  const { isDraggable: t, isDragging: i, isResizable: r, isStickyLeftColumn: s } = l;
-  return o(
+import b from "../../../../utils/classNames.js";
+import { getVerticalAlignClassName as d, getHorizontalAlignClassName as g } from "../../shared/getAlignClassName.js";
+const n = (e, l, a) => {
+  const { isDraggable: t, isDragging: i, isResizable: r, isStickyLeftColumn: s, isStickyRightColumn: o } = a;
+  return b(
     "table-head-cell",
     e.sortable && "table-head-cell-sortable",
     t && "table-head-cell-draggable",
     i && "table-head-cell-dragging",
     r && "table-head-cell-resizable",
     s && "table-head-cell-sticky-left-column",
-    e.columnStart + e.colSpan - 1 < a.totalColumnCount && "table-head-cell-has-column-divider",
-    e.rowStart + e.rowSpan - 1 < a.rowCount && "table-head-cell-has-row-divider",
-    d(e.horizontalAlign),
-    b(e.verticalAlign),
+    o && "table-head-cell-sticky-right-column",
+    e.columnStart + e.colSpan - 1 < l.totalColumnCount && "table-head-cell-has-column-divider",
+    e.rowStart + e.rowSpan - 1 < l.rowCount && "table-head-cell-has-row-divider",
+    g(e.horizontalAlign),
+    d(e.verticalAlign),
     e.hideOnMobile && "table-hide-mobile",
     e.headerClassName
   );

package/components/table/render/header/resolveHeaderCellClassName.js.map

@@ -1 +1 @@
-{"version":3,"file":"resolveHeaderCellClassName.js","sources":["../../../../../src/components/table/render/header/resolveHeaderCellClassName.ts"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport { getHorizontalAlignClassName, getVerticalAlignClassName } from '../../shared/getAlignClassName';\nimport type { TableRowData } from '../../Table.types';\nimport type { HeaderColumn } from './TableHeader.types';\n\nexport const resolveHeaderCellClassName = (\n    column: HeaderColumn<TableRowData>,\n    header: NonNullable<{ columns: HeaderColumn<TableRowData>[]; rowCount: number; totalColumnCount: number }>,\n    options: {\n        isDraggable?: boolean;\n        isDragging?: boolean;\n        isResizable: boolean;\n        isStickyLeftColumn?: boolean;\n    }\n) => {\n    const { isDraggable, isDragging, isResizable, isStickyLeftColumn } = options;\n\n    return classNames(\n        'table-head-cell',\n        column.sortable && 'table-head-cell-sortable',\n        isDraggable && 'table-head-cell-draggable',\n        isDragging && 'table-head-cell-dragging',\n        isResizable && 'table-head-cell-resizable',\n        isStickyLeftColumn && 'table-head-cell-sticky-left-column',\n        column.columnStart + column.colSpan - 1 < header.totalColumnCount && 'table-head-cell-has-column-divider',\n        column.rowStart + column.rowSpan - 1 < header.rowCount && 'table-head-cell-has-row-divider',\n        getHorizontalAlignClassName(column.horizontalAlign),\n        getVerticalAlignClassName(column.verticalAlign),\n        column.hideOnMobile && 'table-hide-mobile',\n        column.headerClassName\n    );\n};\n"],"names":["resolveHeaderCellClassName","column","header","options","isDraggable","isDragging","isResizable","isStickyLeftColumn","classNames","getHorizontalAlignClassName","getVerticalAlignClassName"],"mappings":";;AAKO,MAAMA,IAA6B,CACtCC,GACAC,GACAC,MAMC;AACD,QAAM,EAAE,aAAAC,GAAa,YAAAC,GAAY,aAAAC,GAAa,oBAAAC,MAAuBJ;AAErE,SAAOK;AAAA,IACH;AAAA,IACAP,EAAO,YAAY;AAAA,IACnBG,KAAe;AAAA,IACfC,KAAc;AAAA,IACdC,KAAe;AAAA,IACfC,KAAsB;AAAA,IACtBN,EAAO,cAAcA,EAAO,UAAU,IAAIC,EAAO,oBAAoB;AAAA,IACrED,EAAO,WAAWA,EAAO,UAAU,IAAIC,EAAO,YAAY;AAAA,IAC1DO,EAA4BR,EAAO,eAAe;AAAA,IAClDS,EAA0BT,EAAO,aAAa;AAAA,IAC9CA,EAAO,gBAAgB;AAAA,IACvBA,EAAO;AAAA,EAAA;AAEf;"}
+{"version":3,"file":"resolveHeaderCellClassName.js","sources":["../../../../../src/components/table/render/header/resolveHeaderCellClassName.ts"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport { getHorizontalAlignClassName, getVerticalAlignClassName } from '../../shared/getAlignClassName';\nimport type { TableRowData } from '../../Table.types';\nimport type { HeaderColumn } from './TableHeader.types';\n\nexport const resolveHeaderCellClassName = (\n    column: HeaderColumn<TableRowData>,\n    header: NonNullable<{ columns: HeaderColumn<TableRowData>[]; rowCount: number; totalColumnCount: number }>,\n    options: {\n        isDraggable?: boolean;\n        isDragging?: boolean;\n        isResizable: boolean;\n        isStickyLeftColumn?: boolean;\n        isStickyRightColumn?: boolean;\n    }\n) => {\n    const { isDraggable, isDragging, isResizable, isStickyLeftColumn, isStickyRightColumn } = options;\n\n    return classNames(\n        'table-head-cell',\n        column.sortable && 'table-head-cell-sortable',\n        isDraggable && 'table-head-cell-draggable',\n        isDragging && 'table-head-cell-dragging',\n        isResizable && 'table-head-cell-resizable',\n        isStickyLeftColumn && 'table-head-cell-sticky-left-column',\n        isStickyRightColumn && 'table-head-cell-sticky-right-column',\n        column.columnStart + column.colSpan - 1 < header.totalColumnCount && 'table-head-cell-has-column-divider',\n        column.rowStart + column.rowSpan - 1 < header.rowCount && 'table-head-cell-has-row-divider',\n        getHorizontalAlignClassName(column.horizontalAlign),\n        getVerticalAlignClassName(column.verticalAlign),\n        column.hideOnMobile && 'table-hide-mobile',\n        column.headerClassName\n    );\n};\n"],"names":["resolveHeaderCellClassName","column","header","options","isDraggable","isDragging","isResizable","isStickyLeftColumn","isStickyRightColumn","classNames","getHorizontalAlignClassName","getVerticalAlignClassName"],"mappings":";;AAKO,MAAMA,IAA6B,CACtCC,GACAC,GACAC,MAOC;AACD,QAAM,EAAE,aAAAC,GAAa,YAAAC,GAAY,aAAAC,GAAa,oBAAAC,GAAoB,qBAAAC,MAAwBL;AAE1F,SAAOM;AAAA,IACH;AAAA,IACAR,EAAO,YAAY;AAAA,IACnBG,KAAe;AAAA,IACfC,KAAc;AAAA,IACdC,KAAe;AAAA,IACfC,KAAsB;AAAA,IACtBC,KAAuB;AAAA,IACvBP,EAAO,cAAcA,EAAO,UAAU,IAAIC,EAAO,oBAAoB;AAAA,IACrED,EAAO,WAAWA,EAAO,UAAU,IAAIC,EAAO,YAAY;AAAA,IAC1DQ,EAA4BT,EAAO,eAAe;AAAA,IAClDU,EAA0BV,EAAO,aAAa;AAAA,IAC9CA,EAAO,gBAAgB;AAAA,IACvBA,EAAO;AAAA,EAAA;AAEf;"}

package/components/table/runtime/useResolvedRenderColumns.d.ts

@@ -19,20 +19,20 @@ export type UseResolvedRenderColumnsReturn<RowType extends TableRowData> = {
     handleColumnResizeStart: ReturnType<typeof useResizableColumns<RowType>>['handleColumnResizeStart'];
     lastResizableColumnKey?: string;
     resettableColumnKeys: Set<string>;
-    renderLeafColumns: RenderHeaderColumn<RowType>[];
+    renderDataColumns: RenderHeaderColumn<RowType>[];
     resizeColumnsEnabled: boolean;
     resolvedRenderColumns: RenderHeaderColumn<RowType>[];
     resizedColumns: ReturnType<typeof useResizableColumns<RowType>>['resizedColumns'];
 };
 /**
- * Resolves the leaf-level table columns that drive layout and column behavior.
+ * Resolves the actual data columns that drive layout and column behavior.
  *
  * Header registration can contain grouped header cells, multi-row headers, and
  * other metadata that is useful for rendering, but drag, resize, sticky layout,
- * and body/footer cell placement ultimately need a flat list of leaf columns.
+ * and body/footer cell placement ultimately need a flat list of actual data columns.
  *
  * This hook therefore:
- * - narrows registered header cells down to leaf columns with a stable `columnKey`
+ * - narrows registered header cells down to single-column data headers with a stable `columnKey`
  * - applies column reordering
  * - applies resized widths
  * - exposes a normalized column map for body/footer cell lookup