@lumeweb/portal-framework-ui 0.0.1 → 0.1.0

package/dist/cjs/components/data-table/BaseTableStackedLayout.cjs

@@ -0,0 +1,154 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_components_sizing_index = require('../sizing/index.cjs');
+const require_components_data_table_useMobileDetection = require('./useMobileDetection.cjs');
+const require_components_data_table_contexts_TableConfig = require('./contexts/TableConfig.cjs');
+const require_components_data_table_contexts_index = require('./contexts/index.cjs');
+const require_components_data_table_useTableHandlers = require('./useTableHandlers.cjs');
+const require_components_data_table_tableOptions = require('./tableOptions.cjs');
+const require_components_index = require('../index.cjs');
+let _lumeweb_portal_framework_ui_core = require("@lumeweb/portal-framework-ui-core");
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _tanstack_react_table = require("@tanstack/react-table");
+
+//#region src/components/data-table/BaseTableStackedLayout.tsx
+function BaseTableStackedLayout({ className, emptyState, emptyStateMessage, footer, getCellProps, getRowProps, header, isLoading, loadingState, loadingStateMessage, onRowClick, pagination, table, responsive, hideColumnsOnMobile, mobileBreakpoint, stackedHeaderColumn }) {
+	const tableConfig = require_components_data_table_contexts_TableConfig.useTableConfigOptional();
+	const { isMobile } = require_components_data_table_useMobileDetection.useMobileDetection({ mobileBreakpoint: validateBreakpoint(mobileBreakpoint || tableConfig?.toolbarConfig?.mobileBreakpoint || require_components_sizing_index.ComponentSize.SM) });
+	const normalizedOptions = require_components_data_table_tableOptions.normalizeTableOptions(pagination, emptyState, emptyStateMessage, loadingState, loadingStateMessage, table);
+	const getTableRowProps = require_components_data_table_useTableHandlers.useTableRowHandlers({
+		onRowClick,
+		getRowProps
+	});
+	const hiddenColumns = require_components_data_table_useTableHandlers.useMobileColumnHiding({
+		responsive,
+		hideColumnsOnMobile,
+		columnIds: react.default.useMemo(() => {
+			return table.getAllLeafColumns().map((column) => column.id);
+		}, [table])
+	});
+	if (isLoading) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, _lumeweb_portal_framework_ui_core.cn)(className),
+		children: [
+			header && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mb-4",
+				children: header
+			}),
+			normalizedOptions.loadingState,
+			footer && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mt-4",
+				children: footer
+			})
+		]
+	});
+	const rows = table.getRowModel().rows;
+	if (rows.length === 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, _lumeweb_portal_framework_ui_core.cn)(className),
+		children: [
+			header && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mb-4",
+				children: header
+			}),
+			normalizedOptions.emptyState,
+			footer && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mt-4",
+				children: footer
+			})
+		]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, _lumeweb_portal_framework_ui_core.cn)(className),
+		children: [
+			header && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mb-4",
+				children: header
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "space-y-4",
+				children: rows.map((row) => {
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_lumeweb_portal_framework_ui_core.Card, {
+						...getTableRowProps(row),
+						children: [stackedHeaderColumn && (() => {
+							const headerCell = row.getVisibleCells().find((cell) => cell.column.id === stackedHeaderColumn);
+							if (headerCell) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: (0, _lumeweb_portal_framework_ui_core.cn)("border-b p-4", "[word-break:break-word]"),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "text-lg font-semibold",
+									children: (0, _tanstack_react_table.flexRender)(headerCell.column.columnDef.cell, headerCell.getContext())
+								})
+							});
+							return null;
+						})(), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lumeweb_portal_framework_ui_core.CardContent, {
+							className: (0, _lumeweb_portal_framework_ui_core.cn)("space-y-3", "[word-break:break-word]"),
+							children: row.getVisibleCells().map((cell) => {
+								if (hiddenColumns.has(cell.column.id)) return null;
+								if (cell.column.id === "actions") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: (0, _lumeweb_portal_framework_ui_core.cn)("flex justify-end border-t pt-3", isMobile && "pt-4"),
+									...getCellProps?.(cell),
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: (0, _lumeweb_portal_framework_ui_core.cn)("flex min-h-10 items-center"),
+										children: (0, _tanstack_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
+									})
+								}, cell.id);
+								if (cell.column.id === stackedHeaderColumn) return null;
+								const header$1 = cell.column.columnDef.header;
+								const headerText = typeof header$1 === "string" ? header$1 : void 0;
+								return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: (0, _lumeweb_portal_framework_ui_core.cn)("flex flex-col space-y-1", isMobile && "space-y-2", !stackedHeaderColumn && "pt-4"),
+									...getCellProps?.(cell),
+									children: [headerText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: (0, _lumeweb_portal_framework_ui_core.cn)("text-muted-foreground text-sm font-medium", isMobile && "text-base"),
+										children: headerText
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: (0, _lumeweb_portal_framework_ui_core.cn)("flex min-h-6 items-center text-base", isMobile && "min-h-8 text-lg"),
+										children: (0, _tanstack_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
+									})]
+								}, cell.id);
+							})
+						})]
+					}, row.id);
+				})
+			}),
+			normalizedOptions.pagination.enabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mt-4",
+				children: normalizedOptions.pagination.component
+			}),
+			footer && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mt-4",
+				children: footer
+			})
+		]
+	});
+}
+var validateBreakpoint;
+var init_BaseTableStackedLayout = require_rolldown_runtime.__esmMin((() => {
+	require_components_data_table_contexts_index.init_contexts();
+	require_components_data_table_useMobileDetection.init_useMobileDetection();
+	require_components_data_table_useTableHandlers.init_useTableHandlers();
+	require_components_data_table_tableOptions.init_tableOptions();
+	require_components_index.init_components();
+	validateBreakpoint = (breakpoint) => {
+		if (typeof breakpoint === "string" && [
+			"xs",
+			"sm",
+			"md",
+			"lg",
+			"xl",
+			"2xl"
+		].includes(breakpoint)) return breakpoint;
+		if (typeof breakpoint === "string" && breakpoint !== "") console.warn(`Unknown breakpoint value "${breakpoint}", falling back to "md"`);
+		return "md";
+	};
+}));
+
+//#endregion
+init_BaseTableStackedLayout();
+exports.BaseTableStackedLayout = BaseTableStackedLayout;
+Object.defineProperty(exports, 'init_BaseTableStackedLayout', {
+  enumerable: true,
+  get: function () {
+    return init_BaseTableStackedLayout;
+  }
+});
+//# sourceMappingURL=BaseTableStackedLayout.cjs.map

