Reactabular 1.0.0-rc4 out - Feedback welcome!

beta1

I pretty much rewrote the component based on #109 ideas (context based API). The component is more flexible now. I ended up simplifying it in a few ways while at it. The old cell API accepts just something you can pass through a React component (i.e., a string, number, React component, …). You can still achieve the same things and more as before.

beta2

• Fixed requires at dist-modules. The problem was that Babel renamed Table.jsx and Search.jsx to lowercase while retaining requires in uppercase. Now they should be in lowercase.

beta3

• I resolved #143 and #149. This means you can use nested definitions at property. So property: 'dad.name' is acceptable. It will work with sorting and search too.

beta4

• New site and documentation. Still bit of a WIP.

beta5

• Redesigned column definition. It’s clearer what’s going on now even though there are more fields to think about. The semantic split was needed to make it all work together nicely.
• Started improving test coverage. There’s still work left to do with that but getting better.

beta6

• Improved test coverage.
• Renamed cell.value as more descriptive cell.resolve.
• Dropped redundant formatters. Only highlight remains at the core.
• Moved to curry pattern for transforms. So you now you get edit(...)(...) instead of having to bind.
• Expanded documentation somewhat. There might still be bits missing so be sure to comment.
• Implemented selection example.

beta7

• Improved test coverage. Now we are hovering near 100% and it seems good enough although I may be missing some tests still.
• Improved className handling at Table.Header and Table.Body. Now it merges possible className returned from a transform correctly. I’m not happy about this but I couldn’t see any neater way to do this given React expects a string and I didn’t want to introduce an external dependency just for this.
• Rewrote the search interface. The API should be more sensible now. I extracted the Search component from the core and pushed it to documentation helpers. It’s quite likely it will become a package of its own and I might push the logic there as well. Given the logic is generic, we could end up with two packages. One for the React bit, one for logic.
• Expanded the tree example to multiple levels. While at it I did a performance pass so searches are linear (relies on ordered structure). Performance can likely be improved further. I’ll need to generate test data to see the limits better.

The documentation can use some work still, but the APIs are starting to feel solid. I still need to do a couple of examples to exercise the API further and see how it works out.

beta8

• Made search work correctly with resolved values.
• Renamed header.value to more descriptive header.label.

beta9

• Made search operate correctly with selected columns. Due to a naming error (parameter) it was searching all instead of the specified columns.
• Pushed rowKey to Table from Table.Body. That felt like a better place for it and this clean the table definition further.
• Tidied up the “full table” example. It’s using a different data generator now and overall is nicer to study. Also fixed a pagination related glitch there. Now the paginator uses the correct data.

beta10

• Made the search API accept objects to be consistent with the other ones.
• Added checks to let you know if a transform returns something falsy.
• Redid documentation structure. Now the sections map to the component functionality. There is also more documentation available (specific APIs, step by steps).
• Added a stateful table example. This illustrates how to expand the column definition with something custom. Eventually the idea might become a package of its own. Now it’s more of an experiment.

beta11

• Made search resolve using the full incantation. Thanks @skosch.
• Added lodash back to peer dependencies. This is needed for the Node version.
• Made sorting default to sort-none class. It shows “arrow up and down” symbol if you are using the default styling.
• Generalized transform to transforms. This accepts an array of transforms. See the API.
• Added .toFormatter() methods for the current transforms. This gives you more flexibility as now you can use transforms within formatting. Instead of applying sorting to an entire cell, you might want to use it as a smaller widget of its own. You can see this in the full example.
• Passed column data to formatters/transformers. This is handy data. The full example uses it to figure out the order of sorting so you get these numbers when you apply multi-column sort.
• Allowed sorting order to be customized. This relies on an object formatted in a specific way. See the API.
• Generated test data for the tree example to push it a bit.

beta12

• Made Table accept array input. https://github.com/bebraw/reactabular/commit/855ea3c150962b78ab46fd61a810f869bd404663
• Passed columnIndex and rowIndex to formatters/transformers. https://github.com/bebraw/reactabular/commit/2dde40538098b0b3419ab1238d2a22d222165738
• Added Excel example.
• Made it possible to reset sorting by double clicking at the sorting example.
• Added header drag and drop example.
• Exposed header.column and cell.column. This allows you to override th/td and is handy for implementing drag and drop at least.
• Added column toggling example.
• Showed how to do sticky headers at the tree example.

