gantri-components 2.34.0-beta.2 → 2.34.0-beta.20

package/dist/components/table/components/table-actions-wrapper/table-actions-wrapper.d.ts

@@ -1,30 +1,4 @@
-import { JSXElementConstructor, PropsWithChildren } from 'react';
-import { PagingProps } from '../../../paging/paging.types';
-import { SortProps } from './components/sort/sort.types';
-export type FiltersProps = {
-    FiltersContent: JSX.Element;
-    count: number;
-    numActive: number;
-    onApply: () => void;
-    onClose: () => void;
-    onReset: () => void;
-};
-export interface SearchProps {
-    onSearch: (value: string) => void;
-    placeholder?: string;
-    value: string;
-}
-export interface CustomActionProps {
-    Component: JSXElementConstructor<Record<never, never>>;
-    position?: 'left' | 'right';
-}
-interface TableActionsWrapperProps {
-    customAction: CustomActionProps | undefined;
-    filters: FiltersProps | undefined;
-    paging: PagingProps | undefined;
-    search: SearchProps | undefined;
-    sorting: SortProps | undefined;
-}
+import { PropsWithChildren } from 'react';
+import { TableActionsWrapperProps } from './table-actions-wrapper.types';
 /** Wraps the table with relevant components for paging, filters, sort, and table actions. */
 export declare const TableActionsWrapper: (props: PropsWithChildren<TableActionsWrapperProps>) => JSX.Element;
-export {};

package/dist/components/table/components/table-actions-wrapper/table-actions-wrapper.types.d.ts

@@ -0,0 +1,28 @@
+import { JSXElementConstructor } from 'react';
+import { PagingProps } from '../../../paging/paging.types';
+import { SortProps } from './components/sort/sort.types';
+export type FiltersProps = {
+    count: number;
+    filtersContent: JSX.Element;
+    numActive: number;
+    onApply: () => void;
+    onClose: () => void;
+    onReset: () => void;
+};
+export interface SearchProps {
+    onSearch: (value: string) => void;
+    placeholder?: string;
+    value: string;
+}
+export interface CustomActionProps {
+    Component: JSXElementConstructor<Record<never, never>>;
+    position?: 'left' | 'right';
+}
+export interface TableActionsWrapperProps {
+    className: string | undefined;
+    customAction: CustomActionProps | undefined;
+    filters: FiltersProps | undefined;
+    paging: PagingProps | undefined;
+    search: SearchProps | undefined;
+    sorting: SortProps | undefined;
+}

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

@@ -1,3 +1,7 @@
-import { BaseDataType } from '../../table.types';
+import { RowData } from '@tanstack/react-table';
 import { TableFooterProps } from './table-footer.types';
-export declare const TableFooter: <DataType extends BaseDataType>(props: TableFooterProps<DataType>) => JSX.Element;
+export declare const TableFooter: <DataType extends RowData<{
+    [key: string]: unknown;
+    id: string | number;
+    subRows?: any[] | undefined;
+}>>(props: TableFooterProps<DataType>) => JSX.Element;

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

