Merge pull request #144 from bryanmylee/optional-col-filter-render

Optional `render` column option for addColumnFilters

Author: bryanmylee

.github/workflows/coverage.yml

@@ -17,6 +17,7 @@ jobs:
       - uses: actions/setup-node@v1
         with:
           node-version: 16
+      - run: npm install svelte
       - run: npm ci
       - run: npm test
       - uses: coverallsapp/github-action@master

docs/src/routes/docs/[...3]plugins/[...3]add-column-filters/+page.md

@@ -51,7 +51,7 @@ Defines the filter behavior for the column.
 
 Receives `filterValue` and the column cell `value`, and returns `true` if the cell should be visible.
 
-### `render: (renderProps) => RenderConfig`
+### `render?: (renderProps) => RenderConfig`
 
 Defines the component to render on `HeaderCell->props.[pluginName].render`.
 

src/lib/plugins/addColumnFilters.ts

@@ -19,7 +19,7 @@ export interface ColumnFiltersState<Item> {
 export interface ColumnFiltersColumnOptions<Item, FilterValue = any> {
 	fn: ColumnFilterFn<FilterValue>;
 	initialFilterValue?: FilterValue;
-	render: (props: ColumnRenderConfigPropArgs<Item, FilterValue>) => RenderConfig;
+	render?: (props: ColumnRenderConfigPropArgs<Item, FilterValue>) => RenderConfig;
 }
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -46,7 +46,7 @@ export type ColumnFilterFnProps<FilterValue = any, Value = any> = {
 export type ColumnFiltersPropSet = NewTablePropSet<{
 	'thead.tr.th':
 		| {
-				render: RenderConfig;
+				render?: RenderConfig;
 		  }
 		| undefined;
 }>;
@@ -151,7 +151,7 @@ export const addColumnFilters =
 							}
 							return [];
 						});
-						const render = columnOption.render({
+						const render = columnOption.render?.({
 							id: headerCell.id,
 							filterValue,
 							...tableState,

src/lib/plugins/addFlatten.test.ts

@@ -1,5 +1,5 @@
 import { createTable } from '../createTable';
-import type { Sample } from 'src/routes/_createSamples';
+import type { Sample } from '../../routes/_createSamples';
 import { get, readable } from 'svelte/store';
 import { addFlatten } from './addFlatten';
 import { addSubRows } from './addSubRows';

src/lib/plugins/addGroupBy.test.ts

@@ -1,5 +1,5 @@
 import { createTable } from '../createTable';
-import type { Sample } from 'src/routes/_createSamples';
+import type { Sample } from '../../routes/_createSamples';
 import { get, readable } from 'svelte/store';
 import { addGroupBy } from './addGroupBy';
 import { addSubRows } from './addSubRows';

src/lib/plugins/addSelectedRows.test.ts

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 import { createTable } from '../createTable';
-import type { Sample } from 'src/routes/_createSamples';
+import type { Sample } from '../../routes/_createSamples';
 import { derived, get, readable } from 'svelte/store';
 import { addSelectedRows } from './addSelectedRows';
 import { addSubRows } from './addSubRows';