react-waypoint
Advanced tools
react-waypoint - npm Package Compare versions
Comparing version 8.0.2 to 8.0.3
@@ -0,1 +1,6 @@ | ||
| ## 8.0.3 | ||
| - Defer `handleScroll` in `componentDidUpdate` ([#265](https://github.com/brigade/react-waypoint/pull/265)) | ||
| - Extend `React.PureComponent` instead of `React.Component` when available ([#264](https://github.com/brigade/react-waypoint/pull/264)) | ||
| ## 8.0.2 | ||
@@ -2,0 +7,0 @@ |
@@ -249,9 +249,10 @@ 'use strict'; | ||
| /** | ||
| * Calls a function when you scroll to the element. | ||
| */ | ||
| // React.PureComponent was added in React 15.3.0 | ||
| var BaseClass = typeof React.PureComponent !== 'undefined' ? React.PureComponent : React.Component; | ||
| var Waypoint = function (_React$Component) { | ||
| _inherits(Waypoint, _React$Component); | ||
| // Calls a function when you scroll to the element. | ||
| var Waypoint = function (_BaseClass) { | ||
| _inherits(Waypoint, _BaseClass); | ||
| function Waypoint(props) { | ||
@@ -288,5 +289,7 @@ _classCallCheck(this, Waypoint); | ||
| // this._ref may occasionally not be set at this time. To help ensure that | ||
| // this works smoothly, we want to delay the initial execution until the | ||
| // next tick. | ||
| this.cancelInitialTimeout = onNextTick(function () { | ||
| // this works smoothly and to avoid layout thrashing, we want to delay the | ||
| // initial execution until the next tick. | ||
| this.cancelOnNextTick = onNextTick(function () { | ||
| _this2.cancelOnNextTick = null; | ||
| // Berofe doing anything, we want to check that this._ref is avaliable in Waypoint | ||
@@ -325,2 +328,4 @@ ensureRefIsProvidedByChild(_this2.props.children, _this2._ref); | ||
| function componentDidUpdate() { | ||
| var _this3 = this; | ||
| if (!Waypoint.getWindow()) { | ||
@@ -335,4 +340,17 @@ return; | ||
| // The element may have moved. | ||
| this._handleScroll(null); | ||
| // The element may have moved, so we need to recompute its position on the | ||
| // page. This happens via handleScroll in a way that forces layout to be | ||
| // computed. | ||
| // | ||
| // We want this to be deferred to avoid forcing layout during render, which | ||
| // causes layout thrashing. And, if we already have this work enqueued, we | ||
| // can just wait for that to happen instead of enqueueing again. | ||
| if (this.cancelOnNextTick) { | ||
| return; | ||
| } | ||
| this.cancelOnNextTick = onNextTick(function () { | ||
| _this3.cancelOnNextTick = null; | ||
| _this3._handleScroll(null); | ||
| }); | ||
| } | ||
@@ -357,4 +375,4 @@ | ||
| if (this.cancelInitialTimeout) { | ||
| this.cancelInitialTimeout(); | ||
| if (this.cancelOnNextTick) { | ||
| this.cancelOnNextTick(); | ||
| } | ||
@@ -552,3 +570,3 @@ } | ||
| function render() { | ||
| var _this3 = this; | ||
| var _this4 = this; | ||
@@ -567,3 +585,3 @@ var children = this.props.children; | ||
| function ref(node) { | ||
| _this3.refElement(node); | ||
| _this4.refElement(node); | ||
| if (children.ref) { | ||
@@ -588,6 +606,6 @@ children.ref(node); | ||
| return Waypoint; | ||
| }(React.Component); | ||
| }(BaseClass); | ||
| process.env.NODE_ENV !== "production" ? Waypoint.propTypes = { | ||
| Waypoint.propTypes = { | ||
| children: PropTypes.node, | ||
@@ -613,3 +631,3 @@ debug: PropTypes.bool, | ||
| bottomOffset: PropTypes.oneOfType([PropTypes.string, PropTypes.number]) | ||
| } : void 0; | ||
| }; | ||
@@ -616,0 +634,0 @@ Waypoint.above = constants.above; |
@@ -245,9 +245,10 @@ import React from 'react'; | ||
| /** | ||
| * Calls a function when you scroll to the element. | ||
| */ | ||
| // React.PureComponent was added in React 15.3.0 | ||
| var BaseClass = typeof React.PureComponent !== 'undefined' ? React.PureComponent : React.Component; | ||
| var Waypoint = function (_React$Component) { | ||
| _inherits(Waypoint, _React$Component); | ||
| // Calls a function when you scroll to the element. | ||
| var Waypoint = function (_BaseClass) { | ||
| _inherits(Waypoint, _BaseClass); | ||
| function Waypoint(props) { | ||
@@ -284,5 +285,7 @@ _classCallCheck(this, Waypoint); | ||
| // this._ref may occasionally not be set at this time. To help ensure that | ||
| // this works smoothly, we want to delay the initial execution until the | ||
| // next tick. | ||
| this.cancelInitialTimeout = onNextTick(function () { | ||
| // this works smoothly and to avoid layout thrashing, we want to delay the | ||
| // initial execution until the next tick. | ||
| this.cancelOnNextTick = onNextTick(function () { | ||
| _this2.cancelOnNextTick = null; | ||
| // Berofe doing anything, we want to check that this._ref is avaliable in Waypoint | ||
@@ -321,2 +324,4 @@ ensureRefIsProvidedByChild(_this2.props.children, _this2._ref); | ||
| function componentDidUpdate() { | ||
| var _this3 = this; | ||
| if (!Waypoint.getWindow()) { | ||
@@ -331,4 +336,17 @@ return; | ||
| // The element may have moved. | ||
| this._handleScroll(null); | ||
| // The element may have moved, so we need to recompute its position on the | ||
| // page. This happens via handleScroll in a way that forces layout to be | ||
| // computed. | ||
| // | ||
| // We want this to be deferred to avoid forcing layout during render, which | ||
| // causes layout thrashing. And, if we already have this work enqueued, we | ||
| // can just wait for that to happen instead of enqueueing again. | ||
| if (this.cancelOnNextTick) { | ||
| return; | ||
| } | ||
| this.cancelOnNextTick = onNextTick(function () { | ||
| _this3.cancelOnNextTick = null; | ||
| _this3._handleScroll(null); | ||
| }); | ||
| } | ||
@@ -353,4 +371,4 @@ | ||
| if (this.cancelInitialTimeout) { | ||
| this.cancelInitialTimeout(); | ||
| if (this.cancelOnNextTick) { | ||
| this.cancelOnNextTick(); | ||
| } | ||
@@ -548,3 +566,3 @@ } | ||
| function render() { | ||
| var _this3 = this; | ||
| var _this4 = this; | ||
@@ -563,3 +581,3 @@ var children = this.props.children; | ||
| function ref(node) { | ||
| _this3.refElement(node); | ||
| _this4.refElement(node); | ||
| if (children.ref) { | ||
@@ -584,6 +602,6 @@ children.ref(node); | ||
| return Waypoint; | ||
| }(React.Component); | ||
| }(BaseClass); | ||
| process.env.NODE_ENV !== "production" ? Waypoint.propTypes = { | ||
| Waypoint.propTypes = { | ||
| children: PropTypes.node, | ||
@@ -609,3 +627,3 @@ debug: PropTypes.bool, | ||
| bottomOffset: PropTypes.oneOfType([PropTypes.string, PropTypes.number]) | ||
| } : void 0; | ||
| }; | ||
@@ -612,0 +630,0 @@ Waypoint.above = constants.above; |
@@ -9,2 +9,3 @@ Please use [pull requests](https://github.com/brigade/react-waypoint/pull/new/master) to add your organization and/or project to this document! | ||
| - [DoorDash](https://github.com/doordash) | ||
| - [HousingAnywhere](https://github.com/housinganywhere) | ||
| - [Netflix](https://github.com/Netflix) | ||
@@ -19,1 +20,2 @@ - [Remix](https://github.com/remix) | ||
| - [Happo](https://github.com/Galooshi/happo) | ||
| - [react-ideal-image](https://github.com/stereobooster/react-ideal-image) |
| { | ||
| "name": "react-waypoint", | ||
| "version": "8.0.2", | ||
| "version": "8.0.3", | ||
| "description": "A React component to execute a function whenever you scroll to an element.", | ||
@@ -56,4 +56,4 @@ "main": "cjs/index.js", | ||
| "rimraf": "^2.6.2", | ||
| "rollup": "^0.60.7", | ||
| "rollup-plugin-babel": "^3.0.4", | ||
| "rollup": "^0.62.0", | ||
| "rollup-plugin-babel": "^3.0.7", | ||
| "safe-publish-latest": "^1.1.1", | ||
@@ -60,0 +60,0 @@ "webpack": "^2.3.3" |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by1080.35%
1312813
- Number of package files
- increased by12.5%
18
- Lines of code
- increased by1.29%
2202
- Number of low supply chain risk alerts
- decreased by-11.11%
16