Skip to content

Commit

Permalink
Release v3.4.1.
Browse files Browse the repository at this point in the history
  • Loading branch information
@diasbruno
diasbruno committed Apr 17, 2018
1 parent 2132488 commit dbaa77f
Show file tree
Hide file tree
Showing 5 changed files with 225 additions and 58 deletions.
14 changes: 14 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,17 @@
v3.4.1 - Tue, 17 Apr 2018 09:49:06 UTC
--------------------------------------

- [2132488](../../commit/2132488) Add eslint rule to disallow importing devDependencies in lib sources
- [4887c69](../../commit/4887c69) Move react-lifecycles-compat to `dependencies` and upgrade it to v3
- [f748406](../../commit/f748406) Remove cWRP usage in ModalPortal
- [e91d59a](../../commit/e91d59a) Fix lifecycle method usages in Modal
- [0dd7805](../../commit/0dd7805) [chore] update the pull request template...
- [fa8e33c](../../commit/fa8e33c) removed un-safe lifecycle methods componentWillMount and componentWillUpdate. Implemented getDerivedStateFromProps and getSnapshotBeforeUpdate lifecycle methods using react-lifecycles-compat polyfill.
- [d8c3dad](../../commit/d8c3dad) [fixed] mouse up event on overlay triggered the closing of the modal
- [d6f3463](../../commit/d6f3463) [chore] Update transitions.md (#635)
- [fa87046](../../commit/fa87046) [Chore] update README.md: added description for setting app element


v3.3.2 - Mon, 12 Mar 2018 22:16:32 UTC
--------------------------------------

Expand Down
2 changes: 1 addition & 1 deletion bower.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-modal",
"version": "3.3.2",
"version": "3.4.1",
"homepage": "https://github.com/reactjs/react-modal",
"authors": [
"Ryan Florence",
Expand Down
257 changes: 205 additions & 52 deletions dist/react-modal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -524,6 +524,8 @@ var _safeHTMLElement = __webpack_require__(8);

var _safeHTMLElement2 = _interopRequireDefault(_safeHTMLElement);

var _reactLifecyclesCompat = __webpack_require__(22);

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
Expand Down Expand Up @@ -586,31 +588,37 @@ var Modal = function (_Component) {
!isReact16 && this.renderPortal(this.props);
}
}, {
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(newProps) {
key: "getSnapshotBeforeUpdate",
value: function getSnapshotBeforeUpdate(prevProps) {
var prevParent = getParentElement(prevProps.parentSelector);
var nextParent = getParentElement(this.props.parentSelector);
return { prevParent: prevParent, nextParent: nextParent };
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, _, snapshot) {
if (!_safeHTMLElement.canUseDOM) return;
var isOpen = newProps.isOpen;
// Stop unnecessary renders if modal is remaining closed

if (!this.props.isOpen && !isOpen) return;
var _props = this.props,
isOpen = _props.isOpen,
portalClassName = _props.portalClassName;

var currentParent = getParentElement(this.props.parentSelector);
var newParent = getParentElement(newProps.parentSelector);

if (newParent !== currentParent) {
currentParent.removeChild(this.node);
newParent.appendChild(this.node);
if (prevProps.portalClassName !== portalClassName) {
this.node.className = portalClassName;
}

!isReact16 && this.renderPortal(newProps);
}
}, {
key: "componentWillUpdate",
value: function componentWillUpdate(newProps) {
if (!_safeHTMLElement.canUseDOM) return;
if (newProps.portalClassName !== this.props.portalClassName) {
this.node.className = newProps.portalClassName;
// Stop unnecessary renders if modal is remaining closed
if (!prevProps.isOpen && !isOpen) return;

var prevParent = snapshot.prevParent,
nextParent = snapshot.nextParent;

if (nextParent !== prevParent) {
prevParent.removeChild(this.node);
nextParent.appendChild(this.node);
}

!isReact16 && this.renderPortal(this.props);
}
}, {
key: "componentWillUnmount",
Expand Down Expand Up @@ -735,6 +743,10 @@ Modal.defaultStyles = {
padding: "20px"
}
};


(0, _reactLifecyclesCompat.polyfill)(Modal);

exports.default = Modal;

/***/ }),
Expand Down Expand Up @@ -1594,10 +1606,6 @@ var ModalPortal = function (_Component) {

var _this = _possibleConstructorReturn(this, (ModalPortal.__proto__ || Object.getPrototypeOf(ModalPortal)).call(this, props));

_this.setFocusAfterRender = function (focus) {
_this.focusAfterRender = _this.props.shouldFocusAfterRender && focus;
};

_this.setOverlayRef = function (overlay) {
_this.overlay = overlay;
_this.props.overlayRef && _this.props.overlayRef(overlay);
Expand Down Expand Up @@ -1713,16 +1721,6 @@ var ModalPortal = function (_Component) {
}
}
_this.shouldClose = null;
_this.moveFromContentToOverlay = null;
};

_this.handleOverlayOnMouseUp = function () {
if (_this.moveFromContentToOverlay === null) {
_this.shouldClose = false;
}
if (_this.props.shouldCloseOnOverlayClick) {
_this.shouldClose = true;
}
};

_this.handleContentOnMouseUp = function () {
Expand All @@ -1733,7 +1731,6 @@ var ModalPortal = function (_Component) {
if (!_this.props.shouldCloseOnOverlayClick && event.target == _this.overlay) {
event.preventDefault();
}
_this.moveFromContentToOverlay = false;
};

_this.handleContentOnClick = function () {
Expand All @@ -1742,7 +1739,6 @@ var ModalPortal = function (_Component) {

_this.handleContentOnMouseDown = function () {
_this.shouldClose = false;
_this.moveFromContentToOverlay = false;
};

_this.requestClose = function (event) {
Expand Down Expand Up @@ -1797,39 +1793,33 @@ var ModalPortal = function (_Component) {
_createClass(ModalPortal, [{
key: "componentDidMount",
value: function componentDidMount() {
// Focus needs to be set when mounting and already open
if (this.props.isOpen) {
this.setFocusAfterRender(true);
this.open();
}
}
}, {
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(newProps) {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (undefined !== "production") {
if (newProps.bodyOpenClassName !== this.props.bodyOpenClassName) {
if (prevProps.bodyOpenClassName !== this.props.bodyOpenClassName) {
// eslint-disable-next-line no-console
console.warn('React-Modal: "bodyOpenClassName" prop has been modified. ' + "This may cause unexpected behavior when multiple modals are open.");
}
if (newProps.htmlOpenClassName !== this.props.htmlOpenClassName) {
if (prevProps.htmlOpenClassName !== this.props.htmlOpenClassName) {
// eslint-disable-next-line no-console
console.warn('React-Modal: "htmlOpenClassName" prop has been modified. ' + "This may cause unexpected behavior when multiple modals are open.");
}
}
// Focus only needs to be set once when the modal is being opened
if (!this.props.isOpen && newProps.isOpen) {
this.setFocusAfterRender(true);

if (this.props.isOpen && !prevProps.isOpen) {
this.open();
} else if (this.props.isOpen && !newProps.isOpen) {
} else if (!this.props.isOpen && prevProps.isOpen) {
this.close();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
if (this.focusAfterRender) {

// Focus only needs to be set once when the modal is being opened
if (this.props.shouldFocusAfterRender && this.state.isOpen && !prevState.isOpen) {
this.focusContent();
this.setFocusAfterRender(false);
}
}
}, {
Expand Down Expand Up @@ -1880,7 +1870,6 @@ var ModalPortal = function (_Component) {
style: _extends({}, overlayStyles, this.props.style.overlay),
onClick: this.handleOverlayOnClick,
onMouseDown: this.handleOverlayOnMouseDown,
onMouseUp: this.handleOverlayOnMouseUp,
"aria-modal": "true"
},
_react2.default.createElement(
Expand Down Expand Up @@ -2355,6 +2344,170 @@ var __WEBPACK_AMD_DEFINE_RESULT__;/*!
}());


/***/ }),
/* 22 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "polyfill", function() { return polyfill; });
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

function componentWillMount() {
// Call this.constructor.gDSFP to support sub-classes.
var state = this.constructor.getDerivedStateFromProps(this.props, this.state);
if (state !== null && state !== undefined) {
this.setState(state);
}
}

function componentWillReceiveProps(nextProps) {
// Call this.constructor.gDSFP to support sub-classes.
var state = this.constructor.getDerivedStateFromProps(nextProps, this.state);
if (state !== null && state !== undefined) {
this.setState(state);
}
}

function componentWillUpdate(nextProps, nextState) {
try {
var prevProps = this.props;
var prevState = this.state;
this.props = nextProps;
this.state = nextState;
this.__reactInternalSnapshotFlag = true;
this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(
prevProps,
prevState
);
} finally {
this.props = prevProps;
this.state = prevState;
}
}

// React may warn about cWM/cWRP/cWU methods being deprecated.
// Add a flag to suppress these warnings for this special case.
componentWillMount.__suppressDeprecationWarning = true;
componentWillReceiveProps.__suppressDeprecationWarning = true;
componentWillUpdate.__suppressDeprecationWarning = true;

function polyfill(Component) {
var prototype = Component.prototype;

if (!prototype || !prototype.isReactComponent) {
throw new Error('Can only polyfill class components');
}

if (
typeof Component.getDerivedStateFromProps !== 'function' &&
typeof prototype.getSnapshotBeforeUpdate !== 'function'
) {
return Component;
}

// If new component APIs are defined, "unsafe" lifecycles won't be called.
// Error if any of these lifecycles are present,
// Because they would work differently between older and newer (16.3+) versions of React.
var foundWillMountName = null;
var foundWillReceivePropsName = null;
var foundWillUpdateName = null;
if (typeof prototype.componentWillMount === 'function') {
foundWillMountName = 'componentWillMount';
} else if (typeof prototype.UNSAFE_componentWillMount === 'function') {
foundWillMountName = 'UNSAFE_componentWillMount';
}
if (typeof prototype.componentWillReceiveProps === 'function') {
foundWillReceivePropsName = 'componentWillReceiveProps';
} else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') {
foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
}
if (typeof prototype.componentWillUpdate === 'function') {
foundWillUpdateName = 'componentWillUpdate';
} else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') {
foundWillUpdateName = 'UNSAFE_componentWillUpdate';
}
if (
foundWillMountName !== null ||
foundWillReceivePropsName !== null ||
foundWillUpdateName !== null
) {
var componentName = Component.displayName || Component.name;
var newApiName =
typeof Component.getDerivedStateFromProps === 'function'
? 'getDerivedStateFromProps()'
: 'getSnapshotBeforeUpdate()';

throw Error(
'Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' +
componentName +
' uses ' +
newApiName +
' but also contains the following legacy lifecycles:' +
(foundWillMountName !== null ? '\n ' + foundWillMountName : '') +
(foundWillReceivePropsName !== null
? '\n ' + foundWillReceivePropsName
: '') +
(foundWillUpdateName !== null ? '\n ' + foundWillUpdateName : '') +
'\n\nThe above lifecycles should be removed. Learn more about this warning here:\n' +
'https://fb.me/react-async-component-lifecycle-hooks'
);
}

// React <= 16.2 does not support static getDerivedStateFromProps.
// As a workaround, use cWM and cWRP to invoke the new static lifecycle.
// Newer versions of React will ignore these lifecycles if gDSFP exists.
if (typeof Component.getDerivedStateFromProps === 'function') {
prototype.componentWillMount = componentWillMount;
prototype.componentWillReceiveProps = componentWillReceiveProps;
}

// React <= 16.2 does not support getSnapshotBeforeUpdate.
// As a workaround, use cWU to invoke the new lifecycle.
// Newer versions of React will ignore that lifecycle if gSBU exists.
if (typeof prototype.getSnapshotBeforeUpdate === 'function') {
if (typeof prototype.componentDidUpdate !== 'function') {
throw new Error(
'Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype'
);
}

prototype.componentWillUpdate = componentWillUpdate;

var componentDidUpdate = prototype.componentDidUpdate;

prototype.componentDidUpdate = function componentDidUpdatePolyfill(
prevProps,
prevState,
maybeSnapshot
) {
// 16.3+ will not execute our will-update method;
// It will pass a snapshot value to did-update though.
// Older versions will require our polyfilled will-update value.
// We need to handle both cases, but can't just check for the presence of "maybeSnapshot",
// Because for <= 15.x versions this might be a "prevContext" object.
// We also can't just check "__reactInternalSnapshot",
// Because get-snapshot might return a falsy value.
// So check for the explicit __reactInternalSnapshotFlag flag to determine behavior.
var snapshot = this.__reactInternalSnapshotFlag
? this.__reactInternalSnapshot
: maybeSnapshot;

componentDidUpdate.call(this, prevProps, prevState, snapshot);
};
}

return Component;
}




/***/ })
/******/ ]);
});
Loading

0 comments on commit dbaa77f

Please sign in to comment.