@worknice/whiteboard 0.61.0 → 0.63.0

package/dist/icons/components/ArrowsCompress.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    ({ size, tone, animate }: import("../types").IconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default _default;

package/dist/icons/components/ArrowsCompress.js

@@ -0,0 +1,14 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__ from "../createIcon.js";
+const ArrowsCompressSvg = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 640 640",
+        fill: "currentColor",
+        "aria-hidden": "true",
+        ...props,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("path", {
+            d: "M553.5 121C562.9 111.6 562.9 96.4 553.5 87.1C544.1 77.8 528.9 77.7 519.6 87.1L384.6 222.1L384.6 136C384.6 122.7 373.9 112 360.6 112C347.3 112 336.6 122.7 336.6 136L336.6 280C336.6 293.3 347.3 304 360.6 304L504.6 304C517.9 304 528.6 293.3 528.6 280C528.6 266.7 517.9 256 504.6 256L418.5 256L553.5 121zM87.5 519C78.1 528.4 78.1 543.6 87.5 552.9C96.9 562.2 112.1 562.3 121.4 552.9L256.4 417.9L256.4 504C256.4 517.3 267.1 528 280.4 528C293.7 528 304.4 517.3 304.4 504L304.4 360C304.4 346.7 293.7 336 280.4 336L136.4 336C123.1 336 112.4 346.7 112.4 360C112.4 373.3 123.1 384 136.4 384L222.5 384L87.5 519z"
+        })
+    });
+const ArrowsCompress_rslib_entry_ = (0, __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__.createIcon)(ArrowsCompressSvg);
+export { ArrowsCompress_rslib_entry_ as default };

package/dist/icons/components/ArrowsExpand.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    ({ size, tone, animate }: import("../types").IconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default _default;

package/dist/icons/components/ArrowsExpand.js

@@ -0,0 +1,14 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__ from "../createIcon.js";
+const ArrowsExpandSvg = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 640 640",
+        fill: "currentColor",
+        "aria-hidden": "true",
+        ...props,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("path", {
+            d: "M359 247C349.6 256.4 349.6 271.6 359 280.9C368.4 290.2 383.6 290.3 392.9 280.9L527.9 145.9L527.9 232C527.9 245.3 538.6 256 551.9 256C565.2 256 575.9 245.3 575.9 232L575.9 88C575.9 74.7 565.2 64 551.9 64L408 64C394.7 64 384 74.7 384 88C384 101.3 394.7 112 408 112L494.1 112L359.1 247zM281 393C290.4 383.6 290.4 368.4 281 359.1C271.6 349.8 256.4 349.7 247.1 359.1L112 494.1L112 408C112 394.7 101.3 384 88 384C74.7 384 64 394.7 64 408L64 552C64 565.3 74.7 576 88 576L232 576C245.3 576 256 565.3 256 552C256 538.7 245.3 528 232 528L145.9 528L280.9 393z"
+        })
+    });
+const ArrowsExpand_rslib_entry_ = (0, __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__.createIcon)(ArrowsExpandSvg);
+export { ArrowsExpand_rslib_entry_ as default };

package/dist/icons/components/FitView.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    ({ size, tone, animate }: import("../types").IconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default _default;

package/dist/icons/components/FitView.js

@@ -0,0 +1,14 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__ from "../createIcon.js";
+const FitViewSvg = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 640 640",
+        fill: "currentColor",
+        "aria-hidden": "true",
+        ...props,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("path", {
+            d: "M232 96C245.3 96 256 106.7 256 120C256 133.3 245.3 144 232 144L144 144L144 232C144 245.3 133.3 256 120 256C106.7 256 96 245.3 96 232L96 120C96 106.7 106.7 96 120 96L232 96zM96 408C96 394.7 106.7 384 120 384C133.3 384 144 394.7 144 408L144 496L232 496C245.3 496 256 506.7 256 520C256 533.3 245.3 544 232 544L120 544C106.7 544 96 533.3 96 520L96 408zM520 96C533.3 96 544 106.7 544 120L544 232C544 245.3 533.3 256 520 256C506.7 256 496 245.3 496 232L496 144L408 144C394.7 144 384 133.3 384 120C384 106.7 394.7 96 408 96L520 96zM496 408C496 394.7 506.7 384 520 384C533.3 384 544 394.7 544 408L544 520C544 533.3 533.3 544 520 544L408 544C394.7 544 384 533.3 384 520C384 506.7 394.7 496 408 496L496 496L496 408z"
+        })
+    });
+const FitView_rslib_entry_ = (0, __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__.createIcon)(FitViewSvg);
+export { FitView_rslib_entry_ as default };

package/dist/icons/components/index.d.ts

@@ -3,6 +3,8 @@ export { default as Apps } from "./Apps";
 export { default as Archive } from "./Archive";
 export { default as ArrowLeft } from "./ArrowLeft";
 export { default as ArrowRight } from "./ArrowRight";
+export { default as ArrowsCompress } from "./ArrowsCompress";
+export { default as ArrowsExpand } from "./ArrowsExpand";
 export { default as ArrowsUpDown } from "./ArrowsUpDown";
 export { default as ArrowTurnLeftUp } from "./ArrowTurnLeftUp";
 export { default as Assign } from "./Assign";
@@ -40,6 +42,7 @@ export { default as External } from "./External";
 export { default as FileExport } from "./FileExport";
 export { default as Filter } from "./Filter";
 export { default as FilterList } from "./FilterList";
+export { default as FitView } from "./FitView";
 export { default as Globe } from "./Globe";
 export { default as GripLines } from "./GripLines";
 export { default as Help } from "./Help";

package/dist/icons/components/index.js

