I am trying to write a Bootstrap equivalent to Material React Table using the Bootstrap framework.

I am trying to write a Bootstrap equivalent to Material React Table using the Bootstrap framework.

As part of that I want to implement a series of Storybook examples to confirm I haven't broken rendering. But I am hitting an issue.

I am using generics to define the table objects so I can setup more complex calls and operations like so:

export type RBTColumnDefs<TData extends Record<string, any> = {}> = RBTColumnSizing & { accessorFn?: (originalRow: TData) => string; accessorKey?: keyof TData; }

I've created a basic data object type and constructed test data, however when I use storybook e.g.:

const meta = { title: 'react-bootstrap-table/Table Menu Bar', component: RBTMenuBar, tags: ['autodocs'], args: { ...searchableArgsRBTData, }, } satisfies Meta<typeof RBTMenuBar>;

Storybook will instantiate RBTMenuBar with the generic type {}, instead of the generic type I want the default arguments to contain.

Does anyone know how you get around this?

#react #storybook #webdev #bootstrap