@tulip-systems/core 0.8.3 → 0.10.0

package/dist/src/modules/data-tables/strategies/helpers/sorting.mjs

@@ -0,0 +1,37 @@
+import { z as z$1 } from "zod";
+import { parseAsString, parseAsStringLiteral } from "nuqs";
+
+//#region src/modules/data-tables/strategies/helpers/sorting.ts
+/**
+* Sorting schema
+*/
+const sortingSchema = z$1.object({
+	sort: z$1.string().nullable().optional(),
+	order: z$1.enum(["asc", "desc"]).nullable().optional()
+});
+/**
+* Search params
+*/
+const sortingSearchParams = {
+	sort: parseAsString,
+	order: parseAsStringLiteral(["asc", "desc"])
+};
+function handleSortingChange({ sortingState, setQuery, resetCursor }) {
+	return (updater) => {
+		const newState = typeof updater === "function" ? updater(sortingState) : updater;
+		const { id, desc } = newState[0] ?? {
+			id: null,
+			desc: null
+		};
+		const cursor = resetCursor();
+		setQuery({
+			sort: id?.replaceAll("_", ".") ?? null,
+			order: desc === null ? null : desc ? "desc" : "asc",
+			cursor
+		});
+		return newState;
+	};
+}
+
+//#endregion
+export { handleSortingChange };

package/dist/src/modules/data-tables/strategies/infinite/components.mjs

@@ -0,0 +1,50 @@
+"use client";
+
+import { Skeleton } from "../../../../components/ui/skeleton.mjs";
+import { TableCell, TableRow } from "../../components/table.mjs";
+import { jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { useInView } from "motion/react";
+
+//#region src/modules/data-tables/strategies/infinite/components.tsx
+/**
+* Infinite table bottombar
+*/
+function InfinteTableBottombar({ table }) {
+	const scrollRef = useRef(null);
+	const isInView = useInView(scrollRef);
+	const hasNextPage = table.getCanNextPage();
+	const fetchNextPage = table.nextPage;
+	const { isFetching, isFetchingNextPage } = table.options.meta.strategy.meta;
+	useEffect(() => {
+		if (isInView && hasNextPage && !isFetching && !isFetchingNextPage) fetchNextPage();
+	}, [
+		isInView,
+		fetchNextPage,
+		hasNextPage,
+		isFetching,
+		isFetchingNextPage
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		className: "relative",
+		children: /* @__PURE__ */ jsx("div", {
+			ref: scrollRef,
+			className: "absolute bottom-0 -z-50 min-h-[500px]"
+		})
+	});
+}
+/**
+* Infinite table footer
+*/
+function InfinteTableFooter({ table }) {
+	const { isFetchingNextPage } = table.options.meta.strategy.meta;
+	const pageSize = table.getState().pagination.pageSize;
+	const columnLength = table.getAllFlatColumns().length;
+	return isFetchingNextPage && Array.from({ length: pageSize }).map((_, index) => /* @__PURE__ */ jsx(TableRow, {
+		className: "relative",
+		children: Array.from({ length: columnLength }).map((_, index) => /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "my-2 h-2 w-full rounded-full" }) }, index))
+	}, index));
+}
+
+//#endregion
+export { InfinteTableBottombar, InfinteTableFooter };

package/dist/src/modules/data-tables/strategies/infinite/strategy.d.mts

@@ -0,0 +1,20 @@
+import { TableStrategy } from "../../lib/types.mjs";
+
+//#region src/modules/data-tables/strategies/infinite/strategy.d.ts
+interface UseInfiniteStrategyInput {
+  cursor: number | undefined;
+  total: number | undefined;
+  fetchNextPage: () => void;
+  isFetching: boolean;
+  isFetchingNextPage: boolean;
+}
+type InfiniteStrategyMeta = Pick<UseInfiniteStrategyInput, "isFetching" | "isFetchingNextPage" | "total" | "cursor" | "fetchNextPage">;
+declare function useInfiniteStrategy({
+  cursor,
+  total,
+  fetchNextPage,
+  isFetching,
+  isFetchingNextPage
+}: UseInfiniteStrategyInput): TableStrategy;
+//#endregion
+export { InfiniteStrategyMeta, UseInfiniteStrategyInput, useInfiniteStrategy };