@@ -3,6 +3,8 @@ import * as __WEBPACK_EXTERNAL_MODULE__Apps_js_ac5be813__ from "./Apps.js";
 import * as __WEBPACK_EXTERNAL_MODULE__Archive_js_95b35fb0__ from "./Archive.js";
 import * as __WEBPACK_EXTERNAL_MODULE__ArrowLeft_js_4233a464__ from "./ArrowLeft.js";
 import * as __WEBPACK_EXTERNAL_MODULE__ArrowRight_js_b03494b0__ from "./ArrowRight.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ArrowsCompress_js_0a97c78a__ from "./ArrowsCompress.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ArrowsExpand_js_e865c05e__ from "./ArrowsExpand.js";
 import * as __WEBPACK_EXTERNAL_MODULE__ArrowsUpDown_js_5e0c3c30__ from "./ArrowsUpDown.js";
 import * as __WEBPACK_EXTERNAL_MODULE__ArrowTurnLeftUp_js_6b36a534__ from "./ArrowTurnLeftUp.js";
 import * as __WEBPACK_EXTERNAL_MODULE__Assign_js_d5a91ac0__ from "./Assign.js";
@@ -40,6 +42,7 @@ import * as __WEBPACK_EXTERNAL_MODULE__External_js_f57b3137__ from "./External.j
 import * as __WEBPACK_EXTERNAL_MODULE__FileExport_js_b58980f9__ from "./FileExport.js";
 import * as __WEBPACK_EXTERNAL_MODULE__Filter_js_962e7a68__ from "./Filter.js";
 import * as __WEBPACK_EXTERNAL_MODULE__FilterList_js_14d71870__ from "./FilterList.js";
+import * as __WEBPACK_EXTERNAL_MODULE__FitView_js_91c9e961__ from "./FitView.js";
 import * as __WEBPACK_EXTERNAL_MODULE__Globe_js_b709cce8__ from "./Globe.js";
 import * as __WEBPACK_EXTERNAL_MODULE__GripLines_js_83a4e963__ from "./GripLines.js";
 import * as __WEBPACK_EXTERNAL_MODULE__Help_js_f6301461__ from "./Help.js";
@@ -105,6 +108,8 @@ var __webpack_exports__Archive = __WEBPACK_EXTERNAL_MODULE__Archive_js_95b35fb0_
 var __webpack_exports__ArrowLeft = __WEBPACK_EXTERNAL_MODULE__ArrowLeft_js_4233a464__["default"];
 var __webpack_exports__ArrowRight = __WEBPACK_EXTERNAL_MODULE__ArrowRight_js_b03494b0__["default"];
 var __webpack_exports__ArrowTurnLeftUp = __WEBPACK_EXTERNAL_MODULE__ArrowTurnLeftUp_js_6b36a534__["default"];
+var __webpack_exports__ArrowsCompress = __WEBPACK_EXTERNAL_MODULE__ArrowsCompress_js_0a97c78a__["default"];
+var __webpack_exports__ArrowsExpand = __WEBPACK_EXTERNAL_MODULE__ArrowsExpand_js_e865c05e__["default"];
 var __webpack_exports__ArrowsUpDown = __WEBPACK_EXTERNAL_MODULE__ArrowsUpDown_js_5e0c3c30__["default"];
 var __webpack_exports__Assign = __WEBPACK_EXTERNAL_MODULE__Assign_js_d5a91ac0__["default"];
 var __webpack_exports__AssignmentCertificate = __WEBPACK_EXTERNAL_MODULE__AssignmentCertificate_js_14da7bce__["default"];
@@ -141,6 +146,7 @@ var __webpack_exports__External = __WEBPACK_EXTERNAL_MODULE__External_js_f57b313
 var __webpack_exports__FileExport = __WEBPACK_EXTERNAL_MODULE__FileExport_js_b58980f9__["default"];
 var __webpack_exports__Filter = __WEBPACK_EXTERNAL_MODULE__Filter_js_962e7a68__["default"];
 var __webpack_exports__FilterList = __WEBPACK_EXTERNAL_MODULE__FilterList_js_14d71870__["default"];
+var __webpack_exports__FitView = __WEBPACK_EXTERNAL_MODULE__FitView_js_91c9e961__["default"];
 var __webpack_exports__Globe = __WEBPACK_EXTERNAL_MODULE__Globe_js_b709cce8__["default"];
 var __webpack_exports__GripLines = __WEBPACK_EXTERNAL_MODULE__GripLines_js_83a4e963__["default"];
 var __webpack_exports__Help = __WEBPACK_EXTERNAL_MODULE__Help_js_f6301461__["default"];
