@grasp-labs/ds-react-components 0.14.0 → 0.15.0

package/dist/components/drawer/Drawer.d.ts

@@ -4,10 +4,11 @@ export type DrawerProps = {
     onClose: () => void;
     placement?: "top" | "right" | "bottom" | "left";
     size?: "sm" | "lg";
+    portalContainer?: HTMLElement | null;
     closeOnBackdropClick?: boolean;
     showClose?: boolean;
     closeButtonAriaLabel?: string;
     drawerClassName?: string;
     backdropClassName?: string;
 } & Omit<CardProps, "className">;
-export declare function Drawer({ isOpen, onClose, placement, size, closeOnBackdropClick, showClose, closeButtonAriaLabel, drawerClassName, backdropClassName, title, headerActions, footerActions, children, headerClassName, bodyClassName, footerClassName, }: DrawerProps): import("react/jsx-runtime").JSX.Element;
+export declare function Drawer({ isOpen, onClose, placement, size, closeOnBackdropClick, showClose, closeButtonAriaLabel, drawerClassName, backdropClassName, title, headerActions, footerActions, portalContainer, children, headerClassName, bodyClassName, footerClassName, }: DrawerProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,12 +1,5 @@
 import { JSX } from 'react';
 import { TableProps } from './types';
-/**
- * A customizable table component using TanStack Table.
- *
- * @template T - The row data type.
- * @param {TableProps<T>} props - The table props.
- * @returns {JSX.Element} The rendered table.
- */
 declare function Table<T extends {
     id?: string | number;
 }>({ data, columns, className, scrollWrapperClassName, getCoreRowModel, enableRowSelection, enableMultiRowSelection, enablePagination, paginationProps, ...options }: TableProps<T>): JSX.Element;

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

@@ -1,16 +1,51 @@
-import { PaginationState, TableOptions } from '@tanstack/react-table';
-export type TableProps<T> = Omit<TableOptions<T>, "state" | "getCoreRowModel" | "onPaginationChange" | "getPaginationRowModel" | "manualPagination" | "pageCount" | "autoResetPageIndex" | "onSortingChange" | "onRowSelectionChange"> & {
+import { TableOptions } from '@tanstack/react-table';
+/**
+ * Props for the Table component.
+ * Supports both controlled and uncontrolled modes for sorting, selection, and pagination.
+ *
+ * @template T - The row data type.
+ *
+ * @example
+ * // Uncontrolled (component manages state internally via TanStack Table)
+ * <Table data={data} columns={columns} />
+ *
+ * @example
+ * // Controlled selection
+ * <Table
+ *   data={data}
+ *   columns={columns}
+ *   enableRowSelection
+ *   state={{ rowSelection }}
+ *   onRowSelectionChange={setRowSelection}
+ * />
+ *
+ * @example
+ * // Server-side pagination
+ * <Table
+ *   data={data}
+ *   columns={columns}
+ *   enablePagination
+ *   state={{ pagination }}
+ *   onPaginationChange={setPagination}
+ *   paginationProps={{ mode: 'server', totalItems: 1000 }}
+ * />
+ */
+export type TableProps<T> = Omit<TableOptions<T>, "getCoreRowModel" | "getSortedRowModel" | "getPaginationRowModel" | "manualPagination" | "pageCount" | "autoResetPageIndex"> & {
     className?: string;
     scrollWrapperClassName?: string;
     getCoreRowModel?: TableOptions<T>["getCoreRowModel"];
     enablePagination?: boolean;
     paginationProps?: {
+        mode?: "client";
         itemsPerPageOptions?: number[];
-        pagination?: PaginationState;
-        onPaginationChange?: (pagination: PaginationState) => void;
-        totalItems?: number;
         itemsPerPageText?: string;
         fromText?: string;
+        totalItems?: never;
+    } | {
+        mode: "server";
+        itemsPerPageOptions?: number[];
+        itemsPerPageText?: string;
+        fromText?: string;
+        totalItems: number;
     };
-    state?: Omit<TableOptions<T>["state"], "sorting" | "rowSelection" | "pagination">;
 };

package/dist/hooks/useDropdownPosition.d.ts

@@ -1,6 +1,7 @@
 import { RefObject } from 'react';
 export type DropdownPosition = {
-    top: number;
+    top?: number;
+    bottom?: number;
     left: number;
     width: number;
 };