package/dist/src/modules/data-tables/strategies/infinite/strategy.mjs

@@ -0,0 +1,50 @@
+"use client";
+
+import { tableSearchParams } from "../../lib/search-params.mjs";
+import { handleSortingChange } from "../helpers/sorting.mjs";
+import { useQueryStates } from "nuqs";
+
+//#region src/modules/data-tables/strategies/infinite/strategy.ts
+function useInfiniteStrategy({ cursor, total, fetchNextPage, isFetching, isFetchingNextPage }) {
+	const [query, setQuery] = useQueryStates(tableSearchParams);
+	const paginationState = {
+		pageIndex: cursor ?? 0,
+		pageSize: query.limit
+	};
+	const sortingState = query.sort ? [{
+		id: query.sort,
+		desc: query.order === "desc"
+	}] : [];
+	const resetCursor = () => null;
+	return {
+		name: "infinite",
+		rowCount: total,
+		paginationState,
+		manualPagination: true,
+		onPaginationChange: (updater) => {
+			const newState = typeof updater === "function" ? updater(paginationState) : updater;
+			setQuery({ limit: newState.pageSize });
+			fetchNextPage();
+			return newState;
+		},
+		resetCursor,
+		tableSearchParams,
+		sortingState,
+		manualSorting: true,
+		onSortingChange: handleSortingChange({
+			sortingState,
+			setQuery,
+			resetCursor
+		}),
+		meta: {
+			total,
+			cursor,
+			fetchNextPage,
+			isFetching,
+			isFetchingNextPage
+		}
+	};
+}
+
+//#endregion
+export { useInfiniteStrategy };

package/dist/src/modules/data-tables/strategies/local/components.mjs

@@ -0,0 +1,25 @@
+"use client";
+
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/modules/data-tables/strategies/local/components.tsx
+function LocalTableFooter({ table }) {
+	const selected = Object.keys(table.getState().rowSelection).length;
+	const total = table.getRowCount();
+	return /* @__PURE__ */ jsx("div", {
+		className: "flex flex-col gap-y-2 px-2 md:flex-row md:items-center md:justify-between",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "text-muted-foreground text-sm",
+			children: [
+				selected ?? table.getFilteredSelectedRowModel().rows.length,
+				" of",
+				" ",
+				total ?? table.getRowModel().rows.length,
+				" row(s) selected."
+			]
+		})
+	});
+}
+
+//#endregion
+export { LocalTableFooter };

package/dist/src/modules/data-tables/strategies/local/strategy.d.mts

@@ -0,0 +1,12 @@
+import { TableStrategy } from "../../lib/types.mjs";
+
+//#region src/modules/data-tables/strategies/local/strategy.d.ts
+type UseLocalStrategyInput = {
+  total?: number;
+};
+type LocalStrategy = typeof useLocalStrategy;
+declare function useLocalStrategy({
+  total
+}?: UseLocalStrategyInput): TableStrategy;
+//#endregion
+export { LocalStrategy, UseLocalStrategyInput, useLocalStrategy };

package/dist/src/modules/data-tables/strategies/local/strategy.mjs

@@ -0,0 +1,31 @@
+"use client";
+
+import { tableSearchParams } from "../../lib/search-params.mjs";
+import { handleSortingChange } from "../helpers/sorting.mjs";
+import { useQueryStates } from "nuqs";
+
+//#region src/modules/data-tables/strategies/local/strategy.ts
+function useLocalStrategy({ total } = {}) {
+	const [query, setQuery] = useQueryStates(tableSearchParams);
+	const sortingState = query.sort ? [{
+		id: query.sort,
+		desc: query.order === "desc"
+	}] : [];
+	const resetCursor = () => null;
+	return {
+		name: "local",
+		rowCount: total,
+		resetCursor,
+		tableSearchParams,
+		sortingState,
+		manualSorting: true,
+		onSortingChange: handleSortingChange({
+			sortingState,
+			setQuery,
+			resetCursor
+		})
+	};
+}
+
+//#endregion
+export { useLocalStrategy };

