Fix issue with empty space in table if row heights change (#511) (Fixes #510)
Ability to provide custom scrollbars: (#507)
Users can now customize the scrollbars using props scrollbarX and scrollbarY. Also make sure to pass defaultScrollbars as false to let FDT use these custom ones. More info can be found in #507 and #518.
Remove unsafe react lifecycle hooks (#509) (Fixes #492)
Most of the unsafe react lifecycle hooks have been removed from the code base.

Assets 2

28 Nov 16:11

pradeepnschrodinger

v1.0.2

7936a52

v1.0.2

Adds new table prop isRTL that controls usage of RTL within FDT (#497) (Fixes #209)

Assets 2

30 Oct 00:05

pradeepnschrodinger

v1.0.1

3b3ac3a

v1.0.1

Custom Attributes for Grid and Rows (#491) (Fixes #490)

Added function props gridAttributesGetter and rowAttributesGetter.

These functions can be used to return the grid/row HTML attributes. FDT will pass these to the DIV elements representing the grid and the rows.

rowAttributesGetter is invoked for each visible row (including buffer) with the rowIndex as the first param.

Assets 2

03 Dec 09:56

pradeepnschrodinger

v1.0.0

dd871d8

v1.0.0

v1 Release

Architecture Change

The original FDT's architecture from Facebook had issues on state management in context of dynamic row heights and scroll handling. It also calculated most of the state within the main FixedDataTable component which made future development hard.

With the V1 release, we have rewritten the library’s state management using Redux. This resolves the known issues and provides solid support for dynamic row heights.

State management is now handled via Redux, which neatly divides the state management across multiple files. An overview of the codebase can be found here.

Quick Guide on Scroll state:

For computing scroll position, we start with an anchor. This acts like a marker that describes the first/last row in the viewport along with its offset. The scrollAnchor reducer computes the anchor.

Once we have the anchor, we use it to compute the list of rows in the visible viewport (known as virtualization). The computeRenderedRows reducer handles this step. It also caches the width and positions of the visible rows, and recycles new rows with the existing ones to increase performance.

The main reducer index.js simply handles scroll actions directly by using the new scroll value to recompute the scroll anchor. Then the process is repeated. Similarly, for prop changes that determine scroll state (scrollToRow or scrollTop), we dispatch a prop change event, which again recomputes the scroll anchor.

API Changes

There’s no breaking changes intended for the v1 release. But we did fix several issues related to dynamic row heights and touch scrolling. We also added improvements for performance and to control the scroll behavior.

New Table props:

gridAttributesGetter: (function)
Callback that returns an object of html attributes to add to the grid element.
stopScrollDefaultHandling: (boolean)
If enabled scroll events will never be bubbled to the browser default handler. If disabled (default when unspecified), scroll events will be bubbled up if the scroll doesn't lead to a change in scroll offsets, which is preferable if you like the page/container to scroll up when the table is already scrolled up max.
stopReactWheelPropagation: (boolean)
If enabled scroll events will not be propagated outside of the table.

Modified Table props:

We modified the scroll handlers (onScrollStart and onScrollEnd) so that they also report the last visible row index.

onScrollStart: (function)
Callback that is called when scrolling starts. The current horizontal and vertical scroll values, and the current first and last row indexes will be provided to the callback.
onScrollEnd: (function)
Callback that is called when scrolling ends. The new horizontal and vertical scroll values, and the new first and last row indexes will be provided to the callback.