package/dist/cjs/components/data-table/BaseTableStackedLayout.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseTableStackedLayout.cjs","names":["useTableConfigOptional","useMobileDetection","ComponentSize","normalizeTableOptions","useTableRowHandlers","useMobileColumnHiding","React","Card","CardContent","header"],"sources":["../../../../src/components/data-table/BaseTableStackedLayout.tsx"],"sourcesContent":["import { Card, CardContent, cn } from \"@lumeweb/portal-framework-ui-core\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport React from \"react\";\n\nimport { useTableConfigOptional } from \"./contexts\";\nimport { useMobileDetection } from \"./useMobileDetection\";\nimport { BaseRecord } from \"@refinedev/core\";\nimport { BaseTableLayoutPropsBase } from \"./BaseTable\";\nimport { useMobileColumnHiding, useTableRowHandlers } from \"./useTableHandlers\";\nimport { normalizeTableOptions } from \"./tableOptions\";\nimport { ComponentSize } from \"@/components\";\n\n// Define the known Tailwind breakpoint names\ntype TailwindBreakpoint = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\n\n// Helper function to validate breakpoint values\nconst validateBreakpoint = (breakpoint: any): TailwindBreakpoint => {\n  const validBreakpoints: TailwindBreakpoint[] = [\n    \"xs\",\n    \"sm\",\n    \"md\",\n    \"lg\",\n    \"xl\",\n    \"2xl\",\n  ];\n\n  if (\n    typeof breakpoint === \"string\" &&\n    validBreakpoints.includes(breakpoint as TailwindBreakpoint)\n  ) {\n    return breakpoint as TailwindBreakpoint;\n  }\n\n  // Warn and fall back to a safe default for unknown values\n  if (typeof breakpoint === \"string\" && breakpoint !== \"\") {\n    console.warn(\n      `Unknown breakpoint value \"${breakpoint}\", falling back to \"md\"`,\n    );\n  }\n\n  return \"md\";\n};\n\ninterface BaseTableStackedLayoutProps<TData extends BaseRecord>\n  extends BaseTableLayoutPropsBase<TData> {\n  getCellProps?: (\n    cell: any, // Using any to match BaseTableContentProps interface\n  ) => React.HTMLAttributes<HTMLDivElement>;\n  stackedHeaderColumn?: string;\n}\n\nfunction BaseTableStackedLayout<TData extends BaseRecord>({\n  className,\n  emptyState,\n  emptyStateMessage,\n  footer,\n  getCellProps,\n  getRowProps,\n  header,\n  isLoading,\n  loadingState,\n  loadingStateMessage,\n  onRowClick,\n  pagination,\n  table,\n  responsive,\n  hideColumnsOnMobile,\n  mobileBreakpoint,\n  stackedHeaderColumn,\n}: BaseTableStackedLayoutProps<TData>) {\n  const tableConfig = useTableConfigOptional<TData>();\n  const validatedBreakpoint = validateBreakpoint(\n    mobileBreakpoint ||\n      tableConfig?.toolbarConfig?.mobileBreakpoint ||\n      ComponentSize.SM,\n  );\n\n  const { isMobile } = useMobileDetection({\n    mobileBreakpoint: validatedBreakpoint,\n  });\n\n  // Normalize table options including pagination\n  const normalizedOptions = normalizeTableOptions(\n    pagination,\n    emptyState,\n    emptyStateMessage,\n    loadingState,\n    loadingStateMessage,\n    table,\n  );\n\n  // Use the shared hook for row handling\n  const getTableRowProps = useTableRowHandlers({ onRowClick, getRowProps });\n\n  // Get all visible column IDs for mobile hiding hook\n  const visibleColumnIds = React.useMemo(() => {\n    return table.getAllLeafColumns().map(column => column.id);\n  }, [table]);\n\n  // Determine hidden columns at top level\n  const hiddenColumns = useMobileColumnHiding({\n    responsive,\n    hideColumnsOnMobile,\n    columnIds: visibleColumnIds,\n  });\n\n  if (isLoading) {\n    return (\n      <div className={cn(className)}>\n        {header && <div className=\"mb-4\">{header}</div>}\n        {normalizedOptions.loadingState}\n        {footer && <div className=\"mt-4\">{footer}</div>}\n      </div>\n    );\n  }\n\n  const rows = table.getRowModel().rows;\n\n  if (rows.length === 0) {\n    return (\n      <div className={cn(className)}>\n        {header && <div className=\"mb-4\">{header}</div>}\n        {normalizedOptions.emptyState}\n        {footer && <div className=\"mt-4\">{footer}</div>}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn(className)}>\n      {header && <div className=\"mb-4\">{header}</div>}\n      <div className=\"space-y-4\">\n        {rows.map((row) => {\n          // Use the shared hook for row props\n          const rowProps = getTableRowProps(row);\n\n          return (\n            <Card key={row.id} {...rowProps}>\n              {/* Render stacked header if specified */}\n              {stackedHeaderColumn &&\n                (() => {\n                  const headerCell = row\n                    .getVisibleCells()\n                    .find((cell) => cell.column.id === stackedHeaderColumn);\n\n                  if (headerCell) {\n                    return (\n                      <div\n                        className={cn(\n                          \"border-b p-4\",\n                          \"[word-break:break-word]\",\n                        )}>\n                        <div className=\"text-lg font-semibold\">\n                          {flexRender(\n                            headerCell.column.columnDef.cell,\n                            headerCell.getContext(),\n                          )}\n                        </div>\n                      </div>\n                    );\n                  }\n                  return null;\n                })()}\n\n              <CardContent\n                className={cn(\"space-y-3\", \"[word-break:break-word]\")}>\n                {row.getVisibleCells().map((cell) => {\n                  // Check if column should be hidden using the precomputed set\n                  if (hiddenColumns.has(cell.column.id)) {\n                    return null;\n                  }\n\n                  // Skip the actions column for stacked layout\n                  if (cell.column.id === \"actions\") {\n                    return (\n                      <div\n                        key={cell.id}\n                        className={cn(\n                          \"flex justify-end border-t pt-3\",\n                          isMobile && \"pt-4\",\n                        )}\n                        {...getCellProps?.(cell)}>\n                        <div className={cn(\"flex min-h-10 items-center\")}>\n                          {flexRender(\n                            cell.column.columnDef.cell,\n                            cell.getContext(),\n                          )}\n                        </div>\n                      </div>\n                    );\n                  }\n\n                  // Skip the stacked header column to avoid duplication\n                  if (cell.column.id === stackedHeaderColumn) {\n                    return null;\n                  }\n\n                  const header = cell.column.columnDef.header;\n                  const headerText =\n                    typeof header === \"string\" ? header : undefined;\n\n                  return (\n                    <div\n                      key={cell.id}\n                      className={cn(\n                        \"flex flex-col space-y-1\",\n                        isMobile && \"space-y-2\",\n                        !stackedHeaderColumn && \"pt-4\",\n                      )}\n                      {...getCellProps?.(cell)}>\n                      {headerText && (\n                        <span\n                          className={cn(\n                            \"text-muted-foreground text-sm font-medium\",\n                            isMobile && \"text-base\",\n                          )}>\n                          {headerText}\n                        </span>\n                      )}\n                      <div\n                        className={cn(\n                          \"flex min-h-6 items-center text-base\",\n                          isMobile && \"min-h-8 text-lg\",\n                        )}>\n                        {flexRender(\n                          cell.column.columnDef.cell,\n                          cell.getContext(),\n                        )}\n                      </div>\n                    </div>\n                  );\n                })}\n              </CardContent>\n            </Card>\n          );\n        })}\n      </div>\n      {normalizedOptions.pagination.enabled && (\n        <div className=\"mt-4\">{normalizedOptions.pagination.component}</div>\n      )}\n      {footer && <div className=\"mt-4\">{footer}</div>}\n    </div>\n  );\n}\n\nexport { BaseTableStackedLayout };\n"],"mappings":"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"}

