jattac.libs.web.responsive-table 0.1.5 → 0.2.0

package/dist/Data/IResponsiveTableColumnDefinition.d.ts

@@ -7,4 +7,5 @@ export default interface IResponsiveTableColumnDefinition<TData> {
         onHeaderClick?: (id: string) => void;
         className?: string;
     };
+    getFilterableValue?: (data: TData) => string | number;
 }

package/dist/Plugins/FilterPlugin.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { IResponsiveTablePlugin, IPluginAPI } from './IResponsiveTablePlugin';
+export declare class FilterPlugin<TData> implements IResponsiveTablePlugin<TData> {
+    id: string;
+    private filterText;
+    private api;
+    constructor();
+    onPluginInit: (api: IPluginAPI<TData>) => void;
+    renderHeader: () => React.JSX.Element | null;
+    processData: (data: TData[]) => TData[];
+    private handleFilterChange;
+}

package/dist/Plugins/IResponsiveTablePlugin.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { ColumnDefinition } from '../UI/ResponsiveTable';
+export interface IResponsiveTablePlugin<TData> {
+    id: string;
+    renderHeader?: () => ReactNode;
+    renderFooter?: () => ReactNode;
+    processData?: (data: TData[]) => TData[];
+    onPluginInit?: (api: IPluginAPI<TData>) => void;
+}
+export interface IPluginAPI<TData> {
+    getData: () => TData[];
+    forceUpdate: () => void;
+    columnDefinitions: ColumnDefinition<TData>[];
+    getScrollableElement?: () => HTMLElement | null;
+    infiniteScrollProps?: {
+        enableInfiniteScroll?: boolean;
+        onLoadMore?: (currentData: TData[]) => Promise<TData[] | null>;
+        hasMore?: boolean;
+        loadingMoreComponent?: ReactNode;
+        noMoreDataComponent?: ReactNode;
+    };
+    filterProps?: {
+        showFilter?: boolean;
+        filterPlaceholder?: string;
+    };
+}

package/dist/Plugins/InfiniteScrollPlugin.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { IResponsiveTablePlugin, IPluginAPI } from './IResponsiveTablePlugin';
+export declare class InfiniteScrollPlugin<TData> implements IResponsiveTablePlugin<TData> {
+    id: string;
+    private api;
+    private isLoadingMore;
+    constructor();
+    onPluginInit: (api: IPluginAPI<TData>) => void;
+    private attachScrollListener;
+    private handleScroll;
+    processData: (data: TData[]) => TData[];
+    renderFooter: () => string | number | true | Iterable<React.ReactNode> | React.JSX.Element | null;
+}

package/dist/UI/ResponsiveTable.d.ts

@@ -1,6 +1,7 @@
 import React, { Component, ReactNode } from 'react';
 import IResponsiveTableColumnDefinition from '../Data/IResponsiveTableColumnDefinition';
 import IFooterRowDefinition from '../Data/IFooterRowDefinition';
+import { IResponsiveTablePlugin } from '../Plugins/IResponsiveTablePlugin';
 export type ColumnDefinition<TData> = IResponsiveTableColumnDefinition<TData> | ((data: TData, rowIndex?: number) => IResponsiveTableColumnDefinition<TData>);
 interface IProps<TData> {
     columnDefinitions: ColumnDefinition<TData>[];
@@ -10,14 +11,31 @@ interface IProps<TData> {
     onRowClick?: (item: TData) => void;
     footerRows?: IFooterRowDefinition[];
     mobileBreakpoint?: number;
-    isLoading?: boolean;
-    animateOnLoad?: boolean;
+    plugins?: IResponsiveTablePlugin<TData>[];
+    infiniteScrollProps?: {
+        enableInfiniteScroll?: boolean;
+        onLoadMore?: (currentData: TData[]) => Promise<TData[] | null>;
+        hasMore?: boolean;
+        loadingMoreComponent?: ReactNode;
+        noMoreDataComponent?: ReactNode;
+    };
+    filterProps?: {
+        showFilter?: boolean;
+        filterPlaceholder?: string;
+    };
+    animationProps?: {
+        isLoading?: boolean;
+        animateOnLoad?: boolean;
+    };
 }
-interface IState {
+interface IState<TData> {
     isMobile: boolean;
+    processedData: TData[];
+    isLoadingMore: boolean;
 }
-declare class ResponsiveTable<TData> extends Component<IProps<TData>, IState> {
+declare class ResponsiveTable<TData> extends Component<IProps<TData>, IState<TData>> {
     private debouncedResize;
+    private tableContainerRef;
     constructor(props: IProps<TData>);
     private get mobileBreakpoint();
     private debounce;
@@ -27,6 +45,9 @@ declare class ResponsiveTable<TData> extends Component<IProps<TData>, IState> {
     private get noDataComponent();
     componentDidMount(): void;
     componentWillUnmount(): void;
+    componentDidUpdate(prevProps: IProps<TData>): void;
+    private initializePlugins;
+    private processData;
     handleResize: () => void;
     private getColumnDefinition;
     private getRawColumnDefinition;
@@ -39,6 +60,8 @@ declare class ResponsiveTable<TData> extends Component<IProps<TData>, IState> {
     private get skeletonView();
     private get mobileView();
     private get largeScreenView();
-    render(): React.ReactNode;
+    private renderPluginHeaders;
+    private renderPluginFooters;
+    render(): string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
 }
 export default ResponsiveTable;

package/dist/index.d.ts

@@ -2,5 +2,8 @@ import IFooterColumnDefinition from './Data/IFooterColumnDefinition';
 import IFooterRowDefinition from './Data/IFooterRowDefinition';
 import IResponsiveTableColumnDefinition from './Data/IResponsiveTableColumnDefinition';
 import ResponsiveTable, { ColumnDefinition } from './UI/ResponsiveTable';
-export { IResponsiveTableColumnDefinition, ColumnDefinition, IFooterColumnDefinition, IFooterRowDefinition };
+import { FilterPlugin } from './Plugins/FilterPlugin';
+import { InfiniteScrollPlugin } from './Plugins/InfiniteScrollPlugin';
+import { IResponsiveTablePlugin } from './Plugins/IResponsiveTablePlugin';
+export { IResponsiveTableColumnDefinition, ColumnDefinition, IFooterColumnDefinition, IFooterRowDefinition, FilterPlugin, InfiniteScrollPlugin, IResponsiveTablePlugin };
 export default ResponsiveTable;