Fix error in CustomFilter definitions & support expandAll options.

types/react-bootstrap-table/index.d.ts

@@ -840,6 +840,10 @@ export interface Options<TRow extends object = any> {
 	 * Background color on expanded rows (css color value).
 	 */
 	expandRowBgColor?: string;
+	/**
+	 * Expand all rows
+	 */
+	expandAll?: boolean;
 	/**
 	 * Tell react-bootstrap-table how to trigger expanding by clicking on 'row' or 'column' level.
 	 * If the value is 'column', by default all the columns are expandable. If you want to specify some columns as
@@ -1513,11 +1517,6 @@ export interface Editable<TRow extends object, K extends keyof TRow> {
 	attrs?: EditableAttrs;
 }
 
-export type SetFilterCallback = (targetValue: any) => boolean;
-export interface ApplyFilterParameter {
-	callback: SetFilterCallback;
-}
-
 /**
  * Text filter type.
  */
@@ -1709,10 +1708,25 @@ export interface DateFilter {
 	};
 }
 
+/**
+ * Custom Filter Parameters
+ */
+export interface CustomFilterParameters<Params extends object = any> {
+	callback(cell: any, params: Params): boolean;
+	callbackParameters: Params;
+}
+
+/**
+ * Custom filter element type.
+ */
+export class CustomFilterElement extends Component<any> {
+	cleanFiltered: () => void;
+}
+
 /**
  * Custom filter type.
  */
