Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
react-infinite-list
Advanced tools
react-infinite-list - npm Package Compare versions
Comparing version 0.1.0 to 0.1.1
| (function webpackUniversalModuleDefinition(root, factory) { | ||
| if(typeof exports === 'object' && typeof module === 'object') | ||
| module.exports = factory(require("React")); | ||
| module.exports = factory(require("react")); | ||
| else if(typeof define === 'function' && define.amd) | ||
| define(["React"], factory); | ||
| define(["react"], factory); | ||
| else if(typeof exports === 'object') | ||
| exports["react-infinite-list"] = factory(require("React")); | ||
| exports["react-infinite-list"] = factory(require("react")); | ||
| else | ||
@@ -99,2 +99,7 @@ root["react-infinite-list"] = factory(root["React"]); | ||
| InfiniteListItem.propTypes = { | ||
| height: React.PropTypes.number.isRequired, | ||
| title: React.PropTypes.string.isRequired | ||
| }; | ||
| var InfiniteList = (function (_React$Component2) { | ||
@@ -106,6 +111,3 @@ function InfiniteList(props) { | ||
| this.state = { | ||
| renderedStart: 0, | ||
| renderedEnd: this.props.numOfVisibleItems | ||
| }; | ||
| this.state = { renderedStart: 0 }; | ||
| } | ||
@@ -118,60 +120,59 @@ | ||
| value: function onScroll() { | ||
| this._calculateVisibleItems(); | ||
| } | ||
| }, | ||
| _calculateVisibleItems: { | ||
| value: function _calculateVisibleItems() { | ||
| var scrolledPx = React.findDOMNode(this).scrollTop; | ||
| var visibleStart = parseInt(scrolledPx / this.props.itemHeight); | ||
| var visibleEnd = Math.min(visibleStart + this.props.numOfVisibleItems, this.props.items.length - 1); | ||
| if (visibleStart !== this.state.renderedStart) { | ||
| this._showItems(visibleStart, visibleEnd); | ||
| this.setState({ renderedStart: visibleStart }); | ||
| } | ||
| } | ||
| }, | ||
| renderFromStart: { | ||
| value: function renderFromStart() { | ||
| this.getDOMNode().scrollTop = 0; | ||
| componentWillReceiveProps: { | ||
| value: function componentWillReceiveProps(nextProps) { | ||
| var itemsChanged = this.props.items.length !== nextProps.items.length, | ||
| visibleItemsChanged = this.props.numOfVisibleItems !== nextProps.numOfVisibleItems; | ||
| this.setState({ | ||
| renderedStart: 0, | ||
| renderedEnd: this.props.numOfVisibleItems | ||
| }); | ||
| // scroll to the top when searching | ||
| if (itemsChanged) { | ||
| React.findDOMNode(this).scrollTop = 0; | ||
| } | ||
| if (itemsChanged || visibleItemsChanged) { | ||
| this._calculateVisibleItems(); | ||
| } | ||
| } | ||
| }, | ||
| _showItems: { | ||
| value: function _showItems(visibleStart, visibleEnd) { | ||
| this.setState({ | ||
| renderedStart: visibleStart, | ||
| renderedEnd: visibleEnd | ||
| }); | ||
| _getItemComponent: { | ||
| value: function _getItemComponent(item) { | ||
| var ListItemComponent = this.props.listItemClass || InfiniteListItem; | ||
| return React.createElement(ListItemComponent, _extends({ key: item.id }, item, { height: this.props.itemHeight })); | ||
| } | ||
| }, | ||
| _getListItemClass: { | ||
| value: function _getListItemClass(item, height) { | ||
| if (this.props.listItemClass) { | ||
| return React.createElement(this.props.listItemClass, _extends({ key: item.id }, item, { height: height })); | ||
| } | ||
| return React.createElement(InfiniteListItem, _extends({ key: item.id }, item, { height: height })); | ||
| } | ||
| }, | ||
| render: { | ||
| value: function render() { | ||
| var itemsToRender = {}; | ||
| var renderedStart = this.state.renderedStart;var _props = this.props; | ||
| var items = _props.items; | ||
| var itemHeight = _props.itemHeight; | ||
| itemsToRender.top = React.createElement("div", { className: "topitem", | ||
| style: { height: this.state.renderedStart * this.props.itemHeight } }); | ||
| var numOfVisibleItems = _props.numOfVisibleItems; | ||
| var paddingHeight = renderedStart * itemHeight; | ||
| var visibleHeight = numOfVisibleItems * itemHeight; | ||
| var listHeight = items.length * itemHeight; | ||
| for (var i = this.state.renderedStart; i <= this.state.renderedEnd; i++) { | ||
| var item = this.props.items[i]; | ||
| itemsToRender["item " + i] = this._getListItemClass(item, this.props.itemHeight); | ||
| } | ||
| var visibleItems = items.slice(renderedStart, renderedStart + numOfVisibleItems); | ||
| var listItems = visibleItems.map(this._getItemComponent, this); | ||
| return React.createElement( | ||
| "div", | ||
| { className: "infinite-list", onScroll: this.onScroll.bind(this), | ||
| style: { height: this.props.itemHeight * this.props.numOfVisibleItems } }, | ||
| { className: "infinite-list", onScroll: this.onScroll.bind(this), style: { height: visibleHeight } }, | ||
| React.createElement( | ||
| "div", | ||
| { className: "infinite-list-content", | ||
| style: { height: this.props.items.length * this.props.itemHeight } }, | ||
| React.addons.createFragment(itemsToRender) | ||
| { className: "infinite-list-content", style: { height: listHeight } }, | ||
| React.createElement("div", { className: "topitem", style: { height: paddingHeight }, key: "top" }), | ||
| listItems | ||
| ) | ||
@@ -188,2 +189,8 @@ ); | ||
| InfiniteList.propTypes = { | ||
| items: React.PropTypes.array.isRequired, | ||
| itemHeight: React.PropTypes.number.isRequired, | ||
| numOfVisibleItems: React.PropTypes.number.isRequired | ||
| }; | ||
| /***/ }, | ||
@@ -190,0 +197,0 @@ /* 1 */ |
@@ -1,1 +0,1 @@ | ||
| !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("React")):"function"==typeof define&&define.amd?define(["React"],e):"object"==typeof exports?exports["react-infinite-list"]=e(require("React")):t["react-infinite-list"]=e(t.React)}(this,function(t){return function(t){function e(i){if(r[i])return r[i].exports;var n=r[i]={exports:{},id:i,loaded:!1};return t[i].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var r={};return e.m=t,e.c=r,e.p="",e(0)}([function(t,e,r){"use strict";var i=function(t){return t&&t.__esModule?t["default"]:t},n=function h(t,e,r){var i=Object.getOwnPropertyDescriptor(t,e);if(void 0===i){var n=Object.getPrototypeOf(t);return null===n?void 0:h(n,e,r)}if("value"in i&&i.writable)return i.value;var s=i.get;return void 0===s?void 0:s.call(r)},s=function(){function t(t,e){for(var r in e){var i=e[r];i.configurable=!0,i.value&&(i.writable=!0)}Object.defineProperties(t,e)}return function(e,r,i){return r&&t(e.prototype,r),i&&t(e,i),e}}(),o=function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(t.__proto__=e)},a=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},l=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var i in r)Object.prototype.hasOwnProperty.call(r,i)&&(t[i]=r[i])}return t},p=i(r(1)),u=function(t){function e(){a(this,e),null!=t&&t.apply(this,arguments)}return o(e,t),s(e,{render:{value:function(){return p.createElement("div",{className:"infinite-list-item",style:{height:this.props.height}},this.props.title)}}}),e}(p.Component),c=function(t){function e(t){a(this,e),n(Object.getPrototypeOf(e.prototype),"constructor",this).call(this,t),this.state={renderedStart:0,renderedEnd:this.props.numOfVisibleItems}}return o(e,t),s(e,{onScroll:{value:function(){var t=p.findDOMNode(this).scrollTop,e=parseInt(t/this.props.itemHeight),r=Math.min(e+this.props.numOfVisibleItems,this.props.items.length-1);e!==this.state.renderedStart&&this._showItems(e,r)}},renderFromStart:{value:function(){this.getDOMNode().scrollTop=0,this.setState({renderedStart:0,renderedEnd:this.props.numOfVisibleItems})}},_showItems:{value:function(t,e){this.setState({renderedStart:t,renderedEnd:e})}},_getListItemClass:{value:function(t,e){return this.props.listItemClass?p.createElement(this.props.listItemClass,l({key:t.id},t,{height:e})):p.createElement(u,l({key:t.id},t,{height:e}))}},render:{value:function(){var t={};t.top=p.createElement("div",{className:"topitem",style:{height:this.state.renderedStart*this.props.itemHeight}});for(var e=this.state.renderedStart;e<=this.state.renderedEnd;e++){var r=this.props.items[e];t["item "+e]=this._getListItemClass(r,this.props.itemHeight)}return p.createElement("div",{className:"infinite-list",onScroll:this.onScroll.bind(this),style:{height:this.props.itemHeight*this.props.numOfVisibleItems}},p.createElement("div",{className:"infinite-list-content",style:{height:this.props.items.length*this.props.itemHeight}},p.addons.createFragment(t)))}}}),e}(p.Component);t.exports=c},function(e,r,i){e.exports=t}])}); | ||
| !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports["react-infinite-list"]=t(require("react")):e["react-infinite-list"]=t(e.React)}(this,function(e){return function(e){function t(i){if(r[i])return r[i].exports;var n=r[i]={exports:{},id:i,loaded:!1};return e[i].call(n.exports,n,n.exports,t),n.loaded=!0,n.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){"use strict";var i=function(e){return e&&e.__esModule?e["default"]:e},n=function f(e,t,r){var i=Object.getOwnPropertyDescriptor(e,t);if(void 0===i){var n=Object.getPrototypeOf(e);return null===n?void 0:f(n,t,r)}if("value"in i&&i.writable)return i.value;var o=i.get;return void 0===o?void 0:o.call(r)},o=function(){function e(e,t){for(var r in t){var i=t[r];i.configurable=!0,i.value&&(i.writable=!0)}Object.defineProperties(e,t)}return function(t,r,i){return r&&e(t.prototype,r),i&&e(t,i),t}}(),s=function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(e.__proto__=t)},l=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var i in r)Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},u=i(r(1)),c=function(e){function t(){l(this,t),null!=e&&e.apply(this,arguments)}return s(t,e),o(t,{render:{value:function(){return u.createElement("div",{className:"infinite-list-item",style:{height:this.props.height}},this.props.title)}}}),t}(u.Component);c.propTypes={height:u.PropTypes.number.isRequired,title:u.PropTypes.string.isRequired};var p=function(e){function t(e){l(this,t),n(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.state={renderedStart:0}}return s(t,e),o(t,{onScroll:{value:function(){this._calculateVisibleItems()}},_calculateVisibleItems:{value:function(){var e=u.findDOMNode(this).scrollTop,t=parseInt(e/this.props.itemHeight);t!==this.state.renderedStart&&this.setState({renderedStart:t})}},componentWillReceiveProps:{value:function(e){var t=this.props.items.length!==e.items.length,r=this.props.numOfVisibleItems!==e.numOfVisibleItems;t&&(u.findDOMNode(this).scrollTop=0),(t||r)&&this._calculateVisibleItems()}},_getItemComponent:{value:function(e){var t=this.props.listItemClass||c;return u.createElement(t,a({key:e.id},e,{height:this.props.itemHeight}))}},render:{value:function(){var e=this.state.renderedStart,t=this.props,r=t.items,i=t.itemHeight,n=t.numOfVisibleItems,o=e*i,s=n*i,l=r.length*i,a=r.slice(e,e+n),c=a.map(this._getItemComponent,this);return u.createElement("div",{className:"infinite-list",onScroll:this.onScroll.bind(this),style:{height:s}},u.createElement("div",{className:"infinite-list-content",style:{height:l}},u.createElement("div",{className:"topitem",style:{height:o},key:"top"}),c))}}}),t}(u.Component);e.exports=p,p.propTypes={items:u.PropTypes.array.isRequired,itemHeight:u.PropTypes.number.isRequired,numOfVisibleItems:u.PropTypes.number.isRequired}},function(t,r,i){t.exports=e}])}); |
@@ -1,4 +0,4 @@ | ||
| 'use strict'; | ||
| "use strict"; | ||
| Object.defineProperty(exports, '__esModule', { | ||
| Object.defineProperty(exports, "__esModule", { | ||
| value: true | ||
@@ -9,15 +9,15 @@ }); | ||
| var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } }; | ||
| var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } }; | ||
| var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })(); | ||
| var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })(); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } } | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; } | ||
| function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; } | ||
| var _reactAddons = require('react/addons'); | ||
| var _react = require("react"); | ||
| var _reactAddons2 = _interopRequireDefault(_reactAddons); | ||
| var _react2 = _interopRequireDefault(_react); | ||
@@ -36,7 +36,7 @@ var InfiniteListItem = (function (_React$Component) { | ||
| _createClass(InfiniteListItem, [{ | ||
| key: 'render', | ||
| key: "render", | ||
| value: function render() { | ||
| return _reactAddons2['default'].createElement( | ||
| 'div', | ||
| { className: 'infinite-list-item', style: { height: this.props.height } }, | ||
| return _react2["default"].createElement( | ||
| "div", | ||
| { className: "infinite-list-item", style: { height: this.props.height } }, | ||
| this.props.title | ||
@@ -48,4 +48,9 @@ ); | ||
| return InfiniteListItem; | ||
| })(_reactAddons2['default'].Component); | ||
| })(_react2["default"].Component); | ||
| InfiniteListItem.propTypes = { | ||
| height: _react2["default"].PropTypes.number.isRequired, | ||
| title: _react2["default"].PropTypes.string.isRequired | ||
| }; | ||
| var InfiniteList = (function (_React$Component2) { | ||
@@ -55,8 +60,5 @@ function InfiniteList(props) { | ||
| _get(Object.getPrototypeOf(InfiniteList.prototype), 'constructor', this).call(this, props); | ||
| _get(Object.getPrototypeOf(InfiniteList.prototype), "constructor", this).call(this, props); | ||
| this.state = { | ||
| renderedStart: 0, | ||
| renderedEnd: this.props.numOfVisibleItems | ||
| }; | ||
| this.state = { renderedStart: 0 }; | ||
| } | ||
@@ -67,62 +69,61 @@ | ||
| _createClass(InfiniteList, [{ | ||
| key: 'onScroll', | ||
| key: "onScroll", | ||
| value: function onScroll() { | ||
| var scrolledPx = _reactAddons2['default'].findDOMNode(this).scrollTop; | ||
| this._calculateVisibleItems(); | ||
| } | ||
| }, { | ||
| key: "_calculateVisibleItems", | ||
| value: function _calculateVisibleItems() { | ||
| var scrolledPx = _react2["default"].findDOMNode(this).scrollTop; | ||
| var visibleStart = parseInt(scrolledPx / this.props.itemHeight); | ||
| var visibleEnd = Math.min(visibleStart + this.props.numOfVisibleItems, this.props.items.length - 1); | ||
| if (visibleStart !== this.state.renderedStart) { | ||
| this._showItems(visibleStart, visibleEnd); | ||
| this.setState({ renderedStart: visibleStart }); | ||
| } | ||
| } | ||
| }, { | ||
| key: 'renderFromStart', | ||
| value: function renderFromStart() { | ||
| this.getDOMNode().scrollTop = 0; | ||
| key: "componentWillReceiveProps", | ||
| value: function componentWillReceiveProps(nextProps) { | ||
| var itemsChanged = this.props.items.length !== nextProps.items.length, | ||
| visibleItemsChanged = this.props.numOfVisibleItems !== nextProps.numOfVisibleItems; | ||
| this.setState({ | ||
| renderedStart: 0, | ||
| renderedEnd: this.props.numOfVisibleItems | ||
| }); | ||
| // scroll to the top when searching | ||
| if (itemsChanged) { | ||
| _react2["default"].findDOMNode(this).scrollTop = 0; | ||
| } | ||
| if (itemsChanged || visibleItemsChanged) { | ||
| this._calculateVisibleItems(); | ||
| } | ||
| } | ||
| }, { | ||
| key: '_showItems', | ||
| value: function _showItems(visibleStart, visibleEnd) { | ||
| this.setState({ | ||
| renderedStart: visibleStart, | ||
| renderedEnd: visibleEnd | ||
| }); | ||
| key: "_getItemComponent", | ||
| value: function _getItemComponent(item) { | ||
| var ListItemComponent = this.props.listItemClass || InfiniteListItem; | ||
| return _react2["default"].createElement(ListItemComponent, _extends({ key: item.id }, item, { height: this.props.itemHeight })); | ||
| } | ||
| }, { | ||
| key: '_getListItemClass', | ||
| value: function _getListItemClass(item, height) { | ||
| if (this.props.listItemClass) { | ||
| return _reactAddons2['default'].createElement(this.props.listItemClass, _extends({ key: item.id }, item, { height: height })); | ||
| } | ||
| return _reactAddons2['default'].createElement(InfiniteListItem, _extends({ key: item.id }, item, { height: height })); | ||
| } | ||
| }, { | ||
| key: 'render', | ||
| key: "render", | ||
| value: function render() { | ||
| var itemsToRender = {}; | ||
| var renderedStart = this.state.renderedStart;var _props = this.props; | ||
| var items = _props.items; | ||
| var itemHeight = _props.itemHeight; | ||
| itemsToRender['top'] = _reactAddons2['default'].createElement('div', { className: 'topitem', | ||
| style: { height: this.state.renderedStart * this.props.itemHeight } }); | ||
| var numOfVisibleItems = _props.numOfVisibleItems; | ||
| var paddingHeight = renderedStart * itemHeight; | ||
| var visibleHeight = numOfVisibleItems * itemHeight; | ||
| var listHeight = items.length * itemHeight; | ||
| for (var i = this.state.renderedStart; i <= this.state.renderedEnd; i++) { | ||
| var item = this.props.items[i]; | ||
| itemsToRender['item ' + i] = this._getListItemClass(item, this.props.itemHeight); | ||
| } | ||
| var visibleItems = items.slice(renderedStart, renderedStart + numOfVisibleItems); | ||
| var listItems = visibleItems.map(this._getItemComponent, this); | ||
| return _reactAddons2['default'].createElement( | ||
| 'div', | ||
| { className: 'infinite-list', onScroll: this.onScroll.bind(this), | ||
| style: { height: this.props.itemHeight * this.props.numOfVisibleItems } }, | ||
| _reactAddons2['default'].createElement( | ||
| 'div', | ||
| { className: 'infinite-list-content', | ||
| style: { height: this.props.items.length * this.props.itemHeight } }, | ||
| _reactAddons2['default'].addons.createFragment(itemsToRender) | ||
| return _react2["default"].createElement( | ||
| "div", | ||
| { className: "infinite-list", onScroll: this.onScroll.bind(this), style: { height: visibleHeight } }, | ||
| _react2["default"].createElement( | ||
| "div", | ||
| { className: "infinite-list-content", style: { height: listHeight } }, | ||
| _react2["default"].createElement("div", { className: "topitem", style: { height: paddingHeight }, key: "top" }), | ||
| listItems | ||
| ) | ||
@@ -134,5 +135,12 @@ ); | ||
| return InfiniteList; | ||
| })(_reactAddons2['default'].Component); | ||
| })(_react2["default"].Component); | ||
| exports['default'] = InfiniteList; | ||
| module.exports = exports['default']; | ||
| exports["default"] = InfiniteList; | ||
| InfiniteList.propTypes = { | ||
| items: _react2["default"].PropTypes.array.isRequired, | ||
| itemHeight: _react2["default"].PropTypes.number.isRequired, | ||
| numOfVisibleItems: _react2["default"].PropTypes.number.isRequired, | ||
| listItemClass: _react2["default"].PropTypes.element | ||
| }; | ||
| module.exports = exports["default"]; |
| { | ||
| "name": "react-infinite-list", | ||
| "version": "0.1.0", | ||
| "version": "0.1.1", | ||
| "description": "", | ||
@@ -5,0 +5,0 @@ "main": "lib/react-infinite-list.js", |
@@ -12,5 +12,5 @@ React Infinite List | ||
| ```sh | ||
| npm install react-infinite-list --save | ||
| npm install react-infinite-list --save-dev | ||
| # or | ||
| bower install react-infinite-list --save | ||
| bower install react-infinite-list --save-dev | ||
| ``` | ||
@@ -48,5 +48,8 @@ | ||
| See [example.js](example/example.js) for more details. | ||
| Example | ||
| ------- | ||
| Clone this repo and run `npm i`. After the dependencies are installed, just issue: | ||
| ``` | ||
| npm start | ||
| ``` | ||
| and wait till webpack builds the bundel. Brower shall be opened on port 3000. |
Fixed alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by1.3%
66652
- Lines of code
- increased by4.01%
285
- Number of lines in readme file
- increased by5.88%
54
- Number of medium supply chain risk alerts
- decreased by-100%
0
No dependency changes