package/dist/src/modules/data-tables/strategies/pagination/components.mjs

@@ -0,0 +1,131 @@
+"use client";
+
+import { Button } from "../../../../components/ui/button.mjs";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../../../components/ui/select.client.mjs";
+import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight, XIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/modules/data-tables/strategies/pagination/components.tsx
+function PaginationTableFooter({ table }) {
+	const selected = Object.keys(table.getState().rowSelection).length;
+	const total = table.getRowCount();
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-y-4 px-2 md:flex-row md:items-center md:justify-between",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2",
+			children: [selected > 0 && /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				size: "icon",
+				variant: "ghost",
+				className: "h-4 w-4 rounded-full",
+				onClick: () => table.resetRowSelection(),
+				children: /* @__PURE__ */ jsx(XIcon, { className: "h-2 w-2" })
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex-1 text-muted-foreground text-sm",
+				children: [
+					selected ?? table.getFilteredSelectedRowModel().rows.length,
+					" of",
+					" ",
+					total ?? table.getFilteredRowModel().rows.length,
+					" row(s) selected."
+				]
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center justify-between gap-x-6 md:justify-start lg:space-x-8",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "hidden items-center space-x-2 md:flex",
+					children: [/* @__PURE__ */ jsx("p", {
+						className: "font-medium text-sm",
+						children: "Rows per page"
+					}), /* @__PURE__ */ jsxs(Select, {
+						value: `${table.getState().pagination.pageSize}`,
+						onValueChange: (value) => {
+							table.setPageSize(Number(value));
+						},
+						children: [/* @__PURE__ */ jsx(SelectTrigger, {
+							className: "h-8 w-[70px]",
+							children: /* @__PURE__ */ jsx(SelectValue, { placeholder: table.getState().pagination.pageSize })
+						}), /* @__PURE__ */ jsx(SelectContent, {
+							side: "top",
+							children: [
+								10,
+								20,
+								30,
+								40,
+								50,
+								100,
+								300,
+								500
+							].map((pageSize) => /* @__PURE__ */ jsx(SelectItem, {
+								value: `${pageSize}`,
+								children: pageSize
+							}, pageSize))
+						})]
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex items-center justify-center font-medium text-sm",
+					children: [
+						"Page ",
+						table.getState().pagination.pageIndex + 1,
+						" of ",
+						table.getPageCount()
+					]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex items-center space-x-2",
+					children: [
+						/* @__PURE__ */ jsxs(Button, {
+							type: "button",
+							variant: "outline",
+							className: "hidden h-8 w-8 p-0 lg:flex",
+							onClick: () => table.setPageIndex(0),
+							disabled: !table.getCanPreviousPage(),
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "sr-only",
+								children: "Go to first page"
+							}), /* @__PURE__ */ jsx(ChevronsLeft, { className: "h-4 w-4" })]
+						}),
+						/* @__PURE__ */ jsxs(Button, {
+							type: "button",
+							variant: "outline",
+							className: "h-8 w-8 p-0",
+							onClick: () => table.previousPage(),
+							disabled: !table.getCanPreviousPage(),
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "sr-only",
+								children: "Go to previous page"
+							}), /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })]
+						}),
+						/* @__PURE__ */ jsxs(Button, {
+							type: "button",
+							variant: "outline",
+							className: "h-8 w-8 p-0",
+							onClick: () => table.nextPage(),
+							disabled: !table.getCanNextPage(),
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "sr-only",
+								children: "Go to next page"
+							}), /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })]
+						}),
+						/* @__PURE__ */ jsxs(Button, {
+							type: "button",
+							variant: "outline",
+							className: "hidden h-8 w-8 p-0 lg:flex",
+							onClick: () => table.setPageIndex(table.getPageCount() - 1),
+							disabled: !table.getCanNextPage(),
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "sr-only",
+								children: "Go to last page"
+							}), /* @__PURE__ */ jsx(ChevronsRight, { className: "h-4 w-4" })]
+						})
+					]
+				})
+			]
+		})]
+	});
+}
+
+//#endregion
+export { PaginationTableFooter };