@@ -200,4 +206,4 @@ var __webpack_exports__Tenure = __WEBPACK_EXTERNAL_MODULE__Tenure_js_7ba1f77f__[
 var __webpack_exports__Visible = __WEBPACK_EXTERNAL_MODULE__Visible_js_aa1c6acc__["default"];
 var __webpack_exports__Warning = __WEBPACK_EXTERNAL_MODULE__Warning_js_d0de15e9__["default"];
 var __webpack_exports__Workflows = __WEBPACK_EXTERNAL_MODULE__Workflows_js_35639a49__["default"];
-export { __webpack_exports__Approval as Approval, __webpack_exports__Apps as Apps, __webpack_exports__Archive as Archive, __webpack_exports__ArrowLeft as ArrowLeft, __webpack_exports__ArrowRight as ArrowRight, __webpack_exports__ArrowTurnLeftUp as ArrowTurnLeftUp, __webpack_exports__ArrowsUpDown as ArrowsUpDown, __webpack_exports__Assign as Assign, __webpack_exports__AssignmentCertificate as AssignmentCertificate, __webpack_exports__AssignmentDocument as AssignmentDocument, __webpack_exports__AssignmentQuestionnaire as AssignmentQuestionnaire, __webpack_exports__BankAccount as BankAccount, __webpack_exports__BookOpenLines as BookOpenLines, __webpack_exports__Bug as Bug, __webpack_exports__Calendar as Calendar, __webpack_exports__Cancel as Cancel, __webpack_exports__CaratDown as CaratDown, __webpack_exports__CaratLeft as CaratLeft, __webpack_exports__CaratRight as CaratRight, __webpack_exports__CaratUp as CaratUp, __webpack_exports__CheckMark as CheckMark, __webpack_exports__ChevronDown as ChevronDown, __webpack_exports__ChevronLeft as ChevronLeft, __webpack_exports__ChevronRight as ChevronRight, __webpack_exports__ChevronUp as ChevronUp, __webpack_exports__Close as Close, __webpack_exports__Columns as Columns, __webpack_exports__Comment as Comment, __webpack_exports__Copy as Copy, __webpack_exports__Dash as Dash, __webpack_exports__Delete as Delete, __webpack_exports__Directory as Directory, __webpack_exports__DocumentProcessingFailed as DocumentProcessingFailed, __webpack_exports__Download as Download, __webpack_exports__Edit as Edit, __webpack_exports__Email as Email, __webpack_exports__EmergencyContact as EmergencyContact, __webpack_exports__Events as Events, __webpack_exports__External as External, __webpack_exports__FileExport as FileExport, __webpack_exports__Filter as Filter, __webpack_exports__FilterList as FilterList, __webpack_exports__Globe as Globe, __webpack_exports__GripLines as GripLines, __webpack_exports__Help as Help, __webpack_exports__Hidden as Hidden, __webpack_exports__Inbox as Inbox, __webpack_exports__Info as Info, __webpack_exports__Insights as Insights, __webpack_exports__Job as Job, __webpack_exports__Leave as Leave, __webpack_exports__Lightbulb as Lightbulb, __webpack_exports__Loading as Loading, __webpack_exports__LocationCheck as LocationCheck, __webpack_exports__Logout as Logout, __webpack_exports__Messages as Messages, __webpack_exports__Microsoft as Microsoft, __webpack_exports__Minus as Minus, __webpack_exports__Newspaper as Newspaper, __webpack_exports__Overflow as Overflow, __webpack_exports__Paperwork as Paperwork, __webpack_exports__PaperworkAssigned as PaperworkAssigned, __webpack_exports__PaperworkDraft as PaperworkDraft, __webpack_exports__PaperworkExpired as PaperworkExpired, __webpack_exports__PaperworkExpiringSoon as PaperworkExpiringSoon, __webpack_exports__PaperworkMissing as PaperworkMissing, __webpack_exports__PaperworkProcessed as PaperworkProcessed, __webpack_exports__PaperworkSubmitted as PaperworkSubmitted, __webpack_exports__People as People, __webpack_exports__Phone as Phone, __webpack_exports__Plus as Plus, __webpack_exports__Positions as Positions, __webpack_exports__Profile as Profile, __webpack_exports__ProfileFemale as ProfileFemale, __webpack_exports__ProfileMale as ProfileMale, __webpack_exports__Remuneration as Remuneration, __webpack_exports__Reschedule as Reschedule, __webpack_exports__Restore as Restore, __webpack_exports__Review as Review, __webpack_exports__Schedule as Schedule, __webpack_exports__Search as Search, __webpack_exports__Settings as Settings, __webpack_exports__Sidebar as Sidebar, __webpack_exports__Sliders as Sliders, __webpack_exports__SortAsc as SortAsc, __webpack_exports__SortDefault as SortDefault, __webpack_exports__SortDes as SortDes, __webpack_exports__StepsComplete as StepsComplete, __webpack_exports__StepsCurrent as StepsCurrent, __webpack_exports__StepsIncomplete as StepsIncomplete, __webpack_exports__Submit as Submit, __webpack_exports__Success as Success, __webpack_exports__SuperFund as SuperFund, __webpack_exports__Sync as Sync, __webpack_exports__Table as Table, __webpack_exports__Task as Task, __webpack_exports__Tax as Tax, __webpack_exports__Tenure as Tenure, __webpack_exports__Visible as Visible, __webpack_exports__Warning as Warning, __webpack_exports__Workflows as Workflows };
+export { __webpack_exports__Approval as Approval, __webpack_exports__Apps as Apps, __webpack_exports__Archive as Archive, __webpack_exports__ArrowLeft as ArrowLeft, __webpack_exports__ArrowRight as ArrowRight, __webpack_exports__ArrowTurnLeftUp as ArrowTurnLeftUp, __webpack_exports__ArrowsCompress as ArrowsCompress, __webpack_exports__ArrowsExpand as ArrowsExpand, __webpack_exports__ArrowsUpDown as ArrowsUpDown, __webpack_exports__Assign as Assign, __webpack_exports__AssignmentCertificate as AssignmentCertificate, __webpack_exports__AssignmentDocument as AssignmentDocument, __webpack_exports__AssignmentQuestionnaire as AssignmentQuestionnaire, __webpack_exports__BankAccount as BankAccount, __webpack_exports__BookOpenLines as BookOpenLines, __webpack_exports__Bug as Bug, __webpack_exports__Calendar as Calendar, __webpack_exports__Cancel as Cancel, __webpack_exports__CaratDown as CaratDown, __webpack_exports__CaratLeft as CaratLeft, __webpack_exports__CaratRight as CaratRight, __webpack_exports__CaratUp as CaratUp, __webpack_exports__CheckMark as CheckMark, __webpack_exports__ChevronDown as ChevronDown, __webpack_exports__ChevronLeft as ChevronLeft, __webpack_exports__ChevronRight as ChevronRight, __webpack_exports__ChevronUp as ChevronUp, __webpack_exports__Close as Close, __webpack_exports__Columns as Columns, __webpack_exports__Comment as Comment, __webpack_exports__Copy as Copy, __webpack_exports__Dash as Dash, __webpack_exports__Delete as Delete, __webpack_exports__Directory as Directory, __webpack_exports__DocumentProcessingFailed as DocumentProcessingFailed, __webpack_exports__Download as Download, __webpack_exports__Edit as Edit, __webpack_exports__Email as Email, __webpack_exports__EmergencyContact as EmergencyContact, __webpack_exports__Events as Events, __webpack_exports__External as External, __webpack_exports__FileExport as FileExport, __webpack_exports__Filter as Filter, __webpack_exports__FilterList as FilterList, __webpack_exports__FitView as FitView, __webpack_exports__Globe as Globe, __webpack_exports__GripLines as GripLines, __webpack_exports__Help as Help, __webpack_exports__Hidden as Hidden, __webpack_exports__Inbox as Inbox, __webpack_exports__Info as Info, __webpack_exports__Insights as Insights, __webpack_exports__Job as Job, __webpack_exports__Leave as Leave, __webpack_exports__Lightbulb as Lightbulb, __webpack_exports__Loading as Loading, __webpack_exports__LocationCheck as LocationCheck, __webpack_exports__Logout as Logout, __webpack_exports__Messages as Messages, __webpack_exports__Microsoft as Microsoft, __webpack_exports__Minus as Minus, __webpack_exports__Newspaper as Newspaper, __webpack_exports__Overflow as Overflow, __webpack_exports__Paperwork as Paperwork, __webpack_exports__PaperworkAssigned as PaperworkAssigned, __webpack_exports__PaperworkDraft as PaperworkDraft, __webpack_exports__PaperworkExpired as PaperworkExpired, __webpack_exports__PaperworkExpiringSoon as PaperworkExpiringSoon, __webpack_exports__PaperworkMissing as PaperworkMissing, __webpack_exports__PaperworkProcessed as PaperworkProcessed, __webpack_exports__PaperworkSubmitted as PaperworkSubmitted, __webpack_exports__People as People, __webpack_exports__Phone as Phone, __webpack_exports__Plus as Plus, __webpack_exports__Positions as Positions, __webpack_exports__Profile as Profile, __webpack_exports__ProfileFemale as ProfileFemale, __webpack_exports__ProfileMale as ProfileMale, __webpack_exports__Remuneration as Remuneration, __webpack_exports__Reschedule as Reschedule, __webpack_exports__Restore as Restore, __webpack_exports__Review as Review, __webpack_exports__Schedule as Schedule, __webpack_exports__Search as Search, __webpack_exports__Settings as Settings, __webpack_exports__Sidebar as Sidebar, __webpack_exports__Sliders as Sliders, __webpack_exports__SortAsc as SortAsc, __webpack_exports__SortDefault as SortDefault, __webpack_exports__SortDes as SortDes, __webpack_exports__StepsComplete as StepsComplete, __webpack_exports__StepsCurrent as StepsCurrent, __webpack_exports__StepsIncomplete as StepsIncomplete, __webpack_exports__Submit as Submit, __webpack_exports__Success as Success, __webpack_exports__SuperFund as SuperFund, __webpack_exports__Sync as Sync, __webpack_exports__Table as Table, __webpack_exports__Task as Task, __webpack_exports__Tax as Tax, __webpack_exports__Tenure as Tenure, __webpack_exports__Visible as Visible, __webpack_exports__Warning as Warning, __webpack_exports__Workflows as Workflows };

package/dist/icons/svgs/ArrowsCompress.js

@@ -0,0 +1,2 @@
+import ArrowsCompress_rslib_entry_namespaceObject from "../../static/svg/ArrowsCompress.svg";
+export { ArrowsCompress_rslib_entry_namespaceObject as default };

package/dist/icons/svgs/ArrowsExpand.js

@@ -0,0 +1,2 @@
+import ArrowsExpand_rslib_entry_namespaceObject from "../../static/svg/ArrowsExpand.svg";
+export { ArrowsExpand_rslib_entry_namespaceObject as default };

package/dist/icons/svgs/FitView.js

@@ -0,0 +1,2 @@
+import FitView_rslib_entry_namespaceObject from "../../static/svg/FitView.svg";
+export { FitView_rslib_entry_namespaceObject as default };

package/dist/presentation/CustomizableTable/CustomizableTable.js

@@ -468,7 +468,8 @@ const CustomizableTable = ({ data, columns, csvFilename, getRowId, availableColu
             return void 0 !== tableColumn && tableColumn.getIsVisible();
         }), [
         filterableColumns,
-        reactTable
+        reactTable,
+        columnVisibility
     ]);
     const hasFilterableColumns = filterableColumnsForModal.length > 0;
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{

package/dist/presentation/RichList/RichList.d.ts

@@ -1,5 +1,6 @@
 import { type CSSProperties, type ReactNode } from "react";
 import { type ZodTypeAny } from "zod";
+import { type RichListRowHeight } from "./helpers";
 import { type RichListBulkAction, type RichListContentSlot, type RichListMainSlot, type RichListRowAction, type RichListSlot } from "./types";
 type CommonProps<Type> = {
     data: Array<Type>;
@@ -48,9 +49,14 @@ type CommonProps<Type> = {
      */
     rowActions?: (row: Type) => Array<RichListRowAction<Type> | null>;
     /**
+     * Row height preset, pixel value, or breakpoint-specific values keyed to
+     * `compactBreakpoint` (same signal as `layoutVisibility: "whenWide"` / `"whenCompact"`).
+     *
+     * @example rowHeight="large"
+     * @example rowHeight={{ whenWide: "large", whenCompact: "medium" }}
      * @default `"medium"`
      */
-    rowHeight?: number | "small" | "medium" | "large";
+    rowHeight?: RichListRowHeight;
     /**
      * File name for CSV export when columns with `csvExport: true` are included.
      * @default (omitted) no CSV download from the list toolbar.
@@ -149,4 +155,4 @@ type NavigationProps<Type> = {
 export type RichListProps<Type> = CommonProps<Type> & NavigationProps<Type>;
 declare const RichList: <Type>({ data, getRowId, leadingSlot, mainSlot, contentSlots, contentAlignment, trailingSlot, href, onClick, rowActions, bulkActions, secondaryBulkActions, rowHeight, csvFilename, fillContainerHeight, compactBreakpoint: compactBreakpointProp, emptyState, id, pathName, localStorageSchema, header, }: RichListProps<Type>) => import("react/jsx-runtime").JSX.Element;
 export default RichList;
-export type { RichListBulkAction, RichListColumnWidthMode, RichListContentSlot, RichListLayoutVisibility, RichListMainSlot, RichListRowAction, RichListSlot, RichListSlotSize, RichListTextField, } from "./types";
+export type { RichListBulkAction, RichListColumnWidthMode, RichListContentSlot, RichListGrouping, RichListLayoutVisibility, RichListMainSlot, RichListRowAction, RichListSlot, RichListSlotSize, RichListTextField, } from "./types";

package/dist/presentation/RichList/RichList.js

@@ -63,7 +63,6 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
         contentSlots
     ]);
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useLayoutEffect)(()=>{
-        if (0 === renderableContentSlots.length) return;
         const el = listScopeRef.current;
         if (!el) return;
         const update = ()=>{
@@ -75,7 +74,6 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
         ro.observe(el);
         return ()=>ro.disconnect();
     }, [
-        renderableContentSlots,
         compactBreakpointPx
     ]);
     const enableRowSelection = bulkActions.length + secondaryBulkActions.length > 0;
@@ -146,6 +144,9 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
     const sortableEntries = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>allEntries.filter((e)=>null !== e && e.enableSorting && void 0 !== e.value), [
         allEntries
     ]);
+    const groupableEntries = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>allEntries.filter((e)=>null !== e && void 0 !== e.grouping), [
+        allEntries
+    ]);
     const hasSortableEntries = sortableEntries.length > 0;
     const sortableEntryIds = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>new Set(sortableEntries.map((entry)=>entry.id)), [
         sortableEntries
@@ -155,12 +156,14 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
         const tableFilteringForEntry = (entryId)=>!(void 0 !== inlineSingleSelectExcludedFromTableColumnId && entryId === inlineSingleSelectExcludedFromTableColumnId);
         const columns = allEntries.filter((e)=>null !== e).map((entry)=>{
             const tableFiltering = !!entry.filter && tableFilteringForEntry(entry.id);
+            const grouping = entry.grouping;
             if (void 0 === entry.value) return columnHelper.display({
                 id: entry.id,
                 cell: ({ row })=>entry.render(row.original),
                 enableHiding: (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.isColumnWithVisibilityState)(entry),
                 enableGlobalFilter: false,
-                enableColumnFilter: tableFiltering
+                enableColumnFilter: tableFiltering,
+                getGroupingValue: grouping ? (row)=>grouping.fn(row) : void 0
             });
             const value = entry.value;
             return columnHelper.accessor((row)=>value(row), {
@@ -171,6 +174,7 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
                 enableSorting: entry.enableSorting,
                 sortingFn: entry.sortingFn ?? "auto",
                 sortUndefined: 1,
+                getGroupingValue: grouping ? (row)=>grouping.fn(row) : void 0,
                 filterFn: entry.filter && tableFiltering ? (row, _columnId, filterValue)=>{
                     const filter = entry.filter;
                     if (!filter) return true;
@@ -311,8 +315,11 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
         data: tableData,
         columns: columnDefs,
         getRowId,
+        groupedColumnMode: false,
         getCoreRowModel: (0, __WEBPACK_EXTERNAL_MODULE__tanstack_react_table_777e1b4b__.getCoreRowModel)(),
         getFilteredRowModel: (0, __WEBPACK_EXTERNAL_MODULE__tanstack_react_table_777e1b4b__.getFilteredRowModel)(),
+        getGroupedRowModel: (0, __WEBPACK_EXTERNAL_MODULE__tanstack_react_table_777e1b4b__.getGroupedRowModel)(),
+        getExpandedRowModel: (0, __WEBPACK_EXTERNAL_MODULE__tanstack_react_table_777e1b4b__.getExpandedRowModel)(),
         ...hasSortableEntries ? {
             getSortedRowModel: (0, __WEBPACK_EXTERNAL_MODULE__tanstack_react_table_777e1b4b__.getSortedRowModel)()
         } : {},
@@ -321,12 +328,15 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
         initialState: {
             columnFilters: tableColumnFiltersInitialState,
             columnVisibility: initialColumnVisibility,
+            expanded: true,
             globalFilter: "",
+            grouping: parsedLocalStorage.grouping ?? [],
             sorting: initialSorting
         },
         defaultColumn: {
             enableColumnFilter: false,
             enableGlobalFilter: false,
+            enableGrouping: false,
             enableSorting: false
         }
     });
@@ -363,12 +373,14 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
         if (storageKey) window.localStorage.setItem(storageKey, JSON.stringify({
             columnFilters: mergeInlineSinglePersistedColumnFilters(tableState.columnFilters, inlineSingleSelectExcludedFromTableColumnId, inlineSingleSelectOptionIdResolved),
             columnVisibility: tableState.columnVisibility,
-            sorting: persistedSorting
+            sorting: persistedSorting,
+            grouping: tableState.grouping
         }));
     }, [
         storageKey,
         tableState.columnFilters,
         tableState.columnVisibility,
+        tableState.grouping,
         persistedSorting,
         inlineSingleSelectExcludedFromTableColumnId,
         inlineSingleSelectOptionIdResolved
@@ -393,13 +405,17 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
     const hasMultipleActions = allBulkActionRowCounts.length > 1;
     const allRowsCanDoAllActions = hasMultipleActions && allBulkActionRowCounts.every((count)=>count === filteredSelectedRows.rows.length);
     const showBulkActionCounts = bulkActionRowCountsDiffer || hasMultipleActions && !allRowsCanDoAllActions;
-    const resolvedRowHeightPx = "number" == typeof rowHeight ? rowHeight : __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.ROW_HEIGHT_PRESETS[rowHeight];
+    const resolvedRowHeightValue = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.resolveRichListRowHeightValue)(rowHeight, isCompactContentSlots, "medium"), [
+        rowHeight,
+        isCompactContentSlots
+    ]);
+    const resolvedRowHeightPx = (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.richListRowHeightToPx)(resolvedRowHeightValue);
     const listRootStyle = (0, __WEBPACK_EXTERNAL_MODULE__utils_customProperties_js_3d9c174d__["default"])({
         "--row-height": `${resolvedRowHeightPx}px`,
-        "--richlist-padding-inline": `${(0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.richListInlinePaddingPx)(rowHeight)}px`
+        "--richlist-padding-inline": `${(0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.richListInlinePaddingPx)(resolvedRowHeightValue)}px`
     });
     const showDisplayForColumnVisibility = !isCompactContentSlots && toggleableContentSlots.length > 0;
-    const showDisplayButton = hasSortableEntries || showDisplayForColumnVisibility;
+    const showDisplayButton = hasSortableEntries || groupableEntries.length > 0 || showDisplayForColumnVisibility;
     const defaultDisplayColumnVisibility = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>Object.fromEntries(toggleableContentSlots.map((entry)=>[
                 entry.id,
                 !("hiddenByDefault" in entry && entry.hiddenByDefault)
@@ -412,6 +428,12 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
             })), [
         sortableEntries
     ]);
+    const groupableColumnsForModal = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>groupableEntries.map((entry)=>({
+                id: entry.id,
+                label: entry.grouping.label
+            })), [
+        groupableEntries
+    ]);
     const displayColumnsForModal = toggleableContentSlots.map((entry)=>({
             id: entry.id,
             label: entry.label ?? entry.id,
@@ -419,7 +441,7 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
             defaultVisible: !("hiddenByDefault" in entry && entry.hiddenByDefault)
         }));
     const displayColumnsForDisplayModal = isCompactContentSlots ? [] : displayColumnsForModal;
-    const displayActiveCount = (0, __WEBPACK_EXTERNAL_MODULE__RichListDisplayModal_js_6277e838__.getDisplayFormActiveExpanderCount)(hasSortableEntries, persistedSorting, displayColumnsForDisplayModal);
+    const displayActiveCount = (0, __WEBPACK_EXTERNAL_MODULE__RichListDisplayModal_js_6277e838__.getDisplayFormActiveExpanderCount)(hasSortableEntries, persistedSorting, displayColumnsForDisplayModal, groupableEntries.length > 0, tableState.grouping[0]);
     const hasToolbar = enableRowSelection || entriesWithGlobalFilter.length > 0 || entriesWithFilter.length > 0 || showDisplayButton || shouldShowCsvExport;
     const actionsByRowId = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
         const map = new Map();
@@ -434,22 +456,6 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
         rowActions,
         getRowId
     ]);
-    const maxAlwaysVisibleActions = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
-        let max = 0;
-        for (const actions of actionsByRowId.values()){
-            const count = actions.filter((a)=>a.alwaysVisible).length;
-            if (count > max) max = count;
-        }
-        return max;
-    }, [
-        actionsByRowId
-    ]);
-    const anyRowHasOverflowAction = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
-        for (const actions of actionsByRowId.values())if (actions.some((a)=>!a.alwaysVisible)) return true;
-        return false;
-    }, [
-        actionsByRowId
-    ]);
     const filterableColumnsForModal = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>entriesWithFilter.map((entry)=>({
                 id: entry.id,
                 filter: entry.filter
@@ -546,7 +552,7 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
                                             tone: "muted",
                                             children: [
                                                 "Showing ",
-                                                table.getFilteredRowModel().flatRows.length,
+                                                table.getPreGroupedRowModel().flatRows.length,
                                                 " of",
                                                 " ",
                                                 table.getPreFilteredRowModel().flatRows.length
@@ -568,9 +574,12 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
                         }),
                         rows.length > 0 ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("ul", {
                             className: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].list,
-                            children: rows.map((row)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichListRow_js_08189b13__["default"], {
+                            children: rows.map((row)=>{
+                                const groupEntry = groupableEntries.find((entry)=>entry.id === row.groupingColumnId);
+                                return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichListRow_js_08189b13__["default"], {
                                     row: row,
                                     table: table,
+                                    groupEntry: groupEntry,
                                     enableRowSelection: enableRowSelection,
                                     href: href,
                                     onClick: onClick,
@@ -584,10 +593,9 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
                                     rowMainHidesContentSlotColumns: rowMainHidesContentSlotColumns,
                                     contentSlotsJustifyContent: contentAlignment,
                                     actionsForRow: actionsByRowId.get(row.id) ?? [],
-                                    maxAlwaysVisibleActions: maxAlwaysVisibleActions,
-                                    anyRowHasOverflowAction: anyRowHasOverflowAction,
                                     lastSelectedRowRef: lastSelectedRowRef
-                                }, row.id))
+                                }, row.id);
+                            })
                         }) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
                             className: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].emptyState,
                             children: emptyState
@@ -606,6 +614,11 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
                 sortableColumns: sortableColumnsForModal,
                 currentSorting: persistedSorting,
                 onApplySorting: (sorting)=>table.setSorting(sorting),
+                groupableColumns: groupableColumnsForModal,
+                currentGroupingId: tableState.grouping[0],
+                onApplyGrouping: (columnId)=>table.setGrouping(columnId ? [
+                        columnId
+                    ] : []),
                 displayColumns: displayColumnsForDisplayModal,
                 onApplyColumnVisibility: (vis)=>{
                     table.setColumnVisibility((prev)=>{
@@ -617,6 +630,7 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
                     });
                 },
                 defaultSorting: [],
+                defaultGroupingId: void 0,
                 defaultColumnVisibility: defaultDisplayColumnVisibility
             })
         ]

package/dist/presentation/RichList/RichListDisplayModal.d.ts

@@ -1,17 +1,21 @@
 import type { SortingState } from "@tanstack/react-table";
 /**
  * How many `FilterExpander` sections in the display form are in the
- * highlighted (non-default) state: Sort, and/or Visible columns.
+ * highlighted (non-default) state: Sort, Group by, and/or Visible columns.
  */
 export declare function getDisplayFormActiveExpanderCount(hasSortForm: boolean, sorting: SortingState, displayColumnRows: Array<{
     id: string;
     visible: boolean;
     defaultVisible: boolean;
-}>): number;
+}>, hasGroupForm: boolean, groupingId: string | undefined): number;
 type SortableColumn = {
     id: string;
     label: string;
 };
+type GroupableColumn = {
+    id: string;
+    label: string;
+};
 type DisplayColumn = {
     id: string;
     label: string;
@@ -24,10 +28,14 @@ type Props = {
     sortableColumns: SortableColumn[];
     currentSorting: SortingState;
     onApplySorting: (sorting: SortingState) => void;
+    groupableColumns: GroupableColumn[];
+    currentGroupingId: string | undefined;
+    onApplyGrouping: (columnId: string | undefined) => void;
     displayColumns: DisplayColumn[];
     onApplyColumnVisibility: (visibility: Record<string, boolean>) => void;
     defaultSorting: SortingState;
+    defaultGroupingId: string | undefined;
     defaultColumnVisibility: Record<string, boolean>;
 };
-declare const RichListDisplayModal: ({ onClose, sortableColumns, currentSorting, onApplySorting, displayColumns, onApplyColumnVisibility, defaultSorting, defaultColumnVisibility, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const RichListDisplayModal: ({ onClose, sortableColumns, currentSorting, onApplySorting, groupableColumns, currentGroupingId, onApplyGrouping, displayColumns, onApplyColumnVisibility, defaultSorting, defaultGroupingId, defaultColumnVisibility, }: Props) => import("react/jsx-runtime").JSX.Element;
 export default RichListDisplayModal;

package/dist/presentation/RichList/RichListDisplayModal.js

@@ -16,13 +16,15 @@ import * as __WEBPACK_EXTERNAL_MODULE__Modal_js_91697624__ from "../Modal.js";
 import * as __WEBPACK_EXTERNAL_MODULE__PlainText_js_6d36b5d5__ from "../PlainText.js";
 import * as __WEBPACK_EXTERNAL_MODULE__VStack_js_6ebc0134__ from "../VStack.js";
 const NO_SORT_ID = "__richListNoSort__";
-function getDisplayFormActiveExpanderCount(hasSortForm, sorting, displayColumnRows) {
+const NO_GROUP_ID = "__richListNoGroup__";
+function getDisplayFormActiveExpanderCount(hasSortForm, sorting, displayColumnRows, hasGroupForm, groupingId) {
     let n = 0;
     if (hasSortForm && void 0 !== sorting[0]) n += 1;
+    if (hasGroupForm && void 0 !== groupingId) n += 1;
     if (displayColumnRows.some((c)=>c.visible !== c.defaultVisible)) n += 1;
     return n;
 }
-const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onApplySorting, displayColumns, onApplyColumnVisibility, defaultSorting, defaultColumnVisibility })=>{
+const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onApplySorting, groupableColumns, currentGroupingId, onApplyGrouping, displayColumns, onApplyColumnVisibility, defaultSorting, defaultGroupingId, defaultColumnVisibility })=>{
     const sortOptions = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>[
             {
                 id: NO_SORT_ID,
@@ -32,9 +34,19 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
         ], [
         sortableColumns
     ]);
+    const groupOptions = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>[
+            {
+                id: NO_GROUP_ID,
+                label: "No grouping"
+            },
+            ...groupableColumns
+        ], [
+        groupableColumns
+    ]);
     const firstSort = currentSorting[0];
     const initialSortColumnId = firstSort?.id ?? NO_SORT_ID;
     const initialSortDesc = firstSort?.desc ?? false;
+    const initialGroupColumnId = currentGroupingId ?? NO_GROUP_ID;
     const initialVisibility = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>Object.fromEntries(displayColumns.map((c)=>[
                 c.id,
                 c.visible
@@ -45,6 +57,7 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
         initialValues: {
             sortColumnId: initialSortColumnId,
             sortDesc: initialSortDesc,
+            groupColumnId: initialGroupColumnId,
             visibility: initialVisibility
         },
         onSubmit: async (values)=>{
@@ -55,6 +68,7 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
                 }
             ] : [];
             onApplySorting(nextSort);
+            onApplyGrouping(values.groupColumnId && values.groupColumnId !== NO_GROUP_ID ? values.groupColumnId : void 0);
             onApplyColumnVisibility(values.visibility);
         }
     });
@@ -62,19 +76,27 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
         data.sortColumnId,
         sortOptions
     ]);