package/dist/cjs/components/data-table/BaseTableStackedLayout.d.cts

@@ -0,0 +1,31 @@
+import { BaseTableLayoutPropsBase } from "./BaseTable.cjs";
+import React from "react";
+import { BaseRecord } from "@refinedev/core";
+
+//#region src/components/data-table/BaseTableStackedLayout.d.ts
+interface BaseTableStackedLayoutProps<TData extends BaseRecord> extends BaseTableLayoutPropsBase<TData> {
+  getCellProps?: (cell: any) => React.HTMLAttributes<HTMLDivElement>;
+  stackedHeaderColumn?: string;
+}
+declare function BaseTableStackedLayout<TData extends BaseRecord>({
+  className,
+  emptyState,
+  emptyStateMessage,
+  footer,
+  getCellProps,
+  getRowProps,
+  header,
+  isLoading,
+  loadingState,
+  loadingStateMessage,
+  onRowClick,
+  pagination,
+  table,
+  responsive,
+  hideColumnsOnMobile,
+  mobileBreakpoint,
+  stackedHeaderColumn
+}: BaseTableStackedLayoutProps<TData>): any;
+//#endregion
+export { BaseTableStackedLayout };
+//# sourceMappingURL=BaseTableStackedLayout.d.cts.map

package/dist/cjs/components/data-table/DataTable.cjs

@@ -0,0 +1,113 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_components_data_table_toolbarItems_filters_hooks_useFilterOperators = require('./toolbarItems/filters/hooks/useFilterOperators.cjs');
+const require_components_data_table_contexts_FilterHelpers = require('./contexts/FilterHelpers.cjs');
+const require_components_data_table_contexts_RefineTable = require('./contexts/RefineTable.cjs');
+const require_components_data_table_contexts_TableConfig = require('./contexts/TableConfig.cjs');
+const require_components_data_table_contexts_TableInstance = require('./contexts/TableInstance.cjs');
+const require_components_data_table_contexts_index = require('./contexts/index.cjs');
+const require_components_data_table_BaseTable = require('./BaseTable.cjs');
+const require_components_data_table_TableAction = require('./TableAction.cjs');
+const require_components_data_table_TableActionMenu = require('./TableActionMenu.cjs');
+let _refinedev_core = require("@refinedev/core");
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _refinedev_react_table = require("@refinedev/react-table");
+
+//#region src/components/data-table/DataTable.tsx
+function DataTable({ actionMenu, columns, control, dataProviderName, refineCoreProps, resource, toolbar, refetchInterval, ...props }) {
+	const refineTable = (0, _refinedev_react_table.useTable)({
+		columns: (0, react.useMemo)(() => {
+			const cols = [...columns || []];
+			const actionColumn = actionMenu ? {
+				cell: ({ row }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-center gap-1",
+					children: [actionMenu.actionItems && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_TableAction.TableAction, {
+						items: actionMenu.actionItems,
+						row: row.original
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_TableActionMenu.TableActionMenu, {
+						items: actionMenu.items,
+						row: row.original
+					})]
+				}),
+				header: actionMenu.label ?? "Actions",
+				id: "actions",
+				meta: {
+					cellClassName: "max-w-24 w-12",
+					headerClassName: "max-w-24 w-12"
+				},
+				size: 0
+			} : void 0;
+			if (actionColumn) cols.push(actionColumn);
+			return cols;
+		}, [columns, actionMenu]),
+		refineCoreProps: (0, react.useMemo)(() => ({
+			dataProviderName: dataProviderName ?? void 0,
+			resource,
+			...refineCoreProps,
+			queryOptions: {
+				...refineCoreProps?.queryOptions,
+				refetchInterval
+			}
+		}), [
+			dataProviderName,
+			resource,
+			refineCoreProps,
+			refetchInterval
+		])
+	});
+	const table = {
+		...refineTable.reactTable,
+		options: {
+			...refineTable.reactTable.options,
+			refineCore: refineTable.refineCore
+		}
+	};
+	const getDefaultFilter = (columnName, operatorType) => (0, _refinedev_core.getDefaultFilter)(columnName, refineTable.refineCore?.filters, operatorType);
+	const getDefaultOperator = (fieldType) => require_components_data_table_toolbarItems_filters_hooks_useFilterOperators.getDefaultOperatorForFieldType(fieldType);
+	const getAvailableOperators$1 = (fieldType) => require_components_data_table_toolbarItems_filters_hooks_useFilterOperators.getAvailableOperators(fieldType);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_contexts_RefineTable.RefineTableProvider, {
+		refineTable,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_contexts_TableInstance.TableInstanceProvider, {
+			table,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_contexts_FilterHelpers.FilterHelpersProvider, {
+				refineTable,
+				getDefaultFilter,
+				getDefaultOperator,
+				getAvailableOperators: getAvailableOperators$1,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_data_table_contexts_TableConfig.TableConfigProvider, {
+					toolbarConfig: toolbar,
+					refineContext: {
+						tableInstance: refineTable.refineCore,
+						refetch: refineTable.refineCore.tableQuery.refetch,
+						isLoading: refineTable.refineCore.tableQuery.isFetching,
+						error: refineTable.refineCore.tableQuery.error
+					},
+					children: [control, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_BaseTable.BaseTable, {
+						table,
+						refineTable: refineTable.refineCore,
+						...props
+					})]
+				})
+			})
+		})
+	});
+}
+var init_DataTable = require_rolldown_runtime.__esmMin((() => {
+	require_components_data_table_BaseTable.init_BaseTable();
+	require_components_data_table_TableAction.init_TableAction();
+	require_components_data_table_TableActionMenu.init_TableActionMenu();
+	require_components_data_table_contexts_index.init_contexts();
+	require_components_data_table_toolbarItems_filters_hooks_useFilterOperators.init_useFilterOperators();
+}));
+
+//#endregion
+init_DataTable();
+exports.DataTable = DataTable;
+Object.defineProperty(exports, 'init_DataTable', {
+  enumerable: true,
+  get: function () {
+    return init_DataTable;
+  }
+});
+//# sourceMappingURL=DataTable.cjs.map