package/dist/src/modules/data-tables/strategies/pagination/strategy.d.mts

@@ -0,0 +1,12 @@
+import { TableStrategy } from "../../lib/types.mjs";
+
+//#region src/modules/data-tables/strategies/pagination/strategy.d.ts
+type UsePaginationStrategyInput = {
+  total: number | undefined;
+};
+type PaginationStrategy = typeof usePaginationStrategy;
+declare function usePaginationStrategy({
+  total
+}: UsePaginationStrategyInput): TableStrategy;
+//#endregion
+export { PaginationStrategy, UsePaginationStrategyInput, usePaginationStrategy };

package/dist/src/modules/data-tables/strategies/pagination/strategy.mjs

@@ -0,0 +1,45 @@
+"use client";
+
+import { tableSearchParams } from "../../lib/search-params.mjs";
+import { handleSortingChange } from "../helpers/sorting.mjs";
+import { useQueryStates } from "nuqs";
+
+//#region src/modules/data-tables/strategies/pagination/strategy.ts
+function usePaginationStrategy({ total }) {
+	const [query, setQuery] = useQueryStates(tableSearchParams);
+	const paginationState = {
+		pageIndex: query.cursor,
+		pageSize: query.limit
+	};
+	const sortingState = query.sort ? [{
+		id: query.sort,
+		desc: query.order === "desc"
+	}] : [];
+	const resetCursor = () => 0;
+	return {
+		name: "pagination",
+		rowCount: total,
+		paginationState,
+		manualPagination: true,
+		onPaginationChange: (updater) => {
+			const newState = typeof updater === "function" ? updater(paginationState) : updater;
+			setQuery({
+				cursor: Math.max(newState.pageIndex, 0),
+				limit: newState.pageSize
+			});
+			return newState;
+		},
+		tableSearchParams,
+		resetCursor,
+		sortingState,
+		manualSorting: true,
+		onSortingChange: handleSortingChange({
+			sortingState,
+			setQuery,
+			resetCursor
+		})
+	};
+}
+
+//#endregion
+export { usePaginationStrategy };

package/dist/src/modules/data-tables/tables/data-table/components/body.mjs

@@ -0,0 +1,32 @@
+"use client";
+
+import { Allowed } from "../../../../auth/components/allowed.client.mjs";
+import { TableBody, TableCell, TableRow } from "../../../components/table.mjs";
+import { DataTableRow } from "./row.mjs";
+import { Fragment, jsx } from "react/jsx-runtime";
+import { flexRender } from "@tanstack/react-table";
+
+//#region src/modules/data-tables/tables/data-table/components/body.tsx
+function DataTableBody({ table }) {
+	const { rows } = table.getRowModel();
+	return /* @__PURE__ */ jsx(TableBody, { children: table.getRowModel().rows?.length ? rows.map((row) => /* @__PURE__ */ jsx(DataTableRow, {
+		row,
+		table,
+		children: row.getVisibleCells().map((cell) => {
+			const columnDef = cell.column.columnDef;
+			const children = flexRender(cell.column.columnDef.cell, cell.getContext());
+			if (!columnDef.permissions) return /* @__PURE__ */ jsx(Fragment, { children }, cell.id);
+			return /* @__PURE__ */ jsx(Allowed, {
+				permission: columnDef.permissions,
+				children
+			}, cell.id);
+		})
+	}, row.id)) : /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, {
+		colSpan: table.getAllFlatColumns().length,
+		className: "h-24 text-center",
+		children: "Geen resultaten gevonden"
+	}) }) });
+}
+
+//#endregion
+export { DataTableBody };

package/dist/src/modules/data-tables/tables/data-table/components/header.mjs