+    const groupColumnOption = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>groupOptions.find((o)=>o.id === data.groupColumnId) ?? groupOptions[0], [
+        data.groupColumnId,
+        groupOptions
+    ]);
     const isSortActive = data.sortColumnId !== NO_SORT_ID;
+    const isGroupActive = data.groupColumnId !== NO_GROUP_ID;
     const hasSortSection = sortableColumns.length > 0;
+    const hasGroupSection = groupableColumns.length > 0;
     const hasDisplaySection = displayColumns.length > 0;
     const handleReset = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(()=>{
         setData(()=>({
                 sortColumnId: defaultSorting[0]?.id ?? NO_SORT_ID,
                 sortDesc: defaultSorting[0]?.desc ?? false,
+                groupColumnId: defaultGroupingId ?? NO_GROUP_ID,
                 visibility: {
                     ...defaultColumnVisibility
                 }
             }));
     }, [
         defaultColumnVisibility,
+        defaultGroupingId,
         defaultSorting,
         setData
     ]);
@@ -93,7 +115,7 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
                         type: "secondary",
                         onClick: handleReset,
                         icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__icons_components_Restore_js_f78ce3bd__["default"], {}),
-                        disabled: !hasSortSection && !hasDisplaySection,
+                        disabled: !hasSortSection && !hasGroupSection && !hasDisplaySection,
                         children: "Reset"
                     }),
                     /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__forms_FormButtonSet_js_786d786e__["default"], {
@@ -118,8 +140,8 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
                 children: [
                     hasSortSection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_FilterModal_js_c5dcd344__.FilterExpander, {
                         label: "Sort by",
-                        highlight: isSortActive,
-                        defaultOpen: !hasDisplaySection || isSortActive,
+                        highlight: isSortActive || hasGroupSection && isGroupActive,
+                        defaultOpen: !hasDisplaySection || isSortActive || hasGroupSection && isGroupActive,
                         children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__VStack_js_6ebc0134__["default"], {
                             spacing: "n2",
                             justifyItems: "start",
@@ -158,10 +180,41 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
                                             }));
                                     },
                                     disabled: !isSortActive
