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

package/components/table/Table.types.d.ts

@@ -7,6 +7,7 @@ export type TableViewType = 'TABLE' | 'SINGLE_CARD' | 'MULTI_CARDS';
 export type TableSortDirection = 'asc' | 'desc';
 export type TableRowId = string | number;
 export type TableRowData = Record<string, unknown>;
+export type TableStickyReference = 'applicationLayout' | 'container';
 export type TableCardsStyleSettings = {
     /**
      * Minimum card width for `MULTI_CARDS` view.
@@ -33,6 +34,16 @@ export type TableCardsStyleSettings = {
      */
     contentClassName?: string;
 };
+export type TableResponsiveBreakpoint = {
+    /**
+     * Switch to `MULTI_CARDS` below this rendered table width.
+     */
+    cards?: number | string;
+    /**
+     * Switch to `SINGLE_CARD` below this rendered table width.
+     */
+    list?: number | string;
+};
 /**
  * High-level animation settings for expanded table rows.
  *
@@ -55,7 +66,16 @@ export type TableStickyColumns = {
      */
     left?: 1;
     /**
-     * Aligns footer cells with the sticky left column behavior.
+     * Number of currently rightmost visible data columns to keep sticky in `TABLE` view.
+     *
+     * This is position-based and follows column reordering.
+     * Selection columns and group rows are ignored.
+     *
+     * The public API currently supports `1`.
+     */
+    right?: 1;
+    /**
+     * Aligns footer cells with the sticky column behavior.
      *
      * By default, the footer stays independent so it can still span the selection column
      * or the full table width for summary and batch-action use cases.
@@ -161,6 +181,7 @@ export type TableColumn<RowType extends TableRowData> = TableColumnDefinition<Ro
 export type TableRowClassName<RowType extends TableRowData> = string | ((row: RowType, rowIndex: number) => string);
 export type TableCellClassName<RowType extends TableRowData> = (row: RowType, column: TableColumnDefinition<RowType>, rowIndex: number, columnIndex: number) => string;
 export type TableRowAnimationProps<RowType extends TableRowData> = MotionProps | ((row: RowType, rowIndex: number) => MotionProps);
+export type TableRowSelectable<RowType extends TableRowData> = (row: RowType, rowIndex: number) => boolean;
 export type TableProps<RowType extends TableRowData> = Omit<HTMLAttributes<HTMLDivElement>, 'draggable' | 'onClick'> & {
     /**
      * Row key accessor for resolving a stable unique row id.
@@ -183,6 +204,24 @@ export type TableProps<RowType extends TableRowData> = Omit<HTMLAttributes<HTMLD
      * Card width configuration for `MULTI_CARDS` view.
      */
     cardsStyle?: TableCardsStyleSettings;
+    /**
+     * Automatically switches `TABLE` view when the rendered table width changes.
+     *
+     * Use `cards` to switch to `MULTI_CARDS` and `list` to switch to `SINGLE_CARD`.
+     * The object may contain either key or both.
+     *
+     * Accepts pixel numbers or CSS length values such as `720`, `'720px'`, or `'50vw'`.
+     */
+    responsiveBreakpoint?: TableResponsiveBreakpoint;
+    /**
+     * Called whenever the effective rendered view changes after applying responsive breakpoint logic.
+     *
+     * This can differ from `viewType` when `responsiveBreakpoint` forces an automatic switch.
+     * In controlled setups, you can use this callback to keep the external `viewType` state in sync.
+     *
+     * Only used when `responsiveBreakpoint` is provided.
+     */
+    onViewTypeChange?: (viewType: TableViewType) => void;
     /**
      * Compact row/cell spacing like old `table-condensed`.
      *
@@ -246,16 +285,27 @@ export type TableProps<RowType extends TableRowData> = Omit<HTMLAttributes<HTMLD
      * @default '1px'
      */
     rowSeparatorWidth?: number | string;
+    /**
+     * Controls which scroll context sticky headers and sticky rows align to in `TABLE` view.
+     *
+     * Use `applicationLayout` when the page scroll happens in the default app body.
+     * Use `container` when the table sits inside its own explicit overflow container.
+     *
+     * Sticky rows inside `TableBody maxHeight` continue to pin within that internal body scroller.
+     *
+     * @default 'applicationLayout'
+     */
+    stickyReference?: TableStickyReference;
     /**
      * Sticky column behavior in `TABLE` view.
      *
-     * `left` is position-based and follows column reordering.
+     * `left` and `right` are position-based and follow column reordering.
      * Selection columns and group rows are ignored.
      *
-     * The public API currently supports `left: 1`.
+     * The public API currently supports `left: 1` and `right: 1`.
      *
      * @example
-     * stickyColumns={{ left: 1, footer: true }}
+     * stickyColumns={{ left: 1, right: 1, footer: true }}
      */
     stickyColumns?: TableStickyColumns;
     /**
@@ -315,6 +365,14 @@ export type TableProps<RowType extends TableRowData> = Omit<HTMLAttributes<HTMLD
      * Called when checkbox selection changes.
      */
     onSelectionChange?: (rowIds: TableRowId[]) => void;
+    /**
+     * Hides selection checkboxes for rows marked with `selectable={false}`.
+     *
+     * Those rows stay interactive for hover, click handling, and active-row state.
+     *
+     * @default false
+     */
+    hideSelectionCheckboxesForExcludedRows?: boolean;
     /**
      * Currently selected row keys for multi-selection use cases.
      */

package/components/table/TableColumn.d.ts

