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

package/components/table/Table.js

@@ -0,0 +1,256 @@
+import { jsx as t } from "react/jsx-runtime";
+import { forwardRef as Pe, useRef as Ie, Children as Le, isValidElement as c, Fragment as Me } from "react";
+import Ve from "../../utils/classNames.js";
+import Oe from "../../hooks/useMergeRefs.js";
+import Ge from "./TableBody.js";
+import We from "./TableColumn.js";
+import je from "./TableExpanderButton.js";
+import Ue from "./TableExpandedContentRow.js";
+import qe from "./TableExpandedRow.js";
+import E from "./TableFooter.js";
+import Je from "./TableGroupFooterRow.js";
+import Qe from "./TableGroupRow.js";
+import $ from "./TableHeader.js";
+import Xe from "./TableHeaderColumn.js";
+import Ye from "./TableHeaderRow.js";
+import Ze from "./TableRow.js";
+import _e from "./TableSpacerRow.js";
+import { useTableLayout as eo } from "./layout/useTableLayout.js";
+import { resolveTableClassConfig as oo, resolveTableBaseClassName as ro } from "./model/resolveTableClassConfig.js";
+import to from "./render/header/TableBatchDropdown.js";
+import no from "./render/header/TableColumnFilter.js";
+import lo from "./runtime/useRenderDraftState.js";
+import ao from "./runtime/useResolvedRenderColumns.js";
+import so from "./runtime/useResolvedRenderHeader.js";
+import io from "./selection/useInternalTableSelectionState.js";
+import { TableInteractionContext as mo } from "./context/TableInteractionContext.js";
+import { TableLayoutContext as co } from "./context/TableLayoutContext.js";
+import { TableRenderConfigContext as uo } from "./context/TableRenderConfigContext.js";
+import { TableRenderContext as bo } from "./context/TableRenderContext.js";
+import fo from "./settings/TableColumnsDropdown.js";
+const qo = Ge, Jo = $, Qo = Ye, Xo = Xe, Yo = E, Zo = We, _o = je, er = Ze, or = _e, rr = qe, tr = Ue, nr = Qe, lr = Je, ar = to, sr = no, ir = fo, m = (e, l) => Le.toArray(e).some((o) => l(o) ? !0 : c(o) && o.type === Me ? m(o.props.children, l) : !1), po = (e) => c(e) && e.type === $, Co = (e) => c(e) && e.type === E, dr = Pe(
+  (e, l) => {
+    const {
+      children: o,
+      viewType: n = "TABLE",
+      cardsStyle: u,
+      condensed: z = !1,
+      striped: D = !1,
+      hover: A = !1,
+      shadow: K = !1,
+      border: N = !0,
+      rounded: k = !0,
+      gridLines: P = !1,
+      rowClassName: I,
+      rowKey: L,
+      rowSeparatorWidth: M,
+      stickyColumns: b,
+      activeRowId: V,
+      onActiveRowChange: f,
+      rowAnimationProps: O,
+      expandedRowAnimation: G,
+      sortBy: W,
+      sortDirection: j,
+      onSortChange: U,
+      cellClassName: q,
+      onRowClick: p,
+      onSelectionChange: J,
+      selectedRowIds: Q,
+      selectionHeaderContent: X,
+      columnOrder: Y,
+      onColumnResize: Z,
+      onColumnOrderChange: _,
+      showSelectionColumn: i = !1,
+      noRowsState: ee = "No data available",
+      virtualizedRows: C = !1,
+      virtualizationOverscan: oe = 5,
+      className: R,
+      style: re,
+      ...te
+    } = e, r = Ie({ headerColumns: [], bodyRows: [] });
+    r.current.headerColumns = [], r.current.bodyRows = [], r.current.bodyMaxHeight = void 0, r.current.hasFooter = !1, r.current.hasFooterCells = void 0, r.current.hasExpandableRows = void 0;
+    const {
+      renderHeaderColumns: w,
+      renderBodyRows: T,
+      renderBodyMaxHeight: h,
+      renderHasFooter: ne,
+      renderHasFooterCells: y,
+      renderHasExpandableRows: le,
+      renderBodyRow: ae
+    } = lo(r), {
+      columnDefinitionsByKey: se,
+      columnIndexByKey: ie,
+      draggableColumnKeys: de,
+      draggableColumnsEnabled: v,
+      handleColumnDragEnd: me,
+      handleColumnResizeReset: ce,
+      handleColumnResizeStart: ue,
+      lastResizableColumnKey: be,
+      resettableColumnKeys: fe,
+      resizeColumnsEnabled: a,
+      resolvedRenderColumns: s,
+      resizedColumns: pe
+    } = ao({
+      columnOrder: Y,
+      onColumnOrderChange: _,
+      onColumnResize: Z,
+      renderHeaderColumns: w,
+      viewType: n
+    }), g = so({
+      renderHeaderColumns: w,
+      resolvedRenderColumns: s,
+      sortBy: W,
+      sortDirection: j
+    }), { cardClasses: Ce, hasHover: Re, isTableView: d, styleClassSwitches: we } = oo({
+      viewType: n,
+      hover: A,
+      shadow: K,
+      border: N,
+      rounded: k,
+      className: R,
+      cardsStyle: u
+    }), Te = y ?? !1, S = n === "TABLE" ? Math.min(b?.left ?? 0, 1) : 0, he = S > 0 && b?.footer === !0, {
+      handleBodyScroll: x,
+      hasHorizontalScrollOffset: ye,
+      tableUseOverflow: H,
+      tableWrapperRef: ve,
+      wrapperStyle: ge,
+      tableHeadRowRef: Se,
+      tableFooterRowRef: xe
+    } = eo({
+      bodyMaxHeight: h,
+      cardsStyle: u,
+      columns: pe,
+      hasFooterCells: Te,
+      rowSeparatorWidth: M,
+      showSelectionColumn: i,
+      style: re
+    }), He = Oe(ve, l), B = {
+      hasHeader: !!g || m(o, (ke) => po(ke)),
+      hasFooter: d && (ne || m(o, Co)),
+      isClickable: typeof p == "function" || typeof f == "function",
+      isTableView: d
+    }, {
+      selectedRowIdSet: Be,
+      isAllRowsSelected: Fe,
+      isSomeRowsSelected: Ee,
+      handleToggleAllSelection: $e,
+      handleToggleRowSelection: ze
+    } = io({
+      bodyRows: T,
+      onSelectionChange: J,
+      selectedRowIds: Q
+    }), De = {
+      showSelectionColumn: i,
+      selectedRowIdSet: Be,
+      selectionHeaderContent: X,
+      isAllRowsSelected: Fe,
+      isSomeRowsSelected: Ee,
+      onToggleAllSelection: $e,
+      onToggleRowSelection: ze,
+      activeRowId: V,
+      onActiveRowChange: f,
+      onRowClick: p,
+      isClickable: B.isClickable,
+      onSortChange: U
+    }, Ae = {
+      handleBodyScroll: x,
+      tableHeadRowRef: Se,
+      tableFooterRowRef: xe,
+      draggableColumnKeys: v ? de : void 0,
+      lastResizableColumnKey: a ? be : void 0,
+      resettableColumnKeys: a ? fe : void 0,
+      stickyLeftColumnCount: S,
+      stickyFooter: he,
+      onColumnDragEnd: v ? me : void 0,
+      onColumnResizeReset: a ? ce : void 0,
+      onColumnResizeStart: a ? ue : void 0
+    }, Ke = {
+      viewType: n,
+      isTableView: d,
+      cardClasses: Ce,
+      noRowsState: ee,
+      rowKey: L,
+      rowClassName: I,
+      cellClassName: q,
+      rowAnimationProps: C ? void 0 : O,
+      expandedRowAnimation: G,
+      virtualizedRows: C,
+      virtualizationOverscan: oe
+    }, Ne = {
+      renderDraft: r.current,
+      header: g,
+      columns: s,
+      columnDefinitionsByKey: se,
+      columnIndexByKey: ie,
+      bodyRows: T,
+      renderBodyRow: ae,
+      hasFooterCells: y,
+      hasExpandableRows: le,
+      isRegisteringBodyRows: !0
+    }, F = /* @__PURE__ */ t(
+      mo.Provider,
+      {
+        value: De,
+        children: /* @__PURE__ */ t(co.Provider, { value: Ae, children: /* @__PURE__ */ t(
+          uo.Provider,
+          {
+            value: Ke,
+            children: /* @__PURE__ */ t(
+              bo.Provider,
+              {
+                value: Ne,
+                children: o
+              }
+            )
+          }
+        ) })
+      }
+    );
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ...te,
+        className: Ve(
+          ro({
+            viewType: n,
+            condensed: z,
+            striped: D,
+            gridLines: P,
+            className: R,
+            tableUseOverflow: H,
+            flags: B,
+            hasHover: Re,
+            styleClassSwitches: we
+          }),
+          ye && "table-has-horizontal-scroll-offset"
+        ),
+        ref: He,
+        role: "table",
+        "aria-colcount": s.length > 0 ? s.length + (i ? 1 : 0) : void 0,
+        style: ge,
+        children: H && !h ? /* @__PURE__ */ t("div", { className: "overflow-x-auto", onScroll: x, role: "presentation", children: /* @__PURE__ */ t("div", { className: "table-scroll-content", role: "presentation", children: F }) }) : F
+      }
+    );
+  }
+);
+export {
+  ar as TableBatchDropdown,
+  qo as TableBody,
+  Zo as TableColumn,
+  sr as TableColumnFilter,
+  ir as TableColumnsDropdown,
+  tr as TableExpandedContentRow,
+  rr as TableExpandedRow,
+  _o as TableExpanderButton,
+  Yo as TableFooter,
+  lr as TableGroupFooterRow,
+  nr as TableGroupRow,
+  Jo as TableHeader,
+  Xo as TableHeaderColumn,
+  Qo as TableHeaderRow,
+  er as TableRow,
+  or as TableSpacerRow,
+  dr as default
+};
+//# sourceMappingURL=Table.js.map

