@caspeco/casper-ui-library 10.7.3 → 10.9.0

package/README.md

@@ -28,6 +28,7 @@ All commands are run from the root of the project, from a terminal.
 | `npm run lint` | Run linting with [@caspeco/eslint-config](https://github.com/Caspeco/eslint-config). If you use the recommended [ESLint VSCode extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) you can see your eslint errors directly in your editor without having to run this. |
 | `npm run prettier:fix` | Reformat all files with [@caspeco/prettier-config](https://github.com/Caspeco/prettier-config). If you use the recommended [Prettier VSCode extension](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) you can have your files automatically formatted on file save. |
 | `npm run chakra:types` | Generate Chakra UI type definitions for the theme. You run this if you modify component variants and want to get rid of TS errors, for example. Happens automatically on `npm install`. |
+| `npm run test:all` | Run every check the CI lint job runs, in sequence: `prettier`, `lint`, `tsc`, `knip` and `test`. Stops at the first failure. Requires Playwright browsers (`npm exec -- playwright install chromium`) for the unit tests. |
 
 ### Preview locally in another project
 

package/dist/components/rich-text-editor/boolean-control.js

@@ -1,5 +1,5 @@
 import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
-import { useEditorState as t } from "../../node_modules/@tiptap/react/dist/index.js";
+import { useEditorState as t } from "../../packages/casper-ui-library/node_modules/@tiptap/react/dist/index.js";
 import { useRichTextEditorContext as n } from "./rich-text-editor-context.js";
 import { Tooltip as r } from "../tooltip/tooltip.js";
 import { ToggleButton as i } from "../toggle-button/toggle-button.js";

package/dist/components/rich-text-editor/rich-text-editor-control.js

@@ -10,7 +10,7 @@ import { MenuList as te } from "../menu/menu-list.js";
 import { FormControl as l } from "../form-control/form-control.js";
 import { FormLabel as u } from "../form-control/form-label.js";
 import { Input as d } from "../input/input.js";
-import { useEditorState as f } from "../../node_modules/@tiptap/react/dist/index.js";
+import { useEditorState as f } from "../../packages/casper-ui-library/node_modules/@tiptap/react/dist/index.js";
 import { useRichTextEditorContext as p } from "./rich-text-editor-context.js";
 import { Tooltip as ne } from "../tooltip/tooltip.js";
 import { find as m } from "../../node_modules/linkifyjs/dist/linkify.js";

package/dist/components/rich-text-editor/rich-text-editor.js

@@ -1,6 +1,6 @@
 import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
 import { ThemeColorVariable as t, ThemeSpaceVariable as n } from "../../theme/theme-types.js";
-import { EditorContent as r } from "../../node_modules/@tiptap/react/dist/index.js";
+import { EditorContent as r } from "../../packages/casper-ui-library/node_modules/@tiptap/react/dist/index.js";
 import { RichTextEditorContext as i, useRichTextEditorContext as a } from "./rich-text-editor-context.js";
 import { proseMirrorContainerCss as o, proseMirrorContentCss as s, toolbarCss as c } from "./rich-text-editor-recipe.js";
 import "react";

package/dist/components/rich-text-editor/use-rich-text-editor.js

@@ -1,5 +1,5 @@
 import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
-import { useEditor as t } from "../../node_modules/@tiptap/react/dist/index.js";
+import { useEditor as t } from "../../packages/casper-ui-library/node_modules/@tiptap/react/dist/index.js";
 import { richTextExtensions as n } from "./extensions.js";
 //#region lib/components/rich-text-editor/use-rich-text-editor.ts
 var r = e();

package/dist/components/table/helper.d.ts

@@ -1,5 +1,8 @@
 import { Column } from '@tanstack/react-table';
+import { TableData, TableRow } from './types.js';
 export declare function arrayMove<T>(array: T[], fromIndex: number, toIndex: number): T[];
+export declare function getTopLevelRowIds<TData extends TableData>(data: TableRow<TData>[], getRowId: (originalRow: TableRow<TData>, index: number) => string): string[];
+export declare function isSameSequence(first: readonly string[], second: readonly string[]): boolean;
 export declare function getColumnLabel(header: unknown, columnId: string): string;
 export declare function getColumnSizeCssVarName(columnId: string): string;
 export declare function getColumnStartCssVarName(columnId: string): string;

package/dist/components/table/helper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../lib/components/table/helper.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAGpD,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,CAAC,EAAE,CAShF;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAExE;AAUD,wBAAgB,uBAAuB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEhE;AAED,wBAAgB,wBAAwB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEjE;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAGlG;AAED,wBAAgB,cAAc,CAAC,KAAK,EACnC,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,EAC9B,oBAAoB,EAAE,OAAO,GAC3B,MAAM,GAAG,MAAM,CAGjB;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,oBAAoB,EAAE,OAAO,GAAG,MAAM,CAG1G"}
+{"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../lib/components/table/helper.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAEpD,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnD,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,CAAC,EAAE,CAShF;AAED,wBAAgB,iBAAiB,CAAC,KAAK,SAAS,SAAS,EACxD,IAAI,EAAE,QAAQ,CAAC,KAAK,CAAC,EAAE,EACvB,QAAQ,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAC/D,MAAM,EAAE,CAEV;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,MAAM,EAAE,EAAE,MAAM,EAAE,SAAS,MAAM,EAAE,GAAG,OAAO,CAE3F;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAExE;AAUD,wBAAgB,uBAAuB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEhE;AAED,wBAAgB,wBAAwB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEjE;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAGlG;AAED,wBAAgB,cAAc,CAAC,KAAK,EACnC,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,EAC9B,oBAAoB,EAAE,OAAO,GAC3B,MAAM,GAAG,MAAM,CAGjB;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,oBAAoB,EAAE,OAAO,GAAG,MAAM,CAG1G"}

package/dist/components/table/helper.js

@@ -4,28 +4,34 @@ function e(e, t, n) {
 	return i !== void 0 && r.splice(n, 0, i), r;
 }
 function t(e, t) {
+	return e.map((e, n) => t(e, n));
+}
+function n(e, t) {
+	return e.length === t.length && e.every((e, n) => e === t[n]);
+}
+function r(e, t) {
 	return typeof e == "string" || typeof e == "number" ? String(e) : t;
 }
-function n(e) {
+function i(e) {
 	return e.replace(/[^a-zA-Z0-9]/g, (e) => `_${e.charCodeAt(0).toString(16)}_`);
 }
-function r(e) {
-	return `--col-${n(e)}-size`;
+function a(e) {
+	return `--col-${i(e)}-size`;
 }
-function i(e) {
-	return `--col-${n(e)}-start`;
+function o(e) {
+	return `--col-${i(e)}-start`;
 }
-function a(e, t) {
+function s(e, t) {
 	let { minSize: n = 80, maxSize: r = 2 ** 53 - 1 } = e.columnDef;
 	return Math.min(Math.max(t, n), r);
 }
-function o(e, t) {
+function c(e, t) {
 	let n = e.getSize();
-	return t ? `var(${r(e.id)}, ${n}px)` : n;
+	return t ? `var(${a(e.id)}, ${n}px)` : n;
 }
-function s(e, t) {
+function l(e, t) {
 	let n = `${e.getStart("left")}px`;
-	return t ? `var(${i(e.id)}, ${n})` : n;
+	return t ? `var(${o(e.id)}, ${n})` : n;
 }
 //#endregion
-export { e as arrayMove, a as getClampedColumnWidth, t as getColumnLabel, r as getColumnSizeCssVarName, i as getColumnStartCssVarName, o as getColumnWidth, s as getPinnedLeft };
+export { e as arrayMove, s as getClampedColumnWidth, r as getColumnLabel, a as getColumnSizeCssVarName, o as getColumnStartCssVarName, c as getColumnWidth, l as getPinnedLeft, t as getTopLevelRowIds, n as isSameSequence };

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

@@ -9,5 +9,5 @@ export { TableToolbarAddButton } from './table-toolbar-add-button.js';
 export { TableToolbarSearch } from './table-toolbar-search.js';
 export { TableToolbarSettings } from './table-toolbar-settings.js';
 export type { TableFilterProps } from './table-filter.js';
-export type { CellContext, ColumnDef, ColumnSizingState, ExpandedState, Row, RowSelectionState, SortingState, TableContentProps, TableFilterBoxState, TableFilterVisibleChange, TableProps, TableRow, TableToolbarActionsProps, TableToolbarAddButtonProps, TableToolbarProps, TableToolbarSearchProps, VisibilityState, } from './types.js';
+export type { CellContext, ColumnDef, ColumnSizingState, ExpandedState, Row, RowReorderDetails, RowSelectionState, SortingState, TableContentProps, TableFilterBoxState, TableFilterVisibleChange, TableProps, TableRow, TableToolbarActionsProps, TableToolbarAddButtonProps, TableToolbarProps, TableToolbarSearchProps, VisibilityState, } from './types.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/table/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/table/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEhE,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,YAAY,EACX,WAAW,EACX,SAAS,EACT,iBAAiB,EACjB,aAAa,EACb,GAAG,EACH,iBAAiB,EACjB,YAAY,EACZ,iBAAiB,EACjB,mBAAmB,EACnB,wBAAwB,EACxB,UAAU,EACV,QAAQ,EACR,wBAAwB,EACxB,0BAA0B,EAC1B,iBAAiB,EACjB,uBAAuB,EACvB,eAAe,GACf,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/table/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEhE,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,YAAY,EACX,WAAW,EACX,SAAS,EACT,iBAAiB,EACjB,aAAa,EACb,GAAG,EACH,iBAAiB,EACjB,iBAAiB,EACjB,YAAY,EACZ,iBAAiB,EACjB,mBAAmB,EACnB,wBAAwB,EACxB,UAAU,EACV,QAAQ,EACR,wBAAwB,EACxB,0BAA0B,EAC1B,iBAAiB,EACjB,uBAAuB,EACvB,eAAe,GACf,MAAM,SAAS,CAAC"}

package/dist/components/table/table-cell.d.ts

@@ -12,8 +12,9 @@ type TableCellProps<TData extends TableData> = {
     actionMenu?: ReactNode;
     canSelectRows?: boolean;
     isCheckboxDisabled?: boolean;
+    dragHandleRef?: (element: Element | null) => void;
 };
-declare const TableCellComponent: <TData extends TableData>({ cell, row, rowIsExpanded, visibleCells, breakingContentState, localeString, actionMenu, canSelectRows, isCheckboxDisabled, }: TableCellProps<TData>) => import("react").JSX.Element;
+declare const TableCellComponent: <TData extends TableData>({ cell, row, rowIsExpanded, visibleCells, breakingContentState, localeString, actionMenu, canSelectRows, isCheckboxDisabled, dragHandleRef, }: TableCellProps<TData>) => import("react").JSX.Element;
 export declare const TableCell: typeof TableCellComponent;
 export {};
 //# sourceMappingURL=table-cell.d.ts.map

package/dist/components/table/table-cell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-cell.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-cell.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAc,KAAK,IAAI,EAAE,KAAK,GAAG,EAAE,MAAM,uBAAuB,CAAC;AACxE,OAAO,EAAkD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvF,OAAO,EAAgB,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnD,KAAK,cAAc,CAAC,KAAK,SAAS,SAAS,IAAI;IAC9C,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;IACrC,YAAY,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,EAAE,CAAC;IAC/C,GAAG,EAAE,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;IAC1B,aAAa,EAAE,OAAO,CAAC;IACvB,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAEF,QAAA,MAAM,kBAAkB,GAAI,KAAK,SAAS,SAAS,EAAE,gIAUlD,cAAc,CAAC,KAAK,CAAC,gCAkLvB,CAAC;AAEF,eAAO,MAAM,SAAS,EAA+B,OAAO,kBAAkB,CAAC"}
+{"version":3,"file":"table-cell.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-cell.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAc,KAAK,IAAI,EAAE,KAAK,GAAG,EAAE,MAAM,uBAAuB,CAAC;AACxE,OAAO,EAAkD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvF,OAAO,EAAgB,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnD,KAAK,cAAc,CAAC,KAAK,SAAS,SAAS,IAAI;IAC9C,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;IACrC,YAAY,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,EAAE,CAAC;IAC/C,GAAG,EAAE,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;IAC1B,aAAa,EAAE,OAAO,CAAC;IACvB,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,QAAA,MAAM,kBAAkB,GAAI,KAAK,SAAS,SAAS,EAAE,+IAWlD,cAAc,CAAC,KAAK,CAAC,gCA0LvB,CAAC;AAEF,eAAO,MAAM,SAAS,EAA+B,OAAO,kBAAkB,CAAC"}

package/dist/components/table/table-cell.js

@@ -9,24 +9,25 @@ import { flexRender as s } from "../../node_modules/@tanstack/react-table/build/
 import { getColumnWidth as c, getPinnedLeft as l } from "./helper.js";
 import { useTableContext as u } from "./table-context.js";
 import { translations as d } from "./translations.js";
-import { TableRowExpandToggleButton as f } from "./table-row-expand-toggle-button.js";
-import { memo as p, useCallback as m, useMemo as h } from "react";
-import { Box as g, Flex as _, TableCell as v } from "@chakra-ui/react";
-import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
-var S = p(({ cell: p, row: S, rowIsExpanded: C, visibleCells: w, breakingContentState: T, localeString: E, actionMenu: D, canSelectRows: O, isCheckboxDisabled: k }) => {
-	let A = u(), { column: j } = p, M = d[E], N = h(() => {
+import { TableRowDragHandle as f } from "./table-row-drag-handle.js";
+import { TableRowExpandToggleButton as p } from "./table-row-expand-toggle-button.js";
+import { memo as m, useCallback as h, useMemo as g } from "react";
+import { Box as _, Flex as v, TableCell as y } from "@chakra-ui/react";
+import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
+var C = m(({ cell: m, row: C, rowIsExpanded: w, visibleCells: T, breakingContentState: E, localeString: D, actionMenu: O, canSelectRows: k, isCheckboxDisabled: A, dragHandleRef: j }) => {
+	let M = u(), { column: N } = m, P = d[D], F = g(() => {
 		let e = {
 			width: "100%",
 			display: "inline-flex",
 			height: "100%",
 			alignItems: "center"
 		};
-		return T[j.id] || (e.overflow = "hidden", e.whiteSpace = "nowrap"), e;
-	}, [T, j.id]), P = h(() => j.getIndex() === 0, [j]), F = S.getCanExpand(), I = w[0]?.id === p.id, L = F && I, R = D || P && !!A.getRowActions || O, z = h(() => {
+		return E[N.id] || (e.overflow = "hidden", e.whiteSpace = "nowrap"), e;
+	}, [E, N.id]), I = C.getCanExpand(), L = T[0]?.id === m.id, R = I && L, z = O || L && !!M.getRowActions || k, B = L && M.rowReorderMode !== "off", V = M.rowReorderMode !== "off" && L && C.depth === 0, H = B ? 24 : 0, U = z || B, W = g(() => {
 		let e = [];
-		for (let t = 0; t < S.depth; t += 1) {
+		for (let t = 0; t < C.depth; t += 1) {
 			let n = `${t * 2 + .7}rem`;
-			R && (n = `calc(${n} + ${D && O ? 48 : 24}px)`), e.push(/* @__PURE__ */ b(o, {
+			U && (n = `calc(${n} + ${(z ? (O && k ? 2 : 1) * 24 : 0) + H}px)`), e.push(/* @__PURE__ */ x(o, {
 				orientation: "vertical",
 				position: "absolute",
 				top: "0",
@@ -35,102 +36,108 @@ var S = p(({ cell: p, row: S, rowIsExpanded: C, visibleCells: w, breakingContent
 		}
 		return e;
 	}, [
-		D,
 		O,
-		S.depth,
-		R
-	]), B = () => {
-		let t = j.getIsPinned(), n = c(j, A.enableColumnResizing);
+		k,
+		H,
+		z,
+		C.depth,
+		U
+	]), G = () => {
+		let t = N.getIsPinned(), n = c(N, M.enableColumnResizing);
 		return {
 			position: t ? "sticky" : "relative",
-			left: t ? l(j, A.enableColumnResizing) : void 0,
+			left: t ? l(N, M.enableColumnResizing) : void 0,
 			backgroundColor: t ? e.Background : void 0,
 			zIndex: t ? 1 : void 0,
 			width: n,
 			maxWidth: n
 		};
 	};
-	function V() {
-		let e = S.depth && I || L ? `${S.depth * 2}rem` : t.Small;
-		return R ? `calc(${e} + ${D && O && S.depth === 0 ? 48 : 24}px)` : e;
+	function K() {
+		let e = C.depth && L || R ? `${C.depth * 2}rem` : t.Small;
+		return U ? `calc(${e} + ${(z ? (O && k && C.depth === 0 ? 2 : 1) * 24 : 0) + H}px)` : e;
 	}
-	let H = m(({ checked: e }) => {
+	let q = h(({ checked: e }) => {
 		let t = (e) => {
-			if (A.disableSelectionCheckbox?.(e)) return [];
+			if (M.disableSelectionCheckbox?.(e)) return [];
 			let n = [e.id];
 			return e.subRows?.forEach((e) => {
 				n.push(...t(e));
 			}), n;
 		};
-		A.setSelectedRowIds((n) => {
-			let r = t(S), i = new Set(n);
+		M.setSelectedRowIds((n) => {
+			let r = t(C), i = new Set(n);
 			return r.forEach((t) => {
 				e ? i.add(t) : i.delete(t);
 			}), Array.from(i);
 		});
-	}, [S, A]), U = h(() => A.selectedRowIds?.includes(S.id) ?? !1, [S.id, A.selectedRowIds]);
-	return /* @__PURE__ */ b(v, {
-		id: p.id,
-		textAlign: j.columnDef.meta?.isNumeric ? "end" : void 0,
+	}, [C, M]), J = g(() => M.selectedRowIds?.includes(C.id) ?? !1, [C.id, M.selectedRowIds]);
+	return /* @__PURE__ */ x(y, {
+		id: m.id,
+		textAlign: N.columnDef.meta?.isNumeric ? "end" : void 0,
 		style: {
-			...B(),
+			...G(),
 			borderBottom: 0,
-			paddingLeft: V()
+			paddingLeft: K()
 		},
-		children: /* @__PURE__ */ x(_, {
+		children: /* @__PURE__ */ S(v, {
 			w: "100%",
 			h: "100%",
 			align: "center",
 			children: [
-				D && /* @__PURE__ */ b(r, { children: ({ isOpen: e }) => /* @__PURE__ */ x(g, {
+				V && /* @__PURE__ */ x(f, {
+					localeString: D,
+					handleRef: j
+				}),
+				O && /* @__PURE__ */ x(r, { children: ({ isOpen: e }) => /* @__PURE__ */ S(_, {
 					display: "contents",
 					onClick: (e) => e.stopPropagation(),
 					onKeyDown: (e) => e.stopPropagation(),
-					children: [/* @__PURE__ */ b(g, {
+					children: [/* @__PURE__ */ x(_, {
 						className: "action-menu-button",
 						position: "absolute",
-						left: "0",
+						left: `${H}px`,
 						opacity: +!!e,
 						_hover: { opacity: 1 },
 						_focusVisible: { opacity: 1 },
 						css: { "&:has(:focus-visible)": { opacity: 1 } },
-						children: /* @__PURE__ */ b(i, {
+						children: /* @__PURE__ */ x(i, {
 							icon: n,
 							variant: "ghost",
 							size: "xs",
-							"aria-label": M.moreActions,
+							"aria-label": P.moreActions,
 							borderRadius: "0"
 						})
-					}), D]
+					}), O]
 				}) }),
-				O && /* @__PURE__ */ b(g, {
+				k && /* @__PURE__ */ x(_, {
 					display: "contents",
 					onClick: (e) => e.stopPropagation(),
 					onKeyDown: (e) => e.stopPropagation(),
-					children: /* @__PURE__ */ b(g, {
+					children: /* @__PURE__ */ x(_, {
 						position: "absolute",
-						left: D ? "24px" : "0",
-						children: /* @__PURE__ */ b(a, {
-							isChecked: U,
-							onCheckedChange: H,
-							isDisabled: k
+						left: `${H + (O ? 24 : 0)}px`,
+						children: /* @__PURE__ */ x(a, {
+							isChecked: J,
+							onCheckedChange: q,
+							isDisabled: A
 						})
 					})
 				}),
-				L || S.depth > 0 && I ? /* @__PURE__ */ b(f, {
-					row: S,
-					localeString: E,
-					hidden: !F,
-					rowIsExpanded: C
-				}) : /* @__PURE__ */ b(y, {}),
-				P && z,
-				/* @__PURE__ */ b("div", {
-					style: N,
-					children: s(j.columnDef.cell, p.getContext())
+				R || C.depth > 0 && L ? /* @__PURE__ */ x(p, {
+					row: C,
+					localeString: D,
+					hidden: !I,
+					rowIsExpanded: w
+				}) : /* @__PURE__ */ x(b, {}),
+				L && W,
+				/* @__PURE__ */ x("div", {
+					style: F,
+					children: s(N.columnDef.cell, m.getContext())
 				})
 			]
 		})
-	}, p.id);
+	}, m.id);
 });
 //#endregion
-export { S as TableCell };
+export { C as TableCell };

package/dist/components/table/table-content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-content.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-content.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAsB,KAAK,eAAe,EAAE,MAAM,SAAS,CAAC;AAUnE,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,SAAS,CAAC;AAEnE,UAAU,qBAAqB;IAC9B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,iBAAiB,CAAC,KAAK,SAAS,SAAS,GAAG,SAAS;IACrE;;OAEG;IACH,UAAU,CAAC,EAAE,CACZ,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EACxB,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,mBAAmB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC,KACnF,IAAI,CAAC;IAEV;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;OAEG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAElC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,cAAc,CAAC,EAAE,qBAAqB,CAAC;IACvC;;OAEG;IACH,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACzD;AAED,KAAK,sBAAsB,CAAC,KAAK,SAAS,SAAS,IAAI,iBAAiB,CAAC,KAAK,CAAC,GAAG,eAAe,CAAC;AAElG,QAAA,MAAM,iBAAiB,GAAI,KAAK,SAAS,SAAS,EAAE,8BAGjD,sBAAsB,CAAC,KAAK,CAAC,gCAM/B,CAAC;AAuSF;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAA8B,OAAO,iBAAiB,CAAC"}
+{"version":3,"file":"table-content.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-content.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAsB,KAAK,eAAe,EAAE,MAAM,SAAS,CAAC;AAYnE,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,SAAS,CAAC;AAEnE,UAAU,qBAAqB;IAC9B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,iBAAiB,CAAC,KAAK,SAAS,SAAS,GAAG,SAAS;IACrE;;OAEG;IACH,UAAU,CAAC,EAAE,CACZ,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EACxB,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,mBAAmB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC,KACnF,IAAI,CAAC;IAEV;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;OAEG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAElC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,cAAc,CAAC,EAAE,qBAAqB,CAAC;IACvC;;OAEG;IACH,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACzD;AAED,KAAK,sBAAsB,CAAC,KAAK,SAAS,SAAS,IAAI,iBAAiB,CAAC,KAAK,CAAC,GAAG,eAAe,CAAC;AAElG,QAAA,MAAM,iBAAiB,GAAI,KAAK,SAAS,SAAS,EAAE,8BAGjD,sBAAsB,CAAC,KAAK,CAAC,gCAM/B,CAAC;AAiVF;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAA8B,OAAO,iBAAiB,CAAC"}

package/dist/components/table/table-content.js

@@ -1,28 +1,31 @@
 "use no memo";
 import { ThemeColorVariable as e } from "../../theme/theme-types.js";
 import { useVirtualizer as t } from "../../node_modules/@tanstack/react-virtual/dist/esm/index.js";
+import "./table.constants.js";
 import { getClampedColumnWidth as n, getColumnWidth as r } from "./helper.js";
 import { useTableColumnResizeInfo as i, useTableColumnSizeVars as a, useTableContext as o } from "./table-context.js";
-import { AutoScroller as s, Feedback as c } from "../../node_modules/@dnd-kit/dom/index.js";
-import { DragDropProvider as l } from "../../node_modules/@dnd-kit/react/index.js";
-import { TableHeaderRow as u } from "./table-header-row.js";
-import { TableRow as d } from "./table-row.js";
-import { memo as f, useMemo as p, useRef as m } from "react";
-import { Box as h, Table as g } from "@chakra-ui/react";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Accessibility as s, AutoScroller as c, Feedback as l } from "../../node_modules/@dnd-kit/dom/index.js";
+import { DragDropProvider as u } from "../../node_modules/@dnd-kit/react/index.js";
+import { createDragAccessibility as d } from "./table-drag-accessibility.js";
+import { TableHeaderRow as f } from "./table-header-row.js";
+import { TableRow as p } from "./table-row.js";
+import { memo as m, useEffect as h, useMemo as g, useRef as _ } from "react";
+import { Box as v, Table as y } from "@chakra-ui/react";
+import { jsx as b, jsxs as x } from "react/jsx-runtime";
 //#region lib/components/table/table-content.tsx
-var y = ({ virtualization: e, ...t }) => e ? /* @__PURE__ */ _(b, {
+var S = ({ virtualization: e, ...t }) => e ? /* @__PURE__ */ b(C, {
 	...t,
 	virtualization: e
-}) : /* @__PURE__ */ _(x, { ...t }), b = ({ onClickRow: e, onRowClickIndication: n, showRowHoverStyle: r = !0, virtualization: i, ...a }) => {
-	let s = o(), c = m(null), l = p(() => s.table.getRowModel().rows, [
+}) : /* @__PURE__ */ b(w, { ...t }), C = ({ onClickRow: e, onRowClickIndication: n, showRowHoverStyle: r = !0, virtualization: i, ...a }) => {
+	let s = o(), c = _(null), l = g(() => s.table.getRowModel().rows, [
 		s.expanded,
 		s.breakingContentState,
 		s.columnVisibility,
 		s.sorting,
 		s.data,
+		s.rowOrder,
 		s.columnOrder
-	]), u = p(() => {
+	]), u = g(() => {
 		let e = i.estimateRowHeight ?? 40, t = i.overscan ?? 5;
 		return {
 			count: l.length,
@@ -38,19 +41,19 @@ var y = ({ virtualization: e, ...t }) => e ? /* @__PURE__ */ _(b, {
 		i.estimateRowHeight,
 		i.overscan,
 		l
-	]), f = t(u), y = f.getVirtualItems(), b = () => {
-		let t = y.length > 0 ? y[0]?.start ?? 0 : 0, i = y.length > 0 ? f.getTotalSize() - (y[y.length - 1]?.end ?? 0) : 0, a = (l[0]?.getVisibleCells().length ?? s.table.getVisibleLeafColumns().length) + +!!s.enableColumnResizing;
-		return /* @__PURE__ */ v(g.Body, { children: [
-			t > 0 && /* @__PURE__ */ _("tr", {
+	]), d = t(u), f = d.getVirtualItems(), m = () => {
+		let t = f.length > 0 ? f[0]?.start ?? 0 : 0, i = f.length > 0 ? d.getTotalSize() - (f[f.length - 1]?.end ?? 0) : 0, a = (l[0]?.getVisibleCells().length ?? s.table.getVisibleLeafColumns().length) + +!!s.enableColumnResizing;
+		return /* @__PURE__ */ x(y.Body, { children: [
+			t > 0 && /* @__PURE__ */ b("tr", {
 				style: { height: `${t}px` },
 				"aria-hidden": "true",
-				children: /* @__PURE__ */ _("td", { colSpan: a })
+				children: /* @__PURE__ */ b("td", { colSpan: a })
 			}),
-			y.map((t) => {
+			f.map((t) => {
 				let i = l[t.index];
 				if (!i) return null;
 				let a = i.getVisibleCells();
-				return /* @__PURE__ */ _(d, {
+				return /* @__PURE__ */ b(p, {
 					row: i,
 					visibleCells: a,
 					onClickRow: e,
@@ -58,14 +61,14 @@ var y = ({ virtualization: e, ...t }) => e ? /* @__PURE__ */ _(b, {
 					showRowHoverStyle: r
 				}, i.id);
 			}),
-			i > 0 && /* @__PURE__ */ _("tr", {
+			i > 0 && /* @__PURE__ */ b("tr", {
 				style: { height: `${i}px` },
 				"aria-hidden": "true",
-				children: /* @__PURE__ */ _("td", { colSpan: a })
+				children: /* @__PURE__ */ b("td", { colSpan: a })
 			})
 		] });
 	};
-	return /* @__PURE__ */ _(h, {
+	return /* @__PURE__ */ b(v, {
 		ref: c,
 		overflowY: "auto",
 		height: i.height ?? "600px",
@@ -80,24 +83,25 @@ var y = ({ virtualization: e, ...t }) => e ? /* @__PURE__ */ _(b, {
 			outline: "none",
 			boxShadow: "none"
 		},
-		children: /* @__PURE__ */ _(w, {
+		children: /* @__PURE__ */ b(O, {
 			...a,
-			children: b()
+			children: m()
 		})
 	});
-}, x = ({ onClickRow: e, onRowClickIndication: t, showRowHoverStyle: n = !0, ...r }) => {
-	let i = o(), a = p(() => i.table.getRowModel().rows, [
+}, w = ({ onClickRow: e, onRowClickIndication: t, showRowHoverStyle: n = !0, ...r }) => {
+	let i = o(), a = g(() => i.table.getRowModel().rows, [
 		i.expanded,
 		i.breakingContentState,
 		i.columnVisibility,
 		i.sorting,
-		i.data
+		i.data,
+		i.rowOrder
 	]);
-	return /* @__PURE__ */ _(w, {
+	return /* @__PURE__ */ b(O, {
 		...r,
-		children: /* @__PURE__ */ _(g.Body, { children: a.map((r) => {
+		children: /* @__PURE__ */ b(y.Body, { children: a.map((r) => {
 			let i = r.getVisibleCells();
-			return /* @__PURE__ */ _(d, {
+			return /* @__PURE__ */ b(p, {
 				row: r,
 				visibleCells: i,
 				onClickRow: e,
@@ -107,7 +111,17 @@ var y = ({ virtualization: e, ...t }) => e ? /* @__PURE__ */ _(b, {
 		}) })
 	});
 };
-function S(e) {
+function T() {
+	let e = _(null);
+	return h(() => {
+		let t = e.current;
+		e.current = null, t && document.activeElement === document.body && t.focus();
+	}), (t) => {
+		let n = document.activeElement, r = n === t?.handle || n === t?.element;
+		e.current = r && n instanceof HTMLElement ? n : null;
+	};
+}
+function E(e) {
 	let t = e?.parentElement ?? null;
 	for (; t;) {
 		let e = t.ownerDocument.defaultView?.getComputedStyle(t).overflowX;
@@ -116,13 +130,13 @@ function S(e) {
 	}
 	return 0;
 }
-var C = ({ contentRef: t }) => {
+var D = ({ contentRef: t }) => {
 	let r = o(), a = i(), s = a?.isResizingColumn;
 	if (!s) return null;
 	let c = r.table.getFlatHeaders().find((e) => e.column.id === s);
 	if (!c) return null;
-	let l = c.column.getIsPinned() === "left" ? S(t.current) : 0, u = c.getSize() + (a?.deltaOffset ?? 0), d = n(c.column, u), f = c.getStart() + d + l;
-	return /* @__PURE__ */ _(h, {
+	let l = c.column.getIsPinned() === "left" ? E(t.current) : 0, u = c.getSize() + (a?.deltaOffset ?? 0), d = n(c.column, u), f = c.getStart() + d + l;
+	return /* @__PURE__ */ b(v, {
 		"aria-hidden": !0,
 		className: "tableColumnResizeIndicator",
 		position: "absolute",
@@ -134,21 +148,21 @@ var C = ({ contentRef: t }) => {
 		zIndex: 11,
 		style: { left: `${f}px` }
 	});
-}, w = ({ hideTableHeaderDropdown: e, stickyHeaders: t, portalContainerRef: n, children: i, ...d }) => {
-	let f = o(), p = m(null), y = a(), b = f.enableColumnResizing ? {
-		...y,
+}, O = ({ hideTableHeaderDropdown: e, stickyHeaders: t, portalContainerRef: n, children: i, ...p }) => {
+	let m = o(), h = T(), g = _(null), S = a(), C = m.enableColumnResizing ? {
+		...S,
 		tableLayout: "fixed",
 		width: "100%",
-		minWidth: f.table.getTotalSize()
-	} : void 0, x = f.enableColumnResizing ? /* @__PURE__ */ _("colgroup", { children: f.table.getVisibleLeafColumns().map((e) => /* @__PURE__ */ _("col", { style: { width: r(e, !0) } }, e.id)) }) : null, S = /* @__PURE__ */ v(g.Root, {
-		...d,
-		id: f.id,
-		style: b,
+		minWidth: m.table.getTotalSize()
+	} : void 0, w = m.enableColumnResizing ? /* @__PURE__ */ b("colgroup", { children: m.table.getVisibleLeafColumns().map((e) => /* @__PURE__ */ b("col", { style: { width: r(e, !0) } }, e.id)) }) : null, E = /* @__PURE__ */ x(y.Root, {
+		...p,
+		id: m.id,
+		style: C,
 		children: [
-			x,
-			/* @__PURE__ */ _(g.Header, {
+			w,
+			/* @__PURE__ */ b(y.Header, {
 				"data-sticky-headers": t,
-				children: f.table.getHeaderGroups().map((t) => /* @__PURE__ */ _(u, {
+				children: m.table.getHeaderGroups().map((t) => /* @__PURE__ */ b(f, {
 					headerGroup: t,
 					hideTableHeaderDropdown: e,
 					portalContainerRef: n
@@ -156,20 +170,34 @@ var C = ({ contentRef: t }) => {
 			}),
 			i
 		]
-	}), w = f.enableColumnResizing ? /* @__PURE__ */ v(h, {
-		ref: p,
+	}), O = m.enableColumnResizing ? /* @__PURE__ */ x(v, {
+		ref: g,
 		position: "relative",
 		isolation: "isolate",
-		children: [S, /* @__PURE__ */ _(C, { contentRef: p })]
-	}) : S;
-	return f.enableColumnReorder ? /* @__PURE__ */ _(l, {
+		children: [E, /* @__PURE__ */ b(D, { contentRef: g })]
+	}) : E;
+	return m.enableColumnReorder || m.rowReorderMode === "enabled" ? /* @__PURE__ */ b(u, {
 		onDragEnd: (e) => {
-			let { operation: t } = e, n = String(t.source?.id), r = String(t.target?.id);
-			n !== r && f.handleDragEnd(n, r);
+			let { operation: t } = e;
+			if (e.canceled) return;
+			let n = String(t.source?.id), r = String(t.target?.id);
+			n !== r && (t.source?.type === "table-row" ? m.handleRowDragEnd(n, r) : m.handleDragEnd(n, r), h(t.source));
 		},
-		plugins: (e) => [...e.filter((e) => e !== s), c.configure({ dropAnimation: null })],
-		children: w
-	}) : w;
-}, T = f(y);
+		plugins: (e) => [
+			...e.filter((e) => e !== c && e !== s),
+			d({
+				localeString: m.localeString,
+				rowCount: m.rowOrder.length,
+				columnCount: m.table.getVisibleLeafColumns().length
+			}),
+			...m.rowReorderMode === "enabled" ? [c.configure({ threshold: {
+				x: 0,
+				y: .2
+			} })] : [],
+			l.configure({ dropAnimation: null })
+		],
+		children: O
+	}) : O;
+}, k = m(S);
 //#endregion
-export { T as TableContent };
+export { k as TableContent };

package/dist/components/table/table-context-provider.d.ts

@@ -2,11 +2,19 @@ import { MenuList } from '../menu/index.js';
 import { ColumnDef, ColumnOrderState, ColumnPinningState, ColumnSizingState, ExpandedState, Row, RowSelectionState, SortingState, Table, VisibilityState } from '@tanstack/react-table';
 import { PropsWithChildren } from 'react';
 import { Locales } from './translations.js';
-import { SelectionAction, TableData, TableRow } from './types.js';
+import { RowReorderDetails, SelectionAction, TableData, TableRow } from './types.js';
 export interface TableFilterMethods {
     onToggleFilterVisibility: (columnId: string) => void;
     canFilterOnColumn: (columnId: string) => boolean;
 }
+/**
+ * Defines the current state of row reordering.
+ *
+ * - `off` - row reordering is disabled; no grip or space is reserved
+ * - `blockedBySort` - the grip is visible, but sorting prevents reordering; dragging prompts the user to clear the sort
+ * - `enabled` - row reordering is enabled and dragging moves the row
+ */
+export type RowReorderMode = "off" | "blockedBySort" | "enabled";
 interface TableProviderInterface<TData extends TableData> extends PropsWithChildren {
     data: TableRow<TData>[];
     columns: ColumnDef<TableRow<TData>>[];
@@ -39,6 +47,8 @@ interface TableProviderInterface<TData extends TableData> extends PropsWithChild
     enableColumnResizing?: boolean;
     initialColumnSizingState?: ColumnSizingState;
     onColumnSizingChange?: (state: ColumnSizingState) => void;
+    enableRowReorder?: boolean;
+    onRowOrderChange?: (details: RowReorderDetails) => void;
 }
 export interface TableContextInterface<TData extends TableData = TableData> {
     data: TableRow<TData>[];
@@ -81,7 +91,12 @@ export interface TableContextInterface<TData extends TableData = TableData> {
     handleDragEnd: (sourceId: string, targetId: string) => void;
     enableColumnResizing: boolean;
     columnPinning: ColumnPinningState;
+    rowReorderMode: RowReorderMode;
+    setIsSortedReorderPromptOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    /** IDs of the top-level rows in the order they currently render. */
+    rowOrder: string[];
+    handleRowDragEnd: (sourceId: string, targetId: string) => void;
 }
-export declare const TableProvider: <TData extends TableData>({ data, totalDataCount, columns, children, expandedState, localeString, initialExpandedState, initialBreakingContentState, initialColumnVisibilityState, columnVisibilityState, onColumnVisibilityChange, onExpandedChange, getRowId, getRowActions, onBreakingContentChange, id, customRowIndication, onSortingChange, initialSortingState, sortingState, selectionState, initialSelectionState, onSelectionChange, selectionActions, disableSelectionCheckbox, enableColumnReorder, columnOrderState, initialColumnOrder, onColumnOrderChange, enableColumnResizing, initialColumnSizingState, onColumnSizingChange, }: TableProviderInterface<TData>) => import("react").JSX.Element;
+export declare const TableProvider: <TData extends TableData>({ data, totalDataCount, columns, children, expandedState, localeString, initialExpandedState, initialBreakingContentState, initialColumnVisibilityState, columnVisibilityState, onColumnVisibilityChange, onExpandedChange, getRowId, getRowActions, onBreakingContentChange, id, customRowIndication, onSortingChange, initialSortingState, sortingState, selectionState, initialSelectionState, onSelectionChange, selectionActions, disableSelectionCheckbox, enableColumnReorder, columnOrderState, initialColumnOrder, onColumnOrderChange, enableColumnResizing, initialColumnSizingState, onColumnSizingChange, enableRowReorder, onRowOrderChange, }: TableProviderInterface<TData>) => import("react").JSX.Element;
 export {};
 //# sourceMappingURL=table-context-provider.d.ts.map