-export interface CustomFilter {
+export interface CustomFilter<FParams extends object = any, FElement extends CustomFilterElement = any> {
 	/**
 	 * Type must be 'CustomFilter'
 	 */
@@ -1721,13 +1735,13 @@ export interface CustomFilter {
 	 * Function to generate the filter component
 	 */
 	getElement(
-		filterHandler: (parameters?: ApplyFilterParameter) => void,
-		customFilterParameters: object
-	): ReactElement<any>;
+		filterHandler: (value?: CustomFilterParameters<FParams>, type?: 'CustomFilter') => void,
+		customFilterParameters: CustomFilterParameters<FParams>
+	): ReactElement<FElement>;
 	/**
 	 * Custom filter parameters to be passed to the generator function
 	 */
-	customFilterParameters: object;
+	customFilterParameters: CustomFilterParameters<FParams>;
 }
 
 /**
@@ -1818,8 +1832,8 @@ export type FilterValue =
 /**
  * Filter object that can be passed to BootstrapTableFilter.handleFilterData function.
  */
-export interface FilterData {
-	[dataField: string]: FilterValue;
+export interface FilterData<CustomFilterValue extends object = any> {
+	[dataField: string]: FilterValue | CustomFilterValue;
 }
 
 /**
@@ -1880,6 +1894,13 @@ export interface ExpandColumnComponentProps {
 	isExpanded: boolean;
 }
 
+/**
+ * Input properties for the expandedColumnHeaderComponent function.
+ */
+export interface ExpandedColumnHeaderProps {
+	anyExpand: boolean;
+}
+
 /**
  * Customize the options for expand row feature.
  */
@@ -1901,6 +1922,10 @@ export interface ExpandColumnOptions {
 	 * should be shown first. Default is true, false will move the expand indicator column after selection column.
 	 */
 	expandColumnBeforeSelectColumn?: boolean;
+	/**
+	 * a callback function to customise the header column
+	 */
+	expandedColumnHeaderComponent?(props: ExpandedColumnHeaderProps): string | ReactElement<any>;
 }
 
 /**

types/react-bootstrap-table/react-bootstrap-table-tests.tsx

@@ -1,11 +1,11 @@
 import * as React from 'react';
 import { render } from 'react-dom';
 import {
-  ApplyFilterParameter,
   BootstrapTable,
   ButtonGroupProps,
   CellEdit,
   ColumnDescription,
+  CustomFilter,
   CustomSelectProps,
   DeleteButton,
   EditableAttrs,
@@ -15,6 +15,7 @@ import {
   ExportCSVButton,
   Filter,
   FilterData,
+  FilterType,
   FooterData,
   InsertButton,
   InsertModalColumnDescription,
@@ -32,7 +33,8 @@ import {
   SizePerPageDropDown,
   SortOrder,
   TableHeaderColumn,
-  ToolBarProps
+  ToolBarProps,
+  CustomFilterParameters
 } from 'react-bootstrap-table';
 
 interface Product {
@@ -135,15 +137,21 @@ class TextFilterWithCondition extends React.Component {
   }
 }
 
-function getCustomFilter(filterHandler: (parameters?: ApplyFilterParameter) => void, customFilterParameters: any) {
+interface CustomFilterParams {
+  textOK: string;
+  textNOK: string;
+}
+function getCustomFilter(filterHandler: (parameters?: CustomFilterParameters<CustomFilterParams>, type?: 'CustomFilter') => void, customFilterParameters: CustomFilterParameters<CustomFilterParams>) {
   return (
     <div />
   );
 }
 
-class CustomFilter extends React.Component {
+function customFilterCallback(cell: any, callbackParameters: CustomFilterParams) { return true; }
+
+class CustomFilterTable extends React.Component {
   render() {
-    const filter: Filter = { type: 'CustomFilter', getElement: getCustomFilter, customFilterParameters: { textOK: 'yes', textNOK: 'no' } };
+    const filter: Filter = { type: 'CustomFilter', getElement: getCustomFilter, customFilterParameters: { callback: customFilterCallback, callbackParameters: { textOK: 'yes', textNOK: 'no' }} };
     return (
       <BootstrapTable data={products}>
         <TableHeaderColumn dataField='id' isKey>Product ID</TableHeaderColumn>
@@ -154,9 +162,38 @@ class CustomFilter extends React.Component {
   }
 }
 
-class RemoteProps extends React.Component {
+class RemotePropsDefault extends React.Component {
   render() {
-    const filter: Filter = { type: 'CustomFilter', getElement: getCustomFilter, customFilterParameters: { textOK: 'yes', textNOK: 'no' } };
+    const filter: CustomFilter = { type: 'CustomFilter', getElement: getCustomFilter, customFilterParameters: { callback: customFilterCallback, callbackParameters: { textOK: 'yes', textNOK: 'no' }} };
+    return (
+      <BootstrapTable
+        data={products}
+        remote={(remoteObj) => {
+          remoteObj.cellEdit = true;
+          return remoteObj;
+        }}
+        options={{
+          onCellEdit: (row: any, fieldName: string, value: any) => { console.info(row); return value; }
+        }}
+      >
+        <TableHeaderColumn dataField='id' isKey>Product ID</TableHeaderColumn>
+        <TableHeaderColumn dataField='name'>Product Name</TableHeaderColumn>
+        <TableHeaderColumn dataField='isInStock' filter={filter}>Product Is In Stock</TableHeaderColumn>
+      </BootstrapTable>
+    );
+  }
+}
+
+class RemotePropsSpecified extends React.Component {
+  render() {
+    const filter: CustomFilter<CustomFilterParams> = {
+      type: 'CustomFilter',
+      getElement: getCustomFilter,
+      customFilterParameters: {
+        callback: customFilterCallback,
+        callbackParameters: { textOK: 'yes', textNOK: 'no' }
+      }
+    };
     return (
       <BootstrapTable
         data={products}
@@ -178,7 +215,7 @@ class RemoteProps extends React.Component {
 
 class RemoteBool extends React.Component {
   render() {
-    const filter: Filter = { type: 'CustomFilter', getElement: getCustomFilter, customFilterParameters: { textOK: 'yes', textNOK: 'no' } };
+    const filter: Filter = { type: 'CustomFilter', getElement: getCustomFilter, customFilterParameters: {callback: customFilterCallback, callbackParameters: { textOK: 'yes', textNOK: 'no' } }};
     return (
       <BootstrapTable
         data={products}