@@ -1,5 +1,4 @@
-import { Table } from '@tanstack/react-table';
-import { BaseDataType } from '../../table.types';
-export type TableFooterProps<DataType extends BaseDataType> = {
+import { RowData, Table } from '@tanstack/react-table';
+export type TableFooterProps<DataType extends RowData> = {
     table: Table<DataType>;
 };

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

@@ -1,3 +1,7 @@
-import { BaseDataType } from '../../table.types';
+import { RowData } from '@tanstack/react-table';
 import { TableHeaderProps } from './table-header.types';
-export declare const TableHeader: <DataType extends BaseDataType>(props: TableHeaderProps<DataType>) => JSX.Element;
+export declare const TableHeader: <DataType extends RowData<{
+    [key: string]: unknown;
+    id: string | number;
+    subRows?: any[] | undefined;
+}>>(props: TableHeaderProps<DataType>) => JSX.Element;

package/dist/components/table/components/table-header/table-header.styles.d.ts

@@ -0,0 +1,3 @@
+export declare const StyledTH: import("styled-components").StyledComponent<"th", import("styled-components").DefaultTheme, {
+    size: number;
+}, never>;

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

@@ -1,5 +1,6 @@
-import { Table } from '@tanstack/react-table';
-import { BaseDataType } from '../../table.types';
-export type TableHeaderProps<DataType extends BaseDataType> = {
+import { RowData, Table } from '@tanstack/react-table';
+import { GetHeaderCellProps } from '../../table.types';
+export type TableHeaderProps<DataType extends RowData> = {
+    getHeaderCellProps: GetHeaderCellProps<DataType> | undefined;
     table: Table<DataType>;
 };

package/dist/components/table/components/table-row/hooks/use-drag-and-drop/use-drag-and-drop.d.ts

@@ -1,7 +1,11 @@
 /// <reference types="react" />
-import { BaseDataType } from '../../../../table.types';
+import { RowData } from '@tanstack/react-table';
 import { UseDragAndDropProps } from './use-drag-and-drop.types';
-export declare const useDragAndDrop: <DataType extends BaseDataType>(props: UseDragAndDropProps<DataType>) => {
+export declare const useDragAndDrop: <DataType extends RowData<{
+    [key: string]: unknown;
+    id: string | number;
+    subRows?: any[] | undefined;
+}>>(props: UseDragAndDropProps<DataType>) => {
     dragAndDropRef: import("react").RefObject<HTMLTableRowElement>;
     isDragging: boolean;
 };

package/dist/components/table/components/table-row/hooks/use-drag-and-drop/use-drag-and-drop.types.d.ts

@@ -1,6 +1,5 @@
-import { Row } from '@tanstack/react-table';
-import { BaseDataType } from '../../../../table.types';
-export interface UseDragAndDropProps<DataType extends BaseDataType> {
+import { Row, RowData } from '@tanstack/react-table';
+export interface UseDragAndDropProps<DataType extends RowData> {
     enableReordering: boolean;
     handleOnReorder: () => Promise<void>;
     index: number;

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

@@ -1,3 +1,7 @@
-import { BaseDataType } from '../../table.types';
+import { RowData } from '@tanstack/react-table';
 import { TableRowProps } from './table-row.types';
-export declare const TableRow: <DataType extends BaseDataType>(props: TableRowProps<DataType>) => JSX.Element;
+export declare const TableRow: <DataType extends RowData<{
+    [key: string]: unknown;
+    id: string | number;
+    subRows?: any[] | undefined;
+}>>(props: TableRowProps<DataType>) => JSX.Element;

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

@@ -1,12 +1,12 @@
-import { Row } from '@tanstack/react-table';
-import { MouseEvent } from 'react';
-import { BaseDataType, CustomRowProps } from '../../table.types';
-export interface TableRowProps<DataType extends BaseDataType> {
+import { Row, RowData } from '@tanstack/react-table';
+import { CustomRowProps, GetCellProps, OnRowClick } from '../../table.types';
+export interface TableRowProps<DataType extends RowData> {
     customRowProps: CustomRowProps;
     enableReordering: boolean;
+    getCellProps: GetCellProps<DataType> | undefined;
     handleOnReorder: () => Promise<void>;
     index: number;
     moveRow: (startIndex: number, endIndex: number) => void;
-    onRowClick?: (data: Row<DataType>, event: MouseEvent<HTMLTableRowElement>) => void;
+    onRowClick?: OnRowClick<DataType>;
     row: Row<DataType>;
 }

package/dist/components/table/helpers/add-missing-ids/index.d.ts

@@ -1,3 +1,7 @@
-import { BaseDataType } from '../../table.types';
+import { RowData } from '@tanstack/react-table';
 /** If an index does not contain an `id` value, one is added using uuid. */
-export declare const addMissingIds: <DataType extends BaseDataType>(data: DataType[]) => DataType[];
+export declare const addMissingIds: <DataType extends RowData<{
+    [key: string]: unknown;
+    id: string | number;
+    subRows?: any[] | undefined;
+}>>(data: DataType[]) => DataType[];

package/dist/components/table/helpers/hyphenate-column-id/hyphenate-column-id.d.ts

@@ -0,0 +1 @@
+export declare const hyphenateColumnId: ((id: string) => string) & import("lodash").MemoizedFunction;

package/dist/components/table/helpers/hyphenate-column-id/index.d.ts

@@ -0,0 +1 @@
+export * from './hyphenate-column-id';

package/dist/components/table/hooks/use-move-row/index.d.ts

@@ -0,0 +1 @@
+export * from './use-move-row';

package/dist/components/table/hooks/use-move-row/use-move-row.d.ts

@@ -0,0 +1,9 @@
+import { RowData } from '@tanstack/react-table';
+import { UseMoveRowProps } from './use-move-row.types';
+export declare const useMoveRow: <TData extends RowData<{
+    [key: string]: unknown;
+    id: string | number;
+    subRows?: any[] | undefined;
+}>>(props: UseMoveRowProps<TData>) => {
+    moveRow: (startIndex: number, endIndex: number) => void;
+};

package/dist/components/table/hooks/use-move-row/use-move-row.types.d.ts

@@ -0,0 +1,5 @@
+import { RowData } from '@tanstack/react-table';
+import { Dispatch, SetStateAction } from 'react';
+export interface UseMoveRowProps<TData extends RowData> {
+    setData: Dispatch<SetStateAction<TData[]>>;
+}

package/dist/components/table/hooks/use-track-sticky-cells/index.d.ts

@@ -0,0 +1 @@
+export * from './use-track-sticky-cells';

package/dist/components/table/hooks/use-track-sticky-cells/use-track-sticky-cells.d.ts

@@ -0,0 +1,3 @@
+import { UseTrackStickyCellsProps } from './use-track-sticky-cells.types';
+/** Mark table if header and/or first column cells are sticky. */
+export declare const useTrackStickyCells: (props: UseTrackStickyCellsProps) => void;

package/dist/components/table/hooks/use-track-sticky-cells/use-track-sticky-cells.types.d.ts

@@ -0,0 +1,7 @@
+import { ColumnDef } from '@tanstack/react-table';
+export interface UseTrackStickyCellsProps {
+    columns: ColumnDef<any, any>[];
+    /** The containing element that the child will intersect with. */
+    root: Element | null;
+    stickyFirstColumn: boolean | undefined;
+}

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

@@ -1 +1,3 @@
 export * from './table';
+export * from './table.types';
+export * from './components/table-row/table-row.constants';

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

@@ -1,5 +1,10 @@
-import { BaseDataType, TableProps } from './table.types';
+import { RowData } from '@tanstack/react-table';
+import { TableProps } from './table.types';
 export declare const Table: {
-    <DataType extends BaseDataType>(props: TableProps<DataType>): JSX.Element;
+    <DataType extends RowData<{
+        [key: string]: unknown;
+        id: string | number;
+        subRows?: any[] | undefined;
+    }>>(props: TableProps<DataType>): JSX.Element;
     defaultProps: import("./table.types").TableDefaultProps;
 };

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

@@ -1,3 +1,4 @@
+export declare const StyledTableContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledTable: import("styled-components").StyledComponent<"table", import("styled-components").DefaultTheme, {
     stickyFirstColumn: boolean | undefined;
 }, never>;

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

@@ -1,32 +1,44 @@
-import { ColumnDef, Row, TableOptions } from '@tanstack/react-table';
+import { Cell, ColumnDef, Header, Row, RowData, TableOptions } from '@tanstack/react-table';
 import { HTMLAttributes, MouseEvent } from 'react';
 import { PagingProps } from '../paging/paging.types';
-import { CustomActionProps, FiltersProps, SearchProps } from './components/table-actions-wrapper';
+import { CustomActionProps, FiltersProps, SearchProps } from './components/table-actions-wrapper/table-actions-wrapper.types';
 import { SortProps } from './components/table-actions-wrapper/components/sort/sort.types';
-export interface BaseDataType {
-    [key: string]: unknown;
-    id?: string | number;
-    subRows?: BaseDataType[];
-}
-export interface TableProps<DataType extends BaseDataType> extends Partial<TableDefaultProps> {
+export interface TableProps<DataType extends RowData> extends Partial<TableDefaultProps> {
+    className?: string;
     columns: ColumnDef<DataType, any>[];
     customAction?: CustomActionProps;
+    /**
+     * For each index, if no `id` key exists, one will be assigned.
+     *
+     * To create collapsable rows, optionally provide the index with a `subRows` key. It should be an array of objects matching the expected data type.
+     */
     data: DataType[];
-    enableReordering?: boolean;
     filters?: FiltersProps;
+    getCellProps?: GetCellProps<DataType>;
+    getHeaderCellProps?: GetHeaderCellProps<DataType>;
     /** Include `status` in the returned value to set the row status color. */
-    getRowProps?: (row: Row<DataType>, rows: Row<DataType>[]) => CustomRowProps;
-    onReorder?: (data: DataType[]) => Promise<void>;
-    onRowClick?: (data: Row<DataType>, event: MouseEvent<HTMLTableRowElement>) => void;
+    getRowProps?: GetRowProps<DataType>;
+    onRowClick?: OnRowClick<DataType>;
+    /** Any options provided are passed to `useReactTable` and may override default values. */
     options?: Partial<TableOptions<DataType>>;
     paging?: PagingProps;
+    reordering?: {
+        enable: boolean;
+        onReorder: (data: DataType[]) => Promise<void>;
+    };
     search?: SearchProps;
     sorting?: SortProps;
 }
 export interface TableDefaultProps {
     stickyFirstColumn: boolean;
 }
-export interface CustomRowProps extends HTMLAttributes<HTMLTableRowElement> {
+export type GetHeaderCellProps<DataType extends RowData> = (cell?: Header<DataType, unknown>) => CustomCellProps;
+export type GetRowProps<DataType extends RowData> = (row?: Row<DataType>, rows?: Row<DataType>[]) => CustomRowProps;
+export type GetCellProps<DataType extends RowData> = (cell?: Cell<DataType, unknown>) => CustomCellProps;
+export type OnRowClick<DataType extends RowData> = (data: Row<DataType>, event: MouseEvent<HTMLTableRowElement>) => void;
+export interface CustomRowProps extends Record<string, unknown>, HTMLAttributes<HTMLTableRowElement> {
     status?: RowStatusValue | undefined;
 }
+export interface CustomCellProps extends Record<string, unknown>, HTMLAttributes<HTMLTableCellElement> {
+}
 export type RowStatusValue = 'handled' | 'next' | 'error' | 'warning';

package/dist/helpers/mark-sticky-elements/mark-sticky-elements.d.ts

@@ -7,12 +7,14 @@ import { MarkStickyElementsArgs } from './mark-sticky-elements.types';
  *   const elementsToObserve = Array.from(
  *     document.querySelectorAll('tr td:first-child'),
  *   );
+ *   const root = [document.querySelector('[data-table-container]')];
  *   const stickyTo = 'left';
  *
  *    const { cleanupUseEffect } = markStickyElements({
  *     attrToApply: `${dataAttrIsSticky}-${stickyTo}`,
  *     elementsToMark,
  *     elementsToObserve,
+ *     root,
  *     stickyTo,
  *   });
  *

package/dist/helpers/mark-sticky-elements/mark-sticky-elements.types.d.ts

@@ -16,7 +16,7 @@ export interface StickyElementsDetails {
      */
     elementsToObserve: Element[];
     /**
-     * Value passed to IntersectionObserver options.
+     * The containing element that the child will intersect with. Value is passed to IntersectionObserver options.
      *
      * https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver/root
      * */