-                                })
+                                }),
+                                hasGroupSection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__inputs_SelectInput_js_a37c3c04__["default"], {
+                                    id: "richListDisplayGroupColumn",
+                                    options: groupOptions,
+                                    optionToId: (o)=>o.id,
+                                    optionToLabel: (o)=>o.label,
+                                    value: groupColumnOption,
+                                    onChange: (option)=>{
+                                        setData((prev)=>({
+                                                ...prev,
+                                                groupColumnId: option.id
+                                            }));
+                                    }
+                                }) : null
                             ]
                         })
                     }) : null,
+                    !hasSortSection && hasGroupSection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_FilterModal_js_c5dcd344__.FilterExpander, {
+                        label: "Group by",
+                        highlight: isGroupActive,
+                        defaultOpen: !hasDisplaySection || isGroupActive,
+                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__inputs_SelectInput_js_a37c3c04__["default"], {
+                            id: "richListDisplayGroupColumn",
+                            options: groupOptions,
+                            optionToId: (o)=>o.id,
+                            optionToLabel: (o)=>o.label,
+                            value: groupColumnOption,
+                            onChange: (option)=>{
+                                setData((prev)=>({
+                                        ...prev,
+                                        groupColumnId: option.id
+                                    }));
+                            }
+                        })
+                    }) : null,
                     hasDisplaySection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_FilterModal_js_c5dcd344__.FilterExpander, {
                         label: "Visible columns",
                         highlight: displayColumns.some((c)=>data.visibility[c.id] !== c.defaultVisible),

package/dist/presentation/RichList/RichListRow.d.ts

@@ -1,10 +1,15 @@
 import { type Row, type Table } from "@tanstack/react-table";
 import { type CSSProperties, type MutableRefObject } from "react";
-import { type NormalizedSlot, type NormalizedTextField } from "./types";
+import { type NormalizedSlot, type NormalizedTextField, type RichListGrouping } from "./types";
 import { type RichListRowAction } from "./types";
+type GroupEntry<Type> = {
+    id: string;
+    grouping: RichListGrouping<Type>;
+};
 type Props<Type> = {
     row: Row<Type>;
     table: Table<Type>;
+    groupEntry: GroupEntry<Type> | undefined;
     /** When the list has bulk actions, rows can be selected via the checkbox lane. */
     enableRowSelection: boolean;
     href: ((row: Type) => string) | undefined;
@@ -32,9 +37,7 @@ type Props<Type> = {
     /** Flex `justify-content` for `.contentSlots`. */
     contentSlotsJustifyContent: NonNullable<CSSProperties["justifyContent"]>;
     actionsForRow: Array<RichListRowAction<Type>>;
-    maxAlwaysVisibleActions: number;
-    anyRowHasOverflowAction: boolean;
     lastSelectedRowRef: MutableRefObject<Row<Type> | undefined>;
 };
-declare const RichListRow: <Type>({ row, table, enableRowSelection, href, onClick, normalizedLeadingSlots, normalizedPrimary, normalizedSecondary, mainSlotMaxWidthPx, normalizedContentSlots, normalizedTrailingSlots, isCompactContentSlots, rowMainHidesContentSlotColumns, contentSlotsJustifyContent, actionsForRow, maxAlwaysVisibleActions, anyRowHasOverflowAction, lastSelectedRowRef, }: Props<Type>) => import("react/jsx-runtime").JSX.Element;
+declare const RichListRow: <Type>({ row, table, groupEntry, enableRowSelection, href, onClick, normalizedLeadingSlots, normalizedPrimary, normalizedSecondary, mainSlotMaxWidthPx, normalizedContentSlots, normalizedTrailingSlots, isCompactContentSlots, rowMainHidesContentSlotColumns, contentSlotsJustifyContent, actionsForRow, lastSelectedRowRef, }: Props<Type>) => import("react/jsx-runtime").JSX.Element;
 export default RichListRow;