reactabular-semantic-ui - Reactabular wrapper for semantic-ui-react

Helper for Reactabular to use Semantic-Ui-React table with it.

Should be able to handle any properties specified in Semantic-UI-React documentation. http://react.semantic-ui.com/collections/table

Example

importReact,{Component}from"react";importcomponentsWrapperfrom'reactabular-semantic-ui';import*asTablefrom"reactabular-table";import"semantic-ui-css/semantic.min.css";constrows=[{id: 100,name: 'John'},{id: 101,name: 'Jack'}];constcolumns=[{property: 'name',header: {label: 'Name'}}];// Define properties that you wnat to pass to corresponding components// All of those are optionalconstcombinedProps={//Semantic UI React <Table /> component props in object formattableProps: {striped: true,color: "red"},//Semantic UI React <Table.Header /> component props in object formatheaderProps: {fullWidth: true},//Header row props if you want to do something special thereheaderRowProps: {},//Semantic UI React <Table.HeaderCell /> component props in object formatheaderCellProps: {textAlign: "center"},//Semantic UI React <Table.Body /> component props in object formatbodyProps: {className: "customtablebodyclass"},//Semantic UI React <Table.Row /> component props in object formatbodyRowProps: {positive: true},//Semantic UI React <Table.Cell /> component props in object formatbodyCellProps: {textAlign: "left",positive: true,icon: "folder",singleLine: true}};//Set your custom props//componentsWrapper is possible to call without any parametersconstcomponentsWithProps=componentsWrapper(combinedProps)constSemanticReactabular=()=>{return(<Table.Providercolumns={columns}components={componentsWithProps}><Table.Header/><Table.Bodyrows={rows}rowKey="id"/></Table.Provider>);};

License

MIT. See LICENSE for details.