@rio-cloud/rio-uikit 2.3.0-beta.3 → 2.4.0

package/components/table/TableRow.js

@@ -1,112 +1,129 @@
-import { jsx as a, jsxs as K, Fragment as A } from "react/jsx-runtime";
-import { motion as V } from "motion/react";
-import { useRef as O } from "react";
-import j from "../checkbox/Checkbox.js";
+import { jsx as s, jsxs as O, Fragment as B } from "react/jsx-runtime";
+import { motion as H } from "motion/react";
+import { useRef as j } from "react";
+import F from "../checkbox/Checkbox.js";
 import N from "../../utils/classNames.js";
-import { resolveRowKey as B, resolveRowClassName as H } from "./model/resolveRowMeta.js";
-import { getInteractiveRowProps as F } from "./shared/getInteractiveRowProps.js";
-import { useOptionalTableInteractionContext as q } from "./context/TableInteractionContext.js";
-import { useOptionalTableRenderConfigContext as z } from "./context/TableRenderConfigContext.js";
-import { useOptionalTableSection as E, useTableBodyContext as G, extractTableHtmlAttributes as T, TableRowContext as J } from "./context/TableStructureContext.js";
-import { useOptionalTableRenderContext as L } from "./context/TableRenderContext.js";
-const M = (C) => {
-  const { isSelected: b, isTableView: n, onToggleSelection: p, cardCellClassName: R, disabled: g } = C;
-  return /* @__PURE__ */ a(
+import { resolveRowKey as E, resolveRowClassName as M } from "./model/resolveRowMeta.js";
+import { getVerticalAlignClassName as q } from "./shared/getAlignClassName.js";
+import { getInteractiveRowProps as z } from "./shared/getInteractiveRowProps.js";
+import { useOptionalTableInteractionContext as G } from "./context/TableInteractionContext.js";
+import { useOptionalTableRenderConfigContext as J } from "./context/TableRenderConfigContext.js";
+import { useOptionalTableSection as L, useTableBodyContext as Q, extractTableHtmlAttributes as T, TableRowContext as U } from "./context/TableStructureContext.js";
+import { useOptionalTableRenderContext as W } from "./context/TableRenderContext.js";
+const X = (p) => {
+  const {
+    isSelected: g,
+    isSelectable: l,
+    hideSelectionControl: x,
+    isTableView: m,
+    onToggleSelection: h,
+    cardCellClassName: b,
+    selectionCheckboxVerticalAlignment: a
+  } = p;
+  return /* @__PURE__ */ s(
     "div",
     {
-      className: N("table-cell table-selection-cell", !n && R),
+      className: N(
+        "table-cell table-selection-cell",
+        q(a),
+        !m && b
+      ),
       role: "cell",
       "aria-colindex": 1,
-      style: n ? { gridColumn: "1 / span 1", gridRow: "1 / span 1" } : void 0,
-      onClick: (s) => s.stopPropagation(),
-      onKeyDown: (s) => s.stopPropagation(),
-      children: /* @__PURE__ */ a("div", { className: "table-selection-control", children: /* @__PURE__ */ a(j, { checked: b, disabled: g, onChange: p }) })
+      style: m ? { gridColumn: "1 / span 1", gridRow: "1 / span 1" } : void 0,
+      onClick: (e) => e.stopPropagation(),
+      onKeyDown: (e) => e.stopPropagation(),
+      children: !x && /* @__PURE__ */ s("div", { className: "table-selection-control", children: /* @__PURE__ */ s(F, { checked: g, disabled: !l, onChange: h }) })
     }
   );
-}, ne = (C) => {
-  const { children: b, disabled: n, className: p, noHover: R, sticky: g, ...s } = C, e = z(), w = L(), o = q(), k = E(), u = G(), m = O(0);
-  if (m.current = 0, !w || !e || !o || w.columns.length === 0 || k !== "body" || !u)
+}, ae = (p) => {
+  const { children: g, disabled: l, className: x, noHover: m, selectable: h, sticky: b, ...a } = p, e = J(), c = W(), o = G(), I = L(), f = Q(), C = j(0);
+  if (C.current = 0, !c || !e || !o || c.columns.length === 0 || I !== "body" || !f)
     return null;
-  const c = s, r = u.nextRowIndex(), t = B(c, r, e.rowKey), v = typeof e.rowAnimationProps == "function" ? e.rowAnimationProps(c, r) : e.rowAnimationProps, l = F({
-    isClickable: o.isClickable && !n,
-    onRowClick: (i, d) => {
-      o.onRowClick?.(i, d), o.onActiveRowChange?.(
+  const d = a, n = f.nextRowIndex(), t = E(d, n, e.rowKey), u = typeof e.rowAnimationProps == "function" ? e.rowAnimationProps(d, n) : e.rowAnimationProps, r = z({
+    isClickable: o.isClickable && !l,
+    onRowClick: (i, w) => {
+      o.onRowClick?.(i, w), o.onActiveRowChange?.(
         o.activeRowId === t ? void 0 : t,
         i,
-        d
+        w
       );
     },
-    row: c,
-    rowIndex: r
-  }), x = o.selectedRowIdSet.has(t), P = o.showSelectionColumn && /* @__PURE__ */ a(
-    M,
+    row: d,
+    rowIndex: n
+  }), R = o.selectableRowIdSet.has(t), v = R && o.selectedRowIdSet.has(t), P = o.showSelectionColumn && /* @__PURE__ */ s(
+    X,
     {
-      isSelected: x,
+      isSelected: v,
+      isSelectable: R,
+      hideSelectionControl: !R && o.hideSelectionCheckboxesForExcludedRows,
       isTableView: e.isTableView,
       onToggleSelection: () => o.onToggleRowSelection?.(t),
       cardCellClassName: e.cardClasses.cellClassName,
-      disabled: n
+      selectionCheckboxVerticalAlignment: e.selectionCheckboxVerticalAlignment
     }
-  ), f = N(
+  ), A = !!c.renderDraft.bodyMaxHeight, y = N(
     "table-row",
     !e.isTableView && "divider-y-1 divider-color-lighter divider-style-solid",
     o.activeRowId === t && "table-row-active",
-    n && "table-row-disabled",
-    x && "table-row-selected",
-    l.isClickableClassName,
-    (n || R) && "table-row-no-hover",
-    g && "table-row-sticky",
+    l && "table-row-disabled",
+    v && "table-row-selected",
+    r.isClickableClassName,
+    (l || m) && "table-row-no-hover",
+    b && "table-row-sticky",
+    b && A && "table-row-sticky-in-container",
     !e.isTableView && e.cardClasses.rowClassName,
-    p,
-    H(e.rowClassName, c, r)
-  ), y = /* @__PURE__ */ K(A, { children: [
+    x,
+    M(e.rowClassName, d, n)
+  ), k = /* @__PURE__ */ O(B, { children: [
     P,
-    b
-  ] }), I = {
-    ...T(s),
-    className: f,
-    "data-index": r,
+    g
+  ] }), V = {
+    ...T(a),
+    className: y,
+    "data-index": n,
     "data-row-id": String(t),
-    onClick: l.onClick,
-    onKeyDown: l.onKeyDown,
+    onClick: r.onClick,
+    onKeyDown: r.onKeyDown,
     role: "row",
-    tabIndex: l.tabIndex
-  }, S = {
-    ...T(s),
-    className: f,
-    "data-index": r,
+    tabIndex: r.tabIndex
+  }, D = {
+    ...T(a),
+    className: y,
+    "data-index": n,
     "data-row-id": String(t),
-    onClick: l.onClick,
-    onKeyDown: l.onKeyDown,
+    onClick: r.onClick,
+    onKeyDown: r.onKeyDown,
     role: "row",
-    tabIndex: l.tabIndex,
-    ...v
-  }, h = /* @__PURE__ */ a(
-    J.Provider,
+    tabIndex: r.tabIndex,
+    ...u
+  }, S = /* @__PURE__ */ s(
+    U.Provider,
     {
       value: {
-        nextColumnIndex: (i, d = 1) => {
+        nextColumnIndex: (i, w = 1) => {
           if (i !== void 0 && i >= 0)
-            return m.current = i + d, i;
-          const D = m.current;
-          return m.current += d, D;
+            return C.current = i + w, i;
+          const K = C.current;
+          return C.current += w, K;
         },
-        rowIndex: r,
+        rowIndex: n,
         rowId: t,
-        rowData: c
+        rowData: d
       },
-      children: v ? /* @__PURE__ */ a(V.div, { ...S, children: y }) : /* @__PURE__ */ a("div", { ...I, children: y })
+      children: u ? /* @__PURE__ */ s(H.div, { ...D, children: k }) : /* @__PURE__ */ s("div", { ...V, children: k })
     }
   );
-  return w.renderDraft.bodyRows.push({
+  return c.renderDraft.bodyRows.push({
     rowId: t,
-    rowIndex: r,
+    rowIndex: n,
     kind: "data",
-    disabled: n,
-    render: () => h
-  }), w.isRegisteringBodyRows ? null : h;
+    disabled: l,
+    selectable: !l && h !== !1,
+    render: () => S
+  }), c.isRegisteringBodyRows ? null : S;
 };
 export {
-  ne as default
+  ae as default
 };
 //# sourceMappingURL=TableRow.js.map

package/components/table/TableRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableRow.js","sources":["../../../src/components/table/TableRow.tsx"],"sourcesContent":["import { motion, type HTMLMotionProps } from 'motion/react';\nimport { type ReactNode, useRef } from 'react';\n\nimport Checkbox from '../checkbox/Checkbox';\nimport classNames from '../../utils/classNames';\nimport { resolveRowClassName, resolveRowKey } from './model/resolveRowMeta';\nimport { getInteractiveRowProps } from './shared/getInteractiveRowProps';\nimport type { TableHtmlAttributes, TableRowData } from './Table.types';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useOptionalTableRenderConfigContext } from './context/TableRenderConfigContext';\nimport {\n    extractTableHtmlAttributes,\n    useTableBodyContext,\n    TableRowContext,\n    useOptionalTableSection,\n} from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableRowProps<RowType extends TableRowData> = TableHtmlAttributes &\n    Partial<RowType> & {\n        /**\n         * Keeps the row sticky at the top of a scrollable table body.\n         *\n         * @default false\n         */\n        sticky?: boolean;\n\n        /**\n         * Disables row interaction such as hover styles, clicks, and keyboard activation.\n         *\n         * @default false\n         */\n        disabled?: boolean;\n\n        /**\n         * Optional class names only for this 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 TableRowSelectionCellProps = {\n    isSelected: boolean;\n    isTableView: boolean;\n    onToggleSelection?: () => void;\n    cardCellClassName?: string;\n    disabled?: boolean;\n};\n\nconst TableRowSelectionCell = (props: TableRowSelectionCellProps) => {\n    const { isSelected, isTableView, onToggleSelection, cardCellClassName, disabled } = props;\n\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', gridRow: '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} disabled={disabled} onChange={onToggleSelection} />\n            </div>\n        </div>\n    );\n};\n\nconst TableRow = <RowType extends TableRowData = TableRowData>(props: TableRowProps<RowType>) => {\n    const { children, disabled, className, noHover, sticky, ...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    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 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 && !disabled,\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    const isSelected = interactionContext.selectedRowIdSet.has(rowId);\n    const selectionCell = interactionContext.showSelectionColumn && (\n        <TableRowSelectionCell\n            isSelected={isSelected}\n            isTableView={renderConfigContext.isTableView}\n            onToggleSelection={() => interactionContext.onToggleRowSelection?.(rowId)}\n            cardCellClassName={renderConfigContext.cardClasses.cellClassName}\n            disabled={disabled}\n        />\n    );\n\n    const rowClassName = classNames(\n        'table-row',\n        !renderConfigContext.isTableView && 'divider-y-1 divider-color-lighter divider-style-solid',\n        interactionContext.activeRowId === rowId && 'table-row-active',\n        disabled && 'table-row-disabled',\n        isSelected && 'table-row-selected',\n        interactiveRowProps.isClickableClassName,\n        (disabled || noHover) && 'table-row-no-hover',\n        sticky && 'table-row-sticky',\n        !renderConfigContext.isTableView && renderConfigContext.cardClasses.rowClassName,\n        className,\n        resolveRowClassName(renderConfigContext.rowClassName, rowData, rowIndex)\n    );\n\n    const rowContent = (\n        <>\n            {selectionCell}\n            {children}\n        </>\n    );\n\n    const staticRowProps = {\n        ...extractTableHtmlAttributes(remainingProps),\n        className: rowClassName,\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-index' | 'data-row-id' | 'onClick' | 'onKeyDown' | 'role' | 'tabIndex'\n        >),\n        className: rowClassName,\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        ...resolvedRowAnimationProps,\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            {resolvedRowAnimationProps ? (\n                <motion.div {...animatedRowProps}>{rowContent}</motion.div>\n            ) : (\n                <div {...staticRowProps}>{rowContent}</div>\n            )}\n        </TableRowContext.Provider>\n    );\n\n    renderContext.renderDraft.bodyRows.push({\n        rowId,\n        rowIndex,\n        kind: 'data',\n        disabled,\n        render: () => rowNode,\n    });\n\n    return renderContext.isRegisteringBodyRows ? null : rowNode;\n};\n\nexport default TableRow;\n"],"names":["TableRowSelectionCell","props","isSelected","isTableView","onToggleSelection","cardCellClassName","disabled","jsx","classNames","event","Checkbox","TableRow","children","className","noHover","sticky","remainingProps","renderConfigContext","useOptionalTableRenderConfigContext","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","section","useOptionalTableSection","bodyContext","useTableBodyContext","cellIndexRef","useRef","rowData","rowIndex","rowId","resolveRowKey","resolvedRowAnimationProps","interactiveRowProps","getInteractiveRowProps","clickedRow","clickedRowIndex","selectionCell","rowClassName","resolveRowClassName","rowContent","jsxs","Fragment","staticRowProps","extractTableHtmlAttributes","animatedRowProps","rowNode","TableRowContext","explicitColumnIndex","span","nextIndex","motion"],"mappings":";;;;;;;;;;;AA0DA,MAAMA,IAAwB,CAACC,MAAsC;AACjE,QAAM,EAAE,YAAAC,GAAY,aAAAC,GAAa,mBAAAC,GAAmB,mBAAAC,GAAmB,UAAAC,MAAaL;AAEpF,SACI,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAW,mCAAmC,CAACL,KAAeE,CAAiB;AAAA,MAC1F,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,OAAOF,IAAc,EAAE,YAAY,cAAc,SAAS,iBAAiB;AAAA,MAC3E,SAAS,CAAAM,MAASA,EAAM,gBAAA;AAAA,MACxB,WAAW,CAAAA,MAASA,EAAM,gBAAA;AAAA,MAE1B,UAAA,gBAAAF,EAAC,OAAA,EAAI,WAAU,2BACX,UAAA,gBAAAA,EAACG,GAAA,EAAS,SAASR,GAAY,UAAAI,GAAoB,UAAUF,EAAA,CAAmB,EAAA,CACpF;AAAA,IAAA;AAAA,EAAA;AAGZ,GAEMO,KAAW,CAA8CV,MAAkC;AAC7F,QAAM,EAAE,UAAAW,GAAU,UAAAN,GAAU,WAAAO,GAAW,SAAAC,GAAS,QAAAC,GAAQ,GAAGC,MAAmBf,GAExEgB,IAAsBC,EAAA,GACtBC,IAAgBC,EAAA,GAChBC,IAAqBC,EAAA,GACrBC,IAAUC,EAAA,GACVC,IAAcC,EAAA,GAEdC,IAAeC,EAAO,CAAC;AAG7B,MAFAD,EAAa,UAAU,GAGnB,CAACR,KACD,CAACF,KACD,CAACI,KACDF,EAAc,QAAQ,WAAW,KACjCI,MAAY,UACZ,CAACE;AAED,WAAO;AAGX,QAAMI,IAAUb,GACVc,IAAWL,EAAY,aAAA,GACvBM,IAAQC,EAAcH,GAASC,GAAUb,EAAoB,MAAM,GAEnEgB,IACF,OAAOhB,EAAoB,qBAAsB,aAC3CA,EAAoB,kBAAkBY,GAASC,CAAQ,IACvDb,EAAoB,mBAExBiB,IAAsBC,EAAuB;AAAA,IAC/C,aAAad,EAAmB,eAAe,CAACf;AAAA,IAChD,YAAY,CAAC8B,GAAYC,MAAoB;AACzC,MAAAhB,EAAmB,aAAae,GAAYC,CAAe,GAC3DhB,EAAmB;AAAA,QACfA,EAAmB,gBAAgBU,IAAQ,SAAYA;AAAA,QACvDK;AAAA,QACAC;AAAA,MAAA;AAAA,IAER;AAAA,IACA,KAAKR;AAAA,IACL,UAAAC;AAAA,EAAA,CACH,GAEK5B,IAAamB,EAAmB,iBAAiB,IAAIU,CAAK,GAC1DO,IAAgBjB,EAAmB,uBACrC,gBAAAd;AAAA,IAACP;AAAA,IAAA;AAAA,MACG,YAAAE;AAAA,MACA,aAAae,EAAoB;AAAA,MACjC,mBAAmB,MAAMI,EAAmB,uBAAuBU,CAAK;AAAA,MACxE,mBAAmBd,EAAoB,YAAY;AAAA,MACnD,UAAAX;AAAA,IAAA;AAAA,EAAA,GAIFiC,IAAe/B;AAAA,IACjB;AAAA,IACA,CAACS,EAAoB,eAAe;AAAA,IACpCI,EAAmB,gBAAgBU,KAAS;AAAA,IAC5CzB,KAAY;AAAA,IACZJ,KAAc;AAAA,IACdgC,EAAoB;AAAA,KACnB5B,KAAYQ,MAAY;AAAA,IACzBC,KAAU;AAAA,IACV,CAACE,EAAoB,eAAeA,EAAoB,YAAY;AAAA,IACpEJ;AAAA,IACA2B,EAAoBvB,EAAoB,cAAcY,GAASC,CAAQ;AAAA,EAAA,GAGrEW,IACF,gBAAAC,EAAAC,GAAA,EACK,UAAA;AAAA,IAAAL;AAAA,IACA1B;AAAA,EAAA,GACL,GAGEgC,IAAiB;AAAA,IACnB,GAAGC,EAA2B7B,CAAc;AAAA,IAC5C,WAAWuB;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,GAG5BY,IAAmB;AAAA,IACrB,GAAID,EAA2B7B,CAAc;AAAA,IAI7C,WAAWuB;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,GAAGD;AAAA,EAAA,GAGDc,IACF,gBAAAxC;AAAA,IAACyC,EAAgB;AAAA,IAAhB;AAAA,MACG,OAAO;AAAA,QACH,iBAAiB,CAACC,GAAqBC,IAAO,MAAM;AAChD,cAAID,MAAwB,UAAaA,KAAuB;AAC5D,mBAAAtB,EAAa,UAAUsB,IAAsBC,GACtCD;AAGX,gBAAME,IAAYxB,EAAa;AAC/B,iBAAAA,EAAa,WAAWuB,GACjBC;AAAA,QACX;AAAA,QACA,UAAArB;AAAA,QACA,OAAAC;AAAA,QACA,SAAAF;AAAA,MAAA;AAAA,MAGH,UAAAI,IACG,gBAAA1B,EAAC6C,EAAO,KAAP,EAAY,GAAGN,GAAmB,UAAAL,EAAA,CAAW,IAE9C,gBAAAlC,EAAC,OAAA,EAAK,GAAGqC,GAAiB,UAAAH,EAAA,CAAW;AAAA,IAAA;AAAA,EAAA;AAKjD,SAAAtB,EAAc,YAAY,SAAS,KAAK;AAAA,IACpC,OAAAY;AAAA,IACA,UAAAD;AAAA,IACA,MAAM;AAAA,IACN,UAAAxB;AAAA,IACA,QAAQ,MAAMyC;AAAA,EAAA,CACjB,GAEM5B,EAAc,wBAAwB,OAAO4B;AACxD;"}
+{"version":3,"file":"TableRow.js","sources":["../../../src/components/table/TableRow.tsx"],"sourcesContent":["import { motion, type HTMLMotionProps } from 'motion/react';\nimport { type ReactNode, useRef } from 'react';\n\nimport Checkbox from '../checkbox/Checkbox';\nimport classNames from '../../utils/classNames';\nimport { resolveRowClassName, resolveRowKey } from './model/resolveRowMeta';\nimport { getVerticalAlignClassName } from './shared/getAlignClassName';\nimport { getInteractiveRowProps } from './shared/getInteractiveRowProps';\nimport type { TableHtmlAttributes, TableRowData, TableVerticalAlign } from './Table.types';\nimport { useOptionalTableInteractionContext } from './context/TableInteractionContext';\nimport { useOptionalTableRenderConfigContext } from './context/TableRenderConfigContext';\nimport {\n    extractTableHtmlAttributes,\n    useTableBodyContext,\n    TableRowContext,\n    useOptionalTableSection,\n} from './context/TableStructureContext';\nimport { useOptionalTableRenderContext } from './context/TableRenderContext';\n\nexport type TableRowProps<RowType extends TableRowData> = TableHtmlAttributes &\n    Partial<RowType> & {\n        /**\n         * Keeps the row sticky at the top of the current table scroll context.\n         * When a sticky `TableHeader` is present, the row stacks below the measured header height.\n         * `TableBody maxHeight` continues to pin the row inside the internal body scroller.\n         *\n         * @default false\n         */\n        sticky?: boolean;\n\n        /**\n         * Disables row interaction such as hover styles, clicks, and keyboard activation.\n         *\n         * @default false\n         */\n        disabled?: boolean;\n\n        /**\n         * Optional class names only for this row.\n         */\n        className?: string;\n\n        /**\n         * Excludes this row from table selection while keeping the row interactive.\n         */\n        selectable?: boolean;\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 TableRowSelectionCellProps = {\n    isSelected: boolean;\n    isSelectable: boolean;\n    hideSelectionControl?: boolean;\n    isTableView: boolean;\n    onToggleSelection?: () => void;\n    cardCellClassName?: string;\n    selectionCheckboxVerticalAlignment?: TableVerticalAlign;\n};\n\nconst TableRowSelectionCell = (props: TableRowSelectionCellProps) => {\n    const {\n        isSelected,\n        isSelectable,\n        hideSelectionControl,\n        isTableView,\n        onToggleSelection,\n        cardCellClassName,\n        selectionCheckboxVerticalAlignment,\n    } = props;\n\n    return (\n        <div\n            className={classNames(\n                'table-cell table-selection-cell',\n                getVerticalAlignClassName(selectionCheckboxVerticalAlignment),\n                !isTableView && cardCellClassName\n            )}\n            role='cell'\n            aria-colindex={1}\n            style={isTableView ? { gridColumn: '1 / span 1', gridRow: '1 / span 1' } : undefined}\n            onClick={event => event.stopPropagation()}\n            onKeyDown={event => event.stopPropagation()}\n        >\n            {!hideSelectionControl && (\n                <div className='table-selection-control'>\n                    <Checkbox checked={isSelected} disabled={!isSelectable} onChange={onToggleSelection} />\n                </div>\n            )}\n        </div>\n    );\n};\n\nconst TableRow = <RowType extends TableRowData = TableRowData>(props: TableRowProps<RowType>) => {\n    const { children, disabled, className, noHover, selectable, sticky, ...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    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 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 && !disabled,\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    const isSelectable = interactionContext.selectableRowIdSet.has(rowId);\n    const isSelected = isSelectable && interactionContext.selectedRowIdSet.has(rowId);\n    const selectionCell = interactionContext.showSelectionColumn && (\n        <TableRowSelectionCell\n            isSelected={isSelected}\n            isSelectable={isSelectable}\n            hideSelectionControl={!isSelectable && interactionContext.hideSelectionCheckboxesForExcludedRows}\n            isTableView={renderConfigContext.isTableView}\n            onToggleSelection={() => interactionContext.onToggleRowSelection?.(rowId)}\n            cardCellClassName={renderConfigContext.cardClasses.cellClassName}\n            selectionCheckboxVerticalAlignment={renderConfigContext.selectionCheckboxVerticalAlignment}\n        />\n    );\n\n    const stickyInBodyScrollContainer = !!renderContext.renderDraft.bodyMaxHeight;\n\n    const rowClassName = classNames(\n        'table-row',\n        !renderConfigContext.isTableView && 'divider-y-1 divider-color-lighter divider-style-solid',\n        interactionContext.activeRowId === rowId && 'table-row-active',\n        disabled && 'table-row-disabled',\n        isSelected && 'table-row-selected',\n        interactiveRowProps.isClickableClassName,\n        (disabled || noHover) && 'table-row-no-hover',\n        sticky && 'table-row-sticky',\n        sticky && stickyInBodyScrollContainer && 'table-row-sticky-in-container',\n        !renderConfigContext.isTableView && renderConfigContext.cardClasses.rowClassName,\n        className,\n        resolveRowClassName(renderConfigContext.rowClassName, rowData, rowIndex)\n    );\n\n    const rowContent = (\n        <>\n            {selectionCell}\n            {children}\n        </>\n    );\n\n    const staticRowProps = {\n        ...extractTableHtmlAttributes(remainingProps),\n        className: rowClassName,\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-index' | 'data-row-id' | 'onClick' | 'onKeyDown' | 'role' | 'tabIndex'\n        >),\n        className: rowClassName,\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        ...resolvedRowAnimationProps,\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            {resolvedRowAnimationProps ? (\n                <motion.div {...animatedRowProps}>{rowContent}</motion.div>\n            ) : (\n                <div {...staticRowProps}>{rowContent}</div>\n            )}\n        </TableRowContext.Provider>\n    );\n\n    renderContext.renderDraft.bodyRows.push({\n        rowId,\n        rowIndex,\n        kind: 'data',\n        disabled,\n        selectable: !disabled && selectable !== false,\n        render: () => rowNode,\n    });\n\n    return renderContext.isRegisteringBodyRows ? null : rowNode;\n};\n\nexport default TableRow;\n"],"names":["TableRowSelectionCell","props","isSelected","isSelectable","hideSelectionControl","isTableView","onToggleSelection","cardCellClassName","selectionCheckboxVerticalAlignment","jsx","classNames","getVerticalAlignClassName","event","Checkbox","TableRow","children","disabled","className","noHover","selectable","sticky","remainingProps","renderConfigContext","useOptionalTableRenderConfigContext","renderContext","useOptionalTableRenderContext","interactionContext","useOptionalTableInteractionContext","section","useOptionalTableSection","bodyContext","useTableBodyContext","cellIndexRef","useRef","rowData","rowIndex","rowId","resolveRowKey","resolvedRowAnimationProps","interactiveRowProps","getInteractiveRowProps","clickedRow","clickedRowIndex","selectionCell","stickyInBodyScrollContainer","rowClassName","resolveRowClassName","rowContent","jsxs","Fragment","staticRowProps","extractTableHtmlAttributes","animatedRowProps","rowNode","TableRowContext","explicitColumnIndex","span","nextIndex","motion"],"mappings":"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"}

package/components/table/TableRowActionsDropdown.d.ts

@@ -0,0 +1,11 @@
+import { ButtonDropdownProps } from '../dropdown/ButtonDropdown';
+export type TableRowActionsDropdownProps = Omit<ButtonDropdownProps, 'title' | 'bsStyle' | 'variant' | 'iconOnly' | 'iconName' | 'noCaret' | 'splitButton' | 'pullRight' | 'usePortal'> & {
+    /**
+     * Accessible label applied to the icon-only trigger button.
+     *
+     * @default 'Row actions'
+     */
+    'aria-label'?: string;
+};
+declare const TableRowActionsDropdown: ({ "aria-label": ariaLabel, ...remainingProps }: TableRowActionsDropdownProps) => import("react/jsx-runtime").JSX.Element;
+export default TableRowActionsDropdown;

package/components/table/TableRowActionsDropdown.js

@@ -0,0 +1,22 @@
+import { jsx as o } from "react/jsx-runtime";
+import a from "../dropdown/ButtonDropdown.js";
+const i = ({
+  "aria-label": t = "Row actions",
+  ...r
+}) => /* @__PURE__ */ o(
+  a,
+  {
+    ...r,
+    "aria-label": t,
+    title: /* @__PURE__ */ o("span", { className: "rioglyph rioglyph-option-horizontal", "aria-hidden": "true" }),
+    bsStyle: "muted",
+    iconOnly: !0,
+    noCaret: !0,
+    pullRight: !0,
+    usePortal: !0
+  }
+);
+export {
+  i as default
+};
+//# sourceMappingURL=TableRowActionsDropdown.js.map

package/components/table/TableRowActionsDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRowActionsDropdown.js","sources":["../../../src/components/table/TableRowActionsDropdown.tsx"],"sourcesContent":["import ButtonDropdown, { type ButtonDropdownProps } from '../dropdown/ButtonDropdown';\n\nexport type TableRowActionsDropdownProps = Omit<\n    ButtonDropdownProps,\n    'title' | 'bsStyle' | 'variant' | 'iconOnly' | 'iconName' | 'noCaret' | 'splitButton' | 'pullRight' | 'usePortal'\n> & {\n    /**\n     * Accessible label applied to the icon-only trigger button.\n     *\n     * @default 'Row actions'\n     */\n    'aria-label'?: string;\n};\n\nconst TableRowActionsDropdown = ({\n    'aria-label': ariaLabel = 'Row actions',\n    ...remainingProps\n}: TableRowActionsDropdownProps) => (\n    <ButtonDropdown\n        {...remainingProps}\n        aria-label={ariaLabel}\n        title={<span className='rioglyph rioglyph-option-horizontal' aria-hidden='true' />}\n        bsStyle='muted'\n        iconOnly\n        noCaret\n        pullRight\n        usePortal\n    />\n);\n\nexport default TableRowActionsDropdown;\n"],"names":["TableRowActionsDropdown","ariaLabel","remainingProps","jsx","ButtonDropdown"],"mappings":";;AAcA,MAAMA,IAA0B,CAAC;AAAA,EAC7B,cAAcC,IAAY;AAAA,EAC1B,GAAGC;AACP,MACI,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACI,GAAGF;AAAA,IACJ,cAAYD;AAAA,IACZ,OAAO,gBAAAE,EAAC,QAAA,EAAK,WAAU,uCAAsC,eAAY,QAAO;AAAA,IAChF,SAAQ;AAAA,IACR,UAAQ;AAAA,IACR,SAAO;AAAA,IACP,WAAS;AAAA,IACT,WAAS;AAAA,EAAA;AACb;"}

package/components/table/TableStickyRowButton.d.ts

@@ -0,0 +1,25 @@
+import { MouseEventHandler } from 'react';
+export type TableStickyRowButtonProps = {
+    /**
+     * Controls whether the related row is currently sticky.
+     *
+     * @default false
+     */
+    active?: boolean;
+    /**
+     * Disables the sticky row button.
+     *
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Callback triggered when the sticky row button is clicked.
+     */
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    /**
+     * Optional additional class names for the button element.
+     */
+    className?: string;
+};
+declare const TableStickyRowButton: (props: TableStickyRowButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default TableStickyRowButton;

package/components/table/TableStickyRowButton.js

@@ -0,0 +1,32 @@
+import { jsx as o } from "react/jsx-runtime";
+import l from "../button/Button.js";
+import s from "../../utils/classNames.js";
+const u = (a) => {
+  const { active: t = !1, disabled: i = !1, onClick: r, className: e, ...n } = a;
+  return /* @__PURE__ */ o(
+    l,
+    {
+      ...n,
+      bsStyle: "muted",
+      bsSize: "sm",
+      iconOnly: !0,
+      active: t,
+      disabled: i,
+      className: s("table-sticky-row-button", e),
+      onClick: r,
+      children: /* @__PURE__ */ o(
+        "span",
+        {
+          className: s(
+            "rioglyph rioglyph-pushpin transition-all transition-ease-in-out transition-duration-01 transform-origin-center",
+            t ? "rotate-315" : "rotate-360"
+          )
+        }
+      )
+    }
+  );
+};
+export {
+  u as default
+};
+//# sourceMappingURL=TableStickyRowButton.js.map

package/components/table/TableStickyRowButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableStickyRowButton.js","sources":["../../../src/components/table/TableStickyRowButton.tsx"],"sourcesContent":["import type { MouseEventHandler } from 'react';\n\nimport Button from '../button/Button';\nimport classNames from '../../utils/classNames';\n\nexport type TableStickyRowButtonProps = {\n    /**\n     * Controls whether the related row is currently sticky.\n     *\n     * @default false\n     */\n    active?: boolean;\n\n    /**\n     * Disables the sticky row button.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback triggered when the sticky row 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 TableStickyRowButton = (props: TableStickyRowButtonProps) => {\n    const { active = false, disabled = false, onClick, className, ...remainingProps } = props;\n\n    return (\n        <Button\n            {...remainingProps}\n            bsStyle='muted'\n            bsSize='sm'\n            iconOnly\n            active={active}\n            disabled={disabled}\n            className={classNames('table-sticky-row-button', className)}\n            onClick={onClick}\n        >\n            <span\n                className={classNames(\n                    'rioglyph rioglyph-pushpin transition-all transition-ease-in-out transition-duration-01 transform-origin-center',\n                    active ? 'rotate-315' : 'rotate-360'\n                )}\n            />\n        </Button>\n    );\n};\n\nexport default TableStickyRowButton;\n"],"names":["TableStickyRowButton","props","active","disabled","onClick","className","remainingProps","jsx","Button","classNames"],"mappings":";;;AA+BA,MAAMA,IAAuB,CAACC,MAAqC;AAC/D,QAAM,EAAE,QAAAC,IAAS,IAAO,UAAAC,IAAW,IAAO,SAAAC,GAAS,WAAAC,GAAW,GAAGC,EAAA,IAAmBL;AAEpF,SACI,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAGF;AAAA,MACJ,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,UAAQ;AAAA,MACR,QAAAJ;AAAA,MACA,UAAAC;AAAA,MACA,WAAWM,EAAW,2BAA2BJ,CAAS;AAAA,MAC1D,SAAAD;AAAA,MAEA,UAAA,gBAAAG;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAWE;AAAA,YACP;AAAA,YACAP,IAAS,eAAe;AAAA,UAAA;AAAA,QAC5B;AAAA,MAAA;AAAA,IACJ;AAAA,EAAA;AAGZ;"}

package/components/table/TableToolbar.d.ts

@@ -1,12 +1,33 @@
 import { PropsWithChildren } from 'react';
 import { default as TableToolbarColumn } from './TableToolbarColumn';
+export { TableToolbarColumn };
+export type { TableToolbarColumnHorizontalAlign, TableToolbarColumnProps, TableToolbarColumnVerticalAlign, } from './TableToolbarColumn';
 export type TableToolbarProps = {
     /**
      * Optional class names for the wrapper element.
      */
     className?: string;
+    /**
+     * Optional class names for the card that wraps collapsed toolbar controls
+     * in the compact mobile layout.
+     */
+    collapseCardClassName?: string;
+    /**
+     * Optional toolbar width in pixels at which the toolbar switches into its compact
+     * mobile/collapsible layout.
+     *
+     * @default 544
+     */
+    responsiveCollapseBreakpoint?: number;
+    /**
+     * Disables the compact mobile/collapsible toolbar layout.
+     *
+     * Use this as an escape hatch when a consuming service needs to keep the
+     * default wrapping toolbar behavior regardless of the available toolbar width.
+     *
+     * @default false
+     */
+    disableResponsiveCollapse?: boolean;
 };
-declare const TableToolbar: ({ className, children }: PropsWithChildren<TableToolbarProps>) => import("react/jsx-runtime").JSX.Element;
+declare const TableToolbar: (props: PropsWithChildren<TableToolbarProps>) => import("react/jsx-runtime").JSX.Element;
 export default TableToolbar;
-export { TableToolbarColumn };
-export type { TableToolbarColumnHorizontalAlign, TableToolbarColumnProps, TableToolbarColumnVerticalAlign, } from './TableToolbarColumn';

package/components/table/TableToolbar.js

@@ -1,52 +1,93 @@
-import { jsx as s, jsxs as T } from "react/jsx-runtime";
-import { useRef as f, useState as v, useLayoutEffect as x, Children as y, isValidElement as b, Fragment as z } from "react";
-import N from "../../hooks/useResizeObserver.js";
-import p from "../../utils/classNames.js";
-import w from "./TableToolbarColumn.js";
-const A = (o) => b(o) && o.type === w, h = (o) => {
-  const t = [];
-  for (const e of y.toArray(o)) {
-    if (b(e) && e.type === z) {
-      const r = h(e.props.children);
-      if (!r)
+import { jsx as o, jsxs as c, Fragment as k } from "react/jsx-runtime";
+import { useRef as C, useState as x, useLayoutEffect as D, useEffect as G, Children as w, isValidElement as N, Fragment as P } from "react";
+import I from "../../hooks/useResizeObserver.js";
+import K from "../../hooks/useMergeRefs.js";
+import m from "../../utils/classNames.js";
+import U from "../button/ToggleButton.js";
+import V from "../collapse/Collapse.js";
+import $ from "../card/Card.js";
+import q from "./TableSearch.js";
+import J from "./TableToolbarColumn.js";
+const Q = 544, X = (r) => N(r) && r.type === J, B = (r) => {
+  const e = [];
+  for (const l of w.toArray(r)) {
+    if (N(l) && l.type === P) {
+      const t = B(l.props.children);
+      if (!t)
         return null;
-      t.push(...r);
+      e.push(...t);
       continue;
     }
-    if (!A(e))
+    if (!X(l))
       return null;
-    t.push(e);
+    e.push(l);
   }
-  return t;
-}, u = (o) => {
-  if (!o)
+  return e;
+}, F = (r, e) => w.toArray(r).some((l) => N(l) ? l.type === e ? !0 : F(l.props.children, e) : !1), v = (r) => {
+  if (!r)
     return !1;
-  const t = Array.from(o.children);
-  if (t.length < 2)
+  const e = Array.from(r.children);
+  if (e.length < 2)
     return !1;
-  const e = (t[0]?.offsetTop ?? 0) + (t[0]?.offsetHeight ?? 0);
-  return t.some((r) => r.offsetTop + r.offsetHeight !== e);
-}, j = ({ className: o, children: t }) => {
-  const e = f(null), r = f(null), c = f(null), [g, d] = v(!1), [m, , { inlineSize: C }] = N(), n = h(t), a = (n ?? []).filter((l) => l.props.horizontalAlign !== "right"), i = (n ?? []).filter((l) => l.props.horizontalAlign === "right");
-  return x(() => {
-    const l = e.current;
-    l?.classList.add("table-toolbar-measuring");
-    const R = u(m.current) || u(r.current) || u(c.current);
-    l?.classList.remove("table-toolbar-measuring"), d(R);
-  }, [t, a.length, i.length, C]), n?.length ? /* @__PURE__ */ s(
+  const l = (e[0]?.offsetTop ?? 0) + (e[0]?.offsetHeight ?? 0);
+  return e.some((t) => t.offsetTop + t.offsetHeight !== l);
+}, ie = (r) => {
+  const {
+    className: e,
+    collapseCardClassName: l,
+    children: t,
+    responsiveCollapseBreakpoint: H = Q,
+    disableResponsiveCollapse: _ = !1
+  } = r, R = C(null), T = C(null), y = C(null), [M, S] = x(!1), [f, A] = x(!1), [W, , { inlineSize: z }] = I(), [p, , { inlineSize: j }] = I(), L = K(R, W), i = !_ && z !== void 0 && z <= H, u = B(t), s = (u ?? []).filter((a) => a.props.horizontalAlign !== "right"), n = (u ?? []).filter((a) => a.props.horizontalAlign === "right"), d = n.findIndex(
+    (a) => F(a.props.children, q)
+  ), h = d >= 0 ? n[d] : void 0, E = h ? n.filter((a, g) => g !== d) : n, b = i && E.length > 0, O = b && /* @__PURE__ */ o("div", { className: "table-toolbar-mobile-toggle", children: /* @__PURE__ */ o(
+    U,
+    {
+      active: f,
+      "aria-label": f ? "Hide toolbar filters" : "Show toolbar filters",
+      bsStyle: "default",
+      iconName: "rioglyph-option-horizontal",
+      iconOnly: !0,
+      onClick: A
+    }
+  ) });
+  return D(() => {
+    if (i) {
+      S(!1);
+      return;
+    }
+    const a = R.current;
+    a?.classList.add("table-toolbar-measuring");
+    const g = v(p.current) || v(T.current) || v(y.current);
+    a?.classList.remove("table-toolbar-measuring"), S(g);
+  }, [t, i, s.length, n.length, j]), G(() => {
+    (!i || !b) && A(!1);
+  }, [b, i]), u?.length ? i ? /* @__PURE__ */ o("div", { className: m("table-toolbar", "table-toolbar-mobile", e), ref: L, children: /* @__PURE__ */ c("div", { className: "table-toolbar-container table-toolbar-container-mobile", ref: p, children: [
+    h ? /* @__PURE__ */ c(k, { children: [
+      s.length > 0 && /* @__PURE__ */ o("div", { className: "table-toolbar-mobile-primary", children: /* @__PURE__ */ o("div", { className: "table-toolbar-group-left table-toolbar-group-left-mobile", children: s }) }),
+      /* @__PURE__ */ c("div", { className: "table-toolbar-mobile-search-row", children: [
+        /* @__PURE__ */ o("div", { className: "table-toolbar-mobile-search", children: h }),
+        O
+      ] })
+    ] }) : /* @__PURE__ */ c("div", { className: "table-toolbar-mobile-primary", children: [
+      s.length > 0 && /* @__PURE__ */ o("div", { className: "table-toolbar-group-left table-toolbar-group-left-mobile", children: s }),
+      O
+    ] }),
+    b && /* @__PURE__ */ o(V, { open: f, timeout: 220, children: /* @__PURE__ */ o($, { className: m("table-toolbar-mobile-collapse-card", l), children: /* @__PURE__ */ o("div", { className: "table-toolbar-mobile-collapse", children: E }) }) })
+  ] }) }) : /* @__PURE__ */ o(
     "div",
     {
-      className: p("table-toolbar", g && "table-toolbar-has-wrap", o),
-      ref: e,
-      children: /* @__PURE__ */ T("div", { className: "table-toolbar-container", ref: m, children: [
-        a.length > 0 && /* @__PURE__ */ s("div", { className: "table-toolbar-group-left", ref: r, children: a }),
-        i.length > 0 && /* @__PURE__ */ s("div", { className: "table-toolbar-group-right", ref: c, children: i })
+      className: m("table-toolbar", M && "table-toolbar-has-wrap", e),
+      ref: L,
+      children: /* @__PURE__ */ c("div", { className: "table-toolbar-container", ref: p, children: [
+        s.length > 0 && /* @__PURE__ */ o("div", { className: "table-toolbar-group-left", ref: T, children: s }),
+        n.length > 0 && /* @__PURE__ */ o("div", { className: "table-toolbar-group-right", ref: y, children: n })
       ] })
     }
-  ) : /* @__PURE__ */ s("div", { className: p("table-toolbar", o), children: t });
+  ) : /* @__PURE__ */ o("div", { className: m("table-toolbar", e), children: t });
 };
 export {
-  w as TableToolbarColumn,
-  j as default
+  J as TableToolbarColumn,
+  ie as default
 };
 //# sourceMappingURL=TableToolbar.js.map

package/components/table/TableToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableToolbar.js","sources":["../../../src/components/table/TableToolbar.tsx"],"sourcesContent":["import {\n    Children,\n    Fragment,\n    isValidElement,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type PropsWithChildren,\n    type ReactElement,\n    type ReactNode,\n} from 'react';\n\nimport useResizeObserver from '../../hooks/useResizeObserver';\nimport classNames from '../../utils/classNames';\nimport TableToolbarColumn, { type TableToolbarColumnProps } from './TableToolbarColumn';\n\nexport type TableToolbarProps = {\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n};\n\ntype TableToolbarColumnElement = ReactElement<PropsWithChildren<TableToolbarColumnProps>, typeof TableToolbarColumn>;\n\nconst isTableToolbarColumnElement = (child: ReactNode): child is TableToolbarColumnElement =>\n    isValidElement(child) && child.type === TableToolbarColumn;\n\nconst collectToolbarColumns = (children: ReactNode): TableToolbarColumnElement[] | null => {\n    const columns: TableToolbarColumnElement[] = [];\n\n    for (const child of Children.toArray(children)) {\n        if (isValidElement(child) && child.type === Fragment) {\n            const fragmentColumns = collectToolbarColumns(child.props.children);\n\n            if (!fragmentColumns) {\n                return null;\n            }\n\n            columns.push(...fragmentColumns);\n            continue;\n        }\n\n        if (!isTableToolbarColumnElement(child)) {\n            return null;\n        }\n\n        columns.push(child);\n    }\n\n    return columns;\n};\n\nconst hasWrappedFlexItems = (containerElement: HTMLDivElement | null) => {\n    if (!containerElement) {\n        return false;\n    }\n\n    const itemElements = Array.from(containerElement.children) as HTMLElement[];\n\n    if (itemElements.length < 2) {\n        return false;\n    }\n\n    const firstLineBottom = (itemElements[0]?.offsetTop ?? 0) + (itemElements[0]?.offsetHeight ?? 0);\n\n    return itemElements.some(itemElement => itemElement.offsetTop + itemElement.offsetHeight !== firstLineBottom);\n};\n\nconst TableToolbar = ({ className, children }: PropsWithChildren<TableToolbarProps>) => {\n    const toolbarRef = useRef<HTMLDivElement | null>(null);\n    const leftGroupRef = useRef<HTMLDivElement | null>(null);\n    const rightGroupRef = useRef<HTMLDivElement | null>(null);\n\n    const [hasWrappedRows, setHasWrappedRows] = useState(false);\n\n    const [toolbarContainerRef, , { inlineSize: toolbarInlineSize }] = useResizeObserver<HTMLDivElement>();\n\n    const toolbarColumns = collectToolbarColumns(children);\n\n    const leftColumns = (toolbarColumns ?? []).filter(column => column.props.horizontalAlign !== 'right');\n    const rightColumns = (toolbarColumns ?? []).filter(column => column.props.horizontalAlign === 'right');\n\n    useLayoutEffect(() => {\n        const toolbarElement = toolbarRef.current;\n\n        toolbarElement?.classList.add('table-toolbar-measuring');\n\n        const nextHasWrappedRows =\n            hasWrappedFlexItems(toolbarContainerRef.current) ||\n            hasWrappedFlexItems(leftGroupRef.current) ||\n            hasWrappedFlexItems(rightGroupRef.current);\n\n        toolbarElement?.classList.remove('table-toolbar-measuring');\n\n        setHasWrappedRows(nextHasWrappedRows);\n    }, [children, leftColumns.length, rightColumns.length, toolbarInlineSize]);\n\n    if (!toolbarColumns?.length) {\n        return <div className={classNames('table-toolbar', className)}>{children}</div>;\n    }\n\n    return (\n        <div\n            className={classNames('table-toolbar', hasWrappedRows && 'table-toolbar-has-wrap', className)}\n            ref={toolbarRef}\n        >\n            <div className='table-toolbar-container' ref={toolbarContainerRef}>\n                {leftColumns.length > 0 && (\n                    <div className='table-toolbar-group-left' ref={leftGroupRef}>\n                        {leftColumns}\n                    </div>\n                )}\n                {rightColumns.length > 0 && (\n                    <div className='table-toolbar-group-right' ref={rightGroupRef}>\n                        {rightColumns}\n                    </div>\n                )}\n            </div>\n        </div>\n    );\n};\n\nexport default TableToolbar;\nexport { TableToolbarColumn };\nexport type {\n    TableToolbarColumnHorizontalAlign,\n    TableToolbarColumnProps,\n    TableToolbarColumnVerticalAlign,\n} from './TableToolbarColumn';\n"],"names":["isTableToolbarColumnElement","child","isValidElement","TableToolbarColumn","collectToolbarColumns","children","columns","Children","Fragment","fragmentColumns","hasWrappedFlexItems","containerElement","itemElements","firstLineBottom","itemElement","TableToolbar","className","toolbarRef","useRef","leftGroupRef","rightGroupRef","hasWrappedRows","setHasWrappedRows","useState","toolbarContainerRef","toolbarInlineSize","useResizeObserver","toolbarColumns","leftColumns","column","rightColumns","useLayoutEffect","toolbarElement","nextHasWrappedRows","jsx","classNames","jsxs"],"mappings":";;;;;AAyBA,MAAMA,IAA8B,CAACC,MACjCC,EAAeD,CAAK,KAAKA,EAAM,SAASE,GAEtCC,IAAwB,CAACC,MAA4D;AACvF,QAAMC,IAAuC,CAAA;AAE7C,aAAWL,KAASM,EAAS,QAAQF,CAAQ,GAAG;AAC5C,QAAIH,EAAeD,CAAK,KAAKA,EAAM,SAASO,GAAU;AAClD,YAAMC,IAAkBL,EAAsBH,EAAM,MAAM,QAAQ;AAElE,UAAI,CAACQ;AACD,eAAO;AAGX,MAAAH,EAAQ,KAAK,GAAGG,CAAe;AAC/B;AAAA,IACJ;AAEA,QAAI,CAACT,EAA4BC,CAAK;AAClC,aAAO;AAGX,IAAAK,EAAQ,KAAKL,CAAK;AAAA,EACtB;AAEA,SAAOK;AACX,GAEMI,IAAsB,CAACC,MAA4C;AACrE,MAAI,CAACA;AACD,WAAO;AAGX,QAAMC,IAAe,MAAM,KAAKD,EAAiB,QAAQ;AAEzD,MAAIC,EAAa,SAAS;AACtB,WAAO;AAGX,QAAMC,KAAmBD,EAAa,CAAC,GAAG,aAAa,MAAMA,EAAa,CAAC,GAAG,gBAAgB;AAE9F,SAAOA,EAAa,KAAK,CAAAE,MAAeA,EAAY,YAAYA,EAAY,iBAAiBD,CAAe;AAChH,GAEME,IAAe,CAAC,EAAE,WAAAC,GAAW,UAAAX,QAAqD;AACpF,QAAMY,IAAaC,EAA8B,IAAI,GAC/CC,IAAeD,EAA8B,IAAI,GACjDE,IAAgBF,EAA8B,IAAI,GAElD,CAACG,GAAgBC,CAAiB,IAAIC,EAAS,EAAK,GAEpD,CAACC,KAAuB,EAAE,YAAYC,EAAA,CAAmB,IAAIC,EAAA,GAE7DC,IAAiBvB,EAAsBC,CAAQ,GAE/CuB,KAAeD,KAAkB,CAAA,GAAI,OAAO,CAAAE,MAAUA,EAAO,MAAM,oBAAoB,OAAO,GAC9FC,KAAgBH,KAAkB,CAAA,GAAI,OAAO,CAAAE,MAAUA,EAAO,MAAM,oBAAoB,OAAO;AAiBrG,SAfAE,EAAgB,MAAM;AAClB,UAAMC,IAAiBf,EAAW;AAElC,IAAAe,GAAgB,UAAU,IAAI,yBAAyB;AAEvD,UAAMC,IACFvB,EAAoBc,EAAoB,OAAO,KAC/Cd,EAAoBS,EAAa,OAAO,KACxCT,EAAoBU,EAAc,OAAO;AAE7C,IAAAY,GAAgB,UAAU,OAAO,yBAAyB,GAE1DV,EAAkBW,CAAkB;AAAA,EACxC,GAAG,CAAC5B,GAAUuB,EAAY,QAAQE,EAAa,QAAQL,CAAiB,CAAC,GAEpEE,GAAgB,SAKjB,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAW,iBAAiBd,KAAkB,0BAA0BL,CAAS;AAAA,MAC5F,KAAKC;AAAA,MAEL,UAAA,gBAAAmB,EAAC,OAAA,EAAI,WAAU,2BAA0B,KAAKZ,GACzC,UAAA;AAAA,QAAAI,EAAY,SAAS,KAClB,gBAAAM,EAAC,OAAA,EAAI,WAAU,4BAA2B,KAAKf,GAC1C,UAAAS,EAAA,CACL;AAAA,QAEHE,EAAa,SAAS,KACnB,gBAAAI,EAAC,SAAI,WAAU,6BAA4B,KAAKd,GAC3C,UAAAU,EAAA,CACL;AAAA,MAAA,EAAA,CAER;AAAA,IAAA;AAAA,EAAA,sBAnBI,OAAA,EAAI,WAAWK,EAAW,iBAAiBnB,CAAS,GAAI,UAAAX,GAAS;AAsBjF;"}
+{"version":3,"file":"TableToolbar.js","sources":["../../../src/components/table/TableToolbar.tsx"],"sourcesContent":["import {\n    Children,\n    Fragment,\n    useEffect,\n    isValidElement,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type PropsWithChildren,\n    type ReactElement,\n    type ReactNode,\n} from 'react';\n\nimport useResizeObserver from '../../useResizeObserver';\nimport useMergeRefs from '../../hooks/useMergeRefs';\nimport classNames from '../../utils/classNames';\nimport ToggleButton from '../button/ToggleButton';\nimport Collapse from '../collapse/Collapse';\nimport Card from '../card/Card';\nimport TableSearch from './TableSearch';\nimport TableToolbarColumn, { type TableToolbarColumnProps } from './TableToolbarColumn';\n\nexport { TableToolbarColumn };\nexport type {\n    TableToolbarColumnHorizontalAlign,\n    TableToolbarColumnProps,\n    TableToolbarColumnVerticalAlign,\n} from './TableToolbarColumn';\n\n// Switch the toolbar into the compact mobile layout,\n// based on the available toolbar width instead of the overall viewport width.\nconst DEFAULT_TABLE_TOOLBAR_COLLAPSE_BREAKPOINT = 544;\n\nexport type TableToolbarProps = {\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n\n    /**\n     * Optional class names for the card that wraps collapsed toolbar controls\n     * in the compact mobile layout.\n     */\n    collapseCardClassName?: string;\n\n    /**\n     * Optional toolbar width in pixels at which the toolbar switches into its compact\n     * mobile/collapsible layout.\n     *\n     * @default 544\n     */\n    responsiveCollapseBreakpoint?: number;\n\n    /**\n     * Disables the compact mobile/collapsible toolbar layout.\n     *\n     * Use this as an escape hatch when a consuming service needs to keep the\n     * default wrapping toolbar behavior regardless of the available toolbar width.\n     *\n     * @default false\n     */\n    disableResponsiveCollapse?: boolean;\n};\n\ntype TableToolbarColumnElement = ReactElement<PropsWithChildren<TableToolbarColumnProps>, typeof TableToolbarColumn>;\n\nconst isTableToolbarColumnElement = (child: ReactNode): child is TableToolbarColumnElement =>\n    isValidElement(child) && child.type === TableToolbarColumn;\n\nconst collectToolbarColumns = (children: ReactNode): TableToolbarColumnElement[] | null => {\n    const columns: TableToolbarColumnElement[] = [];\n\n    for (const child of Children.toArray(children)) {\n        if (isValidElement(child) && child.type === Fragment) {\n            const fragmentColumns = collectToolbarColumns(child.props.children);\n\n            if (!fragmentColumns) {\n                return null;\n            }\n\n            columns.push(...fragmentColumns);\n            continue;\n        }\n\n        if (!isTableToolbarColumnElement(child)) {\n            return null;\n        }\n\n        columns.push(child);\n    }\n\n    return columns;\n};\n\nconst hasDescendantType = (node: ReactNode, componentType: unknown): boolean =>\n    Children.toArray(node).some(child => {\n        if (!isValidElement(child)) {\n            return false;\n        }\n\n        if (child.type === componentType) {\n            return true;\n        }\n\n        return hasDescendantType(child.props.children, componentType);\n    });\n\nconst hasWrappedFlexItems = (containerElement: HTMLDivElement | null) => {\n    if (!containerElement) {\n        return false;\n    }\n\n    const itemElements = Array.from(containerElement.children) as HTMLElement[];\n\n    if (itemElements.length < 2) {\n        return false;\n    }\n\n    const firstLineBottom = (itemElements[0]?.offsetTop ?? 0) + (itemElements[0]?.offsetHeight ?? 0);\n\n    return itemElements.some(itemElement => itemElement.offsetTop + itemElement.offsetHeight !== firstLineBottom);\n};\n\nconst TableToolbar = (props: PropsWithChildren<TableToolbarProps>) => {\n    const {\n        className,\n        collapseCardClassName,\n        children,\n        responsiveCollapseBreakpoint = DEFAULT_TABLE_TOOLBAR_COLLAPSE_BREAKPOINT,\n        disableResponsiveCollapse = false,\n    } = props;\n\n    const toolbarRef = useRef<HTMLDivElement | null>(null);\n    const leftGroupRef = useRef<HTMLDivElement | null>(null);\n    const rightGroupRef = useRef<HTMLDivElement | null>(null);\n\n    const [hasWrappedRows, setHasWrappedRows] = useState(false);\n    const [isMobileCollapseOpen, setIsMobileCollapseOpen] = useState(false);\n\n    const [toolbarSizeRef, , { inlineSize: toolbarInlineSize }] = useResizeObserver<HTMLDivElement>();\n    const [toolbarContainerRef, , { inlineSize: toolbarContainerInlineSize }] = useResizeObserver<HTMLDivElement>();\n    const mergedToolbarRefs = useMergeRefs(toolbarRef, toolbarSizeRef);\n\n    const isSmallScreen =\n        !disableResponsiveCollapse &&\n        toolbarInlineSize !== undefined &&\n        toolbarInlineSize <= responsiveCollapseBreakpoint;\n\n    const toolbarColumns = collectToolbarColumns(children);\n\n    const leftColumns = (toolbarColumns ?? []).filter(column => column.props.horizontalAlign !== 'right');\n    const rightColumns = (toolbarColumns ?? []).filter(column => column.props.horizontalAlign === 'right');\n\n    const searchRightColumnIndex = rightColumns.findIndex(column =>\n        hasDescendantType(column.props.children, TableSearch)\n    );\n\n    const searchRightColumn = searchRightColumnIndex >= 0 ? rightColumns[searchRightColumnIndex] : undefined;\n\n    const mobileCollapsedRightColumns = searchRightColumn\n        ? rightColumns.filter((_, index) => index !== searchRightColumnIndex)\n        : rightColumns;\n\n    const hasMobileCollapseToggle = isSmallScreen && mobileCollapsedRightColumns.length > 0;\n\n    const mobileCollapseToggle = hasMobileCollapseToggle && (\n        <div className='table-toolbar-mobile-toggle'>\n            <ToggleButton\n                active={isMobileCollapseOpen}\n                aria-label={isMobileCollapseOpen ? 'Hide toolbar filters' : 'Show toolbar filters'}\n                bsStyle='default'\n                iconName={'rioglyph-option-horizontal'}\n                iconOnly\n                onClick={setIsMobileCollapseOpen}\n            />\n        </div>\n    );\n\n    useLayoutEffect(() => {\n        if (isSmallScreen) {\n            setHasWrappedRows(false);\n            return;\n        }\n\n        const toolbarElement = toolbarRef.current;\n\n        toolbarElement?.classList.add('table-toolbar-measuring');\n\n        const nextHasWrappedRows =\n            hasWrappedFlexItems(toolbarContainerRef.current) ||\n            hasWrappedFlexItems(leftGroupRef.current) ||\n            hasWrappedFlexItems(rightGroupRef.current);\n\n        toolbarElement?.classList.remove('table-toolbar-measuring');\n\n        setHasWrappedRows(nextHasWrappedRows);\n    }, [children, isSmallScreen, leftColumns.length, rightColumns.length, toolbarContainerInlineSize]);\n\n    useEffect(() => {\n        if (!isSmallScreen || !hasMobileCollapseToggle) {\n            setIsMobileCollapseOpen(false);\n        }\n    }, [hasMobileCollapseToggle, isSmallScreen]);\n\n    if (!toolbarColumns?.length) {\n        return <div className={classNames('table-toolbar', className)}>{children}</div>;\n    }\n\n    if (isSmallScreen) {\n        return (\n            <div className={classNames('table-toolbar', 'table-toolbar-mobile', className)} ref={mergedToolbarRefs}>\n                <div className='table-toolbar-container table-toolbar-container-mobile' ref={toolbarContainerRef}>\n                    {searchRightColumn ? (\n                        <>\n                            {leftColumns.length > 0 && (\n                                <div className='table-toolbar-mobile-primary'>\n                                    <div className='table-toolbar-group-left table-toolbar-group-left-mobile'>\n                                        {leftColumns}\n                                    </div>\n                                </div>\n                            )}\n                            <div className='table-toolbar-mobile-search-row'>\n                                <div className='table-toolbar-mobile-search'>{searchRightColumn}</div>\n                                {mobileCollapseToggle}\n                            </div>\n                        </>\n                    ) : (\n                        <div className='table-toolbar-mobile-primary'>\n                            {leftColumns.length > 0 && (\n                                <div className='table-toolbar-group-left table-toolbar-group-left-mobile'>\n                                    {leftColumns}\n                                </div>\n                            )}\n                            {mobileCollapseToggle}\n                        </div>\n                    )}\n\n                    {hasMobileCollapseToggle && (\n                        <Collapse open={isMobileCollapseOpen} timeout={220}>\n                            <Card className={classNames('table-toolbar-mobile-collapse-card', collapseCardClassName)}>\n                                <div className='table-toolbar-mobile-collapse'>{mobileCollapsedRightColumns}</div>\n                            </Card>\n                        </Collapse>\n                    )}\n                </div>\n            </div>\n        );\n    }\n\n    return (\n        <div\n            className={classNames('table-toolbar', hasWrappedRows && 'table-toolbar-has-wrap', className)}\n            ref={mergedToolbarRefs}\n        >\n            <div className='table-toolbar-container' ref={toolbarContainerRef}>\n                {leftColumns.length > 0 && (\n                    <div className='table-toolbar-group-left' ref={leftGroupRef}>\n                        {leftColumns}\n                    </div>\n                )}\n                {rightColumns.length > 0 && (\n                    <div className='table-toolbar-group-right' ref={rightGroupRef}>\n                        {rightColumns}\n                    </div>\n                )}\n            </div>\n        </div>\n    );\n};\n\nexport default TableToolbar;\n"],"names":["DEFAULT_TABLE_TOOLBAR_COLLAPSE_BREAKPOINT","isTableToolbarColumnElement","child","isValidElement","TableToolbarColumn","collectToolbarColumns","children","columns","Children","Fragment","fragmentColumns","hasDescendantType","node","componentType","hasWrappedFlexItems","containerElement","itemElements","firstLineBottom","itemElement","TableToolbar","props","className","collapseCardClassName","responsiveCollapseBreakpoint","disableResponsiveCollapse","toolbarRef","useRef","leftGroupRef","rightGroupRef","hasWrappedRows","setHasWrappedRows","useState","isMobileCollapseOpen","setIsMobileCollapseOpen","toolbarSizeRef","toolbarInlineSize","useResizeObserver","toolbarContainerRef","toolbarContainerInlineSize","mergedToolbarRefs","useMergeRefs","isSmallScreen","toolbarColumns","leftColumns","column","rightColumns","searchRightColumnIndex","TableSearch","searchRightColumn","mobileCollapsedRightColumns","_","index","hasMobileCollapseToggle","mobileCollapseToggle","jsx","ToggleButton","useLayoutEffect","toolbarElement","nextHasWrappedRows","useEffect","classNames","jsxs","Collapse","Card"],"mappings":"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"}