package/dist/cjs/components/data-table/DataTable.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.cjs","names":["TableAction","TableActionMenu","getDefaultOperatorForFieldType","getAvailableOperators","getAvailableOperatorsHelper","RefineTableProvider","TableInstanceProvider","FilterHelpersProvider","TableConfigProvider","BaseTable"],"sources":["../../../../src/components/data-table/DataTable.tsx"],"sourcesContent":["import {\n  BaseRecord,\n  getDefaultFilter as refineGetDefaultFilter,\n} from \"@refinedev/core\";\nimport { useTable as useRefineTable } from \"@refinedev/react-table\";\nimport { Table } from \"@tanstack/react-table\";\nimport React, { useMemo } from \"react\";\n\nimport type { DataTableProps } from \"./DataTable.types\";\n\nimport { ActionColumnCellProps, BaseTable } from \"./BaseTable\";\nimport { TableAction } from \"./TableAction\";\nimport { TableActionMenu } from \"./TableActionMenu\";\nimport {\n  FilterHelpersProvider,\n  RefineTableProvider,\n  TableConfigProvider,\n  TableInstanceProvider,\n} from \"./contexts\";\nimport {\n  getAvailableOperators as getAvailableOperatorsHelper,\n  getDefaultOperatorForFieldType,\n} from \"./toolbarItems/filters/hooks/useFilterOperators\";\n\nfunction DataTable<\n  TData extends BaseRecord = BaseRecord,\n  TError = unknown,\n  TSearchVariables = unknown,\n>({\n  actionMenu,\n  columns,\n  control,\n  dataProviderName,\n  refineCoreProps,\n  resource,\n  toolbar,\n  refetchInterval,\n  ...props\n}: DataTableProps<TData, TError, TSearchVariables>) {\n  const tableColumns = useMemo(() => {\n    const cols = [...(columns || [])];\n\n    // Create actionColumn inside useMemo to avoid unnecessary recreations\n    const actionColumn = actionMenu\n      ? {\n          cell: ({ row }: ActionColumnCellProps<TData>) => (\n            <div className=\"flex items-center gap-1\">\n              {actionMenu.actionItems && (\n                <TableAction\n                  items={actionMenu.actionItems}\n                  row={row.original}\n                />\n              )}\n              <TableActionMenu items={actionMenu.items} row={row.original} />\n            </div>\n          ),\n          header: actionMenu.label ?? \"Actions\",\n          id: \"actions\",\n          meta: {\n            cellClassName: \"max-w-24 w-12\",\n            headerClassName: \"max-w-24 w-12\",\n          },\n          size: 0,\n        }\n      : undefined;\n\n    if (actionColumn) {\n      cols.push(actionColumn);\n    }\n    return cols;\n  }, [columns, actionMenu]);\n\n  const memoizedRefineCoreProps = useMemo(\n    () => ({\n      dataProviderName: dataProviderName ?? undefined,\n      resource,\n      ...refineCoreProps,\n      queryOptions: {\n        ...refineCoreProps?.queryOptions,\n        refetchInterval,\n      },\n    }),\n    [dataProviderName, resource, refineCoreProps, refetchInterval],\n  );\n\n  const refineTable = useRefineTable<TData>({\n    columns: tableColumns,\n    // @ts-ignore\n    refineCoreProps: memoizedRefineCoreProps,\n  });\n\n  const table: Table<TData> = {\n    ...refineTable.reactTable,\n    options: {\n      ...refineTable.reactTable.options,\n      refineCore: refineTable.refineCore,\n    },\n  } as unknown as Table<TData>;\n\n  const getDefaultFilter = (columnName: string, operatorType?: string) =>\n    refineGetDefaultFilter(\n      columnName,\n      refineTable.refineCore?.filters,\n      operatorType as any,\n    );\n\n  const getDefaultOperator = (fieldType: string): string =>\n    getDefaultOperatorForFieldType(fieldType);\n\n  const getAvailableOperators = (fieldType: string) =>\n    getAvailableOperatorsHelper(fieldType);\n\n  return (\n    <RefineTableProvider refineTable={refineTable}>\n      <TableInstanceProvider table={table}>\n        <FilterHelpersProvider\n          refineTable={refineTable}\n          getDefaultFilter={getDefaultFilter}\n          getDefaultOperator={getDefaultOperator}\n          getAvailableOperators={getAvailableOperators}>\n          <TableConfigProvider\n            toolbarConfig={toolbar}\n            refineContext={{\n              tableInstance: refineTable.refineCore,\n              refetch: refineTable.refineCore.tableQuery.refetch,\n              isLoading: refineTable.refineCore.tableQuery.isFetching,\n              error: refineTable.refineCore.tableQuery.error,\n            }}>\n            {control}\n            <BaseTable\n              table={table}\n              refineTable={refineTable.refineCore}\n              {...props}\n            />\n          </TableConfigProvider>\n        </FilterHelpersProvider>\n      </TableInstanceProvider>\n    </RefineTableProvider>\n  );\n}\n\nexport { DataTable };\n"],"mappings":";;;;;;;;;;;;;;;;;AAwBA,SAAS,UAIP,EACA,YACA,SACA,SACA,kBACA,iBACA,UACA,SACA,iBACA,GAAG,SAC+C;CA+ClD,MAAM,mDAAoC;EACxC,kCA/CiC;GACjC,MAAM,OAAO,CAAC,GAAI,WAAW,EAAE,CAAE;GAGjC,MAAM,eAAe,aACjB;IACE,OAAO,EAAE,UACP,4CAAC;KAAI,WAAU;gBACZ,WAAW,eACV,2CAACA;MACC,OAAO,WAAW;MAClB,KAAK,IAAI;OACT,EAEJ,2CAACC;MAAgB,OAAO,WAAW;MAAO,KAAK,IAAI;OAAY;MAC3D;IAER,QAAQ,WAAW,SAAS;IAC5B,IAAI;IACJ,MAAM;KACJ,eAAe;KACf,iBAAiB;KAClB;IACD,MAAM;IACP,GACD;AAEJ,OAAI,aACF,MAAK,KAAK,aAAa;AAEzB,UAAO;KACN,CAAC,SAAS,WAAW,CAAC;EAkBvB,2CAfO;GACL,kBAAkB,oBAAoB;GACtC;GACA,GAAG;GACH,cAAc;IACZ,GAAG,iBAAiB;IACpB;IACD;GACF,GACD;GAAC;GAAkB;GAAU;GAAiB;GAAgB,CAC/D;EAMA,CAAC;CAEF,MAAM,QAAsB;EAC1B,GAAG,YAAY;EACf,SAAS;GACP,GAAG,YAAY,WAAW;GAC1B,YAAY,YAAY;GACzB;EACF;CAED,MAAM,oBAAoB,YAAoB,uDAE1C,YACA,YAAY,YAAY,SACxB,aACD;CAEH,MAAM,sBAAsB,cAC1BC,2GAA+B,UAAU;CAE3C,MAAMC,2BAAyB,cAC7BC,kGAA4B,UAAU;AAExC,QACE,2CAACC;EAAiC;YAChC,2CAACC;GAA6B;aAC5B,2CAACC;IACc;IACK;IACE;IACpB,uBAAuBJ;cACvB,4CAACK;KACC,eAAe;KACf,eAAe;MACb,eAAe,YAAY;MAC3B,SAAS,YAAY,WAAW,WAAW;MAC3C,WAAW,YAAY,WAAW,WAAW;MAC7C,OAAO,YAAY,WAAW,WAAW;MAC1C;gBACA,SACD,2CAACC;MACQ;MACP,aAAa,YAAY;MACzB,GAAI;OACJ;MACkB;KACA;IACF;GACJ;;;yDA/HqC;6DACnB;qEACQ;6DAMhC;sGAIqC"}

