react-error-boundary
Advanced tools
Comparing version 2.3.1 to 2.3.2
@@ -5,7 +5,10 @@ 'use strict'; | ||
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } | ||
var _inheritsLoose = require('@babel/runtime/helpers/inheritsLoose'); | ||
var React = require('react'); | ||
var _inheritsLoose = _interopDefault(require('@babel/runtime/helpers/inheritsLoose')); | ||
var React = _interopDefault(require('react')); | ||
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } | ||
var _inheritsLoose__default = /*#__PURE__*/_interopDefaultLegacy(_inheritsLoose); | ||
var React__default = /*#__PURE__*/_interopDefaultLegacy(React); | ||
var changedArray = function (a, b) { | ||
@@ -31,3 +34,3 @@ if (a === void 0) { | ||
var ErrorBoundary = /*#__PURE__*/function (_React$Component) { | ||
_inheritsLoose(ErrorBoundary, _React$Component); | ||
_inheritsLoose__default['default'](ErrorBoundary, _React$Component); | ||
@@ -59,2 +62,8 @@ function ErrorBoundary() { | ||
ErrorBoundary.getDerivedStateFromError = function getDerivedStateFromError(error) { | ||
return { | ||
error: error | ||
}; | ||
}; | ||
var _proto = ErrorBoundary.prototype; | ||
@@ -67,3 +76,2 @@ | ||
this.setState({ | ||
error: error, | ||
info: info | ||
@@ -74,6 +82,8 @@ }); | ||
_proto.componentDidUpdate = function componentDidUpdate(prevProps) { | ||
var error = this.state.error; | ||
var _this$state = this.state, | ||
error = _this$state.error, | ||
info = _this$state.info; | ||
var resetKeys = this.props.resetKeys; | ||
if (error !== null && changedArray(prevProps.resetKeys, resetKeys)) { | ||
if (error !== null && info !== null && changedArray(prevProps.resetKeys, resetKeys)) { | ||
var _this$props$onResetKe, _this$props3; | ||
@@ -87,5 +97,5 @@ | ||
_proto.render = function render() { | ||
var _this$state = this.state, | ||
error = _this$state.error, | ||
info = _this$state.info; | ||
var _this$state2 = this.state, | ||
error = _this$state2.error, | ||
info = _this$state2.info; | ||
var _this$props4 = this.props, | ||
@@ -97,2 +107,10 @@ fallbackRender = _this$props4.fallbackRender, | ||
if (error !== null) { | ||
// we'll get a re-render with the error state in getDerivedStateFromError | ||
// but we don't have the info yet, so just render null | ||
// note that this won't be committed to the DOM thanks to our componentDidCatch | ||
// so the user won't see a flash of nothing, so this works fine. | ||
// the benefit of doing things this way rather than just putting both the | ||
// error and info setState within componentDidCatch is we avoid re-rendering | ||
// busted stuff: https://github.com/bvaughn/react-error-boundary/issues/66 | ||
if (!info) return null; | ||
var props = { | ||
@@ -104,3 +122,3 @@ componentStack: info == null ? void 0 : info.componentStack, | ||
if ( /*#__PURE__*/React.isValidElement(fallback)) { | ||
if ( /*#__PURE__*/React__default['default'].isValidElement(fallback)) { | ||
return fallback; | ||
@@ -110,3 +128,3 @@ } else if (typeof fallbackRender === 'function') { | ||
} else if (FallbackComponent) { | ||
return /*#__PURE__*/React.createElement(FallbackComponent, props); | ||
return /*#__PURE__*/React__default['default'].createElement(FallbackComponent, props); | ||
} else { | ||
@@ -121,7 +139,7 @@ throw new Error('react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop'); | ||
return ErrorBoundary; | ||
}(React.Component); | ||
}(React__default['default'].Component); | ||
function withErrorBoundary(Component, errorBoundaryProps) { | ||
function Wrapped(props) { | ||
return /*#__PURE__*/React.createElement(ErrorBoundary, errorBoundaryProps, /*#__PURE__*/React.createElement(Component, props)); | ||
return /*#__PURE__*/React__default['default'].createElement(ErrorBoundary, errorBoundaryProps, /*#__PURE__*/React__default['default'].createElement(Component, props)); | ||
} // Format for display in DevTools | ||
@@ -136,3 +154,3 @@ | ||
function useErrorHandler(givenError) { | ||
var _React$useState = React.useState(null), | ||
var _React$useState = React__default['default'].useState(null), | ||
error = _React$useState[0], | ||
@@ -139,0 +157,0 @@ setError = _React$useState[1]; |
@@ -51,2 +51,8 @@ import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose'; | ||
ErrorBoundary.getDerivedStateFromError = function getDerivedStateFromError(error) { | ||
return { | ||
error: error | ||
}; | ||
}; | ||
var _proto = ErrorBoundary.prototype; | ||
@@ -59,3 +65,2 @@ | ||
this.setState({ | ||
error: error, | ||
info: info | ||
@@ -66,6 +71,8 @@ }); | ||
_proto.componentDidUpdate = function componentDidUpdate(prevProps) { | ||
var error = this.state.error; | ||
var _this$state = this.state, | ||
error = _this$state.error, | ||
info = _this$state.info; | ||
var resetKeys = this.props.resetKeys; | ||
if (error !== null && changedArray(prevProps.resetKeys, resetKeys)) { | ||
if (error !== null && info !== null && changedArray(prevProps.resetKeys, resetKeys)) { | ||
var _this$props$onResetKe, _this$props3; | ||
@@ -79,5 +86,5 @@ | ||
_proto.render = function render() { | ||
var _this$state = this.state, | ||
error = _this$state.error, | ||
info = _this$state.info; | ||
var _this$state2 = this.state, | ||
error = _this$state2.error, | ||
info = _this$state2.info; | ||
var _this$props4 = this.props, | ||
@@ -89,2 +96,10 @@ fallbackRender = _this$props4.fallbackRender, | ||
if (error !== null) { | ||
// we'll get a re-render with the error state in getDerivedStateFromError | ||
// but we don't have the info yet, so just render null | ||
// note that this won't be committed to the DOM thanks to our componentDidCatch | ||
// so the user won't see a flash of nothing, so this works fine. | ||
// the benefit of doing things this way rather than just putting both the | ||
// error and info setState within componentDidCatch is we avoid re-rendering | ||
// busted stuff: https://github.com/bvaughn/react-error-boundary/issues/66 | ||
if (!info) return null; | ||
var props = { | ||
@@ -91,0 +106,0 @@ componentStack: info == null ? void 0 : info.componentStack, |
(function (global, factory) { | ||
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) : | ||
typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) : | ||
(global = global || self, factory(global.ReactErrorBoundary = {}, global.React)); | ||
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactErrorBoundary = {}, global.React)); | ||
}(this, (function (exports, React) { 'use strict'; | ||
React = React && Object.prototype.hasOwnProperty.call(React, 'default') ? React['default'] : React; | ||
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } | ||
var React__default = /*#__PURE__*/_interopDefaultLegacy(React); | ||
function _inheritsLoose(subClass, superClass) { | ||
@@ -62,2 +64,8 @@ subClass.prototype = Object.create(superClass.prototype); | ||
ErrorBoundary.getDerivedStateFromError = function getDerivedStateFromError(error) { | ||
return { | ||
error: error | ||
}; | ||
}; | ||
var _proto = ErrorBoundary.prototype; | ||
@@ -70,3 +78,2 @@ | ||
this.setState({ | ||
error: error, | ||
info: info | ||
@@ -77,6 +84,8 @@ }); | ||
_proto.componentDidUpdate = function componentDidUpdate(prevProps) { | ||
var error = this.state.error; | ||
var _this$state = this.state, | ||
error = _this$state.error, | ||
info = _this$state.info; | ||
var resetKeys = this.props.resetKeys; | ||
if (error !== null && changedArray(prevProps.resetKeys, resetKeys)) { | ||
if (error !== null && info !== null && changedArray(prevProps.resetKeys, resetKeys)) { | ||
var _this$props$onResetKe, _this$props3; | ||
@@ -90,5 +99,5 @@ | ||
_proto.render = function render() { | ||
var _this$state = this.state, | ||
error = _this$state.error, | ||
info = _this$state.info; | ||
var _this$state2 = this.state, | ||
error = _this$state2.error, | ||
info = _this$state2.info; | ||
var _this$props4 = this.props, | ||
@@ -100,2 +109,10 @@ fallbackRender = _this$props4.fallbackRender, | ||
if (error !== null) { | ||
// we'll get a re-render with the error state in getDerivedStateFromError | ||
// but we don't have the info yet, so just render null | ||
// note that this won't be committed to the DOM thanks to our componentDidCatch | ||
// so the user won't see a flash of nothing, so this works fine. | ||
// the benefit of doing things this way rather than just putting both the | ||
// error and info setState within componentDidCatch is we avoid re-rendering | ||
// busted stuff: https://github.com/bvaughn/react-error-boundary/issues/66 | ||
if (!info) return null; | ||
var props = { | ||
@@ -107,3 +124,3 @@ componentStack: info == null ? void 0 : info.componentStack, | ||
if ( /*#__PURE__*/React.isValidElement(fallback)) { | ||
if ( /*#__PURE__*/React__default['default'].isValidElement(fallback)) { | ||
return fallback; | ||
@@ -113,3 +130,3 @@ } else if (typeof fallbackRender === 'function') { | ||
} else if (FallbackComponent) { | ||
return /*#__PURE__*/React.createElement(FallbackComponent, props); | ||
return /*#__PURE__*/React__default['default'].createElement(FallbackComponent, props); | ||
} else { | ||
@@ -124,7 +141,7 @@ throw new Error('react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop'); | ||
return ErrorBoundary; | ||
}(React.Component); | ||
}(React__default['default'].Component); | ||
function withErrorBoundary(Component, errorBoundaryProps) { | ||
function Wrapped(props) { | ||
return /*#__PURE__*/React.createElement(ErrorBoundary, errorBoundaryProps, /*#__PURE__*/React.createElement(Component, props)); | ||
return /*#__PURE__*/React__default['default'].createElement(ErrorBoundary, errorBoundaryProps, /*#__PURE__*/React__default['default'].createElement(Component, props)); | ||
} // Format for display in DevTools | ||
@@ -139,3 +156,3 @@ | ||
function useErrorHandler(givenError) { | ||
var _React$useState = React.useState(null), | ||
var _React$useState = React__default['default'].useState(null), | ||
error = _React$useState[0], | ||
@@ -142,0 +159,0 @@ setError = _React$useState[1]; |
@@ -1,2 +0,2 @@ | ||
!function(r,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],e):e((r=r||self).ReactErrorBoundary={},r.React)}(this,(function(r,e){"use strict";e=e&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e;var t={error:null,info:null},n=function(r){var n,o;function a(){for(var e,n=arguments.length,o=new Array(n),a=0;a<n;a++)o[a]=arguments[a];return(e=r.call.apply(r,[this].concat(o))||this).state=t,e.resetErrorBoundary=function(){for(var r,n=arguments.length,o=new Array(n),a=0;a<n;a++)o[a]=arguments[a];null==e.props.onReset||(r=e.props).onReset.apply(r,o),e.setState(t)},e}o=r,(n=a).prototype=Object.create(o.prototype),n.prototype.constructor=n,n.__proto__=o;var l=a.prototype;return l.componentDidCatch=function(r,e){var t,n;null==(t=(n=this.props).onError)||t.call(n,r,null==e?void 0:e.componentStack),this.setState({error:r,info:e})},l.componentDidUpdate=function(r){var e,n,o,a,l=this.state.error,i=this.props.resetKeys;null!==l&&(void 0===(o=r.resetKeys)&&(o=[]),void 0===(a=i)&&(a=[]),o.length!==a.length||o.some((function(r,e){return!Object.is(r,a[e])})))&&(null==(e=(n=this.props).onResetKeysChange)||e.call(n,r.resetKeys,i),this.setState(t))},l.render=function(){var r=this.state,t=r.error,n=r.info,o=this.props,a=o.fallbackRender,l=o.FallbackComponent,i=o.fallback;if(null!==t){var s={componentStack:null==n?void 0:n.componentStack,error:t,resetErrorBoundary:this.resetErrorBoundary};if(e.isValidElement(i))return i;if("function"==typeof a)return a(s);if(l)return e.createElement(l,s);throw new Error("react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop")}return this.props.children},a}(e.Component);r.ErrorBoundary=n,r.useErrorHandler=function(r){var t=e.useState(null),n=t[0],o=t[1];if(r)throw r;if(n)throw n;return o},r.withErrorBoundary=function(r,t){function o(o){return e.createElement(n,t,e.createElement(r,o))}var a=r.displayName||r.name||"Unknown";return o.displayName="withErrorBoundary("+a+")",o},Object.defineProperty(r,"__esModule",{value:!0})})); | ||
!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).ReactErrorBoundary={},e.React)}(this,(function(e,r){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(r);var o={error:null,info:null},a=function(e){var r,t;function a(){for(var r,t=arguments.length,n=new Array(t),a=0;a<t;a++)n[a]=arguments[a];return(r=e.call.apply(e,[this].concat(n))||this).state=o,r.resetErrorBoundary=function(){for(var e,t=arguments.length,n=new Array(t),a=0;a<t;a++)n[a]=arguments[a];null==r.props.onReset||(e=r.props).onReset.apply(e,n),r.setState(o)},r}t=e,(r=a).prototype=Object.create(t.prototype),r.prototype.constructor=r,r.__proto__=t,a.getDerivedStateFromError=function(e){return{error:e}};var l=a.prototype;return l.componentDidCatch=function(e,r){var t,n;null==(t=(n=this.props).onError)||t.call(n,e,null==r?void 0:r.componentStack),this.setState({info:r})},l.componentDidUpdate=function(e){var r,t,n,a,l=this.state,i=l.error,u=l.info,s=this.props.resetKeys;null!==i&&null!==u&&(void 0===(n=e.resetKeys)&&(n=[]),void 0===(a=s)&&(a=[]),n.length!==a.length||n.some((function(e,r){return!Object.is(e,a[r])})))&&(null==(r=(t=this.props).onResetKeysChange)||r.call(t,e.resetKeys,s),this.setState(o))},l.render=function(){var e=this.state,r=e.error,t=e.info,o=this.props,a=o.fallbackRender,l=o.FallbackComponent,i=o.fallback;if(null!==r){if(!t)return null;var u={componentStack:null==t?void 0:t.componentStack,error:r,resetErrorBoundary:this.resetErrorBoundary};if(n.default.isValidElement(i))return i;if("function"==typeof a)return a(u);if(l)return n.default.createElement(l,u);throw new Error("react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop")}return this.props.children},a}(n.default.Component);e.ErrorBoundary=a,e.useErrorHandler=function(e){var r=n.default.useState(null),t=r[0],o=r[1];if(e)throw e;if(t)throw t;return o},e.withErrorBoundary=function(e,r){function t(t){return n.default.createElement(a,r,n.default.createElement(e,t))}var o=e.displayName||e.name||"Unknown";return t.displayName="withErrorBoundary("+o+")",t},Object.defineProperty(e,"__esModule",{value:!0})})); | ||
//# sourceMappingURL=react-error-boundary.umd.min.js.map |
{ | ||
"name": "react-error-boundary", | ||
"version": "2.3.1", | ||
"version": "2.3.2", | ||
"description": "Simple reusable React error boundary component", | ||
@@ -42,12 +42,12 @@ "main": "dist/react-error-boundary.cjs.js", | ||
"dependencies": { | ||
"@babel/runtime": "^7.10.5" | ||
"@babel/runtime": "^7.11.2" | ||
}, | ||
"devDependencies": { | ||
"@testing-library/jest-dom": "^5.11.1", | ||
"@testing-library/react": "^10.4.7", | ||
"@testing-library/user-event": "^12.0.11", | ||
"kcd-scripts": "^6.2.4", | ||
"@testing-library/jest-dom": "^5.11.4", | ||
"@testing-library/react": "^11.0.2", | ||
"@testing-library/user-event": "^12.1.4", | ||
"kcd-scripts": "^6.3.0", | ||
"react": "^16.13.1", | ||
"react-dom": "^16.13.1", | ||
"typescript": "^3.9.7" | ||
"typescript": "^4.0.2" | ||
}, | ||
@@ -61,5 +61,6 @@ "peerDependencies": { | ||
"react/prop-types": "off", | ||
"react/no-did-update-set-state": "off" | ||
"react/no-did-update-set-state": "off", | ||
"babel/no-unused-expressions": "off" | ||
} | ||
} | ||
} |
@@ -342,3 +342,3 @@ <div align="center"> | ||
<input id="name" /> | ||
<button type="submit" onClick={handleClick}> | ||
<button type="submit"}> | ||
get a greeting | ||
@@ -352,3 +352,3 @@ </button> | ||
> Note, in case it's not clear what's happening here, you could also write | ||
> `handleClick` like this: | ||
> `handleSubmit` like this: | ||
@@ -386,5 +386,3 @@ ```javascript | ||
<input id="name" /> | ||
<button type="submit" onClick={handleClick}> | ||
get a greeting | ||
</button> | ||
<button type="submit">get a greeting</button> | ||
</form> | ||
@@ -391,0 +389,0 @@ ) |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
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
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
48985
410
449
Updated@babel/runtime@^7.11.2