package/components/table/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sources":["../../../src/components/table/Table.tsx"],"sourcesContent":["import {\n    Children,\n    Fragment,\n    forwardRef,\n    isValidElement,\n    useRef,\n    type ForwardedRef,\n    type ReactElement,\n    type ReactNode,\n    type RefAttributes,\n} from 'react';\n\nimport classNames from '../../utils/classNames';\nimport useMergeRefs from '../../hooks/useMergeRefs';\nimport TableBodyComponent from './TableBody';\nimport TableColumnComponent from './TableColumn';\nimport TableExpanderButtonComponent from './TableExpanderButton';\nimport TableExpandedContentRowComponent from './TableExpandedContentRow';\nimport TableExpandedRowComponent from './TableExpandedRow';\nimport TableFooterComponent, { type TableFooterProps } from './TableFooter';\nimport TableGroupFooterRowComponent from './TableGroupFooterRow';\nimport TableGroupRowComponent from './TableGroupRow';\nimport TableHeaderComponent, { type TableHeaderProps } from './TableHeader';\nimport TableHeaderColumnComponent from './TableHeaderColumn';\nimport TableHeaderRowComponent from './TableHeaderRow';\nimport TableRowComponent from './TableRow';\nimport TableSpacerRowComponent from './TableSpacerRow';\nimport { useTableLayout } from './layout/useTableLayout';\nimport { resolveTableBaseClassName, resolveTableClassConfig } from './model/resolveTableClassConfig';\nimport TableBatchDropdownComponent from './render/header/TableBatchDropdown';\nimport TableColumnFilterComponent from './render/header/TableColumnFilter';\nimport useRenderDraftState from './runtime/useRenderDraftState';\nimport useResolvedRenderColumns from './runtime/useResolvedRenderColumns';\nimport useResolvedRenderHeader from './runtime/useResolvedRenderHeader';\nimport useInternalTableSelectionState from './selection/useInternalTableSelectionState';\nimport { TableInteractionContext, type TableInteractionContextValue } from './context/TableInteractionContext';\nimport { TableLayoutContext, type TableLayoutContextValue } from './context/TableLayoutContext';\nimport { TableRenderConfigContext, type TableRenderConfigContextValue } from './context/TableRenderConfigContext';\nimport { TableRenderContext, type TableRenderContextValue, type TableRenderDraft } from './context/TableRenderContext';\nimport TableColumnsDropdownComponent from './settings/TableColumnsDropdown';\nimport type { TableProps, TableRowData } from './Table.types';\n\nexport type {\n    TableCellOverflow,\n    TableCellClassName,\n    TableCardsStyleSettings,\n    TableColumnDefinition,\n    TableExpandedRowAnimation,\n    TableHorizontalAlign,\n    TableProps,\n    TableRowAnimationProps,\n    TableRowId,\n    TableRowClassName,\n    TableStickyColumns,\n    TableSortDirection,\n    TableVerticalAlign,\n    TableViewType,\n} from './Table.types';\n\nexport { default as useTableSelection } from './selection/useTableSelection';\n\nexport type { UseTableSelectionOptions, UseTableSelectionReturn } from './selection/useTableSelection';\n\nexport const TableBody = TableBodyComponent;\nexport type { TableBodyHandle, TableBodyProps } from './TableBody';\n\nexport const TableHeader = TableHeaderComponent;\nexport type { TableHeaderProps } from './TableHeader';\n\nexport const TableHeaderRow = TableHeaderRowComponent;\nexport type { TableHeaderRowProps } from './TableHeaderRow';\n\nexport const TableHeaderColumn = TableHeaderColumnComponent;\nexport type { TableHeaderColumnProps } from './TableHeaderColumn';\n\nexport const TableFooter = TableFooterComponent;\nexport type { TableFooterProps } from './TableFooter';\n\nexport const TableColumn = TableColumnComponent;\nexport type { TableColumnProps } from './TableColumn';\n\nexport const TableExpanderButton = TableExpanderButtonComponent;\nexport type { TableExpanderButtonProps } from './TableExpanderButton';\n\nexport const TableRow = TableRowComponent;\nexport type { TableRowProps } from './TableRow';\n\nexport const TableSpacerRow = TableSpacerRowComponent;\nexport type { TableSpacerRowProps } from './TableSpacerRow';\n\nexport const TableExpandedRow = TableExpandedRowComponent;\nexport type { TableExpandedRowProps } from './TableExpandedRow';\n\nexport const TableExpandedContentRow = TableExpandedContentRowComponent;\nexport type { TableExpandedContentRowProps } from './TableExpandedContentRow';\n\nexport const TableGroupRow = TableGroupRowComponent;\nexport type { TableGroupRowProps } from './TableGroupRow';\n\nexport const TableGroupFooterRow = TableGroupFooterRowComponent;\nexport type { TableGroupFooterRowProps } from './TableGroupFooterRow';\n\nexport const TableBatchDropdown = TableBatchDropdownComponent;\nexport const TableColumnFilter = TableColumnFilterComponent;\nexport const TableColumnsDropdown = TableColumnsDropdownComponent;\nexport type { TableBatchDropdownProps } from './render/header/TableBatchDropdown';\nexport type { TableColumnFilterProps } from './render/header/TableColumnFilter';\nexport type { TableColumnsDropdownItem, TableColumnsDropdownProps } from './settings/TableColumnsDropdown';\n\nconst hasMatchingSectionChild = (children: ReactNode, matcher: (child: ReactNode) => boolean): boolean =>\n    Children.toArray(children).some(child => {\n        if (matcher(child)) {\n            return true;\n        }\n\n        if (isValidElement(child) && child.type === Fragment) {\n            return hasMatchingSectionChild(child.props.children, matcher);\n        }\n\n        return false;\n    });\n\nconst isTableHeaderChild = <RowType extends TableRowData>(\n    child: ReactNode\n): child is ReactElement<TableHeaderProps<RowType>> => isValidElement(child) && child.type === TableHeaderComponent;\n\nconst isTableFooterChild = (child: ReactNode): child is ReactElement<TableFooterProps> =>\n    isValidElement(child) && child.type === TableFooterComponent;\n\nconst Table = forwardRef(\n    <RowType extends TableRowData>(props: TableProps<RowType>, ref: ForwardedRef<HTMLDivElement>) => {\n        const {\n            children,\n            viewType = 'TABLE',\n            cardsStyle,\n            condensed = false,\n            striped = false,\n            hover = false,\n            shadow = false,\n            border = true,\n            rounded = true,\n            gridLines = false,\n            rowClassName,\n            rowKey,\n            rowSeparatorWidth,\n            stickyColumns,\n            activeRowId,\n            onActiveRowChange,\n            rowAnimationProps,\n            expandedRowAnimation,\n            sortBy,\n            sortDirection,\n            onSortChange,\n            cellClassName,\n            onRowClick,\n            onSelectionChange,\n            selectedRowIds,\n            selectionHeaderContent,\n            columnOrder,\n            onColumnResize,\n            onColumnOrderChange,\n            showSelectionColumn = false,\n            noRowsState = 'No data available',\n            virtualizedRows = false,\n            virtualizationOverscan = 5,\n            className,\n            style,\n            ...remainingProps\n        } = props;\n\n        const renderDraftRef = useRef<TableRenderDraft<RowType>>({ headerColumns: [], bodyRows: [] });\n\n        // Core render cycle:\n        // 1. Header/body/footer sub-components register their structure into `renderDraftRef.current`.\n        // 2. `useRenderDraftState(...)` promotes that mutable draft into stable state.\n        // 3. The table renders from that stable draft state so virtualization, footer logic, sorting,\n        //    and row animations operate on a normalized model instead of arbitrary JSX children.\n        //\n        // The draft must be reset before each pass because it only represents the currently\n        // executing render, not persistent state.\n        renderDraftRef.current.headerColumns = [];\n        renderDraftRef.current.bodyRows = [];\n        renderDraftRef.current.bodyMaxHeight = undefined;\n        renderDraftRef.current.hasFooter = false;\n        renderDraftRef.current.hasFooterCells = undefined;\n        renderDraftRef.current.hasExpandableRows = undefined;\n\n        const {\n            renderHeaderColumns,\n            renderBodyRows,\n            renderBodyMaxHeight,\n            renderHasFooter,\n            renderHasFooterCells,\n            renderHasExpandableRows,\n            renderBodyRow,\n        } = useRenderDraftState(renderDraftRef);\n\n        const {\n            columnDefinitionsByKey,\n            columnIndexByKey,\n            draggableColumnKeys,\n            draggableColumnsEnabled,\n            handleColumnDragEnd,\n            handleColumnResizeReset,\n            handleColumnResizeStart,\n            lastResizableColumnKey,\n            resettableColumnKeys,\n            resizeColumnsEnabled,\n            resolvedRenderColumns,\n            resizedColumns,\n        } = useResolvedRenderColumns({\n            columnOrder,\n            onColumnOrderChange,\n            onColumnResize,\n            renderHeaderColumns,\n            viewType,\n        });\n\n        const resolvedRenderHeader = useResolvedRenderHeader({\n            renderHeaderColumns,\n            resolvedRenderColumns,\n            sortBy,\n            sortDirection,\n        });\n\n        const { cardClasses, hasHover, isTableView, styleClassSwitches } = resolveTableClassConfig({\n            viewType,\n            hover,\n            shadow,\n            border,\n            rounded,\n            className,\n            cardsStyle,\n        });\n\n        const hasFooterCells = renderHasFooterCells ?? false;\n        const stickyLeftColumnCount = viewType === 'TABLE' ? Math.min(stickyColumns?.left ?? 0, 1) : 0;\n        const stickyFooter = stickyLeftColumnCount > 0 && stickyColumns?.footer === true;\n\n        const {\n            handleBodyScroll,\n            hasHorizontalScrollOffset,\n            tableUseOverflow,\n            tableWrapperRef,\n            wrapperStyle,\n            tableHeadRowRef,\n            tableFooterRowRef,\n        } = useTableLayout({\n            bodyMaxHeight: renderBodyMaxHeight,\n            cardsStyle,\n            columns: resizedColumns,\n            hasFooterCells,\n            rowSeparatorWidth,\n            showSelectionColumn,\n            style,\n        });\n\n        const mergedWrapperRefs = useMergeRefs(tableWrapperRef, ref);\n\n        const flags = {\n            hasHeader:\n                !!resolvedRenderHeader ||\n                hasMatchingSectionChild(children, child => isTableHeaderChild<RowType>(child)),\n            hasFooter: isTableView && (renderHasFooter || hasMatchingSectionChild(children, isTableFooterChild)),\n            isClickable: typeof onRowClick === 'function' || typeof onActiveRowChange === 'function',\n            isTableView,\n        };\n\n        // Keep controlled selection derivation out of the main Table orchestrator so the\n        // interaction context consumes a small, already-normalized selection state.\n        const {\n            selectedRowIdSet,\n            isAllRowsSelected,\n            isSomeRowsSelected,\n            handleToggleAllSelection,\n            handleToggleRowSelection,\n        } = useInternalTableSelectionState({\n            bodyRows: renderBodyRows,\n            onSelectionChange,\n            selectedRowIds,\n        });\n\n        const interactionContextValue: TableInteractionContextValue<RowType> = {\n            showSelectionColumn,\n            selectedRowIdSet,\n            selectionHeaderContent,\n            isAllRowsSelected,\n            isSomeRowsSelected,\n            onToggleAllSelection: handleToggleAllSelection,\n            onToggleRowSelection: handleToggleRowSelection,\n            activeRowId,\n            onActiveRowChange,\n            onRowClick,\n            isClickable: flags.isClickable,\n            onSortChange,\n        };\n\n        const layoutContextValue: TableLayoutContextValue = {\n            handleBodyScroll,\n            tableHeadRowRef,\n            tableFooterRowRef,\n            draggableColumnKeys: draggableColumnsEnabled ? draggableColumnKeys : undefined,\n            lastResizableColumnKey: resizeColumnsEnabled ? lastResizableColumnKey : undefined,\n            resettableColumnKeys: resizeColumnsEnabled ? resettableColumnKeys : undefined,\n            stickyLeftColumnCount,\n            stickyFooter,\n            onColumnDragEnd: draggableColumnsEnabled ? handleColumnDragEnd : undefined,\n            onColumnResizeReset: resizeColumnsEnabled ? handleColumnResizeReset : undefined,\n            onColumnResizeStart: resizeColumnsEnabled ? handleColumnResizeStart : undefined,\n        };\n\n        const renderConfigContextValue: TableRenderConfigContextValue<RowType> = {\n            viewType,\n            isTableView,\n            cardClasses,\n            noRowsState,\n            rowKey,\n            rowClassName,\n            cellClassName,\n            rowAnimationProps: virtualizedRows ? undefined : rowAnimationProps,\n            expandedRowAnimation,\n            virtualizedRows,\n            virtualizationOverscan,\n        };\n\n        const renderContextValue: TableRenderContextValue<RowType> = {\n            renderDraft: renderDraftRef.current,\n            header: resolvedRenderHeader,\n            columns: resolvedRenderColumns,\n            columnDefinitionsByKey,\n            columnIndexByKey,\n            bodyRows: renderBodyRows,\n            renderBodyRow,\n            hasFooterCells: renderHasFooterCells,\n            hasExpandableRows: renderHasExpandableRows,\n            isRegisteringBodyRows: true,\n        };\n\n        const content = (\n            <TableInteractionContext.Provider\n                value={interactionContextValue as TableInteractionContextValue<TableRowData>}\n            >\n                <TableLayoutContext.Provider value={layoutContextValue}>\n                    <TableRenderConfigContext.Provider\n                        value={renderConfigContextValue as TableRenderConfigContextValue<TableRowData>}\n                    >\n                        <TableRenderContext.Provider\n                            value={renderContextValue as TableRenderContextValue<TableRowData>}\n                        >\n                            {children}\n                        </TableRenderContext.Provider>\n                    </TableRenderConfigContext.Provider>\n                </TableLayoutContext.Provider>\n            </TableInteractionContext.Provider>\n        );\n\n        return (\n            <div\n                {...remainingProps}\n                className={classNames(\n                    resolveTableBaseClassName({\n                        viewType,\n                        condensed,\n                        striped,\n                        gridLines,\n                        className,\n                        tableUseOverflow,\n                        flags,\n                        hasHover,\n                        styleClassSwitches,\n                    }),\n                    hasHorizontalScrollOffset && 'table-has-horizontal-scroll-offset'\n                )}\n                ref={mergedWrapperRefs}\n                role='table'\n                aria-colcount={\n                    resolvedRenderColumns.length > 0\n                        ? resolvedRenderColumns.length + (showSelectionColumn ? 1 : 0)\n                        : undefined\n                }\n                style={wrapperStyle}\n            >\n                {tableUseOverflow && !renderBodyMaxHeight ? (\n                    <div className='overflow-x-auto' onScroll={handleBodyScroll} role='presentation'>\n                        <div className='table-scroll-content' role='presentation'>\n                            {content}\n                        </div>\n                    </div>\n                ) : (\n                    content\n                )}\n            </div>\n        );\n    }\n) as <RowType extends TableRowData>(props: TableProps<RowType> & RefAttributes<HTMLDivElement>) => ReactElement;\n\nexport default Table;\n"],"names":["TableBody","TableBodyComponent","TableHeader","TableHeaderComponent","TableHeaderRow","TableHeaderRowComponent","TableHeaderColumn","TableHeaderColumnComponent","TableFooter","TableFooterComponent","TableColumn","TableColumnComponent","TableExpanderButton","TableExpanderButtonComponent","TableRow","TableRowComponent","TableSpacerRow","TableSpacerRowComponent","TableExpandedRow","TableExpandedRowComponent","TableExpandedContentRow","TableExpandedContentRowComponent","TableGroupRow","TableGroupRowComponent","TableGroupFooterRow","TableGroupFooterRowComponent","TableBatchDropdown","TableBatchDropdownComponent","TableColumnFilter","TableColumnFilterComponent","TableColumnsDropdown","TableColumnsDropdownComponent","hasMatchingSectionChild","children","matcher","Children","child","isValidElement","Fragment","isTableHeaderChild","isTableFooterChild","Table","forwardRef","props","ref","viewType","cardsStyle","condensed","striped","hover","shadow","border","rounded","gridLines","rowClassName","rowKey","rowSeparatorWidth","stickyColumns","activeRowId","onActiveRowChange","rowAnimationProps","expandedRowAnimation","sortBy","sortDirection","onSortChange","cellClassName","onRowClick","onSelectionChange","selectedRowIds","selectionHeaderContent","columnOrder","onColumnResize","onColumnOrderChange","showSelectionColumn","noRowsState","virtualizedRows","virtualizationOverscan","className","style","remainingProps","renderDraftRef","useRef","renderHeaderColumns","renderBodyRows","renderBodyMaxHeight","renderHasFooter","renderHasFooterCells","renderHasExpandableRows","renderBodyRow","useRenderDraftState","columnDefinitionsByKey","columnIndexByKey","draggableColumnKeys","draggableColumnsEnabled","handleColumnDragEnd","handleColumnResizeReset","handleColumnResizeStart","lastResizableColumnKey","resettableColumnKeys","resizeColumnsEnabled","resolvedRenderColumns","resizedColumns","useResolvedRenderColumns","resolvedRenderHeader","useResolvedRenderHeader","cardClasses","hasHover","isTableView","styleClassSwitches","resolveTableClassConfig","hasFooterCells","stickyLeftColumnCount","stickyFooter","handleBodyScroll","hasHorizontalScrollOffset","tableUseOverflow","tableWrapperRef","wrapperStyle","tableHeadRowRef","tableFooterRowRef","useTableLayout","mergedWrapperRefs","useMergeRefs","flags","selectedRowIdSet","isAllRowsSelected","isSomeRowsSelected","handleToggleAllSelection","handleToggleRowSelection","useInternalTableSelectionState","interactionContextValue","layoutContextValue","renderConfigContextValue","renderContextValue","content","jsx","TableInteractionContext","TableLayoutContext","TableRenderConfigContext","TableRenderContext","classNames","resolveTableBaseClassName"],"mappings":"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"}

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

@@ -0,0 +1,379 @@
+import { MotionProps } from 'motion/react';
+import { HTMLAttributes, MouseEvent as ReactMouseEvent, ReactNode } from 'react';
+export type TableHorizontalAlign = 'left' | 'center' | 'right';
+export type TableVerticalAlign = 'top' | 'middle' | 'bottom';
+export type TableCellOverflow = 'hidden' | 'visible' | 'ellipsis' | 'ellipsis-2' | 'ellipsis-3';
+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 TableCardsStyleSettings = {
+    /**
+     * Minimum card width for `MULTI_CARDS` view.
+     */
+    minWidth?: number | string;
+    /**
+     * Maximum card width for `MULTI_CARDS` view.
+     */
+    maxWidth?: number | string;
+    /**
+     * Additional classes for each card row in card views.
+     */
+    className?: string;
+    /**
+     * Additional classes for each card cell in card views.
+     */
+    rowClassName?: string;
+    /**
+     * Additional classes for each card label in card views.
+     */
+    labelClassName?: string;
+    /**
+     * Additional classes for each card content in card views.
+     */
+    contentClassName?: string;
+};
+/**
+ * High-level animation settings for expanded table rows.
+ *
+ * Use `false` to disable built-in expanded-row animations entirely.
+ * Use `duration` to keep the default expanded-row animation behavior
+ * while making it faster or slower.
+ */
+export type TableExpandedRowAnimation = false | {
+    duration?: number;
+};
+export type TableHtmlAttributes = Omit<HTMLAttributes<HTMLDivElement>, 'id' | 'children' | 'className' | 'onClick' | 'onKeyDown' | 'onDrag' | 'onDragCapture' | 'onDragEnd' | 'onDragEndCapture' | 'onDragEnter' | 'onDragEnterCapture' | 'onDragExit' | 'onDragExitCapture' | 'onDragLeave' | 'onDragLeaveCapture' | 'onDragOver' | 'onDragOverCapture' | 'onDragStart' | 'onDragStartCapture' | 'onDrop' | 'onDropCapture' | 'role'>;
+export type TableStickyColumns = {
+    /**
+     * Number of currently leftmost 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`.
+     */
+    left?: 1;
+    /**
+     * Aligns footer cells with the sticky left 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.
+     */
+    footer?: boolean;
+};
+export type TableColumnDefinition<RowType extends TableRowData> = {
+    /**
+     * Unique key of the column.
+     */
+    key: Extract<keyof RowType, string> | string;
+    /**
+     * Column label shown in the header.
+     */
+    label: ReactNode;
+    /**
+     * Optional rioglyph class rendered before the header label in table view.
+     */
+    icon?: string;
+    /**
+     * Optional column label shown on mobile cards.
+     */
+    mobileLabel?: string;
+    /**
+     * Optional custom filter control rendered next to the header label.
+     *
+     * Useful for column-specific filter dropdowns or other header actions.
+     */
+    filter?: ReactNode;
+    /**
+     * Hides the visible label in table header cells while keeping the label for
+     * cards, mobile labels, settings dialogs, and other metadata consumers.
+     *
+     * @default false
+     */
+    hideLabel?: boolean;
+    /**
+     * Minimum width of a flexible column.
+     *
+     * Adds a fixed width to the column.
+     */
+    width?: number | string;
+    /**
+     * Minimum resize width in px for the header drag handle.
+     *
+     * @default 50
+     */
+    minResizeWidth?: number;
+    /**
+     * Maximum resize width in px for the header drag handle.
+     *
+     * @default 1000
+     */
+    maxResizeWidth?: number;
+    /**
+     * Enables drag-reordering for this column in `TABLE` view.
+     *
+     * When `columnOrder` and `onColumnOrderChange` are provided, reordering is controlled from the outside.
+     * When they are omitted, the table keeps the reordered state internally.
+     *
+     * @default false
+     */
+    draggable?: boolean;
+    /**
+     * Enables resize handles for this column in `TABLE` view.
+     *
+     * When `onColumnResize` is provided, resized widths are controlled from the outside.
+     * When it is omitted, the table keeps resized widths internally.
+     *
+     * @default false
+     */
+    resizeable?: boolean;
+    /**
+     * Horizontal alignment of body cells in this column.
+     *
+     * @default 'left'
+     */
+    horizontalAlign?: TableHorizontalAlign;
+    /**
+     * Additional class names for body cells in this column.
+     */
+    className?: string;
+    /**
+     * Additional class names for header cells in this column.
+     */
+    headerClassName?: string;
+    /**
+     * Hide this column on mobile card layout.
+     *
+     * @default false
+     */
+    hideOnMobile?: boolean;
+    /**
+     * Allow sorting via clickable table header.
+     *
+     * Sorting itself stays controlled outside the table.
+     *
+     * @default false
+     */
+    sortable?: boolean;
+};
+export type TableColumn<RowType extends TableRowData> = TableColumnDefinition<RowType>;
+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 TableProps<RowType extends TableRowData> = Omit<HTMLAttributes<HTMLDivElement>, 'draggable' | 'onClick'> & {
+    /**
+     * Row key accessor for resolving a stable unique row id.
+     *
+     * This is recommended whenever rows have their own identifier such as `id`, `vehicleId`, or `uuid`, especially
+     * when using selection, active rows, expanded rows, or virtualization.
+     *
+     * If omitted, the row index is used as a fallback.
+     *
+     * @default row index
+     */
+    rowKey?: keyof RowType | ((row: RowType, rowIndex: number) => string | number);
+    /**
+     * Controls table or card rendering modes.
+     *
+     * @default 'TABLE'
+     */
+    viewType?: TableViewType;
+    /**
+     * Card width configuration for `MULTI_CARDS` view.
+     */
+    cardsStyle?: TableCardsStyleSettings;
+    /**
+     * Compact row/cell spacing like old `table-condensed`.
+     *
+     * @default false
+     */
+    condensed?: boolean;
+    /**
+     * Zebra rows like old `table-striped`.
+     *
+     * @default false
+     */
+    striped?: boolean;
+    /**
+     * Hover effect like old `table-hover`.
+     *
+     * @default false
+     */
+    hover?: boolean;
+    /**
+     * Apply table shadow.
+     *
+     * @default false
+     */
+    shadow?: boolean;
+    /**
+     * Simple outer border on table wrapper and card variants.
+     *
+     * @default true
+     */
+    border?: boolean;
+    /**
+     * Rounded table corners and card variants.
+     * Top corners are applied to header or body (if no header),
+     * bottom corners are applied to footer or body (if no footer).
+     *
+     * @default true
+     */
+    rounded?: boolean;
+    /**
+     * Show vertical and header row grid lines.
+     *
+     * @default false
+     */
+    gridLines?: boolean;
+    /**
+     * Optional classes for rows.
+     *
+     * Accepts either a static class string for all rows or a callback that resolves
+     * row-specific classes from the current row data and row index.
+     *
+     * @example
+     * rowClassName={(row) => (row.disabled ? 'my-class-name' : '')}
+     */
+    rowClassName?: TableRowClassName<RowType>;
+    /**
+     * Width of the separator between regular body rows in table view.
+     *
+     * This affects normal data rows and expanded child rows.
+     * Group rows, group footers, footer rows, and full-width expanded rows keep their own fixed separators.
+     *
+     * @default '1px'
+     */
+    rowSeparatorWidth?: number | string;
+    /**
+     * Sticky column behavior in `TABLE` view.
+     *
+     * `left` is position-based and follows column reordering.
+     * Selection columns and group rows are ignored.
+     *
+     * The public API currently supports `left: 1`.
+     *
+     * @example
+     * stickyColumns={{ left: 1, footer: true }}
+     */
+    stickyColumns?: TableStickyColumns;
+    /**
+     * Current active row key for detail context or external side panels.
+     */
+    activeRowId?: TableRowId;
+    /**
+     * Called when a row is activated or deactivated by row click.
+     */
+    onActiveRowChange?: (rowId: TableRowId | undefined, row: RowType, rowIndex: number) => void;
+    /**
+     * Optional low-level motion props applied to data rows for enter, exit, and layout animations.
+     *
+     * This is intended as an advanced escape hatch when the built-in row animation behavior is not sufficient.
+     * Can be defined once for all rows or resolved per row.
+     * A stable `rowKey` is recommended so animations keep working predictably across inserts, removals, and reordering.
+     * Ignored when `virtualizedRows` is enabled.
+     */
+    rowAnimationProps?: TableRowAnimationProps<RowType>;
+    /**
+     * High-level animation settings for expanded rows.
+     *
+     * Pass `false` to disable expanded-row animations entirely.
+     * Pass a `duration` to keep the built-in expanded-row animations but make them faster or slower.
+     */
+    expandedRowAnimation?: TableExpandedRowAnimation;
+    /**
+     * Current sorted column key.
+     */
+    sortBy?: string | string[];
+    /**
+     * Current sort direction for `sortBy`.
+     */
+    sortDirection?: TableSortDirection;
+    /**
+     * Called when a sortable header is clicked.
+     *
+     * Sorting itself remains controlled outside the table.
+     * The click event is passed through as an optional third argument for modifier-key scenarios such as shift-click.
+     */
+    onSortChange?: (columnKey: string, direction: TableSortDirection, event: ReactMouseEvent<HTMLButtonElement>) => void;
+    /**
+     * Optional classes for each cell.
+     *
+     * The callback is resolved per rendered body cell and receives the current
+     * row data, the resolved column definition, the row index, and the column index.
+     *
+     * @example
+     * cellClassName={(row, column) => (column.key === 'status' && row.disabled ? 'text-color-muted' : '')}
+     */
+    cellClassName?: TableCellClassName<RowType>;
+    /**
+     * Row click callback. Adds keyboard support and pointer cursor.
+     */
+    onRowClick?: (row: RowType, rowIndex: number) => void;
+    /**
+     * Called when checkbox selection changes.
+     */
+    onSelectionChange?: (rowIds: TableRowId[]) => void;
+    /**
+     * Currently selected row keys for multi-selection use cases.
+     */
+    selectedRowIds?: TableRowId[];
+    /**
+     * Optional custom header content for the selection column.
+     * If omitted, the header renders the default select-all checkbox.
+     */
+    selectionHeaderContent?: ReactNode;
+    /**
+     * Controlled column order for drag-reordering.
+     *
+     * Reordering interactions are enabled when reorderable header columns set `draggable`
+     * and the table is in `TABLE` view.
+     *
+     * Keys not present in the current table columns are ignored.
+     */
+    columnOrder?: string[];
+    /**
+     * Called while a column is resized via the header handle.
+     *
+     * Resize handles are shown only for header columns that set `resizeable`.
+     *
+     * When omitted, the table keeps resized widths internally.
+     * Pass `undefined` to clear a previously configured width.
+     *
+     * Drag-resizing emits pixel widths as numbers. A reset can restore the original
+     * configured width, which may also be a string such as `'20%'`.
+     */
+    onColumnResize?: (columnKey: string, width?: number | string) => void;
+    /**
+     * Called when drag-reordering produces a new column order.
+     *
+     * When omitted, the table keeps the reordered column state internally.
+     * Drag interactions are enabled only for header columns that set `draggable`.
+     */
+    onColumnOrderChange?: (columnOrder: string[]) => void;
+    /**
+     * Render a selection checkbox column as the first column.
+     */
+    showSelectionColumn?: boolean;
+    /**
+     * Fallback content when there are no rows.
+     *
+     * @default 'No data available'
+     */
+    noRowsState?: ReactNode;
+    /**
+     * Enables table-specific row virtualization for vertically scrolling table bodies.
+     *
+     * Virtualization is currently only active in `TABLE` view with `bodyMaxHeight`.
+     *
+     * @default false
+     */
+    virtualizedRows?: boolean;
+    /**
+     * Extra row count rendered above and below the visible area when virtualization is enabled.
+     *
+     * @default 5
+     */
+    virtualizationOverscan?: number;
+};