package/dist/cjs/components/data-table/DataTable.d.cts

@@ -0,0 +1,18 @@
+import { DataTableProps } from "./DataTable.types.cjs";
+import { BaseRecord } from "@refinedev/core";
+
+//#region src/components/data-table/DataTable.d.ts
+declare function DataTable<TData extends BaseRecord = BaseRecord, TError = unknown, TSearchVariables = unknown>({
+  actionMenu,
+  columns,
+  control,
+  dataProviderName,
+  refineCoreProps,
+  resource,
+  toolbar,
+  refetchInterval,
+  ...props
+}: DataTableProps<TData, TError, TSearchVariables>): any;
+//#endregion
+export { DataTable };
+//# sourceMappingURL=DataTable.d.cts.map

package/dist/cjs/components/data-table/DataTable.types.cjs

@@ -0,0 +1,39 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+
+//#region src/components/data-table/DataTable.types.ts
+var ToolbarItemAlignment, ToolbarItemType, TableLayoutType;
+var init_DataTable_types = require_rolldown_runtime.__esmMin((() => {
+	ToolbarItemAlignment = /* @__PURE__ */ function(ToolbarItemAlignment$1) {
+		ToolbarItemAlignment$1["LEFT"] = "left";
+		ToolbarItemAlignment$1["RIGHT"] = "right";
+		ToolbarItemAlignment$1["CENTER"] = "center";
+		return ToolbarItemAlignment$1;
+	}({});
+	ToolbarItemType = /* @__PURE__ */ function(ToolbarItemType$1) {
+		ToolbarItemType$1["ACTION"] = "action";
+		ToolbarItemType$1["CUSTOM"] = "custom";
+		ToolbarItemType$1["FILTER"] = "filter";
+		ToolbarItemType$1["SEPARATOR"] = "separator";
+		ToolbarItemType$1["FILTER_GROUP"] = "filter-group";
+		return ToolbarItemType$1;
+	}({});
+	TableLayoutType = /* @__PURE__ */ function(TableLayoutType$1) {
+		TableLayoutType$1["TABLE"] = "table";
+		TableLayoutType$1["STACKED"] = "stacked";
+		TableLayoutType$1["AUTO"] = "auto";
+		return TableLayoutType$1;
+	}({});
+}));
+
+//#endregion
+init_DataTable_types();
+exports.TableLayoutType = TableLayoutType;
+exports.ToolbarItemAlignment = ToolbarItemAlignment;
+exports.ToolbarItemType = ToolbarItemType;
+Object.defineProperty(exports, 'init_DataTable_types', {
+  enumerable: true,
+  get: function () {
+    return init_DataTable_types;
+  }
+});
+//# sourceMappingURL=DataTable.types.cjs.map

