react-virtualized - npm Package Compare versions

Comparing version 5.0.1 to 5.1.0

CHANGELOG.md

 Changelog
 ------------
 
+### 5.1.0
+Added `ColumnSizer` high-order component for auto-calculating column widths for `Grid` cells.
+
 #### 5.0.1
@@ -5,0 +8,0 @@

docs/README.md

@@ -6,15 +6,18 @@ Documentation
 
+* [FlexTable](FlexTable.md)
+  * [FlexColumn](FlexColumn.md)
+  * [SortDirection](SortDirection.md)
+* [Grid](Grid.md)
+* [VirtualScroll](VirtualScroll.md)
+
+### High-Order Components
 * [AutoSizer](AutoSizer.md)
-* [FlexColumn](FlexColumn.md)
-* [Grid](Grid.md)
-* [FlexTable](FlexTable.md)
+* [ColumnSizer](ColumnSizer.md)
 * [InfiniteLoader](InfiniteLoader.md)
 * [ScrollSync](ScrollSync.md)
-* [SortDirection](SortDirection.md)
-* [VirtualScroll](VirtualScroll.md)
 
 ### How-to Guides
 
-* [Customizing classes and styles](customizingStyles.md).
-* [Displaying items in reverse order](reverseList.md).
-* [Using AutoSizer](usingAutoSizer.md).
+* [Customizing classes and styles](customizingStyles.md)
+* [Displaying items in reverse order](reverseList.md)
+* [Using AutoSizer](usingAutoSizer.md)

docs/usingAutoSizer.md

@@ -44,3 +44,3 @@ Using AutoSizer
 #### Using AutoSizer with InfiniteLoader
-`AutoScroller` can be used within other react-virtualized HOCs such as `InfiniteLoader` or `ScrollSync` like so:
+`AutoSizer` can be used within other react-virtualized HOCs such as `InfiniteLoader` or `ScrollSync` like so:
 
@@ -47,0 +47,0 @@ ```html

es/index.js

@@ -16,2 +16,11 @@ 'use strict';
 
+var _ColumnSizer = require('./ColumnSizer');
+
+Object.defineProperty(exports, 'ColumnSizer', {
+  enumerable: true,
+  get: function get() {
+    return _ColumnSizer.ColumnSizer;
+  }
+});
+
 var _FlexTable = require('./FlexTable');
@@ -18,0 +27,0 @@

package.json

@@ -6,3 +6,3 @@ {
   "user": "bvaughn",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "homepage": "https://github.com/bvaughn/react-virtualized",
@@ -9,0 +9,0 @@ "main": "dist/react-virtualized.js",

source/demo/Application.js

 import AutoSizerExample from '../AutoSizer/AutoSizer.example'
+import ColumnSizerExample from '../ColumnSizer/ColumnSizer.example'
 import ComponentLink from './ComponentLink'
@@ -17,3 +18,4 @@ import GridExample from '../Grid/Grid.example'
 
-const COMPONENTS = ['AutoSizer', 'Grid', 'FlexTable', 'InfiniteLoader', 'ScrollSync', 'VirtualScroll']
+const COMPONENTS = ['Grid', 'FlexTable', 'VirtualScroll']
+const HIGH_ORDER_COMPONENTS = ['AutoSizer', 'ColumnSizer', 'InfiniteLoader', 'ScrollSync']
 
@@ -31,3 +33,3 @@ // HACK Generate arbitrary data for use in example components :)
     const matches = window.location.search.match('component=(.+)')
-    const activeComponent = matches && COMPONENTS.includes(matches[1])
+    const activeComponent = matches && (COMPONENTS.includes(matches[1]) || HIGH_ORDER_COMPONENTS.includes(matches[1]))
       ? matches[1]
@@ -91,2 +93,13 @@ : 'VirtualScroll'
           </ul>
+
+          <ul className={styles.HighOrderComponentList}>
+            {HIGH_ORDER_COMPONENTS.map(component => (
+              <ComponentLink
+                key={component}
+                activeComponent={activeComponent}
+                component={component}
+                setActiveComponent={setActiveComponent}
+              />
+            ))}
+          </ul>
         </div>
@@ -101,2 +114,8 @@
           }
+          {activeComponent === 'ColumnSizer' &&
+            <ColumnSizerExample
+              className={styles.column}
+              list={list}
+            />
+          }
           {activeComponent === 'FlexTable' &&
@@ -103,0 +122,0 @@ <FlexTableExample

source/Grid/Grid.example.js

@@ -149,2 +149,3 @@ /** @flow */
               height={height}
+              noContentRenderer={this._noContentRenderer}
               overscanColumnsCount={overscanColumnsCount}
@@ -151,0 +152,0 @@ renderCell={this._renderCell}

source/index.js

 /* @flow */
 export { AutoSizer } from './AutoSizer'
+export { ColumnSizer } from './ColumnSizer'
 export { FlexTable, FlexColumn, SortDirection, SortIndicator } from './FlexTable'
@@ -4,0 +5,0 @@ export { Grid } from './Grid'

No alert changes

Improved metrics

Total package byte prevSize

827321

increased by5.57%

Number of package files

102

increased by8.51%

Lines of code

11761

increased by5.82%

No dependency changes