@tsed/react-formio 2.0.2 → 2.1.0

package/coverage.json

@@ -1,6 +1,6 @@
 {
-  "statements": 57.05,
-  "branches": 47.58,
-  "functions": 51.6,
-  "lines": 57.04
+  "statements": 56.11,
+  "branches": 46.65,
+  "functions": 51.31,
+  "lines": 56.1
 }

package/dist/components/actions-table/actionsTable.component.d.ts

@@ -1,5 +1,5 @@
 import { ActionSchema } from "../../interfaces";
-import { TableProps } from "../table/table.component";
+import { TableProps } from "../table/hooks/useCustomTable.hook";
 export declare type ActionsTableProps = Omit<TableProps<ActionSchema>, "columns"> & {
     onAddAction?: (actionName: string) => void;
     availableActions?: {

package/dist/components/form-access/formAccess.component.d.ts

@@ -1,6 +1,6 @@
 import PropTypes from "prop-types";
 import { PropsWithChildren, ReactElement } from "react";
-import { FormOptions, FormSchema } from "../../interfaces";
+import type { FormOptions, FormSchema } from "../../interfaces";
 export interface FormAccessProps {
     form: Partial<FormSchema>;
     roles: any;

package/dist/components/form-edit/formEdit.stories.d.ts

@@ -1,4 +1,4 @@
-import { FormEdit } from "../../index";
+import { FormEdit } from "./formEdit.component";
 declare const _default: {
     title: string;
     component: typeof FormEdit;

package/dist/components/forms-table/formsTable.component.d.ts

@@ -1,5 +1,5 @@
 import { FormSchema } from "../../interfaces";
-import { TableProps } from "../table/table.component";
+import { TableProps } from "../table/hooks/useCustomTable.hook";
 export declare type FormsTableProps = Omit<TableProps<FormSchema>, "columns"> & {
     icon?: string;
     tags?: {

package/dist/components/submissions-table/submissionsTable.component.d.ts

@@ -1,5 +1,5 @@
 import { FormSchema, Submission } from "../../interfaces";
-import { TableProps } from "../table/table.component";
+import { TableProps } from "../table/hooks/useCustomTable.hook";
 export declare type SubmissionsTableProps = Omit<TableProps<Submission>, "columns"> & {
     form?: FormSchema;
 };

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

@@ -0,0 +1,4 @@
+import { Row } from "react-table";
+export declare function DefaultCells<Data extends object = {}>({ row }: {
+    row: Row<Data>;
+}): JSX.Element;

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

@@ -0,0 +1,12 @@
+import { DetailedHTMLProps, HTMLAttributes } from "react";
+import { Row } from "react-table";
+export interface DefaultRowProps<Data extends object = {}> extends Omit<DetailedHTMLProps<HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "onClick" | "onDrag" | "onDrop"> {
+    onClick: (data: any, action: string) => void;
+    row: Row<Data>;
+    index: number;
+    onDrop: (item: Data) => void;
+    onDrag: (index: number, hoverIndex: number) => void;
+    enableDragNDrop?: boolean;
+}
+export declare function DefaultDndRow<Data extends object = {}>(props: DefaultRowProps<Data>): JSX.Element;
+export declare function DefaultRow<Data extends object = {}>({ onClick, row, enableDragNDrop, onDrop, onDrag, ...props }: DefaultRowProps<Data>): JSX.Element;

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

@@ -0,0 +1,4 @@
+import { PropsWithChildren } from "react";
+export declare function DrapNDropContainer({ enableDragNDrop, children }: PropsWithChildren<{
+    enableDragNDrop?: boolean;
+}>): JSX.Element;

package/dist/components/table/hooks/useCustomTable.hook.d.ts

@@ -0,0 +1,187 @@
+import React, { PropsWithChildren } from "react";
+import { CellProps, FilterProps, Renderer, TableOptions } from "react-table";
+import { OnClickOperation, Operation, QueryOptions } from "../../../interfaces";
+import { Pagination as DefaultPagination } from "../../pagination/pagination.component";
+import { DefaultCellHeaderProps } from "../components/defaultCellHeader.component";
+import { DefaultRow, DefaultRowProps } from "../components/defaultRow.component";
+export interface TableProps<Data extends object = any> extends TableOptions<Data>, Partial<QueryOptions> {
+    className?: string;
+    /**
+     * Call the listener when a filter / pagination  / sort change.
+     */
+    onChange?: (query: QueryOptions) => void;
+    /**
+     * Call the listener when a line is clicked.
+     */
+    onClick?: OnClickOperation<Data>;
+    /**
+     * Pagination steps list
+     */
+    pageSizes?: number[];
+    /**
+     *
+     */
+    isLoading?: boolean;
+    /**
+     * Custom EmptyData displayed when there is no data
+     */
+    EmptyData?: React.ComponentType;
+    /**
+     * Custom ArrowSort
+     */
+    ArrowSort?: React.ComponentType;
+    /**
+     * Custom default ColumnFilter
+     */
+    ColumnFilter?: Renderer<FilterProps<Data>>;
+    /**
+     * Custom cell
+     */
+    Cell?: React.ComponentType<CellProps<Data>>;
+    /**
+     * Custom Row
+     */
+    Row?: React.ComponentType<DefaultRowProps<Data>>;
+    /**
+     *
+     */
+    CellHeader?: React.ComponentType<DefaultCellHeaderProps<Data>>;
+    /**
+     *
+     */
+    CellOperations?: React.ComponentType;
+    /**
+     * Custom Loader
+     */
+    Loader?: React.ComponentType;
+    /**
+     * Custom Loader
+     */
+    Pagination?: React.ComponentType;
+    /**
+     * Disable filters
+     */
+    disableFilters?: boolean;
+    /**
+     * Disable pagination
+     */
+    disablePagination?: boolean;
+    manualPagination?: boolean;
+    manualSortBy?: boolean;
+    manualFilters?: boolean;
+    /**
+     * Configuration operation for each line.
+     */
+    operations?: Operation[];
+    i18n?: (f: string) => string;
+    /**
+     * Enable drag and drop rows
+     */
+    enableDragNDrop?: boolean;
+    onDrag?: (data: Data[]) => void;
+    onDrop?: (item: Data) => void;
+}
+export declare function getOperationCallback(operations: Operation[], onClick: OnClickOperation): (data: any, action: string) => void;
+declare function DefaultLoader(): JSX.Element;
+declare function DefaultEmptyData(): JSX.Element;
+export declare function useCustomTable<Data extends object = {}>(props: PropsWithChildren<TableProps<Data>>): {
+    className: string;
+    tableInstance: import("react-table").TableInstance<Data>;
+    CellHeader: any;
+    isLoading: boolean | undefined;
+    onClick: (data: any, action: string) => void;
+    Loader: React.ComponentType<{}> | typeof DefaultLoader;
+    EmptyData: React.ComponentType<{}> | typeof DefaultEmptyData;
+    Row: React.ComponentType<DefaultRowProps<Data>> | typeof DefaultRow;
+    data: Data[];
+    disablePagination: boolean | undefined;
+    Pagination: React.ComponentType<{}> | typeof DefaultPagination;
+    pageIndex: number;
+    pageSize: number;
+    pageSizes: number[];
+    setPageSize: (pageSize: number) => void;
+    i18n: (f: string) => string;
+    children: React.ReactNode;
+    onDrag: (dragIndex: number, hoverIndex: number) => void;
+    onDrop: (...args: any[]) => void;
+    /**
+     * Call the listener when a filter / pagination  / sort change.
+     */
+    onChange?: ((query: QueryOptions) => void) | undefined;
+    /**
+     * Custom ArrowSort
+     */
+    ArrowSort?: React.ComponentType<{}> | undefined;
+    /**
+     * Custom default ColumnFilter
+     */
+    ColumnFilter?: Renderer<FilterProps<Data>> | undefined;
+    /**
+     * Custom cell
+     */
+    Cell?: React.ComponentType<CellProps<Data, any>> | undefined;
+    /**
+     *
+     */
+    CellOperations?: React.ComponentType<{}> | undefined;
+    /**
+     * Disable filters
+     */
+    disableFilters?: boolean | undefined;
+    manualPagination?: boolean | undefined;
+    manualSortBy?: boolean | undefined;
+    manualFilters?: boolean | undefined;
+    /**
+     * Configuration operation for each line.
+     */
+    operations?: Operation<any>[] | undefined;
+    /**
+     * Enable drag and drop rows
+     */
+    enableDragNDrop?: boolean | undefined;
+    columns: import("react-table").Column<Data>[];
+    initialState?: Partial<import("react-table").TableState<Data>> | undefined;
+    stateReducer?: ((newState: import("react-table").TableState<Data>, action: import("react-table").ActionType, previousState: import("react-table").TableState<Data>, instance?: import("react-table").TableInstance<Data> | undefined) => import("react-table").TableState<Data>) | undefined;
+    useControlledState?: ((state: import("react-table").TableState<Data>, meta: import("react-table").MetaBase<Data>) => import("react-table").TableState<Data>) | undefined;
+    defaultColumn?: Partial<import("react-table").Column<Data>> | undefined;
+    getSubRows?: ((originalRow: Data, relativeIndex: number) => Data[]) | undefined;
+    getRowId?: ((originalRow: Data, relativeIndex: number, parent?: import("react-table").Row<Data> | undefined) => string) | undefined;
+    autoResetHiddenColumns?: boolean | undefined;
+    manualExpandedKey?: import("react-table").IdType<Data> | undefined;
+    paginateExpandedRows?: boolean | undefined;
+    expandSubRows?: boolean | undefined;
+    autoResetExpanded?: boolean | undefined;
+    defaultCanFilter?: boolean | undefined;
+    filterTypes?: import("react-table").FilterTypes<Data> | undefined;
+    autoResetFilters?: boolean | undefined;
+    globalFilter?: string | ((rows: import("react-table").Row<Data>[], columnIds: import("react-table").IdType<Data>[], filterValue: any) => import("react-table").Row<Data>[]) | undefined;
+    manualGlobalFilter?: boolean | undefined;
+    autoResetGlobalFilter?: boolean | undefined;
+    disableGlobalFilter?: boolean | undefined;
+    manualGroupBy?: boolean | undefined;
+    disableGroupBy?: boolean | undefined;
+    defaultCanGroupBy?: boolean | undefined;
+    aggregations?: Record<string, import("react-table").AggregatorFn<Data>> | undefined;
+    groupByFn?: ((rows: import("react-table").Row<Data>[], columnId: import("react-table").IdType<Data>) => Record<string, import("react-table").Row<Data>[]>) | undefined;
+    autoResetGroupBy?: boolean | undefined;
+    pageCount?: number | undefined;
+    autoResetPage?: boolean | undefined;
+    disableResizing?: boolean | undefined;
+    manualRowSelectedKey?: import("react-table").IdType<Data> | undefined;
+    autoResetSelectedRows?: boolean | undefined;
+    selectSubRows?: boolean | undefined;
+    disableSortBy?: boolean | undefined;
+    defaultCanSort?: boolean | undefined;
+    disableMultiSort?: boolean | undefined;
+    isMultiSortEvent?: ((e: React.MouseEvent<Element, MouseEvent>) => boolean) | undefined;
+    maxMultiSortColCount?: number | undefined;
+    disableSortRemove?: boolean | undefined;
+    disabledMultiRemove?: boolean | undefined;
+    orderByFn?: ((rows: import("react-table").Row<Data>[], sortFns: import("react-table").SortByFn<Data>[], directions: boolean[]) => import("react-table").Row<Data>[]) | undefined;
+    sortTypes?: Record<string, import("react-table").SortByFn<Data>> | undefined;
+    autoResetSortBy?: boolean | undefined;
+    sortBy?: import("../../../interfaces").ColumnIdentifier[] | undefined;
+    filters?: import("../../../interfaces").ColumnIdentifier[] | undefined;
+    filterId?: string | undefined;
+};
+export {};

package/dist/components/table/hooks/useDragnDropRow.hook.d.ts

@@ -0,0 +1,266 @@
+/// <reference types="react" />
+import { DefaultRowProps } from "../components/defaultRow.component";
+export declare function useDndRow<Data extends object = {}>({ onDrag, onDrop, index, ...props }: DefaultRowProps<Data>): {
+    opacity: number;
+    isDragging: boolean;
+    dropRef: import("react").RefObject<HTMLTableRowElement>;
+    dragRef: import("react").RefObject<HTMLTableDataCellElement>;
+    onClick: (data: any, action: string) => void;
+    row: import("react-table").Row<Data>;
+    enableDragNDrop?: boolean | undefined;
+    ref?: import("react").LegacyRef<HTMLTableRowElement> | undefined;
+    key?: import("react").Key | null | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    className?: string | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    hidden?: boolean | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    placeholder?: string | undefined;
+    slot?: string | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    style?: import("react").CSSProperties | undefined;
+    tabIndex?: number | undefined;
+    title?: string | undefined;
+    translate?: "yes" | "no" | undefined;
+    radioGroup?: string | undefined;
+    role?: string | undefined;
+    about?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    resource?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCapitalize?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    color?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "on" | "off" | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
+    is?: string | undefined;
+    'aria-activedescendant'?: string | undefined;
+    'aria-atomic'?: boolean | "true" | "false" | undefined;
+    'aria-autocomplete'?: "none" | "inline" | "list" | "both" | undefined;
+    'aria-busy'?: boolean | "true" | "false" | undefined;
+    'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
+    'aria-colcount'?: number | undefined;
+    'aria-colindex'?: number | undefined;
+    'aria-colspan'?: number | undefined;
+    'aria-controls'?: string | undefined;
+    'aria-current'?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
+    'aria-describedby'?: string | undefined;
+    'aria-details'?: string | undefined;
+    'aria-disabled'?: boolean | "true" | "false" | undefined;
+    'aria-dropeffect'?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
+    'aria-errormessage'?: string | undefined;
+    'aria-expanded'?: boolean | "true" | "false" | undefined;
+    'aria-flowto'?: string | undefined;
+    'aria-grabbed'?: boolean | "true" | "false" | undefined;
+    'aria-haspopup'?: boolean | "true" | "false" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
+    'aria-hidden'?: boolean | "true" | "false" | undefined;
+    'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    'aria-keyshortcuts'?: string | undefined;
+    'aria-label'?: string | undefined;
+    'aria-labelledby'?: string | undefined;
+    'aria-level'?: number | undefined;
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    'aria-modal'?: boolean | "true" | "false" | undefined;
+    'aria-multiline'?: boolean | "true" | "false" | undefined;
+    'aria-multiselectable'?: boolean | "true" | "false" | undefined;
+    'aria-orientation'?: "horizontal" | "vertical" | undefined;
+    'aria-owns'?: string | undefined;
+    'aria-placeholder'?: string | undefined;
+    'aria-posinset'?: number | undefined;
+    'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
+    'aria-readonly'?: boolean | "true" | "false" | undefined;
+    'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    'aria-required'?: boolean | "true" | "false" | undefined;
+    'aria-roledescription'?: string | undefined;
+    'aria-rowcount'?: number | undefined;
+    'aria-rowindex'?: number | undefined;
+    'aria-rowspan'?: number | undefined;
+    'aria-selected'?: boolean | "true" | "false" | undefined;
+    'aria-setsize'?: number | undefined;
+    'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
+    'aria-valuemax'?: number | undefined;
+    'aria-valuemin'?: number | undefined;
+    'aria-valuenow'?: number | undefined;
+    'aria-valuetext'?: string | undefined;
+    children?: import("react").ReactNode;
+    dangerouslySetInnerHTML?: {
+        __html: string;
+    } | undefined;
+    onCopy?: import("react").ClipboardEventHandler<HTMLTableRowElement> | undefined;
+    onCopyCapture?: import("react").ClipboardEventHandler<HTMLTableRowElement> | undefined;
+    onCut?: import("react").ClipboardEventHandler<HTMLTableRowElement> | undefined;
+    onCutCapture?: import("react").ClipboardEventHandler<HTMLTableRowElement> | undefined;
+    onPaste?: import("react").ClipboardEventHandler<HTMLTableRowElement> | undefined;
+    onPasteCapture?: import("react").ClipboardEventHandler<HTMLTableRowElement> | undefined;
+    onCompositionEnd?: import("react").CompositionEventHandler<HTMLTableRowElement> | undefined;
+    onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLTableRowElement> | undefined;
+    onCompositionStart?: import("react").CompositionEventHandler<HTMLTableRowElement> | undefined;
+    onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLTableRowElement> | undefined;
+    onCompositionUpdate?: import("react").CompositionEventHandler<HTMLTableRowElement> | undefined;
+    onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLTableRowElement> | undefined;
+    onFocus?: import("react").FocusEventHandler<HTMLTableRowElement> | undefined;
+    onFocusCapture?: import("react").FocusEventHandler<HTMLTableRowElement> | undefined;
+    onBlur?: import("react").FocusEventHandler<HTMLTableRowElement> | undefined;
+    onBlurCapture?: import("react").FocusEventHandler<HTMLTableRowElement> | undefined;
+    onChange?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onChangeCapture?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onBeforeInput?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onBeforeInputCapture?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onInput?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onInputCapture?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onReset?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onResetCapture?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onSubmit?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onSubmitCapture?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onInvalid?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onInvalidCapture?: import("react").FormEventHandler<HTMLTableRowElement> | undefined;
+    onLoad?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onLoadCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onError?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onErrorCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onKeyDown?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
+    onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
+    onKeyPress?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
+    onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
+    onKeyUp?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
+    onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
+    onAbort?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onAbortCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onCanPlay?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onCanPlayCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onCanPlayThrough?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onDurationChange?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onDurationChangeCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onEmptied?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onEmptiedCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onEncrypted?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onEncryptedCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onEnded?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onEndedCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onLoadedData?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onLoadedDataCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onLoadedMetadata?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onLoadStart?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onLoadStartCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onPause?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onPauseCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onPlay?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onPlayCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onPlaying?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onPlayingCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onProgress?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onProgressCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onRateChange?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onRateChangeCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onSeeked?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onSeekedCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onSeeking?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onSeekingCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onStalled?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onStalledCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onSuspend?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onSuspendCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onTimeUpdate?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onVolumeChange?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onWaiting?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onWaitingCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onAuxClick?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onAuxClickCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onClickCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onContextMenu?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onContextMenuCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onDoubleClick?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onDoubleClickCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onDragCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragEnd?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragEndCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragEnter?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragEnterCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragExit?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragExitCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragLeave?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragLeaveCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragOver?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragOverCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragStart?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDragStartCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onDropCapture?: import("react").DragEventHandler<HTMLTableRowElement> | undefined;
+    onMouseDown?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseDownCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseEnter?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseLeave?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseMove?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseMoveCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseOut?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseOutCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseOver?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseOverCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseUp?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onMouseUpCapture?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+    onSelect?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onSelectCapture?: import("react").ReactEventHandler<HTMLTableRowElement> | undefined;
+    onTouchCancel?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onTouchCancelCapture?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onTouchEnd?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onTouchEndCapture?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onTouchMove?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onTouchMoveCapture?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onTouchStart?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onTouchStartCapture?: import("react").TouchEventHandler<HTMLTableRowElement> | undefined;
+    onPointerDown?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerDownCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerMove?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerMoveCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerUp?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerUpCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerCancel?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerCancelCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerEnter?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerEnterCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerLeave?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerOver?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerOverCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerOut?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onPointerOutCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onGotPointerCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onLostPointerCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLTableRowElement> | undefined;
+    onScroll?: import("react").UIEventHandler<HTMLTableRowElement> | undefined;
+    onScrollCapture?: import("react").UIEventHandler<HTMLTableRowElement> | undefined;
+    onWheel?: import("react").WheelEventHandler<HTMLTableRowElement> | undefined;
+    onWheelCapture?: import("react").WheelEventHandler<HTMLTableRowElement> | undefined;
+    onAnimationStart?: import("react").AnimationEventHandler<HTMLTableRowElement> | undefined;
+    onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLTableRowElement> | undefined;
+    onAnimationEnd?: import("react").AnimationEventHandler<HTMLTableRowElement> | undefined;
+    onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLTableRowElement> | undefined;
+    onAnimationIteration?: import("react").AnimationEventHandler<HTMLTableRowElement> | undefined;
+    onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLTableRowElement> | undefined;
+    onTransitionEnd?: import("react").TransitionEventHandler<HTMLTableRowElement> | undefined;
+    onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLTableRowElement> | undefined;
+};

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

@@ -7,5 +7,6 @@ export * from "./components/defaultOperationButton.component";
 export * from "./filters/defaultColumnFilter.component";
 export * from "./filters/selectColumnFilter.component";
 export * from "./filters/sliderColumnFilter.component";
+export * from "./hooks/useCustomTable.hook";
+export * from "./hooks/useOperations.hook";
 export * from "./table.component";
-export * from "./utils/useOperations.hook";

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

@@ -1,72 +1,3 @@
-import React, { PropsWithChildren } from "react";
-import { CellProps, FilterProps, Renderer, TableOptions } from "react-table";
-import { OnClickOperation, Operation, QueryOptions } from "../../interfaces";
-import { DefaultCellHeaderProps } from "./components/defaultCellHeader.component";
-export interface TableProps<Data extends object = any> extends TableOptions<Data>, Partial<QueryOptions> {
-    className?: string;
-    /**
-     * Call the listener when a filter / pagination  / sort change.
-     */
-    onChange?: (query: QueryOptions) => void;
-    /**
-     * Call the listener when a line is clicked.
-     */
-    onClick?: OnClickOperation<Data>;
-    /**
-     * Pagination steps list
-     */
-    pageSizes?: number[];
-    /**
-     *
-     */
-    isLoading?: boolean;
-    /**
-     * Custom EmptyData displayed when there is no data
-     */
-    EmptyData?: React.ComponentType;
-    /**
-     * Custom ArrowSort
-     */
-    ArrowSort?: React.ComponentType;
-    /**
-     * Custom default ColumnFilter
-     */
-    ColumnFilter?: Renderer<FilterProps<Data>>;
-    /**
-     * Custom cell
-     */
-    Cell?: React.ComponentType<CellProps<Data>>;
-    /**
-     *
-     */
-    CellHeader?: React.ComponentType<DefaultCellHeaderProps<Data>>;
-    /**
-     *
-     */
-    CellOperations?: React.ComponentType;
-    /**
-     * Custom Loader
-     */
-    Loader?: React.ComponentType;
-    /**
-     * Custom Loader
-     */
-    Pagination?: React.ComponentType;
-    /**
-     * Disable filters
-     */
-    disableFilters?: boolean;
-    /**
-     * Disable pagination
-     */
-    disablePagination?: boolean;
-    manualPagination?: boolean;
-    manualSortBy?: boolean;
-    manualFilters?: boolean;
-    /**
-     * Configuration operation for each line.
-     */
-    operations?: Operation[];
-    i18n?: (f: string) => string;
-}
+import { PropsWithChildren } from "react";
+import { TableProps } from "./hooks/useCustomTable.hook";
 export declare function Table<Data extends object = any>(props: PropsWithChildren<TableProps<Data>>): JSX.Element;

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

@@ -43,3 +43,28 @@ export declare const Sandbox: {
         })[];
     };
 };
+export declare const TableWithDragNDrop: {
+    (args: any): JSX.Element;
+    args: {
+        enableDragNDrop: boolean;
+        data: never[];
+        columns: import("react-table").Column<{}>[];
+        operations: ({
+            title: string;
+            action: string;
+            alias: string;
+            path: string;
+            icon: string;
+            permissionsResolver(): boolean;
+            buttonType?: undefined;
+        } | {
+            action: string;
+            path: string;
+            icon: string;
+            buttonType: string;
+            permissionsResolver(): boolean;
+            title?: undefined;
+            alias?: undefined;
+        })[];
+    };
+};

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

@@ -0,0 +1 @@
+export declare const swapElements: <T = any>(myArray: T[], index1: number, index2: number) => T[];