package/dist/cjs/components/data-table/DataTable.types.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.types.cjs","names":[],"sources":["../../../../src/components/data-table/DataTable.types.ts"],"sourcesContent":["import {\n  useTableReturnType,\n  type BaseRecord,\n  type CrudFilter,\n  type CrudSorting,\n  type useTableProps as useTablePropsCore,\n} from \"@refinedev/core\";\nimport { Table } from \"@tanstack/react-table\";\nimport { UseTableReturnType } from \"@refinedev/react-table\";\n\nimport type { BaseTableProps } from \"./BaseTable\";\n\nimport { TableActionItem } from \"./TableAction\";\nimport { TableActionMenuItem } from \"./TableActionMenu\";\nimport {\n  FilterConfig,\n  LogicalFilterOperator,\n} from \"./toolbarItems/filters/types\";\n\n// Alignment options for toolbar items\nexport enum ToolbarItemAlignment {\n  LEFT = \"left\",\n  RIGHT = \"right\",\n  CENTER = \"center\",\n}\n\n// Base toolbar item interface\nexport interface BaseToolbarItem {\n  /** Unique identifier for the toolbar item */\n  id: string;\n  /** Type of the toolbar item */\n  type: ToolbarItemType;\n  /** Optional order for positioning items in toolbar */\n  order?: number;\n  /** Alignment for this specific item */\n  alignment?: ToolbarItemAlignment;\n}\n\n// Toolbar item types\nexport enum ToolbarItemType {\n  ACTION = \"action\",\n  CUSTOM = \"custom\",\n  FILTER = \"filter\",\n  SEPARATOR = \"separator\",\n  FILTER_GROUP = \"filter-group\",\n}\n\n// Table layout types\nexport enum TableLayoutType {\n  TABLE = \"table\",\n  STACKED = \"stacked\",\n  AUTO = \"auto\",\n}\n\n// Refine contexts for toolbar items\nexport interface ToolbarRefineContext<TData extends BaseRecord> {\n  /** The Refine table instance */\n  tableInstance: useTableReturnType<TData, any>;\n  /** Function to refetch data */\n  refetch: () => void;\n  /** Whether data is currently being fetched */\n  isLoading: boolean;\n  /** Any errors from data fetching */\n  error?: any;\n}\n\n// Table contexts for enhanced functionality\nexport interface TableContext<TData> {\n  /** Set table filters */\n  setFilters?: (filters: CrudFilter[]) => void;\n  /** Set table sorters */\n  setSorters?: (sorters: CrudSorting) => void;\n  /** Refine table query object */\n  tableQuery?: any;\n  /** Current filters state */\n  filters?: CrudFilter[];\n  /** Current sorters state */\n  sorters?: CrudSorting;\n}\n\n// Base props for all toolbar item components\nexport interface ToolbarItemComponentProps<TData extends BaseRecord> {\n  /** The table instance */\n  table: Table<TData>;\n  /** Current value of the item (for filters) */\n  value?: any;\n  /** Handler to update the item value (for filters) */\n  onChange?: (value: any) => void;\n  /** Optional Refine table contexts - only available when using DataTable with Refine */\n  refineContext?: ToolbarRefineContext<TData>;\n  /** Enhanced table contexts with filter management helpers */\n  context?: TableContext<TData>;\n}\n\n// Action item types for toolbar buttons\nexport interface ToolbarActionItem<TData extends BaseRecord = any>\n  extends BaseToolbarItem {\n  type: ToolbarItemType.ACTION;\n  /** Label for the action button */\n  label: string;\n  /** Icon for the action button */\n  icon?: React.ComponentType<{ className?: string }> | React.ReactNode;\n  /** Click handler for the action */\n  onClick: (props: ToolbarItemComponentProps<TData>) => void;\n  /** Whether the action is disabled */\n  disabled?: boolean;\n  /** Tooltip text for the action */\n  tooltip?: string;\n  /** Variant style for the button */\n  variant?:\n    | \"default\"\n    | \"destructive\"\n    | \"outline\"\n    | \"secondary\"\n    | \"ghost\"\n    | \"link\";\n  /** Size of the button */\n  size?: \"default\" | \"sm\" | \"lg\" | \"icon\";\n  /** Class name for the button */\n  className?: string;\n}\n\n// Filter item types\nexport interface ToolbarFilterItem<TData extends BaseRecord>\n  extends BaseToolbarItem {\n  type: ToolbarItemType.FILTER;\n  /** Label for the filter */\n  label: string;\n  /** Field name in the data model to filter on - defaults to id if not provided */\n  field?: keyof TData;\n  /** The filter component to render - either direct component or registered type string */\n  component?: React.ComponentType<ToolbarItemComponentProps<TData>> | string;\n  /** Initial value for the filter */\n  initialValue?: any;\n  /** Filter-specific configuration - now required and contains all necessary properties */\n  config: FilterConfig<TData>;\n}\n\n// Separator item type\nexport interface ToolbarSeparatorItem extends BaseToolbarItem {\n  type: ToolbarItemType.SEPARATOR;\n}\n\n// Filter group item type\nexport interface ToolbarFilterGroupItem<TData extends BaseRecord = any>\n  extends BaseToolbarItem {\n  type: ToolbarItemType.FILTER_GROUP;\n  /** Label for the filter group */\n  label: string;\n  /** Icon for the filter group (defaults to Filter icon) */\n  icon?: React.ReactNode;\n  /** Filter items contained within this group */\n  items: ToolbarFilterItem<TData>[];\n  /** Whether the group is initially expanded */\n  initiallyExpanded?: boolean;\n  /** Layout direction for filter items */\n  layout?: \"horizontal\" | \"vertical\";\n  /** Optional custom class name for the group container */\n  className?: string;\n  /** Whether to use dropdown style expansion instead of inline */\n  dropdownStyle?: boolean;\n}\n\n// Custom item type for toolbar\nexport interface ToolbarCustomItem<TData extends BaseRecord = any>\n  extends BaseToolbarItem {\n  type: ToolbarItemType.CUSTOM;\n  /** Custom component to render */\n  component: React.ComponentType<ToolbarItemComponentProps<TData>>;\n  /** Optional class name for the container */\n  className?: string;\n}\n\n// Extended toolbar item type\nexport type ExtendedToolbarItem<TData extends BaseRecord> =\n  | ToolbarItem<TData>\n  | (BaseToolbarItem & {\n      component?: React.ComponentType<ToolbarItemComponentProps<TData>>;\n    });\n\n// Union type for all toolbar items\nexport type ToolbarItem<TData extends BaseRecord> =\n  | ToolbarActionItem<TData>\n  | ToolbarFilterItem<TData>\n  | ToolbarSeparatorItem\n  | ToolbarFilterGroupItem<TData>\n  | ToolbarCustomItem<TData>;\n\n// Props for filter components (extends base interface)\nexport interface ToolbarFilterComponentProps<TData extends BaseRecord>\n  extends ToolbarItemComponentProps<TData> {\n  /** Column information if the filter is tied to a specific column */\n  column?: keyof TData;\n  /** Filter configuration */\n  config?: FilterConfig<TData>;\n  /** Label from the filter item (not config) */\n  itemLabel?: string;\n  /** Function to get available operators for a field */\n  getAvailableOperators?: (field?: string) => LogicalFilterOperator[];\n}\n\n// Toolbar configuration types\nexport interface ToolbarConfig<TData extends BaseRecord> {\n  /** Items to display in the toolbar */\n  items: ToolbarItem<TData>[];\n  /** Whether the toolbar should be sticky */\n  sticky?: boolean;\n  /** Custom class name for the toolbar container */\n  className?: string;\n  /** Default alignment for all toolbar items */\n  defaultAlignment?: ToolbarItemAlignment;\n  /** Whether to automatically distribute space between left and right aligned items */\n  justifyBetween?: boolean;\n  /** Mobile breakpoint configuration */\n  mobileBreakpoint?: string;\n}\n\nexport interface DataTableActionMenuProps<TData> {\n  items: TableActionMenuItem<TData>[];\n  label?: string;\n  /**\n   * Action items to display as individual buttons\n   */\n  actionItems?: TableActionItem<TData>[];\n}\n\nexport interface DataTableProps<\n  TData extends BaseRecord = BaseRecord,\n  TError = unknown,\n  TSearchVariables = unknown,\n> extends Omit<\n    BaseTableProps<TData>,\n    \"actionColumn\" | \"data\" | \"tableOptions\"\n  > {\n  /**\n   * Configuration for action menu items\n   */\n  actionMenu?: DataTableActionMenuProps<TData>;\n  /**\n   * Configuration for toolbar items\n   */\n  toolbar?: ToolbarConfig<TData>;\n  /**\n   * The dataProvider name if not using the default one\n   * @default \"default\"\n   */\n  dataProviderName?: string;\n  /**\n   * Configuration options for refine's useTable hook\n   */\n  refineCoreProps?: Omit<\n    useTablePropsCore<TData, TError, TSearchVariables>,\n    \"columns\" | \"dataProviderName\" | \"resource\"\n  >;\n  /**\n   * The resource name for API data interactions\n   * @example \"posts\", \"users\", \"products\"\n   */\n  resource: string;\n  /**\n   * Interval (in milliseconds) for automatic data refetching\n   * This value gets passed to React Query through refineCoreProps\n   */\n  refetchInterval?: number;\n  /**\n   * Custom control elements to render above the table, typically used for DataTableController\n   * or other custom control components that need access to table controls\n   */\n  control?: React.ReactNode;\n}\n"],"mappings":";;;;;CAoBY,wEAAL;AACL;AACA;AACA;;;CAgBU,8DAAL;AACL;AACA;AACA;AACA;AACA;;;CAIU,8DAAL;AACL;AACA;AACA"}