beta13

• Botched release. Forgot to include lib at package.json files.

beta14

• Added fixed header demo. That avoid table resizing when filtering. Thanks @isaachinman!
• Added resizable columns demo. You can change column sizes through the header widgets.
• Documented the props field. Also added it to the column root so you can define shared props easily. This was handy for the new demos.
• Added nested headers demo. To make this possible, I added support for children field that accepts a column definition.
• Expanded drag and drop demo to show how to handle the nested case. It’s not perfect implementation (no recursion) but it solves the hard bit.
• Table.Header and Table.Body are components now. I needed this as I had to attach refs to them. It’s not possible with function based components.
• Added sticky header demo with overflow. There would be room for rendering optimizations based on the limited viewport but those haven’t been implemented.
• Added installation documentation.
• Expanded Lodash version range to include Lodash 3. Note that this needs some tweaking as discussed in the installation guide. You’ll need to alias Lodash 4 imports to work with Lodash 3. I would love to find a better solution for this, though.
• Made the npm version contain less files by utilizing the files field.

I still have to tidy up the site a bit (get rid of faker -> 1 MB less), go through the docs, and improve test coverage. We should be good to go after that unless you have other ideas.

rc1

• Replaced faker with a lighter solution. The site should be lighter now as a result. Still too chunky for my liking, though.
• Simplified the full example a notch. Easier to follow now.
• Acquired proper domain for the project through js.org. There’s reactabular.js.org now.
• Reworked Table proptypes. The checks should be more accurate.
• Renamed cellData as rowData to describe the content better.
• Renamed Table as Table.Provider as I realized it makes sense to have Table components below the same namespace.
• Replaced header/cell.component with a more generic solution that allows you to replace any table elements (table, header, body, etc.). This happens through a specific components Table.Provider prop that accepts an object with the replacing components.
• Pushed test coverage to 100%. This was useful as it forced me to think through certain aspects better.
• Made header/body props to be merged deeply (style won’t override for instance) but so that classNames get concatenated.
• Ported search/sort/etc. to curry format so that data is applied separately (({...})(data)). This allows you to compose.
• Made sure sorting resolves values correctly through column.cell.resolve.
• Improved outlook of the documentation site.

rc2

• Fixed Table to Table.Provider. There was something extra at dist-modules (workflow issue).

rc3

• Moved from right to left to left to right evaluation. This means column definition props, column/header.props and transforms are evaluated in this specific order. I had to make this change as I realized you have to be able to specialize props.
• Expanded documentation greatly. Now most of examples are inline and there is also example code available.
• Dropped lodash.merge and lodash.find dependencies. This brought the size of the minified standalone bundle to around 27k. It still bundles lodash.get and lodash.has so there’s room for improvement if those can be written out.
• Instead of deep merging props, now I do something more clever. Only style props are deep merged (one level deep). This seemed to improve performance somewhat although there are still likely tweaks left. I would need some kind of benchmark to improve this further.
• Simplified sorting interface. Now you can do just sortable instead of sortable('property'). Big thanks to @skosch for pushing me to the right direction with this.

rc4

• Reworked the search interface to support the concept of position. This was lost in the previous column index based refactoring and I realized we still need position for tracking the order of sorting since the order cannot be implicit for multi-column sort. See the API for details.
• Wrote react-addons-update out of documentation. I replaced it with a small solution of my own.
• Expanded the all features example to include more features (toggling, resizing columns) to make it more complete.
• Added links between the main content and the examples. Also pushed a few more there so that they are easier to find.
• Pushed the project below an organization of its own. This way it’s easier to expand and implement more related packages.
• Generalized toFormatter as a function of its own. Now there’s no need to implement it per transform. See the API.
• Added an example of a custom editor.
• Added search customization example.
• Expanded the stateful example with resizable property.
• Added initial infinite scrolling example.

There are still smaller things to do like release logs and a migration guide, but not that much. Feedback would be very welcome.

You can install the release candidate through npm i reactabular@rc4.

[bebraw]

rc4 is out. Most importantly the sort interface includes order information now since that matters for multi-column sorting. Also made toFormatter more generic function. See the issue for further details.

Unless something serious comes up, this will likely be the final release. Still not too late to get changes in. If we need to break the API after that, then we’ll do 2.0 etc.

[bebraw]

@skosch I fixed the issue in beta8. Also renamed header.value as header.label as that describes the intent better.