@@ -11,7 +11,14 @@ export type TableColumnProps = TableHtmlAttributes & {
     children?: ReactNode;
     /**
      * Optional explicit column key.
-     * If omitted, the cell is matched by its position inside `<TableRow>`.
+     *
+     * In `TableBody`, this should usually match the `columnKey` of the corresponding
+     * `TableHeaderColumn` for the same data column. If omitted, the cell is matched by its position inside
+     * the current row.
+     *
+     * Position-based matching is mainly useful for simple rows that mirror the header
+     * order exactly. For spanned cells, reordered columns, or more complex row layouts,
+     * prefer an explicit `columnKey`.
      */
     columnKey?: string;
     /**

package/components/table/TableColumn.js

@@ -1,35 +1,35 @@
-import { jsx as u, jsxs as F } from "react/jsx-runtime";
-import a from "../../utils/classNames.js";
-import { getVerticalAlignClassName as K, getHorizontalAlignClassName as I } from "./shared/getAlignClassName.js";
-import L from "./shared/getCellContentOverflowClassName.js";
-import { resolveAriaSpan as V, resolveAriaColIndex as R } from "./shared/resolveTableAria.js";
-import { useOptionalTableInteractionContext as j } from "./context/TableInteractionContext.js";
-import { useOptionalTableLayoutContext as H } from "./context/TableLayoutContext.js";
-import { useOptionalTableRenderConfigContext as P } from "./context/TableRenderConfigContext.js";
-import { useOptionalTableSection as $, useTableRowContext as q } from "./context/TableStructureContext.js";
-import { useOptionalTableRenderContext as E } from "./context/TableRenderContext.js";
-const oe = (T) => {
+import { jsx as b, jsxs as j } from "react/jsx-runtime";
+import c from "../../utils/classNames.js";
+import { getVerticalAlignClassName as I, getHorizontalAlignClassName as L } from "./shared/getAlignClassName.js";
+import T from "./shared/getCellContentOverflowClassName.js";
+import { resolveAriaSpan as H, resolveAriaColIndex as D } from "./shared/resolveTableAria.js";
+import { useOptionalTableInteractionContext as P } from "./context/TableInteractionContext.js";
+import { useOptionalTableLayoutContext as $ } from "./context/TableLayoutContext.js";
+import { useOptionalTableRenderConfigContext as q } from "./context/TableRenderConfigContext.js";
+import { useOptionalTableSection as E, useTableRowContext as G } from "./context/TableStructureContext.js";
+import { useOptionalTableRenderContext as J } from "./context/TableRenderContext.js";
+const ne = (F) => {
   const {
-    children: h,
+    children: f,
     className: g,
-    colSpan: b = 1,
-    columnKey: o,
-    horizontalAlign: D,
-    overflow: p = "hidden",
-    preventRowClick: s = !1,
-    value: x,
-    verticalAlign: M,
-    ...v
-  } = T, n = P(), t = E(), r = j(), f = H(), y = $(), i = q(), c = y === "body", m = y === "footer";
-  if (!t || !n || !r || !f || t.columns.length === 0 || !c && !m || c && !i)
+    colSpan: h = 1,
+    columnKey: t,
+    horizontalAlign: M,
+    overflow: y = "hidden",
+    preventRowClick: m = !1,
+    value: p,
+    verticalAlign: W,
+    ...x
+  } = F, n = q(), o = J(), d = P(), i = $(), v = E(), a = G(), s = v === "body", r = v === "footer";
+  if (!o || !n || !d || !i || o.columns.length === 0 || !s && !r || s && !a)
     return null;
-  const N = o !== void 0 ? t.columnIndexByKey.get(o) : void 0, d = i?.nextColumnIndex(N, b) ?? N ?? -1;
-  if (d < 0)
+  const N = t !== void 0 ? o.columnIndexByKey.get(t) : void 0, u = a?.nextColumnIndex(N, h) ?? N ?? -1;
+  if (u < 0)
     return null;
-  const e = t.columns[d], l = d + 1, W = l + (r.showSelectionColumn ? 1 : 0), w = D ?? e?.horizontalAlign, z = M ?? e?.verticalAlign, A = c && i?.rowData && n.cellClassName?.(
-    i.rowData,
-    t.columnDefinitionsByKey.get(e?.columnKey ?? o ?? "") ?? {
-      key: e?.columnKey ?? o ?? String(l),
+  const e = o.columns[u], l = u + 1, B = l + (d.showSelectionColumn ? 1 : 0), w = M ?? e?.horizontalAlign, k = W ?? e?.verticalAlign, S = s && a?.rowData && n.cellClassName?.(
+    a.rowData,
+    o.columnDefinitionsByKey.get(e?.columnKey ?? t ?? "") ?? {
+      key: e?.columnKey ?? t ?? String(l),
       label: e?.label ?? "",
       icon: e?.icon,
       filter: e?.filter,
@@ -45,64 +45,66 @@ const oe = (T) => {
       hideOnMobile: e?.hideOnMobile,
       sortable: e?.sortable
     },
-    i.rowIndex,
-    d
-  ), S = f.stickyLeftColumnCount ?? 0, k = S > 0 && l <= S, O = e?.mobileLabel ?? (typeof e?.label == "string" ? e.label : ""), C = (B) => {
-    B.stopPropagation();
+    a.rowIndex,
+    u
+  ), z = i.stickyLeftColumnCount ?? 0, A = i.stickyRightColumnCount ?? 0, R = z > 0 && l <= z, O = A > 0 && l > o.columns.length - A, K = e?.mobileLabel ?? (typeof e?.label == "string" ? e.label : ""), C = (V) => {
+    V.stopPropagation();
   };
-  return m && (t.renderDraft.hasFooterCells = !0), n.isTableView ? /* @__PURE__ */ u(
+  return r && (o.renderDraft.hasFooterCells = !0), n.isTableView ? /* @__PURE__ */ b(
     "div",
     {
-      ...v,
-      className: a(
+      ...x,
+      className: c(
         "table-cell",
-        m && "table-footer-cell",
-        c && k && "table-cell-sticky-left-column",
-        m && f.stickyFooter && k && "table-footer-cell-sticky-left-column",
-        I(w),
-        K(z),
+        r && "table-footer-cell",
+        s && R && "table-cell-sticky-left-column",
+        s && O && "table-cell-sticky-right-column",
+        r && i.stickyFooter && R && "table-footer-cell-sticky-left-column",
+        r && i.stickyFooter && O && "table-footer-cell-sticky-right-column",
+        L(w),
+        I(k),
         e?.hideOnMobile && "table-hide-mobile",
-        A,
+        S,
         g
       ),
-      "data-column": e?.columnKey ?? o ?? l,
+      "data-column": e?.columnKey ?? t ?? l,
       role: "cell",
-      "aria-colindex": R(l, r.showSelectionColumn),
-      "aria-colspan": V(b),
-      onClick: s ? C : void 0,
-      onKeyDown: s ? C : void 0,
-      style: { gridColumn: `${W} / span ${b}` },
-      children: /* @__PURE__ */ u("div", { className: a("table-cell-content", L(p)), children: x ?? h ?? "" })
+      "aria-colindex": D(l, d.showSelectionColumn),
+      "aria-colspan": H(h),
+      onClick: m ? C : void 0,
+      onKeyDown: m ? C : void 0,
+      style: { gridColumn: `${B} / span ${h}`, gridRow: "1 / span 1" },
+      children: /* @__PURE__ */ b("div", { className: c("table-cell-content", T(y)), children: p ?? f ?? "" })
     }
-  ) : /* @__PURE__ */ F(
+  ) : /* @__PURE__ */ j(
     "div",
     {
-      ...v,
-      className: a(
+      ...x,
+      className: c(
         "table-cell",
         n.cardClasses.cellClassName,
-        I(w),
-        K(z),
+        L(w),
+        I(k),
         e?.hideOnMobile && "table-hide-mobile",
-        A,
+        S,
         g
       ),
-      "data-column": e?.columnKey ?? o ?? l,
+      "data-column": e?.columnKey ?? t ?? l,
       role: "cell",
-      "aria-colindex": R(l, r.showSelectionColumn),
-      onClick: s ? C : void 0,
-      onKeyDown: s ? C : void 0,
+      "aria-colindex": D(l, d.showSelectionColumn),
+      onClick: m ? C : void 0,
+      onKeyDown: m ? C : void 0,
       children: [
-        O && /* @__PURE__ */ u("div", { className: a("table-cell-label", n.cardClasses.labelClassName), children: O }),
-        /* @__PURE__ */ u(
+        K && /* @__PURE__ */ b("div", { className: c("table-cell-label", n.cardClasses.labelClassName), children: K }),
+        /* @__PURE__ */ b(
           "div",
           {
-            className: a(
+            className: c(
               "table-cell-content",
               n.cardClasses.contentClassName,
-              L(p)
+              T(y)
             ),
-            children: x ?? h ?? ""
+            children: p ?? f ?? ""
           }
         )
       ]
@@ -110,6 +112,6 @@ const oe = (T) => {
   );
 };
 export {
-  oe as default
+  ne as default
 };
 //# sourceMappingURL=TableColumn.js.map

package/components/table/TableColumn.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableColumn.js","sources":["../../../src/components/table/TableColumn.tsx"],"sourcesContent":["import type { KeyboardEvent, MouseEvent, ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport { getHorizontalAlignClassName, getVerticalAlignClassName } from './shared/getAlignClassName';\nimport getCellContentOverflowClassName from './shared/getCellContentOverflowClassName';\nimport { resolveAriaColIndex, resolveAriaSpan } from './shared/resolveTableAria';\nimport type { TableCellOverflow, TableHorizontalAlign, TableHtmlAttributes, TableVerticalAlign } from './Table.types';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useOptionalTableLayoutContext } from './context/TableLayoutContext';\nimport { useOptionalTableRenderConfigContext } from './context/TableRenderConfigContext';\nimport { useOptionalTableSection, useTableRowContext } from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableColumnProps = TableHtmlAttributes & {\n    /**\n     * `TableColumn` may be rendered directly inside `TableFooter`.\n     *\n     * In `TableBody`, columns must be rendered inside a row component such as\n     * `TableRow` or `TableExpandedRow`. Direct `TableColumn` children of\n     * `TableBody` are ignored.\n     */\n    children?: ReactNode;\n\n    /**\n     * Optional explicit column key.\n     * If omitted, the cell is matched by its position inside `<TableRow>`.\n     */\n    columnKey?: string;\n\n    /**\n     * Optional explicit value.\n     */\n    value?: ReactNode;\n\n    /**\n     * Additional classes for this cell only.\n     */\n    className?: string;\n\n    /**\n     * Horizontal alignment override for this cell.\n     */\n    horizontalAlign?: TableHorizontalAlign;\n\n    /**\n     * Vertical alignment override for this cell.\n     */\n    verticalAlign?: TableVerticalAlign;\n\n    /**\n     * Overflow behavior for the cell content wrapper.\n     *\n     * @default 'hidden'\n     */\n    overflow?: TableCellOverflow;\n\n    /**\n     * Number of columns this cell should span.\n     *\n     * Currently used by header and footer-style declarative table sections.\n     */\n    colSpan?: number;\n\n    /**\n     * Prevents clicks and keyboard interactions inside this cell from triggering the parent row click handler.\n     *\n     * Useful for interactive cell content such as dropdowns, inputs, or buttons.\n     *\n     * @default false\n     */\n    preventRowClick?: boolean;\n};\n\nconst TableColumn = (props: TableColumnProps) => {\n    const {\n        children,\n        className,\n        colSpan = 1,\n        columnKey,\n        horizontalAlign,\n        overflow = 'hidden',\n        preventRowClick = false,\n        value,\n        verticalAlign,\n        ...remainingProps\n    } = props;\n\n    const renderConfigContext = useOptionalTableRenderConfigContext();\n    const renderContext = useOptionalTableRenderContext();\n    const interactionContext = useOptionalTableInteractionContext();\n    const layoutContext = useOptionalTableLayoutContext();\n    const section = useOptionalTableSection();\n    const rowContext = useTableRowContext();\n\n    const isBodySection = section === 'body';\n    const isFooterSection = section === 'footer';\n\n    if (\n        !renderContext ||\n        !renderConfigContext ||\n        !interactionContext ||\n        !layoutContext ||\n        renderContext.columns.length === 0 ||\n        (!isBodySection && !isFooterSection)\n    ) {\n        return null;\n    }\n\n    if (isBodySection && !rowContext) {\n        return null;\n    }\n\n    const explicitColumnIndex = columnKey !== undefined ? renderContext.columnIndexByKey.get(columnKey) : undefined;\n    const columnIndex = rowContext?.nextColumnIndex(explicitColumnIndex, colSpan) ?? explicitColumnIndex ?? -1;\n\n    if (columnIndex < 0) {\n        return null;\n    }\n\n    const renderColumn = renderContext.columns[columnIndex];\n    const baseColumnStart = columnIndex + 1;\n    const resolvedColumnStart = baseColumnStart + (interactionContext.showSelectionColumn ? 1 : 0);\n    const resolvedHorizontalAlign = horizontalAlign ?? renderColumn?.horizontalAlign;\n    const resolvedVerticalAlign = verticalAlign ?? renderColumn?.verticalAlign;\n\n    const resolvedCellClassName =\n        isBodySection &&\n        rowContext?.rowData &&\n        renderConfigContext.cellClassName?.(\n            rowContext.rowData,\n            renderContext.columnDefinitionsByKey.get(renderColumn?.columnKey ?? columnKey ?? '') ?? {\n                key: renderColumn?.columnKey ?? columnKey ?? String(baseColumnStart),\n                label: renderColumn?.label ?? '',\n                icon: renderColumn?.icon,\n                filter: renderColumn?.filter,\n                hideLabel: renderColumn?.hideLabel,\n                width: renderColumn?.width,\n                minResizeWidth: renderColumn?.minResizeWidth,\n                maxResizeWidth: renderColumn?.maxResizeWidth,\n                draggable: renderColumn?.draggable,\n                resizeable: renderColumn?.resizeable,\n                horizontalAlign: renderColumn?.horizontalAlign,\n                className: undefined,\n                headerClassName: renderColumn?.headerClassName,\n                hideOnMobile: renderColumn?.hideOnMobile,\n                sortable: renderColumn?.sortable,\n            },\n            rowContext.rowIndex,\n            columnIndex\n        );\n\n    const stickyLeftColumns = layoutContext.stickyLeftColumnCount ?? 0;\n    const isStickyLeftColumn = stickyLeftColumns > 0 && baseColumnStart <= stickyLeftColumns;\n\n    const mobileLabel =\n        renderColumn?.mobileLabel ?? (typeof renderColumn?.label === 'string' ? renderColumn.label : '');\n\n    const handleCellInteraction = (event: KeyboardEvent<HTMLDivElement> | MouseEvent<HTMLDivElement>) => {\n        event.stopPropagation();\n    };\n\n    if (isFooterSection) {\n        renderContext.renderDraft.hasFooterCells = true;\n    }\n\n    if (renderConfigContext.isTableView) {\n        return (\n            <div\n                {...remainingProps}\n                className={classNames(\n                    'table-cell',\n                    isFooterSection && 'table-footer-cell',\n                    isBodySection && isStickyLeftColumn && 'table-cell-sticky-left-column',\n                    isFooterSection &&\n                        layoutContext.stickyFooter &&\n                        isStickyLeftColumn &&\n                        'table-footer-cell-sticky-left-column',\n                    getHorizontalAlignClassName(resolvedHorizontalAlign),\n                    getVerticalAlignClassName(resolvedVerticalAlign),\n                    renderColumn?.hideOnMobile && 'table-hide-mobile',\n                    resolvedCellClassName,\n                    className\n                )}\n                data-column={renderColumn?.columnKey ?? columnKey ?? baseColumnStart}\n                role='cell'\n                aria-colindex={resolveAriaColIndex(baseColumnStart, interactionContext.showSelectionColumn)}\n                aria-colspan={resolveAriaSpan(colSpan)}\n                onClick={preventRowClick ? handleCellInteraction : undefined}\n                onKeyDown={preventRowClick ? handleCellInteraction : undefined}\n                style={{ gridColumn: `${resolvedColumnStart} / span ${colSpan}` }}\n            >\n                <div className={classNames('table-cell-content', getCellContentOverflowClassName(overflow))}>\n                    {value ?? children ?? ''}\n                </div>\n            </div>\n        );\n    }\n\n    return (\n        <div\n            {...remainingProps}\n            className={classNames(\n                'table-cell',\n                renderConfigContext.cardClasses.cellClassName,\n                getHorizontalAlignClassName(resolvedHorizontalAlign),\n                getVerticalAlignClassName(resolvedVerticalAlign),\n                renderColumn?.hideOnMobile && 'table-hide-mobile',\n                resolvedCellClassName,\n                className\n            )}\n            data-column={renderColumn?.columnKey ?? columnKey ?? baseColumnStart}\n            role='cell'\n            aria-colindex={resolveAriaColIndex(baseColumnStart, interactionContext.showSelectionColumn)}\n            onClick={preventRowClick ? handleCellInteraction : undefined}\n            onKeyDown={preventRowClick ? handleCellInteraction : undefined}\n        >\n            {mobileLabel && (\n                <div className={classNames('table-cell-label', renderConfigContext.cardClasses.labelClassName)}>\n                    {mobileLabel}\n                </div>\n            )}\n            <div\n                className={classNames(\n                    'table-cell-content',\n                    renderConfigContext.cardClasses.contentClassName,\n                    getCellContentOverflowClassName(overflow)\n                )}\n            >\n                {value ?? children ?? ''}\n            </div>\n        </div>\n    );\n};\n\nexport default TableColumn;\n"],"names":["TableColumn","props","children","className","colSpan","columnKey","horizontalAlign","overflow","preventRowClick","value","verticalAlign","remainingProps","renderConfigContext","useOptionalTableRenderConfigContext","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","layoutContext","useOptionalTableLayoutContext","section","useOptionalTableSection","rowContext","useTableRowContext","isBodySection","isFooterSection","explicitColumnIndex","columnIndex","renderColumn","baseColumnStart","resolvedColumnStart","resolvedHorizontalAlign","resolvedVerticalAlign","resolvedCellClassName","stickyLeftColumns","isStickyLeftColumn","mobileLabel","handleCellInteraction","event","jsx","classNames","getHorizontalAlignClassName","getVerticalAlignClassName","resolveAriaColIndex","resolveAriaSpan","getCellContentOverflowClassName","jsxs"],"mappings":"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"}
+{"version":3,"file":"TableColumn.js","sources":["../../../src/components/table/TableColumn.tsx"],"sourcesContent":["import type { KeyboardEvent, MouseEvent, ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport { getHorizontalAlignClassName, getVerticalAlignClassName } from './shared/getAlignClassName';\nimport getCellContentOverflowClassName from './shared/getCellContentOverflowClassName';\nimport { resolveAriaColIndex, resolveAriaSpan } from './shared/resolveTableAria';\nimport type { TableCellOverflow, TableHorizontalAlign, TableHtmlAttributes, TableVerticalAlign } from './Table.types';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useOptionalTableLayoutContext } from './context/TableLayoutContext';\nimport { useOptionalTableRenderConfigContext } from './context/TableRenderConfigContext';\nimport { useOptionalTableSection, useTableRowContext } from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableColumnProps = TableHtmlAttributes & {\n    /**\n     * `TableColumn` may be rendered directly inside `TableFooter`.\n     *\n     * In `TableBody`, columns must be rendered inside a row component such as\n     * `TableRow` or `TableExpandedRow`. Direct `TableColumn` children of\n     * `TableBody` are ignored.\n     */\n    children?: ReactNode;\n\n    /**\n     * Optional explicit column key.\n     *\n     * In `TableBody`, this should usually match the `columnKey` of the corresponding\n     * `TableHeaderColumn` for the same data column. If omitted, the cell is matched by its position inside\n     * the current row.\n     *\n     * Position-based matching is mainly useful for simple rows that mirror the header\n     * order exactly. For spanned cells, reordered columns, or more complex row layouts,\n     * prefer an explicit `columnKey`.\n     */\n    columnKey?: string;\n\n    /**\n     * Optional explicit value.\n     */\n    value?: ReactNode;\n\n    /**\n     * Additional classes for this cell only.\n     */\n    className?: string;\n\n    /**\n     * Horizontal alignment override for this cell.\n     */\n    horizontalAlign?: TableHorizontalAlign;\n\n    /**\n     * Vertical alignment override for this cell.\n     */\n    verticalAlign?: TableVerticalAlign;\n\n    /**\n     * Overflow behavior for the cell content wrapper.\n     *\n     * @default 'hidden'\n     */\n    overflow?: TableCellOverflow;\n\n    /**\n     * Number of columns this cell should span.\n     *\n     * Currently used by header and footer-style declarative table sections.\n     */\n    colSpan?: number;\n\n    /**\n     * Prevents clicks and keyboard interactions inside this cell from triggering the parent row click handler.\n     *\n     * Useful for interactive cell content such as dropdowns, inputs, or buttons.\n     *\n     * @default false\n     */\n    preventRowClick?: boolean;\n};\n\nconst TableColumn = (props: TableColumnProps) => {\n    const {\n        children,\n        className,\n        colSpan = 1,\n        columnKey,\n        horizontalAlign,\n        overflow = 'hidden',\n        preventRowClick = false,\n        value,\n        verticalAlign,\n        ...remainingProps\n    } = props;\n\n    const renderConfigContext = useOptionalTableRenderConfigContext();\n    const renderContext = useOptionalTableRenderContext();\n    const interactionContext = useOptionalTableInteractionContext();\n    const layoutContext = useOptionalTableLayoutContext();\n    const section = useOptionalTableSection();\n    const rowContext = useTableRowContext();\n\n    const isBodySection = section === 'body';\n    const isFooterSection = section === 'footer';\n\n    if (\n        !renderContext ||\n        !renderConfigContext ||\n        !interactionContext ||\n        !layoutContext ||\n        renderContext.columns.length === 0 ||\n        (!isBodySection && !isFooterSection)\n    ) {\n        return null;\n    }\n\n    if (isBodySection && !rowContext) {\n        return null;\n    }\n\n    const explicitColumnIndex = columnKey !== undefined ? renderContext.columnIndexByKey.get(columnKey) : undefined;\n    const columnIndex = rowContext?.nextColumnIndex(explicitColumnIndex, colSpan) ?? explicitColumnIndex ?? -1;\n\n    if (columnIndex < 0) {\n        return null;\n    }\n\n    const renderColumn = renderContext.columns[columnIndex];\n    const baseColumnStart = columnIndex + 1;\n    const resolvedColumnStart = baseColumnStart + (interactionContext.showSelectionColumn ? 1 : 0);\n    const resolvedHorizontalAlign = horizontalAlign ?? renderColumn?.horizontalAlign;\n    const resolvedVerticalAlign = verticalAlign ?? renderColumn?.verticalAlign;\n\n    const resolvedCellClassName =\n        isBodySection &&\n        rowContext?.rowData &&\n        renderConfigContext.cellClassName?.(\n            rowContext.rowData,\n            renderContext.columnDefinitionsByKey.get(renderColumn?.columnKey ?? columnKey ?? '') ?? {\n                key: renderColumn?.columnKey ?? columnKey ?? String(baseColumnStart),\n                label: renderColumn?.label ?? '',\n                icon: renderColumn?.icon,\n                filter: renderColumn?.filter,\n                hideLabel: renderColumn?.hideLabel,\n                width: renderColumn?.width,\n                minResizeWidth: renderColumn?.minResizeWidth,\n                maxResizeWidth: renderColumn?.maxResizeWidth,\n                draggable: renderColumn?.draggable,\n                resizeable: renderColumn?.resizeable,\n                horizontalAlign: renderColumn?.horizontalAlign,\n                className: undefined,\n                headerClassName: renderColumn?.headerClassName,\n                hideOnMobile: renderColumn?.hideOnMobile,\n                sortable: renderColumn?.sortable,\n            },\n            rowContext.rowIndex,\n            columnIndex\n        );\n\n    const stickyLeftColumns = layoutContext.stickyLeftColumnCount ?? 0;\n    const stickyRightColumns = layoutContext.stickyRightColumnCount ?? 0;\n    const isStickyLeftColumn = stickyLeftColumns > 0 && baseColumnStart <= stickyLeftColumns;\n    const isStickyRightColumn =\n        stickyRightColumns > 0 && baseColumnStart > renderContext.columns.length - stickyRightColumns;\n\n    const mobileLabel =\n        renderColumn?.mobileLabel ?? (typeof renderColumn?.label === 'string' ? renderColumn.label : '');\n\n    const handleCellInteraction = (event: KeyboardEvent<HTMLDivElement> | MouseEvent<HTMLDivElement>) => {\n        event.stopPropagation();\n    };\n\n    if (isFooterSection) {\n        renderContext.renderDraft.hasFooterCells = true;\n    }\n\n    if (renderConfigContext.isTableView) {\n        return (\n            <div\n                {...remainingProps}\n                className={classNames(\n                    'table-cell',\n                    isFooterSection && 'table-footer-cell',\n                    isBodySection && isStickyLeftColumn && 'table-cell-sticky-left-column',\n                    isBodySection && isStickyRightColumn && 'table-cell-sticky-right-column',\n                    isFooterSection &&\n                        layoutContext.stickyFooter &&\n                        isStickyLeftColumn &&\n                        'table-footer-cell-sticky-left-column',\n                    isFooterSection &&\n                        layoutContext.stickyFooter &&\n                        isStickyRightColumn &&\n                        'table-footer-cell-sticky-right-column',\n                    getHorizontalAlignClassName(resolvedHorizontalAlign),\n                    getVerticalAlignClassName(resolvedVerticalAlign),\n                    renderColumn?.hideOnMobile && 'table-hide-mobile',\n                    resolvedCellClassName,\n                    className\n                )}\n                data-column={renderColumn?.columnKey ?? columnKey ?? baseColumnStart}\n                role='cell'\n                aria-colindex={resolveAriaColIndex(baseColumnStart, interactionContext.showSelectionColumn)}\n                aria-colspan={resolveAriaSpan(colSpan)}\n                onClick={preventRowClick ? handleCellInteraction : undefined}\n                onKeyDown={preventRowClick ? handleCellInteraction : undefined}\n                style={{ gridColumn: `${resolvedColumnStart} / span ${colSpan}`, gridRow: '1 / span 1' }}\n            >\n                <div className={classNames('table-cell-content', getCellContentOverflowClassName(overflow))}>\n                    {value ?? children ?? ''}\n                </div>\n            </div>\n        );\n    }\n\n    return (\n        <div\n            {...remainingProps}\n            className={classNames(\n                'table-cell',\n                renderConfigContext.cardClasses.cellClassName,\n                getHorizontalAlignClassName(resolvedHorizontalAlign),\n                getVerticalAlignClassName(resolvedVerticalAlign),\n                renderColumn?.hideOnMobile && 'table-hide-mobile',\n                resolvedCellClassName,\n                className\n            )}\n            data-column={renderColumn?.columnKey ?? columnKey ?? baseColumnStart}\n            role='cell'\n            aria-colindex={resolveAriaColIndex(baseColumnStart, interactionContext.showSelectionColumn)}\n            onClick={preventRowClick ? handleCellInteraction : undefined}\n            onKeyDown={preventRowClick ? handleCellInteraction : undefined}\n        >\n            {mobileLabel && (\n                <div className={classNames('table-cell-label', renderConfigContext.cardClasses.labelClassName)}>\n                    {mobileLabel}\n                </div>\n            )}\n            <div\n                className={classNames(\n                    'table-cell-content',\n                    renderConfigContext.cardClasses.contentClassName,\n                    getCellContentOverflowClassName(overflow)\n                )}\n            >\n                {value ?? children ?? ''}\n            </div>\n        </div>\n    );\n};\n\nexport default TableColumn;\n"],"names":["TableColumn","props","children","className","colSpan","columnKey","horizontalAlign","overflow","preventRowClick","value","verticalAlign","remainingProps","renderConfigContext","useOptionalTableRenderConfigContext","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","layoutContext","useOptionalTableLayoutContext","section","useOptionalTableSection","rowContext","useTableRowContext","isBodySection","isFooterSection","explicitColumnIndex","columnIndex","renderColumn","baseColumnStart","resolvedColumnStart","resolvedHorizontalAlign","resolvedVerticalAlign","resolvedCellClassName","stickyLeftColumns","stickyRightColumns","isStickyLeftColumn","isStickyRightColumn","mobileLabel","handleCellInteraction","event","jsx","classNames","getHorizontalAlignClassName","getVerticalAlignClassName","resolveAriaColIndex","resolveAriaSpan","getCellContentOverflowClassName","jsxs"],"mappings":"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"}

package/components/table/TableExpandedRow.d.ts

@@ -9,6 +9,10 @@ export type TableExpandedRowProps<RowType extends TableRowData> = TableHtmlAttri
      * Optional class names only for this expanded row.
      */
     className?: string;
+    /**
+     * Excludes this row from table selection while keeping the row interactive.
+     */
+    selectable?: boolean;
     /**
      * Disable table hover styling for this row.
      */

package/components/table/TableExpandedRow.js

@@ -1,41 +1,41 @@
-import { jsx as s, jsxs as _, Fragment as M } from "react/jsx-runtime";
-import { useReducedMotion as j, motion as B } from "motion/react";
-import { useRef as F, useState as H, useMemo as U } from "react";
-import L from "../checkbox/Checkbox.js";
-import A from "../../utils/classNames.js";
-import { resolveRowKey as W, resolveRowClassName as X } from "./model/resolveRowMeta.js";
-import { useOptionalTableInteractionContext as q } from "./context/TableInteractionContext.js";
-import { useOptionalTableRenderConfigContext as z } from "./context/TableRenderConfigContext.js";
-import { useOptionalTableSection as G, useTableBodyContext as J, extractTableHtmlAttributes as I, TableRowContext as Q } from "./context/TableStructureContext.js";
-import { useOptionalTableRenderContext as Y } from "./context/TableRenderContext.js";
-import { getInteractiveRowProps as Z } from "./shared/getInteractiveRowProps.js";
-const u = 0.18, $ = (C) => {
-  const { isSelected: b, isTableView: m, onToggleSelection: x, cardCellClassName: R } = C;
+import { jsx as s, jsxs as M, Fragment as j } from "react/jsx-runtime";
+import { useReducedMotion as B, motion as H } from "motion/react";
+import { useRef as U, useState as L, useMemo as W } from "react";
+import X from "../checkbox/Checkbox.js";
+import P from "../../utils/classNames.js";
+import { resolveRowKey as q, resolveRowClassName as z } from "./model/resolveRowMeta.js";
+import { useOptionalTableInteractionContext as G } from "./context/TableInteractionContext.js";
+import { useOptionalTableRenderConfigContext as J } from "./context/TableRenderConfigContext.js";
+import { useOptionalTableSection as Q, useTableBodyContext as Y, extractTableHtmlAttributes as A, TableRowContext as Z } from "./context/TableStructureContext.js";
+import { useOptionalTableRenderContext as $ } from "./context/TableRenderContext.js";
+import { getInteractiveRowProps as ee } from "./shared/getInteractiveRowProps.js";
+const p = 0.18, oe = (b) => {
+  const { isSelected: C, isSelectable: u, hideSelectionControl: R, isTableView: x, onToggleSelection: h, cardCellClassName: r } = b;
   return /* @__PURE__ */ s(
     "div",
     {
-      className: A("table-cell table-selection-cell", !m && R),
+      className: P("table-cell table-selection-cell", !x && r),
       role: "cell",
       "aria-colindex": 1,
-      style: m ? { gridColumn: "1 / span 1" } : void 0,
-      onClick: (a) => a.stopPropagation(),
-      onKeyDown: (a) => a.stopPropagation(),
-      children: /* @__PURE__ */ s("div", { className: "table-selection-control", children: /* @__PURE__ */ s(L, { checked: b, onChange: x }) })
+      style: x ? { gridColumn: "1 / span 1", gridRow: "1 / span 1" } : void 0,
+      onClick: (e) => e.stopPropagation(),
+      onKeyDown: (e) => e.stopPropagation(),
+      children: !R && /* @__PURE__ */ s("div", { className: "table-selection-control", children: /* @__PURE__ */ s(X, { checked: C, disabled: !u, onChange: h }) })
     }
   );
-}, me = (C) => {
-  const { children: b, className: m, noHover: x, parentKey: R, ...a } = C, e = z(), l = Y(), o = q(), P = G(), y = J(), w = F(0);
-  w.current = 0;
-  const [S, g] = H(!0), f = j(), D = U(
-    () => f ? {
+}, pe = (b) => {
+  const { children: C, className: u, noHover: R, parentKey: x, selectable: h, ...r } = b, e = J(), l = $(), o = G(), k = Q(), y = Y(), m = U(0);
+  m.current = 0;
+  const [D, f] = L(!0), v = B(), O = W(
+    () => v ? {
       initial: { opacity: 0 },
       animate: {
         opacity: 1,
-        transition: { duration: u, ease: "easeInOut" }
+        transition: { duration: p, ease: "easeInOut" }
       },
       exit: {
         opacity: 0,
-        transition: { duration: u, ease: "easeInOut" }
+        transition: { duration: p, ease: "easeInOut" }
       }
     } : {
       initial: { opacity: 0, height: 0, y: -8 },
@@ -43,108 +43,111 @@ const u = 0.18, $ = (C) => {
         opacity: 1,
         height: "auto",
         y: 0,
-        transition: { duration: u, ease: "easeOut" }
+        transition: { duration: p, ease: "easeOut" }
       },
       exit: {
         opacity: 0,
         height: 0,
         y: -8,
-        transition: { duration: u, ease: "easeInOut" }
+        transition: { duration: p, ease: "easeInOut" }
       }
     },
-    [f]
+    [v]
   );
-  if (!l || !e || !o || l.columns.length === 0 || P !== "body" || !y)
+  if (!l || !e || !o || l.columns.length === 0 || k !== "body" || !y)
     return null;
-  const c = a, n = y.nextRowIndex(), t = W(c, n, e.rowKey), k = typeof e.rowAnimationProps == "function" ? e.rowAnimationProps(c, n) : e.rowAnimationProps, i = Z({
+  const c = r, n = y.nextRowIndex(), t = q(c, n, e.rowKey), K = typeof e.rowAnimationProps == "function" ? e.rowAnimationProps(c, n) : e.rowAnimationProps, i = ee({
     isClickable: o.isClickable,
-    onRowClick: (r, d) => {
-      o.onRowClick?.(r, d), o.onActiveRowChange?.(
+    onRowClick: (a, d) => {
+      o.onRowClick?.(a, d), o.onActiveRowChange?.(
         o.activeRowId === t ? void 0 : t,
-        r,
+        a,
         d
       );
     },
     row: c,
     rowIndex: n
   });
-  let p;
-  e.expandedRowAnimation !== !1 && (p = {
-    ...D,
-    ...k
+  let w;
+  e.expandedRowAnimation !== !1 && (w = {
+    ...O,
+    ...K
   });
-  const h = o.selectedRowIdSet.has(t), v = A(
+  const g = o.selectableRowIdSet.has(t), S = g && o.selectedRowIdSet.has(t), T = P(
     "table-row",
     "table-row-expanded-data",
     !e.isTableView && "divider-y-1 divider-color-lighter divider-style-solid",
     o.activeRowId === t && "table-row-active",
-    h && "table-row-selected",
+    S && "table-row-selected",
     i.isClickableClassName,
-    x && "table-row-no-hover",
+    R && "table-row-no-hover",
     !e.isTableView && e.cardClasses.rowClassName,
-    m,
-    X(e.rowClassName, c, n)
-  ), O = o.showSelectionColumn && /* @__PURE__ */ s(
-    $,
+    u,
+    z(e.rowClassName, c, n)
+  ), E = o.showSelectionColumn && /* @__PURE__ */ s(
+    oe,
     {
-      isSelected: h,
+      isSelected: S,
+      isSelectable: g,
+      hideSelectionControl: !g && o.hideSelectionCheckboxesForExcludedRows,
       isTableView: e.isTableView,
       onToggleSelection: () => o.onToggleRowSelection?.(t),
       cardCellClassName: e.cardClasses.cellClassName
     }
-  ), T = /* @__PURE__ */ _(M, { children: [
-    O,
-    b
-  ] }), K = {
-    ...I(a),
-    className: v,
+  ), I = /* @__PURE__ */ M(j, { children: [
+    E,
+    C
+  ] }), V = {
+    ...A(r),
+    className: T,
     "data-index": n,
     "data-row-id": String(t),
     onClick: i.onClick,
     onKeyDown: i.onKeyDown,
     role: "row",
     tabIndex: i.tabIndex
-  }, E = {
-    ...I(a),
-    className: v,
+  }, _ = {
+    ...A(r),
+    className: T,
     "data-index": n,
     "data-row-id": String(t),
     onClick: i.onClick,
     onKeyDown: i.onKeyDown,
     role: "row",
     tabIndex: i.tabIndex,
-    onAnimationStart: () => g(!0),
-    onAnimationComplete: () => g(!1),
-    ...p,
+    onAnimationStart: () => f(!0),
+    onAnimationComplete: () => f(!1),
+    ...w,
     style: {
-      ...p?.style ?? {},
-      overflow: S ? "hidden" : "visible"
+      ...w?.style ?? {},
+      overflow: D ? "hidden" : "visible"
     }
   }, N = /* @__PURE__ */ s(
-    Q.Provider,
+    Z.Provider,
     {
       value: {
-        nextColumnIndex: (r, d = 1) => {
-          if (r !== void 0 && r >= 0)
-            return w.current = r + d, r;
-          const V = w.current;
-          return w.current += d, V;
+        nextColumnIndex: (a, d = 1) => {
+          if (a !== void 0 && a >= 0)
+            return m.current = a + d, a;
+          const F = m.current;
+          return m.current += d, F;
         },
         rowIndex: n,
         rowId: t,
         rowData: c
       },
-      children: p ? /* @__PURE__ */ s(B.div, { ...E, children: T }) : /* @__PURE__ */ s("div", { ...K, children: T })
+      children: w ? /* @__PURE__ */ s(H.div, { ..._, children: I }) : /* @__PURE__ */ s("div", { ...V, children: I })
     }
   );
   return l.renderDraft.hasExpandableRows = !0, l.renderDraft.bodyRows.push({
     rowId: t,
     rowIndex: n,
     kind: "expanded",
+    selectable: h !== !1,
     render: () => N
   }), l.isRegisteringBodyRows ? null : N;
 };
 export {
-  me as default
+  pe as default
 };
 //# sourceMappingURL=TableExpandedRow.js.map