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

package/components/table/TableExpandedRow.js

@@ -1,5 +1,150 @@
-const e = (a) => null;
+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;
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: A("table-cell table-selection-cell", !m && 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 }) })
+    }
+  );
+}, 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 ? {
+      initial: { opacity: 0 },
+      animate: {
+        opacity: 1,
+        transition: { duration: u, ease: "easeInOut" }
+      },
+      exit: {
+        opacity: 0,
+        transition: { duration: u, ease: "easeInOut" }
+      }
+    } : {
+      initial: { opacity: 0, height: 0, y: -8 },
+      animate: {
+        opacity: 1,
+        height: "auto",
+        y: 0,
+        transition: { duration: u, ease: "easeOut" }
+      },
+      exit: {
+        opacity: 0,
+        height: 0,
+        y: -8,
+        transition: { duration: u, ease: "easeInOut" }
+      }
+    },
+    [f]
+  );
+  if (!l || !e || !o || l.columns.length === 0 || P !== "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({
+    isClickable: o.isClickable,
+    onRowClick: (r, d) => {
+      o.onRowClick?.(r, d), o.onActiveRowChange?.(
+        o.activeRowId === t ? void 0 : t,
+        r,
+        d
+      );
+    },
+    row: c,
+    rowIndex: n
+  });
+  let p;
+  e.expandedRowAnimation !== !1 && (p = {
+    ...D,
+    ...k
+  });
+  const h = o.selectedRowIdSet.has(t), v = A(
+    "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",
+    i.isClickableClassName,
+    x && "table-row-no-hover",
+    !e.isTableView && e.cardClasses.rowClassName,
+    m,
+    X(e.rowClassName, c, n)
+  ), O = o.showSelectionColumn && /* @__PURE__ */ s(
+    $,
+    {
+      isSelected: h,
+      isTableView: e.isTableView,
+      onToggleSelection: () => o.onToggleRowSelection?.(t),
+      cardCellClassName: e.cardClasses.cellClassName
+    }
+  ), T = /* @__PURE__ */ _(M, { children: [
+    O,
+    b
+  ] }), K = {
+    ...I(a),
+    className: v,
+    "data-index": n,
+    "data-row-id": String(t),
+    onClick: i.onClick,
+    onKeyDown: i.onKeyDown,
+    role: "row",
+    tabIndex: i.tabIndex
+  }, E = {
+    ...I(a),
+    className: v,
+    "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,
+    style: {
+      ...p?.style ?? {},
+      overflow: S ? "hidden" : "visible"
+    }
+  }, N = /* @__PURE__ */ s(
+    Q.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;
+        },
+        rowIndex: n,
+        rowId: t,
+        rowData: c
+      },
+      children: p ? /* @__PURE__ */ s(B.div, { ...E, children: T }) : /* @__PURE__ */ s("div", { ...K, children: T })
+    }
+  );
+  return l.renderDraft.hasExpandableRows = !0, l.renderDraft.bodyRows.push({
+    rowId: t,
+    rowIndex: n,
+    kind: "expanded",
+    render: () => N
+  }), l.isRegisteringBodyRows ? null : N;
+};
 export {
-  e as default
+  me as default
 };
 //# sourceMappingURL=TableExpandedRow.js.map