@@ -0,0 +1,12 @@
+"use client";
+
+import { TableHeader, TableHeaderCell, TableHeaderRow } from "../../../components/header.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/modules/data-tables/tables/data-table/components/header.tsx
+function DataTableHeader({ table }) {
+	return /* @__PURE__ */ jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(TableHeaderRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(TableHeaderCell, { header }, header.id)) }, headerGroup.id)) });
+}
+
+//#endregion
+export { DataTableHeader };

package/dist/src/modules/data-tables/tables/data-table/components/row.mjs

@@ -0,0 +1,13 @@
+import { TableRow } from "../../../components/table.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/modules/data-tables/tables/data-table/components/row.tsx
+function DataTableRow({ row, table, className, ...props }) {
+	return /* @__PURE__ */ jsx(TableRow, {
+		...props,
+		"data-state": row.getIsSelected() && "selected"
+	});
+}
+
+//#endregion
+export { DataTableRow };

package/dist/src/modules/data-tables/tables/data-table/components/table.d.mts

@@ -0,0 +1,8 @@
+import { Table } from "../../../components/table.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { ComponentProps } from "react";
+
+//#region src/modules/data-tables/tables/data-table/components/table.d.ts
+declare function DataTable<TData>(props: ComponentProps<typeof Table>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { DataTable };

package/dist/src/modules/data-tables/tables/data-table/components/table.mjs

@@ -0,0 +1,42 @@
+"use client";
+
+import { FloatingCommandMenu } from "../../../../commands/components/menus/floating-menu.client.mjs";
+import { Table } from "../../../components/table.mjs";
+import { useTable } from "../../../hooks/use-table.client.mjs";
+import { TableBottombar, TableFooter } from "../../../components/footer.mjs";
+import { DataTableBody } from "./body.mjs";
+import { DataTableHeader } from "./header.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/modules/data-tables/tables/data-table/components/table.tsx
+function DataTable(props) {
+	const table = useTable();
+	const meta = table.options.meta;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-4",
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "rounded-md border",
+				children: /* @__PURE__ */ jsxs(Table, {
+					...props,
+					children: [
+						/* @__PURE__ */ jsx(DataTableHeader, { table }),
+						/* @__PURE__ */ jsx(DataTableBody, { table }),
+						/* @__PURE__ */ jsx(TableFooter, { table })
+					]
+				})
+			}),
+			/* @__PURE__ */ jsx(TableBottombar, { table }),
+			meta.commands && /* @__PURE__ */ jsx(FloatingCommandMenu, {
+				data: meta.selectedData,
+				commands: meta.commands,
+				meta,
+				state: meta.selectedData?.length ? "open" : "closed",
+				onSuccess: () => table.resetRowSelection()
+			})
+		]
+	});
+}
+
+//#endregion
+export { DataTable };

package/dist/src/modules/data-tables/tables/inline-table/components/body.mjs

