diff options
Diffstat (limited to 'src/lib/SmartList')
-rw-r--r-- | src/lib/SmartList/SmartList.js | 28 | ||||
-rw-r--r-- | src/lib/SmartList/SmartList.tsx | 44 |
2 files changed, 44 insertions, 28 deletions
diff --git a/src/lib/SmartList/SmartList.js b/src/lib/SmartList/SmartList.js deleted file mode 100644 index b462c47..0000000 --- a/src/lib/SmartList/SmartList.js +++ /dev/null @@ -1,28 +0,0 @@ -import React from 'react'; - -import { FixedSizeList } from 'react-window'; -import AutoSizer from 'react-virtualized-auto-sizer'; - - -const SmartList = ({ itemSize, itemCount, renderItem }) => { - - return ( - <div style={{ flex: '1 1 auto', overflow: 'hidden' }}> - <AutoSizer> - {({ width, height }) => ( - <FixedSizeList - height={height} - width={width} - itemSize={itemSize} - itemCount={itemCount} - > - {renderItem} - </FixedSizeList> - )} - </AutoSizer> - </div> - ); -}; - - -export default SmartList; diff --git a/src/lib/SmartList/SmartList.tsx b/src/lib/SmartList/SmartList.tsx new file mode 100644 index 0000000..c889719 --- /dev/null +++ b/src/lib/SmartList/SmartList.tsx @@ -0,0 +1,44 @@ +import React from 'react'; +import { FixedSizeList } from 'react-window'; +import AutoSizer from 'react-virtualized-auto-sizer'; + + +interface RenderPropTypes { + index: number; + style: any; +} + +interface PropTypes { + itemSize: number; + itemCount: number; + renderItem: React.FC<RenderPropTypes>; +} + +interface Size { + height: number; + width: number; +} + + +const SmartList: React.FC<PropTypes> = ({ itemSize, itemCount, renderItem }) => { + + const ResizedList: React.FC<Size> = ({ width, height}) => ( + <FixedSizeList + height={height} + width={width} + itemSize={itemSize} + itemCount={itemCount} + > + {renderItem} + </FixedSizeList> + ); + + return ( + <div style={{ flex: '1 1 auto', overflow: 'hidden' }}> + <AutoSizer children={ResizedList} /> + </div> + ); +}; + + +export default SmartList; |