package/components/table/TableExpandedRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableExpandedRow.js","sources":["../../../src/components/table/TableExpandedRow.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\n\nexport type TableExpandedRowProps<RowType extends Record<string, unknown>> = PropsWithChildren<\n    {\n        /**\n         * Parent row key used to associate this expanded row with its parent.\n         */\n        parentKey: string | number;\n\n        /**\n         * Optional class names only for this expanded row.\n         */\n        className?: string;\n\n        /**\n         * Disable table hover styling for this row.\n         */\n        noHover?: boolean;\n    } & Partial<RowType>\n>;\n\nconst TableExpandedRow = <RowType extends Record<string, unknown> = Record<string, unknown>>(\n    _props: TableExpandedRowProps<RowType>\n) => null;\n\nexport default TableExpandedRow;\n"],"names":["TableExpandedRow","_props"],"mappings":"AAqBA,MAAMA,IAAmB,CACrBC,MACC;"}
+{"version":3,"file":"TableExpandedRow.js","sources":["../../../src/components/table/TableExpandedRow.tsx"],"sourcesContent":["import { motion, type HTMLMotionProps, useReducedMotion, type MotionProps } from 'motion/react';\nimport { useMemo, useRef, useState, type ReactNode } from 'react';\n\nimport Checkbox from '../checkbox/Checkbox';\nimport classNames from '../../utils/classNames';\nimport type { TableHtmlAttributes, TableRowData } from './Table.types';\nimport { resolveRowClassName, resolveRowKey } from './model/resolveRowMeta';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useOptionalTableRenderConfigContext } from './context/TableRenderConfigContext';\nimport {\n    extractTableHtmlAttributes,\n    TableRowContext,\n    useTableBodyContext,\n    useOptionalTableSection,\n} from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\nimport { getInteractiveRowProps } from './shared/getInteractiveRowProps';\n\nconst DEFAULT_EXPANDED_ROW_DURATION = 0.18;\n\nexport type TableExpandedRowProps<RowType extends TableRowData> = TableHtmlAttributes &\n    Partial<RowType> & {\n        /**\n         * Parent row key used to associate this expanded row with its parent.\n         */\n        parentKey: string | number;\n\n        /**\n         * Optional class names only for this expanded row.\n         */\n        className?: string;\n\n        /**\n         * Disable table hover styling for this row.\n         */\n        noHover?: boolean;\n\n        /**\n         * Table row content.\n         */\n        children?: ReactNode;\n    };\n\ntype TableExpandedRowSelectionCellProps = {\n    isSelected: boolean;\n    isTableView: boolean;\n    onToggleSelection?: () => void;\n    cardCellClassName?: string;\n};\n\nconst TableExpandedRowSelectionCell = (props: TableExpandedRowSelectionCellProps) => {\n    const { isSelected, isTableView, onToggleSelection, cardCellClassName } = props;\n    return (\n        <div\n            className={classNames('table-cell table-selection-cell', !isTableView && cardCellClassName)}\n            role='cell'\n            aria-colindex={1}\n            style={isTableView ? { gridColumn: '1 / span 1' } : undefined}\n            onClick={event => event.stopPropagation()}\n            onKeyDown={event => event.stopPropagation()}\n        >\n            <div className='table-selection-control'>\n                <Checkbox checked={isSelected} onChange={onToggleSelection} />\n            </div>\n        </div>\n    );\n};\n\nconst TableExpandedRow = <RowType extends TableRowData = TableRowData>(props: TableExpandedRowProps<RowType>) => {\n    const { children, className, noHover, parentKey: _parentKey, ...remainingProps } = props;\n\n    const renderConfigContext = useOptionalTableRenderConfigContext<RowType>();\n    const renderContext = useOptionalTableRenderContext<RowType>();\n    const interactionContext = useOptionalTableInteractionContext<RowType>();\n    const section = useOptionalTableSection();\n    const bodyContext = useTableBodyContext();\n\n    const cellIndexRef = useRef(0);\n    cellIndexRef.current = 0;\n\n    const [isAnimating, setIsAnimating] = useState(true);\n    const shouldReduceMotion = useReducedMotion();\n\n    const animation = useMemo(\n        () =>\n            shouldReduceMotion\n                ? {\n                      initial: { opacity: 0 },\n                      animate: {\n                          opacity: 1,\n                          transition: { duration: DEFAULT_EXPANDED_ROW_DURATION, ease: 'easeInOut' as const },\n                      },\n                      exit: {\n                          opacity: 0,\n                          transition: { duration: DEFAULT_EXPANDED_ROW_DURATION, ease: 'easeInOut' as const },\n                      },\n                  }\n                : {\n                      initial: { opacity: 0, height: 0, y: -8 },\n                      animate: {\n                          opacity: 1,\n                          height: 'auto',\n                          y: 0,\n                          transition: { duration: DEFAULT_EXPANDED_ROW_DURATION, ease: 'easeOut' as const },\n                      },\n                      exit: {\n                          opacity: 0,\n                          height: 0,\n                          y: -8,\n                          transition: { duration: DEFAULT_EXPANDED_ROW_DURATION, ease: 'easeInOut' as const },\n                      },\n                  },\n        [shouldReduceMotion]\n    );\n\n    if (\n        !renderContext ||\n        !renderConfigContext ||\n        !interactionContext ||\n        renderContext.columns.length === 0 ||\n        section !== 'body' ||\n        !bodyContext\n    ) {\n        return null;\n    }\n\n    const rowData = remainingProps as unknown as RowType;\n    const rowIndex = bodyContext.nextRowIndex();\n    const rowId = resolveRowKey(rowData, rowIndex, renderConfigContext.rowKey);\n\n    const resolvedRowAnimationProps =\n        typeof renderConfigContext.rowAnimationProps === 'function'\n            ? renderConfigContext.rowAnimationProps(rowData, rowIndex)\n            : renderConfigContext.rowAnimationProps;\n\n    const interactiveRowProps = getInteractiveRowProps({\n        isClickable: interactionContext.isClickable,\n        onRowClick: (clickedRow, clickedRowIndex) => {\n            interactionContext.onRowClick?.(clickedRow, clickedRowIndex);\n            interactionContext.onActiveRowChange?.(\n                interactionContext.activeRowId === rowId ? undefined : rowId,\n                clickedRow,\n                clickedRowIndex\n            );\n        },\n        row: rowData,\n        rowIndex,\n    });\n\n    let mergedRowAnimationProps: MotionProps | undefined;\n\n    if (renderConfigContext.expandedRowAnimation !== false) {\n        mergedRowAnimationProps = {\n            ...animation,\n            ...resolvedRowAnimationProps,\n        };\n    }\n\n    const isSelected = interactionContext.selectedRowIdSet.has(rowId);\n\n    const rowClassNames = classNames(\n        'table-row',\n        'table-row-expanded-data',\n        !renderConfigContext.isTableView && 'divider-y-1 divider-color-lighter divider-style-solid',\n        interactionContext.activeRowId === rowId && 'table-row-active',\n        isSelected && 'table-row-selected',\n        interactiveRowProps.isClickableClassName,\n        noHover && 'table-row-no-hover',\n        !renderConfigContext.isTableView && renderConfigContext.cardClasses.rowClassName,\n        className,\n        resolveRowClassName(renderConfigContext.rowClassName, rowData, rowIndex)\n    );\n\n    const selectionCell = interactionContext.showSelectionColumn && (\n        <TableExpandedRowSelectionCell\n            isSelected={isSelected}\n            isTableView={renderConfigContext.isTableView}\n            onToggleSelection={() => interactionContext.onToggleRowSelection?.(rowId)}\n            cardCellClassName={renderConfigContext.cardClasses.cellClassName}\n        />\n    );\n\n    const rowContent = (\n        <>\n            {selectionCell}\n            {children}\n        </>\n    );\n\n    const staticRowProps = {\n        ...extractTableHtmlAttributes(remainingProps),\n        className: rowClassNames,\n        'data-index': rowIndex,\n        'data-row-id': String(rowId),\n        onClick: interactiveRowProps.onClick,\n        onKeyDown: interactiveRowProps.onKeyDown,\n        role: 'row' as const,\n        tabIndex: interactiveRowProps.tabIndex,\n    };\n\n    const animatedRowProps = {\n        ...(extractTableHtmlAttributes(remainingProps) as Omit<\n            HTMLMotionProps<'div'>,\n            'children' | 'className' | 'data-row-id' | 'onClick' | 'onKeyDown' | 'role' | 'style' | 'tabIndex'\n        >),\n        className: rowClassNames,\n        'data-index': rowIndex,\n        'data-row-id': String(rowId),\n        onClick: interactiveRowProps.onClick,\n        onKeyDown: interactiveRowProps.onKeyDown,\n        role: 'row' as const,\n        tabIndex: interactiveRowProps.tabIndex,\n        onAnimationStart: () => setIsAnimating(true),\n        onAnimationComplete: () => setIsAnimating(false),\n        ...mergedRowAnimationProps,\n        style: {\n            ...(mergedRowAnimationProps?.style ?? {}),\n            overflow: isAnimating ? 'hidden' : 'visible',\n        },\n    };\n\n    const rowNode = (\n        <TableRowContext.Provider\n            value={{\n                nextColumnIndex: (explicitColumnIndex, span = 1) => {\n                    if (explicitColumnIndex !== undefined && explicitColumnIndex >= 0) {\n                        cellIndexRef.current = explicitColumnIndex + span;\n                        return explicitColumnIndex;\n                    }\n\n                    const nextIndex = cellIndexRef.current;\n                    cellIndexRef.current += span;\n                    return nextIndex;\n                },\n                rowIndex,\n                rowId,\n                rowData,\n            }}\n        >\n            {mergedRowAnimationProps ? (\n                <motion.div {...animatedRowProps}>{rowContent}</motion.div>\n            ) : (\n                <div {...staticRowProps}>{rowContent}</div>\n            )}\n        </TableRowContext.Provider>\n    );\n\n    renderContext.renderDraft.hasExpandableRows = true;\n    renderContext.renderDraft.bodyRows.push({\n        rowId,\n        rowIndex,\n        kind: 'expanded',\n        render: () => rowNode,\n    });\n\n    return renderContext.isRegisteringBodyRows ? null : rowNode;\n};\n\nexport default TableExpandedRow;\n"],"names":["DEFAULT_EXPANDED_ROW_DURATION","TableExpandedRowSelectionCell","props","isSelected","isTableView","onToggleSelection","cardCellClassName","jsx","classNames","event","Checkbox","TableExpandedRow","children","className","noHover","_parentKey","remainingProps","renderConfigContext","useOptionalTableRenderConfigContext","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","section","useOptionalTableSection","bodyContext","useTableBodyContext","cellIndexRef","useRef","isAnimating","setIsAnimating","useState","shouldReduceMotion","useReducedMotion","animation","useMemo","rowData","rowIndex","rowId","resolveRowKey","resolvedRowAnimationProps","interactiveRowProps","getInteractiveRowProps","clickedRow","clickedRowIndex","mergedRowAnimationProps","rowClassNames","resolveRowClassName","selectionCell","rowContent","jsxs","Fragment","staticRowProps","extractTableHtmlAttributes","animatedRowProps","rowNode","TableRowContext","explicitColumnIndex","span","nextIndex","motion"],"mappings":";;;;;;;;;;;AAkBA,MAAMA,IAAgC,MAgChCC,IAAgC,CAACC,MAA8C;AACjF,QAAM,EAAE,YAAAC,GAAY,aAAAC,GAAa,mBAAAC,GAAmB,mBAAAC,MAAsBJ;AAC1E,SACI,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAW,mCAAmC,CAACJ,KAAeE,CAAiB;AAAA,MAC1F,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,OAAOF,IAAc,EAAE,YAAY,iBAAiB;AAAA,MACpD,SAAS,CAAAK,MAASA,EAAM,gBAAA;AAAA,MACxB,WAAW,CAAAA,MAASA,EAAM,gBAAA;AAAA,MAE1B,UAAA,gBAAAF,EAAC,OAAA,EAAI,WAAU,2BACX,UAAA,gBAAAA,EAACG,KAAS,SAASP,GAAY,UAAUE,EAAA,CAAmB,EAAA,CAChE;AAAA,IAAA;AAAA,EAAA;AAGZ,GAEMM,KAAmB,CAA8CT,MAA0C;AAC7G,QAAM,EAAE,UAAAU,GAAU,WAAAC,GAAW,SAAAC,GAAS,WAAWC,GAAY,GAAGC,MAAmBd,GAE7Ee,IAAsBC,EAAA,GACtBC,IAAgBC,EAAA,GAChBC,IAAqBC,EAAA,GACrBC,IAAUC,EAAA,GACVC,IAAcC,EAAA,GAEdC,IAAeC,EAAO,CAAC;AAC7B,EAAAD,EAAa,UAAU;AAEvB,QAAM,CAACE,GAAaC,CAAc,IAAIC,EAAS,EAAI,GAC7CC,IAAqBC,EAAA,GAErBC,IAAYC;AAAA,IACd,MACIH,IACM;AAAA,MACI,SAAS,EAAE,SAAS,EAAA;AAAA,MACpB,SAAS;AAAA,QACL,SAAS;AAAA,QACT,YAAY,EAAE,UAAUhC,GAA+B,MAAM,YAAA;AAAA,MAAqB;AAAA,MAEtF,MAAM;AAAA,QACF,SAAS;AAAA,QACT,YAAY,EAAE,UAAUA,GAA+B,MAAM,YAAA;AAAA,MAAqB;AAAA,IACtF,IAEJ;AAAA,MACI,SAAS,EAAE,SAAS,GAAG,QAAQ,GAAG,GAAG,GAAA;AAAA,MACrC,SAAS;AAAA,QACL,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,GAAG;AAAA,QACH,YAAY,EAAE,UAAUA,GAA+B,MAAM,UAAA;AAAA,MAAmB;AAAA,MAEpF,MAAM;AAAA,QACF,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,GAAG;AAAA,QACH,YAAY,EAAE,UAAUA,GAA+B,MAAM,YAAA;AAAA,MAAqB;AAAA,IACtF;AAAA,IAEd,CAACgC,CAAkB;AAAA,EAAA;AAGvB,MACI,CAACb,KACD,CAACF,KACD,CAACI,KACDF,EAAc,QAAQ,WAAW,KACjCI,MAAY,UACZ,CAACE;AAED,WAAO;AAGX,QAAMW,IAAUpB,GACVqB,IAAWZ,EAAY,aAAA,GACvBa,IAAQC,EAAcH,GAASC,GAAUpB,EAAoB,MAAM,GAEnEuB,IACF,OAAOvB,EAAoB,qBAAsB,aAC3CA,EAAoB,kBAAkBmB,GAASC,CAAQ,IACvDpB,EAAoB,mBAExBwB,IAAsBC,EAAuB;AAAA,IAC/C,aAAarB,EAAmB;AAAA,IAChC,YAAY,CAACsB,GAAYC,MAAoB;AACzC,MAAAvB,EAAmB,aAAasB,GAAYC,CAAe,GAC3DvB,EAAmB;AAAA,QACfA,EAAmB,gBAAgBiB,IAAQ,SAAYA;AAAA,QACvDK;AAAA,QACAC;AAAA,MAAA;AAAA,IAER;AAAA,IACA,KAAKR;AAAA,IACL,UAAAC;AAAA,EAAA,CACH;AAED,MAAIQ;AAEJ,EAAI5B,EAAoB,yBAAyB,OAC7C4B,IAA0B;AAAA,IACtB,GAAGX;AAAA,IACH,GAAGM;AAAA,EAAA;AAIX,QAAMrC,IAAakB,EAAmB,iBAAiB,IAAIiB,CAAK,GAE1DQ,IAAgBtC;AAAA,IAClB;AAAA,IACA;AAAA,IACA,CAACS,EAAoB,eAAe;AAAA,IACpCI,EAAmB,gBAAgBiB,KAAS;AAAA,IAC5CnC,KAAc;AAAA,IACdsC,EAAoB;AAAA,IACpB3B,KAAW;AAAA,IACX,CAACG,EAAoB,eAAeA,EAAoB,YAAY;AAAA,IACpEJ;AAAA,IACAkC,EAAoB9B,EAAoB,cAAcmB,GAASC,CAAQ;AAAA,EAAA,GAGrEW,IAAgB3B,EAAmB,uBACrC,gBAAAd;AAAA,IAACN;AAAA,IAAA;AAAA,MACG,YAAAE;AAAA,MACA,aAAac,EAAoB;AAAA,MACjC,mBAAmB,MAAMI,EAAmB,uBAAuBiB,CAAK;AAAA,MACxE,mBAAmBrB,EAAoB,YAAY;AAAA,IAAA;AAAA,EAAA,GAIrDgC,IACF,gBAAAC,EAAAC,GAAA,EACK,UAAA;AAAA,IAAAH;AAAA,IACApC;AAAA,EAAA,GACL,GAGEwC,IAAiB;AAAA,IACnB,GAAGC,EAA2BrC,CAAc;AAAA,IAC5C,WAAW8B;AAAA,IACX,cAAcT;AAAA,IACd,eAAe,OAAOC,CAAK;AAAA,IAC3B,SAASG,EAAoB;AAAA,IAC7B,WAAWA,EAAoB;AAAA,IAC/B,MAAM;AAAA,IACN,UAAUA,EAAoB;AAAA,EAAA,GAG5Ba,IAAmB;AAAA,IACrB,GAAID,EAA2BrC,CAAc;AAAA,IAI7C,WAAW8B;AAAA,IACX,cAAcT;AAAA,IACd,eAAe,OAAOC,CAAK;AAAA,IAC3B,SAASG,EAAoB;AAAA,IAC7B,WAAWA,EAAoB;AAAA,IAC/B,MAAM;AAAA,IACN,UAAUA,EAAoB;AAAA,IAC9B,kBAAkB,MAAMX,EAAe,EAAI;AAAA,IAC3C,qBAAqB,MAAMA,EAAe,EAAK;AAAA,IAC/C,GAAGe;AAAA,IACH,OAAO;AAAA,MACH,GAAIA,GAAyB,SAAS,CAAA;AAAA,MACtC,UAAUhB,IAAc,WAAW;AAAA,IAAA;AAAA,EACvC,GAGE0B,IACF,gBAAAhD;AAAA,IAACiD,EAAgB;AAAA,IAAhB;AAAA,MACG,OAAO;AAAA,QACH,iBAAiB,CAACC,GAAqBC,IAAO,MAAM;AAChD,cAAID,MAAwB,UAAaA,KAAuB;AAC5D,mBAAA9B,EAAa,UAAU8B,IAAsBC,GACtCD;AAGX,gBAAME,IAAYhC,EAAa;AAC/B,iBAAAA,EAAa,WAAW+B,GACjBC;AAAA,QACX;AAAA,QACA,UAAAtB;AAAA,QACA,OAAAC;AAAA,QACA,SAAAF;AAAA,MAAA;AAAA,MAGH,UAAAS,IACG,gBAAAtC,EAACqD,EAAO,KAAP,EAAY,GAAGN,GAAmB,UAAAL,EAAA,CAAW,IAE9C,gBAAA1C,EAAC,OAAA,EAAK,GAAG6C,GAAiB,UAAAH,EAAA,CAAW;AAAA,IAAA;AAAA,EAAA;AAKjD,SAAA9B,EAAc,YAAY,oBAAoB,IAC9CA,EAAc,YAAY,SAAS,KAAK;AAAA,IACpC,OAAAmB;AAAA,IACA,UAAAD;AAAA,IACA,MAAM;AAAA,IACN,QAAQ,MAAMkB;AAAA,EAAA,CACjB,GAEMpC,EAAc,wBAAwB,OAAOoC;AACxD;"}