@@ -0,0 +1,69 @@
+"use client";
+
+import { Allowed } from "../../../../auth/components/allowed.client.mjs";
+import { TableBody, TableCell, TableRow } from "../../../components/table.mjs";
+import { useInlineTableContext } from "../hooks/context.client.mjs";
+import { useInlineDataTableHotkeys } from "../hooks/use-hotkeys.client.mjs";
+import { InlineTableRow } from "./row.client.mjs";
+import { Fragment, jsx } from "react/jsx-runtime";
+import { flexRender } from "@tanstack/react-table";
+import { SortableContext, rectSortingStrategy, sortableKeyboardCoordinates } from "@dnd-kit/sortable";
+import { DndContext, KeyboardSensor, PointerSensor, closestCenter, useDroppable, useSensor, useSensors } from "@dnd-kit/core";
+import { restrictToParentElement, restrictToVerticalAxis } from "@dnd-kit/modifiers";
+
+//#region src/modules/data-tables/tables/inline-table/components/body.tsx
+function InlineTableBody({ table }) {
+	const context = useInlineTableContext();
+	const { rows } = table.getRowModel();
+	const { setNodeRef } = useDroppable({ id: "inline-data-table" });
+	const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
+	useInlineDataTableHotkeys(context.hotkeys);
+	if (rows?.length === 0) return /* @__PURE__ */ jsx(TableBody, { children: /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, {
+		colSpan: table.getAllFlatColumns().length + 1 + (context.isDraggable ? 1 : 0) + (table.options.enableRowSelection ? 1 : 0),
+		className: "h-24 text-center",
+		children: "Geen resultaten gevonden"
+	}) }) });
+	function handleDragEnd(event) {
+		if (!context.isDraggable) return;
+		const { active, over } = event;
+		if (active.id !== over?.id) {
+			const fromIndex = rows.findIndex((item) => item.id === active.id);
+			const toIndex = rows.findIndex((item) => item.id === over?.id);
+			context.moveRow({
+				fromIndex,
+				toIndex
+			});
+		}
+	}
+	return /* @__PURE__ */ jsx(DndContext, {
+		sensors,
+		onDragEnd: handleDragEnd,
+		collisionDetection: closestCenter,
+		modifiers: [restrictToVerticalAxis, restrictToParentElement],
+		children: /* @__PURE__ */ jsx(SortableContext, {
+			items: rows.map((row) => row.id),
+			strategy: rectSortingStrategy,
+			children: /* @__PURE__ */ jsx(TableBody, {
+				ref: setNodeRef,
+				children: rows.map((row) => /* @__PURE__ */ jsx(InlineTableRow, {
+					row,
+					"data-row-id": row.id,
+					table,
+					className: "relative",
+					children: row.getVisibleCells().map((cell) => {
+						const columnDef = cell.column.columnDef;
+						const children = flexRender(cell.column.columnDef.cell, cell.getContext());
+						if (!columnDef.permissions) return /* @__PURE__ */ jsx(Fragment, { children }, cell.id);
+						return /* @__PURE__ */ jsx(Allowed, {
+							permission: columnDef.permissions,
+							children
+						}, cell.id);
+					})
+				}, row.id))
+			})
+		})
+	});
+}
+
+//#endregion
+export { InlineTableBody };

package/dist/src/modules/data-tables/tables/inline-table/components/cells/common.d.mts

@@ -0,0 +1,11 @@
+import { TableCell } from "../../../../components/table.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as React$1 from "react";
+
+//#region src/modules/data-tables/tables/inline-table/components/cells/common.d.ts
+declare function TableInlineCell({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof TableCell>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TableInlineCell };

package/dist/src/modules/data-tables/tables/inline-table/components/cells/common.mjs

@@ -0,0 +1,14 @@
+import { cn } from "../../../../../../lib/utils/cn.mjs";
+import { TableCell } from "../../../../components/table.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/modules/data-tables/tables/inline-table/components/cells/common.tsx
+function TableInlineCell({ className, ...props }) {
+	return /* @__PURE__ */ jsx(TableCell, {
+		className: cn("h-8 border-l p-0 align-middle first:border-0 focus-within:bg-accent focus-within:text-accent-foreground [&:has([role=checkbox])]:pr-0", className),
+		...props
+	});
+}
+
+//#endregion
+export { TableInlineCell };

package/dist/src/modules/data-tables/tables/inline-table/components/cells/drag-handle.client.d.mts

@@ -0,0 +1,24 @@
+import { TableColumnDef } from "../../../../lib/types.mjs";
+import "../../../../../../../data-tables.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { CellContext } from "@tanstack/react-table";
+
+//#region src/modules/data-tables/tables/inline-table/components/cells/drag-handle.client.d.ts
+/**
+ * Create a new column with the drag handle
+ */
+type TableDragHandleProps<TData, TValue> = Pick<CellContext<TData, TValue>, "row"> & {
+  className?: string;
+  disabled?: boolean;
+};
+declare function TableDragHandle<TData, TValue>({
+  row,
+  className,
+  disabled
+}: TableDragHandleProps<TData, TValue>): react_jsx_runtime0.JSX.Element;
+/**
+ * Create a new column with the drag handle
+ */
+declare const createTableDragHandleCell: <TData>(newColumn?: Partial<TableColumnDef<TData>>) => TableColumnDef<TData>;
+//#endregion
+export { TableDragHandle, TableDragHandleProps, createTableDragHandleCell };