package/dist/cjs/components/data-table/DataTable.types.d.cts

@@ -0,0 +1,203 @@
+import { TableActionItem } from "./TableAction.cjs";
+import { TableActionMenuItem } from "./TableActionMenu.cjs";
+import { FilterConfig, LogicalFilterOperator } from "./toolbarItems/filters/types.cjs";
+import { BaseTableProps } from "./BaseTable.cjs";
+import { BaseRecord, CrudFilter, CrudSorting, useTableProps, useTableReturnType } from "@refinedev/core";
+import { Table } from "@tanstack/react-table";
+
+//#region src/components/data-table/DataTable.types.d.ts
+declare enum ToolbarItemAlignment {
+  LEFT = "left",
+  RIGHT = "right",
+  CENTER = "center",
+}
+interface BaseToolbarItem {
+  /** Unique identifier for the toolbar item */
+  id: string;
+  /** Type of the toolbar item */
+  type: ToolbarItemType;
+  /** Optional order for positioning items in toolbar */
+  order?: number;
+  /** Alignment for this specific item */
+  alignment?: ToolbarItemAlignment;
+}
+declare enum ToolbarItemType {
+  ACTION = "action",
+  CUSTOM = "custom",
+  FILTER = "filter",
+  SEPARATOR = "separator",
+  FILTER_GROUP = "filter-group",
+}
+declare enum TableLayoutType {
+  TABLE = "table",
+  STACKED = "stacked",
+  AUTO = "auto",
+}
+interface ToolbarRefineContext<TData extends BaseRecord> {
+  /** The Refine table instance */
+  tableInstance: useTableReturnType<TData, any>;
+  /** Function to refetch data */
+  refetch: () => void;
+  /** Whether data is currently being fetched */
+  isLoading: boolean;
+  /** Any errors from data fetching */
+  error?: any;
+}
+interface TableContext<TData> {
+  /** Set table filters */
+  setFilters?: (filters: CrudFilter[]) => void;
+  /** Set table sorters */
+  setSorters?: (sorters: CrudSorting) => void;
+  /** Refine table query object */
+  tableQuery?: any;
+  /** Current filters state */
+  filters?: CrudFilter[];
+  /** Current sorters state */
+  sorters?: CrudSorting;
+}
+interface ToolbarItemComponentProps<TData extends BaseRecord> {
+  /** The table instance */
+  table: Table<TData>;
+  /** Current value of the item (for filters) */
+  value?: any;
+  /** Handler to update the item value (for filters) */
+  onChange?: (value: any) => void;
+  /** Optional Refine table contexts - only available when using DataTable with Refine */
+  refineContext?: ToolbarRefineContext<TData>;
+  /** Enhanced table contexts with filter management helpers */
+  context?: TableContext<TData>;
+}
+interface ToolbarActionItem<TData extends BaseRecord = any> extends BaseToolbarItem {
+  type: ToolbarItemType.ACTION;
+  /** Label for the action button */
+  label: string;
+  /** Icon for the action button */
+  icon?: React.ComponentType<{
+    className?: string;
+  }> | React.ReactNode;
+  /** Click handler for the action */
+  onClick: (props: ToolbarItemComponentProps<TData>) => void;
+  /** Whether the action is disabled */
+  disabled?: boolean;
+  /** Tooltip text for the action */
+  tooltip?: string;
+  /** Variant style for the button */
+  variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
+  /** Size of the button */
+  size?: "default" | "sm" | "lg" | "icon";
+  /** Class name for the button */
+  className?: string;
+}
+interface ToolbarFilterItem<TData extends BaseRecord> extends BaseToolbarItem {
+  type: ToolbarItemType.FILTER;
+  /** Label for the filter */
+  label: string;
+  /** Field name in the data model to filter on - defaults to id if not provided */
+  field?: keyof TData;
+  /** The filter component to render - either direct component or registered type string */
+  component?: React.ComponentType<ToolbarItemComponentProps<TData>> | string;
+  /** Initial value for the filter */
+  initialValue?: any;
+  /** Filter-specific configuration - now required and contains all necessary properties */
+  config: FilterConfig<TData>;
+}
+interface ToolbarSeparatorItem extends BaseToolbarItem {
+  type: ToolbarItemType.SEPARATOR;
+}
+interface ToolbarFilterGroupItem<TData extends BaseRecord = any> extends BaseToolbarItem {
+  type: ToolbarItemType.FILTER_GROUP;
+  /** Label for the filter group */
+  label: string;
+  /** Icon for the filter group (defaults to Filter icon) */
+  icon?: React.ReactNode;
+  /** Filter items contained within this group */
+  items: ToolbarFilterItem<TData>[];
+  /** Whether the group is initially expanded */
+  initiallyExpanded?: boolean;
+  /** Layout direction for filter items */
+  layout?: "horizontal" | "vertical";
+  /** Optional custom class name for the group container */
+  className?: string;
+  /** Whether to use dropdown style expansion instead of inline */
+  dropdownStyle?: boolean;
+}
+interface ToolbarCustomItem<TData extends BaseRecord = any> extends BaseToolbarItem {
+  type: ToolbarItemType.CUSTOM;
+  /** Custom component to render */
+  component: React.ComponentType<ToolbarItemComponentProps<TData>>;
+  /** Optional class name for the container */
+  className?: string;
+}
+type ExtendedToolbarItem<TData extends BaseRecord> = ToolbarItem<TData> | (BaseToolbarItem & {
+  component?: React.ComponentType<ToolbarItemComponentProps<TData>>;
+});
+type ToolbarItem<TData extends BaseRecord> = ToolbarActionItem<TData> | ToolbarFilterItem<TData> | ToolbarSeparatorItem | ToolbarFilterGroupItem<TData> | ToolbarCustomItem<TData>;
+interface ToolbarFilterComponentProps<TData extends BaseRecord> extends ToolbarItemComponentProps<TData> {
+  /** Column information if the filter is tied to a specific column */
+  column?: keyof TData;
+  /** Filter configuration */
+  config?: FilterConfig<TData>;
+  /** Label from the filter item (not config) */
+  itemLabel?: string;
+  /** Function to get available operators for a field */
+  getAvailableOperators?: (field?: string) => LogicalFilterOperator[];
+}
+interface ToolbarConfig<TData extends BaseRecord> {
+  /** Items to display in the toolbar */
+  items: ToolbarItem<TData>[];
+  /** Whether the toolbar should be sticky */
+  sticky?: boolean;
+  /** Custom class name for the toolbar container */
+  className?: string;
+  /** Default alignment for all toolbar items */
+  defaultAlignment?: ToolbarItemAlignment;
+  /** Whether to automatically distribute space between left and right aligned items */
+  justifyBetween?: boolean;
+  /** Mobile breakpoint configuration */
+  mobileBreakpoint?: string;
+}
+interface DataTableActionMenuProps<TData> {
+  items: TableActionMenuItem<TData>[];
+  label?: string;
+  /**
+   * Action items to display as individual buttons
+   */
+  actionItems?: TableActionItem<TData>[];
+}
+interface DataTableProps<TData extends BaseRecord = BaseRecord, TError = unknown, TSearchVariables = unknown> extends Omit<BaseTableProps<TData>, "actionColumn" | "data" | "tableOptions"> {
+  /**
+   * Configuration for action menu items
+   */
+  actionMenu?: DataTableActionMenuProps<TData>;
+  /**
+   * Configuration for toolbar items
+   */
+  toolbar?: ToolbarConfig<TData>;
+  /**
+   * The dataProvider name if not using the default one
+   * @default "default"
+   */
+  dataProviderName?: string;
+  /**
+   * Configuration options for refine's useTable hook
+   */
+  refineCoreProps?: Omit<useTableProps<TData, TError, TSearchVariables>, "columns" | "dataProviderName" | "resource">;
+  /**
+   * The resource name for API data interactions
+   * @example "posts", "users", "products"
+   */
+  resource: string;
+  /**
+   * Interval (in milliseconds) for automatic data refetching
+   * This value gets passed to React Query through refineCoreProps
+   */
+  refetchInterval?: number;
+  /**
+   * Custom control elements to render above the table, typically used for DataTableController
+   * or other custom control components that need access to table controls
+   */
+  control?: React.ReactNode;
+}
+//#endregion
+export { BaseToolbarItem, DataTableActionMenuProps, DataTableProps, ExtendedToolbarItem, TableContext, TableLayoutType, ToolbarActionItem, ToolbarConfig, ToolbarCustomItem, ToolbarFilterComponentProps, ToolbarFilterGroupItem, ToolbarFilterItem, ToolbarItem, ToolbarItemAlignment, ToolbarItemComponentProps, ToolbarItemType, ToolbarRefineContext, ToolbarSeparatorItem };
+//# sourceMappingURL=DataTable.types.d.cts.map