package/components/table/TableExpanderButton.js

@@ -1,22 +1,24 @@
-import { jsx as n } from "react/jsx-runtime";
-import r from "../button/Button.js";
-import l from "../../utils/classNames.js";
-const p = (e) => {
-  const { expanded: o = !1, disabled: t = !1, onClick: a, className: s } = e;
-  return /* @__PURE__ */ n(
-    r,
+import { jsx as l } from "react/jsx-runtime";
+import i from "../button/Button.js";
+import m from "../../utils/classNames.js";
+import { useOptionalTableRenderContext as p } from "./context/TableRenderContext.js";
+const x = (o) => {
+  const { expanded: r = !1, disabled: t = !1, onClick: n, className: a, ...s } = o, e = p();
+  return e && (e.renderDraft.hasExpandableRows = !0), /* @__PURE__ */ l(
+    i,
     {
+      ...s,
       bsStyle: "muted",
       bsSize: "xs",
       iconOnly: !0,
       disabled: t,
-      iconName: o ? "rioglyph-chevron-up" : "rioglyph-chevron-down",
-      className: l("table-expander-button", s),
-      onClick: a
+      iconName: r ? "rioglyph-chevron-up" : "rioglyph-chevron-down",
+      className: m("table-expander-button", a),
+      onClick: n
     }
   );
 };
 export {
-  p as default
+  x as default
 };
 //# sourceMappingURL=TableExpanderButton.js.map

package/components/table/TableExpanderButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableExpanderButton.js","sources":["../../../src/components/table/TableExpanderButton.tsx"],"sourcesContent":["import type { MouseEventHandler } from 'react';\n\nimport Button from '../button/Button';\nimport classNames from '../../utils/classNames';\n\nexport type TableExpanderButtonProps = {\n    /**\n     * Controls whether the related row is currently expanded.\n     *\n     * @default false\n     */\n    expanded?: boolean;\n\n    /**\n     * Disables the expander button.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback triggered when the expander button is clicked.\n     */\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n\n    /**\n     * Optional additional class names for the button element.\n     */\n    className?: string;\n};\n\nconst TableExpanderButton = (props: TableExpanderButtonProps) => {\n    const { expanded = false, disabled = false, onClick, className } = props;\n\n    return (\n        <Button\n            bsStyle='muted'\n            bsSize='xs'\n            iconOnly\n            disabled={disabled}\n            iconName={expanded ? 'rioglyph-chevron-up' : 'rioglyph-chevron-down'}\n            className={classNames('table-expander-button', className)}\n            onClick={onClick}\n        />\n    );\n};\n\nexport default TableExpanderButton;\n"],"names":["TableExpanderButton","props","expanded","disabled","onClick","className","jsx","Button","classNames"],"mappings":";;;AA+BA,MAAMA,IAAsB,CAACC,MAAoC;AAC7D,QAAM,EAAE,UAAAC,IAAW,IAAO,UAAAC,IAAW,IAAO,SAAAC,GAAS,WAAAC,MAAcJ;AAEnE,SACI,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,UAAQ;AAAA,MACR,UAAAJ;AAAA,MACA,UAAUD,IAAW,wBAAwB;AAAA,MAC7C,WAAWM,EAAW,yBAAyBH,CAAS;AAAA,MACxD,SAAAD;AAAA,IAAA;AAAA,EAAA;AAGZ;"}
+{"version":3,"file":"TableExpanderButton.js","sources":["../../../src/components/table/TableExpanderButton.tsx"],"sourcesContent":["import type { MouseEventHandler } from 'react';\n\nimport Button from '../button/Button';\nimport classNames from '../../utils/classNames';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableExpanderButtonProps = {\n    /**\n     * Controls whether the related row is currently expanded.\n     *\n     * @default false\n     */\n    expanded?: boolean;\n\n    /**\n     * Disables the expander button.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback triggered when the expander button is clicked.\n     */\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n\n    /**\n     * Optional additional class names for the button element.\n     */\n    className?: string;\n};\n\nconst TableExpanderButton = (props: TableExpanderButtonProps) => {\n    const { expanded = false, disabled = false, onClick, className, ...remainingProps } = props;\n\n    const renderContext = useOptionalTableRenderContext();\n\n    if (renderContext) {\n        renderContext.renderDraft.hasExpandableRows = true;\n    }\n\n    return (\n        <Button\n            {...remainingProps}\n            bsStyle='muted'\n            bsSize='xs'\n            iconOnly\n            disabled={disabled}\n            iconName={expanded ? 'rioglyph-chevron-up' : 'rioglyph-chevron-down'}\n            className={classNames('table-expander-button', className)}\n            onClick={onClick}\n        />\n    );\n};\n\nexport default TableExpanderButton;\n"],"names":["TableExpanderButton","props","expanded","disabled","onClick","className","remainingProps","renderContext","useOptionalTableRenderContext","jsx","Button","classNames"],"mappings":";;;;AAgCA,MAAMA,IAAsB,CAACC,MAAoC;AAC7D,QAAM,EAAE,UAAAC,IAAW,IAAO,UAAAC,IAAW,IAAO,SAAAC,GAAS,WAAAC,GAAW,GAAGC,EAAA,IAAmBL,GAEhFM,IAAgBC,EAAA;AAEtB,SAAID,MACAA,EAAc,YAAY,oBAAoB,KAI9C,gBAAAE;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAGJ;AAAA,MACJ,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,UAAQ;AAAA,MACR,UAAAH;AAAA,MACA,UAAUD,IAAW,wBAAwB;AAAA,MAC7C,WAAWS,EAAW,yBAAyBN,CAAS;AAAA,MACxD,SAAAD;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/components/table/TableFooter.d.ts

@@ -1,13 +1,17 @@
-import { PropsWithChildren, ReactNode } from 'react';
-export type TableFooterProps = PropsWithChildren<{
+import { ReactNode } from 'react';
+import { TableHtmlAttributes } from './Table.types';
+export type TableFooterProps = TableHtmlAttributes & {
     /**
-     * Optional content spanning all footer columns.
+     * The footer content.
+     *
+     * Use `TableColumn` children for cell-based footers, or arbitrary content
+     * for a full-width footer row.
      */
-    content?: ReactNode;
+    children?: ReactNode;
     /**
      * Optional class names for footer row.
      */
     className?: string;
-}>;
-declare const TableFooter: (_props: TableFooterProps) => null;
+};
+declare const TableFooter: (props: TableFooterProps) => import("react/jsx-runtime").JSX.Element | null;
 export default TableFooter;

package/components/table/TableFooter.js

@@ -1,5 +1,52 @@
-const e = (o) => null;
+import { jsx as o } from "react/jsx-runtime";
+import { useRef as p } from "react";
+import f from "../../utils/classNames.js";
+import w from "./render/footer/TableFooterContent.js";
+import { useOptionalTableInteractionContext as x } from "./context/TableInteractionContext.js";
+import { useOptionalTableLayoutContext as F } from "./context/TableLayoutContext.js";
+import { useOptionalTableRenderConfigContext as T } from "./context/TableRenderConfigContext.js";
+import { TableSectionContext as R, TableRowContext as v } from "./context/TableStructureContext.js";
+import { useOptionalTableRenderContext as g } from "./context/TableRenderContext.js";
+const L = (u) => {
+  const { children: n, className: m, ...d } = u, l = T(), e = g(), a = x(), s = F(), t = p(0);
+  if (t.current = 0, !l || !e || !a || !s || e.columns.length === 0 || !l.isTableView)
+    return null;
+  const C = e.columns.length + (a.showSelectionColumn ? 1 : 0), i = e.hasFooterCells !== !1, b = !i;
+  return e.renderDraft.hasFooter = !0, e.renderDraft.hasFooterCells = !1, /* @__PURE__ */ o(
+    "div",
+    {
+      ...d,
+      className: f("table-footer", b && "table-footer-full-width"),
+      role: "rowgroup",
+      children: /* @__PURE__ */ o(
+        "div",
+        {
+          className: f("table-row table-row-footer", m),
+          role: "row",
+          ref: s.tableFooterRowRef,
+          children: i ? /* @__PURE__ */ o(R.Provider, { value: "footer", children: /* @__PURE__ */ o(
+            v.Provider,
+            {
+              value: {
+                nextColumnIndex: (r, c = 1) => {
+                  if (r !== void 0 && r >= 0)
+                    return t.current = r + c, r;
+                  const h = t.current;
+                  return t.current += c, h;
+                },
+                rowData: {},
+                rowId: "__footer__",
+                rowIndex: -1
+              },
+              children: n
+            }
+          ) }) : /* @__PURE__ */ o(w, { columnCount: C, content: n })
+        }
+      )
+    }
+  );
+};
 export {
-  e as default
+  L as default
 };
 //# sourceMappingURL=TableFooter.js.map

package/components/table/TableFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableFooter.js","sources":["../../../src/components/table/TableFooter.tsx"],"sourcesContent":["import type { PropsWithChildren, ReactNode } from 'react';\n\nexport type TableFooterProps = PropsWithChildren<{\n    /**\n     * Optional content spanning all footer columns.\n     */\n    content?: ReactNode;\n\n    /**\n     * Optional class names for footer row.\n     */\n    className?: string;\n}>;\n\nconst TableFooter = (_props: TableFooterProps) => null;\n\nexport default TableFooter;\n"],"names":["TableFooter","_props"],"mappings":"AAcA,MAAMA,IAAc,CAACC,MAA6B;"}
+{"version":3,"file":"TableFooter.js","sources":["../../../src/components/table/TableFooter.tsx"],"sourcesContent":["import { useRef, type ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport type { TableHtmlAttributes } from './Table.types';\nimport TableFooterContent from './render/footer/TableFooterContent';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useOptionalTableLayoutContext } from './context/TableLayoutContext';\nimport { useOptionalTableRenderConfigContext } from './context/TableRenderConfigContext';\nimport { TableRowContext, TableSectionContext } from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableFooterProps = TableHtmlAttributes & {\n    /**\n     * The footer content.\n     *\n     * Use `TableColumn` children for cell-based footers, or arbitrary content\n     * for a full-width footer row.\n     */\n    children?: ReactNode;\n\n    /**\n     * Optional class names for footer row.\n     */\n    className?: string;\n};\n\nconst TableFooter = (props: TableFooterProps) => {\n    const { children, className, ...remainingProps } = props;\n\n    const renderConfigContext = useOptionalTableRenderConfigContext();\n    const renderContext = useOptionalTableRenderContext();\n    const interactionContext = useOptionalTableInteractionContext();\n    const layoutContext = useOptionalTableLayoutContext();\n\n    const cellIndexRef = useRef(0);\n    cellIndexRef.current = 0;\n\n    if (\n        !renderConfigContext ||\n        !renderContext ||\n        !interactionContext ||\n        !layoutContext ||\n        renderContext.columns.length === 0\n    ) {\n        return null;\n    }\n\n    if (!renderConfigContext.isTableView) {\n        return null;\n    }\n\n    const columnCount = renderContext.columns.length + (interactionContext.showSelectionColumn ? 1 : 0);\n    const shouldRenderFooterCells = renderContext.hasFooterCells !== false;\n    const isFullWidthFooter = !shouldRenderFooterCells;\n\n    renderContext.renderDraft.hasFooter = true;\n    renderContext.renderDraft.hasFooterCells = false;\n\n    return (\n        <div\n            {...remainingProps}\n            className={classNames('table-footer', isFullWidthFooter && 'table-footer-full-width')}\n            role='rowgroup'\n        >\n            <div\n                className={classNames('table-row table-row-footer', className)}\n                role='row'\n                ref={layoutContext.tableFooterRowRef}\n            >\n                {shouldRenderFooterCells ? (\n                    <TableSectionContext.Provider value='footer'>\n                        <TableRowContext.Provider\n                            value={{\n                                nextColumnIndex: (explicitColumnIndex, span = 1) => {\n                                    if (explicitColumnIndex !== undefined && explicitColumnIndex >= 0) {\n                                        cellIndexRef.current = explicitColumnIndex + span;\n                                        return explicitColumnIndex;\n                                    }\n\n                                    const nextIndex = cellIndexRef.current;\n                                    cellIndexRef.current += span;\n                                    return nextIndex;\n                                },\n                                rowData: {},\n                                rowId: '__footer__',\n                                rowIndex: -1,\n                            }}\n                        >\n                            {children}\n                        </TableRowContext.Provider>\n                    </TableSectionContext.Provider>\n                ) : (\n                    <TableFooterContent columnCount={columnCount} content={children} />\n                )}\n            </div>\n        </div>\n    );\n};\n\nexport default TableFooter;\n"],"names":["TableFooter","props","children","className","remainingProps","renderConfigContext","useOptionalTableRenderConfigContext","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","layoutContext","useOptionalTableLayoutContext","cellIndexRef","useRef","columnCount","shouldRenderFooterCells","isFullWidthFooter","jsx","classNames","TableSectionContext","TableRowContext","explicitColumnIndex","span","nextIndex","TableFooterContent"],"mappings":";;;;;;;;;AA0BA,MAAMA,IAAc,CAACC,MAA4B;AAC7C,QAAM,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,MAAmBH,GAE7CI,IAAsBC,EAAA,GACtBC,IAAgBC,EAAA,GAChBC,IAAqBC,EAAA,GACrBC,IAAgBC,EAAA,GAEhBC,IAAeC,EAAO,CAAC;AAa7B,MAZAD,EAAa,UAAU,GAGnB,CAACR,KACD,CAACE,KACD,CAACE,KACD,CAACE,KACDJ,EAAc,QAAQ,WAAW,KAKjC,CAACF,EAAoB;AACrB,WAAO;AAGX,QAAMU,IAAcR,EAAc,QAAQ,UAAUE,EAAmB,sBAAsB,IAAI,IAC3FO,IAA0BT,EAAc,mBAAmB,IAC3DU,IAAoB,CAACD;AAE3B,SAAAT,EAAc,YAAY,YAAY,IACtCA,EAAc,YAAY,iBAAiB,IAGvC,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGd;AAAA,MACJ,WAAWe,EAAW,gBAAgBF,KAAqB,yBAAyB;AAAA,MACpF,MAAK;AAAA,MAEL,UAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAWC,EAAW,8BAA8BhB,CAAS;AAAA,UAC7D,MAAK;AAAA,UACL,KAAKQ,EAAc;AAAA,UAElB,cACG,gBAAAO,EAACE,EAAoB,UAApB,EAA6B,OAAM,UAChC,UAAA,gBAAAF;AAAA,YAACG,EAAgB;AAAA,YAAhB;AAAA,cACG,OAAO;AAAA,gBACH,iBAAiB,CAACC,GAAqBC,IAAO,MAAM;AAChD,sBAAID,MAAwB,UAAaA,KAAuB;AAC5D,2BAAAT,EAAa,UAAUS,IAAsBC,GACtCD;AAGX,wBAAME,IAAYX,EAAa;AAC/B,yBAAAA,EAAa,WAAWU,GACjBC;AAAA,gBACX;AAAA,gBACA,SAAS,CAAA;AAAA,gBACT,OAAO;AAAA,gBACP,UAAU;AAAA,cAAA;AAAA,cAGb,UAAAtB;AAAA,YAAA;AAAA,UAAA,GAET,IAEA,gBAAAgB,EAACO,GAAA,EAAmB,aAAAV,GAA0B,SAASb,EAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAEzE;AAAA,EAAA;AAGZ;"}

package/components/table/TableGroupFooterRow.d.ts

@@ -1,10 +1,10 @@
-import { PropsWithChildren, ReactNode } from 'react';
-export type TableGroupFooterRowProps = PropsWithChildren<{
+import { ReactNode } from 'react';
+import { TableHtmlAttributes } from './Table.types';
+export type TableGroupFooterRowProps = TableHtmlAttributes & {
     /**
-     * Optional explicit content for the full-width group footer row.
-     * If omitted, `children` are used.
+     * The content of the full-width group footer row.
      */
-    content?: ReactNode;
+    children?: ReactNode;
     /**
      * Optional class names only for this group footer row.
      */
@@ -13,6 +13,6 @@ export type TableGroupFooterRowProps = PropsWithChildren<{
      * Disable table hover styling for this row.
      */
     noHover?: boolean;
-}>;
-declare const TableGroupFooterRow: (_props: TableGroupFooterRowProps) => null;
+};
+declare const TableGroupFooterRow: (props: TableGroupFooterRowProps) => import("react/jsx-runtime").JSX.Element | null;
 export default TableGroupFooterRow;

package/components/table/TableGroupFooterRow.js

@@ -1,5 +1,30 @@
-const e = (o) => null;
+import { jsx as t } from "react/jsx-runtime";
+import p from "../../utils/classNames.js";
+import { useOptionalTableInteractionContext as b } from "./context/TableInteractionContext.js";
+import { useOptionalTableSection as w, useTableBodyContext as x } from "./context/TableStructureContext.js";
+import { useOptionalTableRenderContext as f } from "./context/TableRenderContext.js";
+const v = (s) => {
+  const { children: a, className: c, noHover: i, ...d } = s, o = f(), n = b(), m = w(), r = x();
+  if (!o || !n || o.columns.length === 0 || m !== "body" || !r)
+    return null;
+  const e = r.nextRowIndex(), u = o.columns.length + (n.showSelectionColumn ? 1 : 0), l = /* @__PURE__ */ t(
+    "div",
+    {
+      ...d,
+      className: p("table-row", "table-row-group-footer", i && "table-row-no-hover", c),
+      "data-index": e,
+      role: "row",
+      children: /* @__PURE__ */ t("div", { className: "table-cell table-group-cell", role: "cell", "aria-colspan": u, children: /* @__PURE__ */ t("div", { className: "table-cell-content", children: a }) })
+    }
+  );
+  return o.renderDraft.bodyRows.push({
+    rowId: `group-footer-${e}`,
+    rowIndex: e,
+    kind: "group-footer",
+    render: () => l
+  }), o.isRegisteringBodyRows ? null : l;
+};
 export {
-  e as default
+  v as default
 };
 //# sourceMappingURL=TableGroupFooterRow.js.map

package/components/table/TableGroupFooterRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableGroupFooterRow.js","sources":["../../../src/components/table/TableGroupFooterRow.tsx"],"sourcesContent":["import type { PropsWithChildren, ReactNode } from 'react';\n\nexport type TableGroupFooterRowProps = PropsWithChildren<{\n    /**\n     * Optional explicit content for the full-width group footer row.\n     * If omitted, `children` are used.\n     */\n    content?: ReactNode;\n\n    /**\n     * Optional class names only for this group footer row.\n     */\n    className?: string;\n\n    /**\n     * Disable table hover styling for this row.\n     */\n    noHover?: boolean;\n}>;\n\nconst TableGroupFooterRow = (_props: TableGroupFooterRowProps) => null;\n\nexport default TableGroupFooterRow;\n"],"names":["TableGroupFooterRow","_props"],"mappings":"AAoBA,MAAMA,IAAsB,CAACC,MAAqC;"}
+{"version":3,"file":"TableGroupFooterRow.js","sources":["../../../src/components/table/TableGroupFooterRow.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport type { TableHtmlAttributes } from './Table.types';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useTableBodyContext, useOptionalTableSection } from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableGroupFooterRowProps = TableHtmlAttributes & {\n    /**\n     * The content of the full-width group footer row.\n     */\n    children?: ReactNode;\n\n    /**\n     * Optional class names only for this group footer row.\n     */\n    className?: string;\n\n    /**\n     * Disable table hover styling for this row.\n     */\n    noHover?: boolean;\n};\n\nconst TableGroupFooterRow = (props: TableGroupFooterRowProps) => {\n    const { children, className, noHover, ...remainingProps } = props;\n\n    const renderContext = useOptionalTableRenderContext();\n    const interactionContext = useOptionalTableInteractionContext();\n    const section = useOptionalTableSection();\n    const bodyContext = useTableBodyContext();\n\n    if (\n        !renderContext ||\n        !interactionContext ||\n        renderContext.columns.length === 0 ||\n        section !== 'body' ||\n        !bodyContext\n    ) {\n        return null;\n    }\n\n    const rowIndex = bodyContext.nextRowIndex();\n    const columnCount = renderContext.columns.length + (interactionContext.showSelectionColumn ? 1 : 0);\n\n    const rowNode = (\n        <div\n            {...remainingProps}\n            className={classNames('table-row', 'table-row-group-footer', noHover && 'table-row-no-hover', className)}\n            data-index={rowIndex}\n            role='row'\n        >\n            <div className='table-cell table-group-cell' role='cell' aria-colspan={columnCount}>\n                <div className='table-cell-content'>{children}</div>\n            </div>\n        </div>\n    );\n\n    renderContext.renderDraft.bodyRows.push({\n        rowId: `group-footer-${rowIndex}`,\n        rowIndex,\n        kind: 'group-footer',\n        render: () => rowNode,\n    });\n\n    return renderContext.isRegisteringBodyRows ? null : rowNode;\n};\n\nexport default TableGroupFooterRow;\n"],"names":["TableGroupFooterRow","props","children","className","noHover","remainingProps","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","section","useOptionalTableSection","bodyContext","useTableBodyContext","rowIndex","columnCount","rowNode","jsx","classNames"],"mappings":";;;;;AAyBA,MAAMA,IAAsB,CAACC,MAAoC;AAC7D,QAAM,EAAE,UAAAC,GAAU,WAAAC,GAAW,SAAAC,GAAS,GAAGC,MAAmBJ,GAEtDK,IAAgBC,EAAA,GAChBC,IAAqBC,EAAA,GACrBC,IAAUC,EAAA,GACVC,IAAcC,EAAA;AAEpB,MACI,CAACP,KACD,CAACE,KACDF,EAAc,QAAQ,WAAW,KACjCI,MAAY,UACZ,CAACE;AAED,WAAO;AAGX,QAAME,IAAWF,EAAY,aAAA,GACvBG,IAAcT,EAAc,QAAQ,UAAUE,EAAmB,sBAAsB,IAAI,IAE3FQ,IACF,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGZ;AAAA,MACJ,WAAWa,EAAW,aAAa,0BAA0Bd,KAAW,sBAAsBD,CAAS;AAAA,MACvG,cAAYW;AAAA,MACZ,MAAK;AAAA,MAEL,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,+BAA8B,MAAK,QAAO,gBAAcF,GACnE,UAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,sBAAsB,UAAAf,GAAS,EAAA,CAClD;AAAA,IAAA;AAAA,EAAA;AAIR,SAAAI,EAAc,YAAY,SAAS,KAAK;AAAA,IACpC,OAAO,gBAAgBQ,CAAQ;AAAA,IAC/B,UAAAA;AAAA,IACA,MAAM;AAAA,IACN,QAAQ,MAAME;AAAA,EAAA,CACjB,GAEMV,EAAc,wBAAwB,OAAOU;AACxD;"}

package/components/table/TableGroupRow.d.ts

@@ -1,10 +1,10 @@
-import { PropsWithChildren, ReactNode } from 'react';
-export type TableGroupRowProps = PropsWithChildren<{
+import { ReactNode } from 'react';
+import { TableHtmlAttributes } from './Table.types';
+export type TableGroupRowProps = TableHtmlAttributes & {
     /**
-     * Optional explicit content for the full-width group row.
-     * If omitted, `children` are used.
+     * The content of the full-width group row.
      */
-    content?: ReactNode;
+    children?: ReactNode;
     /**
      * Keeps the group row sticky at the top of a scrollable table body.
      *
@@ -19,6 +19,6 @@ export type TableGroupRowProps = PropsWithChildren<{
      * Disable table hover styling for this row.
      */
     noHover?: boolean;
-}>;
-declare const TableGroupRow: (_props: TableGroupRowProps) => null;
+};
+declare const TableGroupRow: (props: TableGroupRowProps) => import("react/jsx-runtime").JSX.Element | null;
 export default TableGroupRow;

package/components/table/TableGroupRow.js

@@ -1,5 +1,36 @@
-const l = (o) => null;
+import { jsx as t } from "react/jsx-runtime";
+import b from "../../utils/classNames.js";
+import { useOptionalTableInteractionContext as w } from "./context/TableInteractionContext.js";
+import { useOptionalTableSection as x, useTableBodyContext as g } from "./context/TableStructureContext.js";
+import { useOptionalTableRenderContext as f } from "./context/TableRenderContext.js";
+const v = (s) => {
+  const { children: a, className: c, noHover: i, sticky: d, ...u } = s, o = f(), n = w(), m = x(), r = g();
+  if (!o || !n || o.columns.length === 0 || m !== "body" || !r)
+    return null;
+  const e = r.nextRowIndex(), p = o.columns.length + (n.showSelectionColumn ? 1 : 0), l = /* @__PURE__ */ t(
+    "div",
+    {
+      ...u,
+      className: b(
+        "table-row",
+        "table-row-group",
+        d && "table-row-group-sticky",
+        i && "table-row-no-hover",
+        c
+      ),
+      "data-index": e,
+      role: "row",
+      children: /* @__PURE__ */ t("div", { className: "table-cell table-group-cell", role: "cell", "aria-colspan": p, children: /* @__PURE__ */ t("div", { className: "table-cell-content", children: a }) })
+    }
+  );
+  return o.renderDraft.bodyRows.push({
+    rowId: `group-${e}`,
+    rowIndex: e,
+    kind: "group",
+    render: () => l
+  }), o.isRegisteringBodyRows ? null : l;
+};
 export {
-  l as default
+  v as default
 };
 //# sourceMappingURL=TableGroupRow.js.map

package/components/table/TableGroupRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableGroupRow.js","sources":["../../../src/components/table/TableGroupRow.tsx"],"sourcesContent":["import type { PropsWithChildren, ReactNode } from 'react';\n\nexport type TableGroupRowProps = PropsWithChildren<{\n    /**\n     * Optional explicit content for the full-width group row.\n     * If omitted, `children` are used.\n     */\n    content?: ReactNode;\n\n    /**\n     * Keeps the group row sticky at the top of a scrollable table body.\n     *\n     * @default false\n     */\n    sticky?: boolean;\n\n    /**\n     * Optional class names only for this group row.\n     */\n    className?: string;\n\n    /**\n     * Disable table hover styling for this row.\n     */\n    noHover?: boolean;\n}>;\n\nconst TableGroupRow = (_props: TableGroupRowProps) => null;\n\nexport default TableGroupRow;\n"],"names":["TableGroupRow","_props"],"mappings":"AA2BA,MAAMA,IAAgB,CAACC,MAA+B;"}
+{"version":3,"file":"TableGroupRow.js","sources":["../../../src/components/table/TableGroupRow.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport type { TableHtmlAttributes } from './Table.types';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useTableBodyContext, useOptionalTableSection } from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableGroupRowProps = TableHtmlAttributes & {\n    /**\n     * The content of the full-width group row.\n     */\n    children?: ReactNode;\n\n    /**\n     * Keeps the group row sticky at the top of a scrollable table body.\n     *\n     * @default false\n     */\n    sticky?: boolean;\n\n    /**\n     * Optional class names only for this group row.\n     */\n    className?: string;\n\n    /**\n     * Disable table hover styling for this row.\n     */\n    noHover?: boolean;\n};\n\nconst TableGroupRow = (props: TableGroupRowProps) => {\n    const { children, className, noHover, sticky, ...remainingProps } = props;\n\n    const renderContext = useOptionalTableRenderContext();\n    const interactionContext = useOptionalTableInteractionContext();\n    const section = useOptionalTableSection();\n    const bodyContext = useTableBodyContext();\n\n    if (\n        !renderContext ||\n        !interactionContext ||\n        renderContext.columns.length === 0 ||\n        section !== 'body' ||\n        !bodyContext\n    ) {\n        return null;\n    }\n\n    const rowIndex = bodyContext.nextRowIndex();\n    const columnCount = renderContext.columns.length + (interactionContext.showSelectionColumn ? 1 : 0);\n\n    const rowNode = (\n        <div\n            {...remainingProps}\n            className={classNames(\n                'table-row',\n                'table-row-group',\n                sticky && 'table-row-group-sticky',\n                noHover && 'table-row-no-hover',\n                className\n            )}\n            data-index={rowIndex}\n            role='row'\n        >\n            <div className='table-cell table-group-cell' role='cell' aria-colspan={columnCount}>\n                <div className='table-cell-content'>{children}</div>\n            </div>\n        </div>\n    );\n\n    renderContext.renderDraft.bodyRows.push({\n        rowId: `group-${rowIndex}`,\n        rowIndex,\n        kind: 'group',\n        render: () => rowNode,\n    });\n\n    return renderContext.isRegisteringBodyRows ? null : rowNode;\n};\n\nexport default TableGroupRow;\n"],"names":["TableGroupRow","props","children","className","noHover","sticky","remainingProps","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","section","useOptionalTableSection","bodyContext","useTableBodyContext","rowIndex","columnCount","rowNode","jsx","classNames"],"mappings":";;;;;AAgCA,MAAMA,IAAgB,CAACC,MAA8B;AACjD,QAAM,EAAE,UAAAC,GAAU,WAAAC,GAAW,SAAAC,GAAS,QAAAC,GAAQ,GAAGC,MAAmBL,GAE9DM,IAAgBC,EAAA,GAChBC,IAAqBC,EAAA,GACrBC,IAAUC,EAAA,GACVC,IAAcC,EAAA;AAEpB,MACI,CAACP,KACD,CAACE,KACDF,EAAc,QAAQ,WAAW,KACjCI,MAAY,UACZ,CAACE;AAED,WAAO;AAGX,QAAME,IAAWF,EAAY,aAAA,GACvBG,IAAcT,EAAc,QAAQ,UAAUE,EAAmB,sBAAsB,IAAI,IAE3FQ,IACF,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGZ;AAAA,MACJ,WAAWa;AAAA,QACP;AAAA,QACA;AAAA,QACAd,KAAU;AAAA,QACVD,KAAW;AAAA,QACXD;AAAA,MAAA;AAAA,MAEJ,cAAYY;AAAA,MACZ,MAAK;AAAA,MAEL,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,+BAA8B,MAAK,QAAO,gBAAcF,GACnE,UAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,sBAAsB,UAAAhB,GAAS,EAAA,CAClD;AAAA,IAAA;AAAA,EAAA;AAIR,SAAAK,EAAc,YAAY,SAAS,KAAK;AAAA,IACpC,OAAO,SAASQ,CAAQ;AAAA,IACxB,UAAAA;AAAA,IACA,MAAM;AAAA,IACN,QAAQ,MAAME;AAAA,EAAA,CACjB,GAEMV,EAAc,wBAAwB,OAAOU;AACxD;"}

package/components/table/TableHeader.d.ts

@@ -1,9 +1,14 @@
-import { PropsWithChildren } from 'react';
-export type TableHeaderProps<RowType extends Record<string, unknown>> = PropsWithChildren<{
+import { ReactNode } from 'react';
+import { TableHtmlAttributes, TableRowData } from './Table.types';
+export type TableHeaderProps<RowType extends TableRowData> = TableHtmlAttributes & {
     /**
      * Additional class names for the header grid wrapper.
      */
     className?: string;
-}>;
-declare const TableHeader: <RowType extends Record<string, unknown> = Record<string, unknown>>(_props: TableHeaderProps<RowType>) => null;
+    /**
+     * Table header content.
+     */
+    children?: ReactNode;
+};
+declare const TableHeader: <RowType extends TableRowData = TableRowData>(props: TableHeaderProps<RowType>) => import("react/jsx-runtime").JSX.Element | null;
 export default TableHeader;

package/components/table/TableHeader.js

@@ -1,5 +1,107 @@
-const a = (e) => null;
+import { jsxs as h, jsx as o } from "react/jsx-runtime";
+import { useSensors as K, useSensor as O, PointerSensor as P, DndContext as E, DragOverlay as N } from "@dnd-kit/core";
+import { restrictToHorizontalAxis as j } from "@dnd-kit/modifiers";
+import { SortableContext as z, horizontalListSortingStrategy as L } from "@dnd-kit/sortable";
+import { useRef as W, useState as v } from "react";
+import k from "../../utils/classNames.js";
+import V from "./render/header/TableHeaderDragOverlay.js";
+import _ from "./render/header/TableHeaderSelectionCell.js";
+import { resolveColumnCollisionDetection as $ } from "./render/header/resolveColumnCollisionDetection.js";
+import { useOptionalTableInteractionContext as q } from "./context/TableInteractionContext.js";
+import { useOptionalTableLayoutContext as B } from "./context/TableLayoutContext.js";
+import { useOptionalTableRenderConfigContext as F } from "./context/TableRenderConfigContext.js";
+import { TableSectionContext as f, TableHeaderContext as p } from "./context/TableStructureContext.js";
+import { useOptionalTableRenderContext as G } from "./context/TableRenderContext.js";
+const ie = (x) => {
+  const { children: s, className: S, ...w } = x, l = G(), d = F(), t = q(), n = B();
+  if (!l || !d || !t || !n)
+    return null;
+  const D = K(O(P, { activationConstraint: { distance: 6 } })), r = W(0);
+  r.current = 0;
+  const [c, m] = v(void 0), [b, u] = v(void 0), R = !!n.onColumnDragEnd && (n.draggableColumnKeys?.length ?? 0) > 1, i = l.header, a = i?.rowCount ?? 1, y = i ?? {
+    rowCount: a,
+    totalColumnCount: l.columns.length,
+    columns: []
+  }, H = c ? i?.columns.find((e) => (e.columnKey ?? String(e.key)) === c) : void 0, g = () => {
+    m(void 0), u(void 0);
+  }, T = (e) => {
+    m(String(e.active.id)), u(e.active.rect.current.initial?.width ?? void 0);
+  }, A = (e) => {
+    g();
+  }, I = (e) => {
+    g(), n.onColumnDragEnd?.(e);
+  }, C = R && n.draggableColumnKeys ? /* @__PURE__ */ h(
+    E,
+    {
+      sensors: D,
+      collisionDetection: $,
+      modifiers: [j],
+      onDragStart: T,
+      onDragCancel: A,
+      onDragEnd: I,
+      children: [
+        /* @__PURE__ */ o(z, { items: n.draggableColumnKeys, strategy: L, children: s }),
+        /* @__PURE__ */ o(N, { adjustScale: !1, dropAnimation: null, children: /* @__PURE__ */ o(
+          V,
+          {
+            column: H,
+            header: y,
+            showSelectionColumn: t.showSelectionColumn,
+            width: b
+          }
+        ) })
+      ]
+    }
+  ) : s;
+  return d.isTableView ? /* @__PURE__ */ o("div", { ...w, className: "table-head", role: "rowgroup", ref: n.tableHeadRowRef, children: /* @__PURE__ */ o(f.Provider, { value: "header", children: /* @__PURE__ */ o(
+    p.Provider,
+    {
+      value: {
+        nextHeaderRowIndex: () => {
+          const e = r.current;
+          return r.current += 1, e;
+        }
+      },
+      children: /* @__PURE__ */ h(
+        "div",
+        {
+          className: k(
+            "table-head-grid",
+            t.selectionHeaderContent && "table-head-grid-custom-selection",
+            S
+          ),
+          role: a === 1 ? "row" : "presentation",
+          style: { gridTemplateRows: `repeat(${a}, auto)` },
+          children: [
+            t.showSelectionColumn && /* @__PURE__ */ o(
+              _,
+              {
+                isAllSelected: t.isAllRowsSelected,
+                isSomeRowsSelected: t.isSomeRowsSelected,
+                onToggleAllSelection: t.onToggleAllSelection,
+                rowCount: a,
+                selectionHeaderContent: t.selectionHeaderContent
+              }
+            ),
+            C
+          ]
+        }
+      )
+    }
+  ) }) }) : /* @__PURE__ */ o(f.Provider, { value: "header", children: /* @__PURE__ */ o(
+    p.Provider,
+    {
+      value: {
+        nextHeaderRowIndex: () => {
+          const e = r.current;
+          return r.current += 1, e;
+        }
+      },
+      children: C
+    }
+  ) });
+};
 export {
-  a as default
+  ie as default
 };
 //# sourceMappingURL=TableHeader.js.map