Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

react-overlays

Package Overview
Dependencies
Maintainers
2
Versions
85
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-overlays - npm Package Compare versions

Comparing version 0.6.3 to 0.6.4

17

CHANGELOG.md

@@ -0,1 +1,18 @@

## [v0.6.4]
> 2016-07-11
- **Feature:** Add `disabled` prop to `<RootCloseWrapper>` ([#93])
- **Feature:** Add `event` prop to `<RootCloseWrapper>` to control mouse event that triggers root close behavior ([#95])
- **Bugfix:** Fix restoring focus on closing `<Modal>` ([#82])
- **Bugfix:** Do not pass unknown props to children ([#99])
- **Chore:** Upgrade to Babel 6 ([#100])
[v0.6.4]: https://github.com/react-bootstrap/react-overlays/compare/v0.6.3...v0.6.4
[#82]: https://github.com/react-bootstrap/react-overlays/pull/82
[#93]: https://github.com/react-bootstrap/react-overlays/pull/93
[#95]: https://github.com/react-bootstrap/react-overlays/pull/95
[#99]: https://github.com/react-bootstrap/react-overlays/pull/99
[#100]: https://github.com/react-bootstrap/react-overlays/pull/100
## [v0.6.3]

@@ -2,0 +19,0 @@ > 2016-04-07

366

lib/Affix.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
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 _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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var _classnames = require('classnames');

@@ -17,21 +15,21 @@

var _domHelpersQueryHeight = require('dom-helpers/query/height');
var _height = require('dom-helpers/query/height');
var _domHelpersQueryHeight2 = _interopRequireDefault(_domHelpersQueryHeight);
var _height2 = _interopRequireDefault(_height);
var _domHelpersQueryOffset = require('dom-helpers/query/offset');
var _offset = require('dom-helpers/query/offset');
var _domHelpersQueryOffset2 = _interopRequireDefault(_domHelpersQueryOffset);
var _offset2 = _interopRequireDefault(_offset);
var _domHelpersQueryOffsetParent = require('dom-helpers/query/offsetParent');
var _offsetParent = require('dom-helpers/query/offsetParent');
var _domHelpersQueryOffsetParent2 = _interopRequireDefault(_domHelpersQueryOffsetParent);
var _offsetParent2 = _interopRequireDefault(_offsetParent);
var _domHelpersQueryScrollTop = require('dom-helpers/query/scrollTop');
var _scrollTop = require('dom-helpers/query/scrollTop');
var _domHelpersQueryScrollTop2 = _interopRequireDefault(_domHelpersQueryScrollTop);
var _scrollTop2 = _interopRequireDefault(_scrollTop);
var _domHelpersUtilRequestAnimationFrame = require('dom-helpers/util/requestAnimationFrame');
var _requestAnimationFrame = require('dom-helpers/util/requestAnimationFrame');
var _domHelpersUtilRequestAnimationFrame2 = _interopRequireDefault(_domHelpersUtilRequestAnimationFrame);
var _requestAnimationFrame2 = _interopRequireDefault(_requestAnimationFrame);

@@ -46,18 +44,26 @@ var _react = require('react');

var _utilsAddEventListener = require('./utils/addEventListener');
var _addEventListener = require('./utils/addEventListener');
var _utilsAddEventListener2 = _interopRequireDefault(_utilsAddEventListener);
var _addEventListener2 = _interopRequireDefault(_addEventListener);
var _utilsGetDocumentHeight = require('./utils/getDocumentHeight');
var _getDocumentHeight = require('./utils/getDocumentHeight');
var _utilsGetDocumentHeight2 = _interopRequireDefault(_utilsGetDocumentHeight);
var _getDocumentHeight2 = _interopRequireDefault(_getDocumentHeight);
var _utilsOwnerDocument = require('./utils/ownerDocument');
var _ownerDocument = require('./utils/ownerDocument');
var _utilsOwnerDocument2 = _interopRequireDefault(_utilsOwnerDocument);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _utilsOwnerWindow = require('./utils/ownerWindow');
var _ownerWindow = require('./utils/ownerWindow');
var _utilsOwnerWindow2 = _interopRequireDefault(_utilsOwnerWindow);
var _ownerWindow2 = _interopRequireDefault(_ownerWindow);
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 _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**

@@ -68,3 +74,3 @@ * The `<Affix/>` component toggles `position: fixed;` on and off, emulating

var Affix = (function (_React$Component) {
var Affix = function (_React$Component) {
_inherits(Affix, _React$Component);

@@ -75,5 +81,5 @@

_React$Component.call(this, props, context);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Affix).call(this, props, context));
this.state = {
_this.state = {
affixed: 'top',

@@ -84,166 +90,180 @@ position: null,

this._needPositionUpdate = false;
_this._needPositionUpdate = false;
return _this;
}
Affix.prototype.componentDidMount = function componentDidMount() {
var _this = this;
_createClass(Affix, [{
key: 'componentDidMount',
value: function componentDidMount() {
var _this2 = this;
this._isMounted = true;
this._isMounted = true;
this._windowScrollListener = _utilsAddEventListener2['default'](_utilsOwnerWindow2['default'](this), 'scroll', function () {
return _this.onWindowScroll();
});
this._documentClickListener = _utilsAddEventListener2['default'](_utilsOwnerDocument2['default'](this), 'click', function () {
return _this.onDocumentClick();
});
this._windowScrollListener = (0, _addEventListener2.default)((0, _ownerWindow2.default)(this), 'scroll', function () {
return _this2.onWindowScroll();
});
this._documentClickListener = (0, _addEventListener2.default)((0, _ownerDocument2.default)(this), 'click', function () {
return _this2.onDocumentClick();
});
this.onUpdate();
};
Affix.prototype.componentWillReceiveProps = function componentWillReceiveProps() {
this._needPositionUpdate = true;
};
Affix.prototype.componentDidUpdate = function componentDidUpdate() {
if (this._needPositionUpdate) {
this._needPositionUpdate = false;
this.onUpdate();
}
};
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps() {
this._needPositionUpdate = true;
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
if (this._needPositionUpdate) {
this._needPositionUpdate = false;
this.onUpdate();
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this._isMounted = false;
Affix.prototype.componentWillUnmount = function componentWillUnmount() {
this._isMounted = false;
if (this._windowScrollListener) {
this._windowScrollListener.remove();
if (this._windowScrollListener) {
this._windowScrollListener.remove();
}
if (this._documentClickListener) {
this._documentClickListener.remove();
}
}
if (this._documentClickListener) {
this._documentClickListener.remove();
}, {
key: 'onWindowScroll',
value: function onWindowScroll() {
this.onUpdate();
}
};
}, {
key: 'onDocumentClick',
value: function onDocumentClick() {
var _this3 = this;
Affix.prototype.onWindowScroll = function onWindowScroll() {
this.onUpdate();
};
(0, _requestAnimationFrame2.default)(function () {
return _this3.onUpdate();
});
}
}, {
key: 'onUpdate',
value: function onUpdate() {
var _this4 = this;
Affix.prototype.onDocumentClick = function onDocumentClick() {
var _this2 = this;
if (!this._isMounted) {
return;
}
_domHelpersUtilRequestAnimationFrame2['default'](function () {
return _this2.onUpdate();
});
};
var _props = this.props;
var offsetTop = _props.offsetTop;
var viewportOffsetTop = _props.viewportOffsetTop;
Affix.prototype.onUpdate = function onUpdate() {
var _this3 = this;
var scrollTop = (0, _scrollTop2.default)((0, _ownerWindow2.default)(this));
var positionTopMin = scrollTop + (viewportOffsetTop || 0);
if (!this._isMounted) {
return;
}
if (positionTopMin <= offsetTop) {
this.updateState('top', null, null);
return;
}
var _props = this.props;
var offsetTop = _props.offsetTop;
var viewportOffsetTop = _props.viewportOffsetTop;
if (positionTopMin > this.getPositionTopMax()) {
if (this.state.affixed === 'bottom') {
this.updateStateAtBottom();
} else {
// Setting position away from `fixed` can change the offset parent of
// the affix, so we can't calculate the correct position until after
// we've updated its position.
this.setState({
affixed: 'bottom',
position: 'absolute',
top: null
}, function () {
if (!_this4._isMounted) {
return;
}
var scrollTop = _domHelpersQueryScrollTop2['default'](_utilsOwnerWindow2['default'](this));
var positionTopMin = scrollTop + (viewportOffsetTop || 0);
_this4.updateStateAtBottom();
});
}
return;
}
if (positionTopMin <= offsetTop) {
this.updateState('top', null, null);
return;
this.updateState('affix', 'fixed', viewportOffsetTop);
}
}, {
key: 'getPositionTopMax',
value: function getPositionTopMax() {
var documentHeight = (0, _getDocumentHeight2.default)((0, _ownerDocument2.default)(this));
var height = (0, _height2.default)(_reactDom2.default.findDOMNode(this));
if (positionTopMin > this.getPositionTopMax()) {
if (this.state.affixed === 'bottom') {
this.updateStateAtBottom();
} else {
// Setting position away from `fixed` can change the offset parent of
// the affix, so we can't calculate the correct position until after
// we've updated its position.
this.setState({
affixed: 'bottom',
position: 'absolute',
top: null
}, function () {
if (!_this3._isMounted) {
return;
}
return documentHeight - height - this.props.offsetBottom;
}
}, {
key: 'updateState',
value: function updateState(affixed, position, top) {
var _this5 = this;
_this3.updateStateAtBottom();
});
if (affixed === this.state.affixed && position === this.state.position && top === this.state.top) {
return;
}
return;
}
this.updateState('affix', 'fixed', viewportOffsetTop);
};
var upperName = affixed === 'affix' ? '' : affixed.charAt(0).toUpperCase() + affixed.substr(1);
Affix.prototype.getPositionTopMax = function getPositionTopMax() {
var documentHeight = _utilsGetDocumentHeight2['default'](_utilsOwnerDocument2['default'](this));
var height = _domHelpersQueryHeight2['default'](_reactDom2['default'].findDOMNode(this));
if (this.props['onAffix' + upperName]) {
this.props['onAffix' + upperName]();
}
return documentHeight - height - this.props.offsetBottom;
};
this.setState({ affixed: affixed, position: position, top: top }, function () {
if (_this5.props['onAffixed' + upperName]) {
_this5.props['onAffixed' + upperName]();
}
});
}
}, {
key: 'updateStateAtBottom',
value: function updateStateAtBottom() {
var positionTopMax = this.getPositionTopMax();
var offsetParent = (0, _offsetParent2.default)(_reactDom2.default.findDOMNode(this));
var parentTop = (0, _offset2.default)(offsetParent).top;
Affix.prototype.updateState = function updateState(affixed, position, top) {
var _this4 = this;
if (affixed === this.state.affixed && position === this.state.position && top === this.state.top) {
return;
this.updateState('bottom', 'absolute', positionTopMax - parentTop);
}
}, {
key: 'render',
value: function render() {
var child = _react2.default.Children.only(this.props.children);
var _child$props = child.props;
var className = _child$props.className;
var style = _child$props.style;
var _state = this.state;
var affixed = _state.affixed;
var position = _state.position;
var top = _state.top;
var upperName = affixed === 'affix' ? '' : affixed.charAt(0).toUpperCase() + affixed.substr(1);
var positionStyle = { position: position, top: top };
if (this.props['onAffix' + upperName]) {
this.props['onAffix' + upperName]();
}
this.setState({ affixed: affixed, position: position, top: top }, function () {
if (_this4.props['onAffixed' + upperName]) {
_this4.props['onAffixed' + upperName]();
var affixClassName = void 0;
var affixStyle = void 0;
if (affixed === 'top') {
affixClassName = this.props.topClassName;
affixStyle = this.props.topStyle;
} else if (affixed === 'bottom') {
affixClassName = this.props.bottomClassName;
affixStyle = this.props.bottomStyle;
} else {
affixClassName = this.props.affixClassName;
affixStyle = this.props.affixStyle;
}
});
};
Affix.prototype.updateStateAtBottom = function updateStateAtBottom() {
var positionTopMax = this.getPositionTopMax();
var offsetParent = _domHelpersQueryOffsetParent2['default'](_reactDom2['default'].findDOMNode(this));
var parentTop = _domHelpersQueryOffset2['default'](offsetParent).top;
this.updateState('bottom', 'absolute', positionTopMax - parentTop);
};
Affix.prototype.render = function render() {
var child = _react2['default'].Children.only(this.props.children);
var _child$props = child.props;
var className = _child$props.className;
var style = _child$props.style;
var _state = this.state;
var affixed = _state.affixed;
var position = _state.position;
var top = _state.top;
var positionStyle = { position: position, top: top };
var affixClassName = undefined;
var affixStyle = undefined;
if (affixed === 'top') {
affixClassName = this.props.topClassName;
affixStyle = this.props.topStyle;
} else if (affixed === 'bottom') {
affixClassName = this.props.bottomClassName;
affixStyle = this.props.bottomStyle;
} else {
affixClassName = this.props.affixClassName;
affixStyle = this.props.affixStyle;
return _react2.default.cloneElement(child, {
className: (0, _classnames2.default)(affixClassName, className),
style: _extends({}, positionStyle, affixStyle, style)
});
}
}]);
return _react2['default'].cloneElement(child, {
className: _classnames2['default'](affixClassName, className),
style: _extends({}, positionStyle, affixStyle, style)
});
};
return Affix;
})(_react2['default'].Component);
}(_react2.default.Component);

@@ -254,3 +274,3 @@ Affix.propTypes = {

*/
offsetTop: _react2['default'].PropTypes.number,
offsetTop: _react2.default.PropTypes.number,

@@ -260,3 +280,3 @@ /**

*/
viewportOffsetTop: _react2['default'].PropTypes.number,
viewportOffsetTop: _react2.default.PropTypes.number,

@@ -266,3 +286,3 @@ /**

*/
offsetBottom: _react2['default'].PropTypes.number,
offsetBottom: _react2.default.PropTypes.number,

@@ -272,3 +292,3 @@ /**

*/
topClassName: _react2['default'].PropTypes.string,
topClassName: _react2.default.PropTypes.string,

@@ -278,3 +298,3 @@ /**

*/
topStyle: _react2['default'].PropTypes.object,
topStyle: _react2.default.PropTypes.object,

@@ -284,7 +304,7 @@ /**

*/
affixClassName: _react2['default'].PropTypes.string,
affixClassName: _react2.default.PropTypes.string,
/**
* Style to apply when affixed
*/
affixStyle: _react2['default'].PropTypes.object,
affixStyle: _react2.default.PropTypes.object,

@@ -294,3 +314,3 @@ /**

*/
bottomClassName: _react2['default'].PropTypes.string,
bottomClassName: _react2.default.PropTypes.string,

@@ -300,3 +320,3 @@ /**

*/
bottomStyle: _react2['default'].PropTypes.object,
bottomStyle: _react2.default.PropTypes.object,

@@ -306,7 +326,7 @@ /**

*/
onAffix: _react2['default'].PropTypes.func,
onAffix: _react2.default.PropTypes.func,
/**
* Callback fired after the component `affixStyle` and `affixClassName` props have been rendered.
*/
onAffixed: _react2['default'].PropTypes.func,
onAffixed: _react2.default.PropTypes.func,

@@ -316,3 +336,3 @@ /**

*/
onAffixTop: _react2['default'].PropTypes.func,
onAffixTop: _react2.default.PropTypes.func,

@@ -322,3 +342,3 @@ /**

*/
onAffixedTop: _react2['default'].PropTypes.func,
onAffixedTop: _react2.default.PropTypes.func,

@@ -328,3 +348,3 @@ /**

*/
onAffixBottom: _react2['default'].PropTypes.func,
onAffixBottom: _react2.default.PropTypes.func,

@@ -334,3 +354,3 @@ /**

*/
onAffixedBottom: _react2['default'].PropTypes.func
onAffixedBottom: _react2.default.PropTypes.func
};

@@ -344,3 +364,3 @@

exports['default'] = Affix;
exports.default = Affix;
module.exports = exports['default'];

310

lib/AutoAffix.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
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 _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var _offset = require('dom-helpers/query/offset');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
var _offset2 = _interopRequireDefault(_offset);
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var _requestAnimationFrame = require('dom-helpers/util/requestAnimationFrame');
var _domHelpersQueryOffset = require('dom-helpers/query/offset');
var _requestAnimationFrame2 = _interopRequireDefault(_requestAnimationFrame);
var _domHelpersQueryOffset2 = _interopRequireDefault(_domHelpersQueryOffset);
var _domHelpersUtilRequestAnimationFrame = require('dom-helpers/util/requestAnimationFrame');
var _domHelpersUtilRequestAnimationFrame2 = _interopRequireDefault(_domHelpersUtilRequestAnimationFrame);
var _react = require('react');

@@ -27,5 +23,5 @@

var _reactPropTypesLibMountable = require('react-prop-types/lib/mountable');
var _mountable = require('react-prop-types/lib/mountable');
var _reactPropTypesLibMountable2 = _interopRequireDefault(_reactPropTypesLibMountable);
var _mountable2 = _interopRequireDefault(_mountable);

@@ -36,22 +32,32 @@ var _Affix = require('./Affix');

var _utilsAddEventListener = require('./utils/addEventListener');
var _addEventListener = require('./utils/addEventListener');
var _utilsAddEventListener2 = _interopRequireDefault(_utilsAddEventListener);
var _addEventListener2 = _interopRequireDefault(_addEventListener);
var _utilsGetContainer = require('./utils/getContainer');
var _getContainer = require('./utils/getContainer');
var _utilsGetContainer2 = _interopRequireDefault(_utilsGetContainer);
var _getContainer2 = _interopRequireDefault(_getContainer);
var _utilsGetDocumentHeight = require('./utils/getDocumentHeight');
var _getDocumentHeight = require('./utils/getDocumentHeight');
var _utilsGetDocumentHeight2 = _interopRequireDefault(_utilsGetDocumentHeight);
var _getDocumentHeight2 = _interopRequireDefault(_getDocumentHeight);
var _utilsOwnerDocument = require('./utils/ownerDocument');
var _ownerDocument = require('./utils/ownerDocument');
var _utilsOwnerDocument2 = _interopRequireDefault(_utilsOwnerDocument);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _utilsOwnerWindow = require('./utils/ownerWindow');
var _ownerWindow = require('./utils/ownerWindow');
var _utilsOwnerWindow2 = _interopRequireDefault(_utilsOwnerWindow);
var _ownerWindow2 = _interopRequireDefault(_ownerWindow);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**

@@ -62,3 +68,3 @@ * The `<AutoAffix/>` component wraps `<Affix/>` to automatically calculate

var AutoAffix = (function (_React$Component) {
var AutoAffix = function (_React$Component) {
_inherits(AutoAffix, _React$Component);

@@ -69,5 +75,5 @@

_React$Component.call(this, props, context);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(AutoAffix).call(this, props, context));
this.state = {
_this.state = {
offsetTop: null,

@@ -77,154 +83,170 @@ offsetBottom: null,

};
return _this;
}
AutoAffix.prototype.componentDidMount = function componentDidMount() {
var _this = this;
_createClass(AutoAffix, [{
key: 'componentDidMount',
value: function componentDidMount() {
var _this2 = this;
this._isMounted = true;
this._isMounted = true;
this._windowScrollListener = _utilsAddEventListener2['default'](_utilsOwnerWindow2['default'](this), 'scroll', function () {
return _this.onWindowScroll();
});
this._windowScrollListener = (0, _addEventListener2.default)((0, _ownerWindow2.default)(this), 'scroll', function () {
return _this2.onWindowScroll();
});
this._windowResizeListener = _utilsAddEventListener2['default'](_utilsOwnerWindow2['default'](this), 'resize', function () {
return _this.onWindowResize();
});
this._windowResizeListener = (0, _addEventListener2.default)((0, _ownerWindow2.default)(this), 'resize', function () {
return _this2.onWindowResize();
});
this._documentClickListener = _utilsAddEventListener2['default'](_utilsOwnerDocument2['default'](this), 'click', function () {
return _this.onDocumentClick();
});
this._documentClickListener = (0, _addEventListener2.default)((0, _ownerDocument2.default)(this), 'click', function () {
return _this2.onDocumentClick();
});
this.onUpdate();
};
AutoAffix.prototype.componentWillReceiveProps = function componentWillReceiveProps() {
this._needPositionUpdate = true;
};
AutoAffix.prototype.componentDidUpdate = function componentDidUpdate() {
if (this._needPositionUpdate) {
this._needPositionUpdate = false;
this.onUpdate();
}
};
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps() {
this._needPositionUpdate = true;
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
if (this._needPositionUpdate) {
this._needPositionUpdate = false;
this.onUpdate();
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this._isMounted = false;
AutoAffix.prototype.componentWillUnmount = function componentWillUnmount() {
this._isMounted = false;
if (this._windowScrollListener) {
this._windowScrollListener.remove();
if (this._windowScrollListener) {
this._windowScrollListener.remove();
}
if (this._documentClickListener) {
this._documentClickListener.remove();
}
if (this._windowResizeListener) {
this._windowResizeListener.remove();
}
}
if (this._documentClickListener) {
this._documentClickListener.remove();
}, {
key: 'onWindowScroll',
value: function onWindowScroll() {
this.onUpdate();
}
if (this._windowResizeListener) {
this._windowResizeListener.remove();
}, {
key: 'onWindowResize',
value: function onWindowResize() {
var _this3 = this;
if (this.props.autoWidth) {
(0, _requestAnimationFrame2.default)(function () {
return _this3.onUpdate();
});
}
}
};
}, {
key: 'onDocumentClick',
value: function onDocumentClick() {
var _this4 = this;
AutoAffix.prototype.onWindowScroll = function onWindowScroll() {
this.onUpdate();
};
AutoAffix.prototype.onWindowResize = function onWindowResize() {
var _this2 = this;
if (this.props.autoWidth) {
_domHelpersUtilRequestAnimationFrame2['default'](function () {
return _this2.onUpdate();
(0, _requestAnimationFrame2.default)(function () {
return _this4.onUpdate();
});
}
};
}, {
key: 'onUpdate',
value: function onUpdate() {
if (!this._isMounted) {
return;
}
AutoAffix.prototype.onDocumentClick = function onDocumentClick() {
var _this3 = this;
var _getOffset = (0, _offset2.default)(this.refs.positioner);
_domHelpersUtilRequestAnimationFrame2['default'](function () {
return _this3.onUpdate();
});
};
var offsetTop = _getOffset.top;
var width = _getOffset.width;
AutoAffix.prototype.onUpdate = function onUpdate() {
if (!this._isMounted) {
return;
}
var _getOffset = _domHelpersQueryOffset2['default'](this.refs.positioner);
var container = (0, _getContainer2.default)(this.props.container);
var offsetBottom = void 0;
if (container) {
var documentHeight = (0, _getDocumentHeight2.default)((0, _ownerDocument2.default)(this));
var offsetTop = _getOffset.top;
var width = _getOffset.width;
var _getOffset2 = (0, _offset2.default)(container);
var container = _utilsGetContainer2['default'](this.props.container);
var offsetBottom = undefined;
if (container) {
var documentHeight = _utilsGetDocumentHeight2['default'](_utilsOwnerDocument2['default'](this));
var top = _getOffset2.top;
var height = _getOffset2.height;
var _getOffset2 = _domHelpersQueryOffset2['default'](container);
offsetBottom = documentHeight - top - height;
} else {
offsetBottom = null;
}
var _top = _getOffset2.top;
var height = _getOffset2.height;
this.updateState(offsetTop, offsetBottom, width);
}
}, {
key: 'updateState',
value: function updateState(offsetTop, offsetBottom, width) {
if (offsetTop === this.state.offsetTop && offsetBottom === this.state.offsetBottom && width === this.state.width) {
return;
}
offsetBottom = documentHeight - _top - height;
} else {
offsetBottom = null;
this.setState({ offsetTop: offsetTop, offsetBottom: offsetBottom, width: width });
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var autoWidth = _props.autoWidth;
var viewportOffsetTop = _props.viewportOffsetTop;
var children = _props.children;
this.updateState(offsetTop, offsetBottom, width);
};
var props = _objectWithoutProperties(_props, ['autoWidth', 'viewportOffsetTop', 'children']);
AutoAffix.prototype.updateState = function updateState(offsetTop, offsetBottom, width) {
if (offsetTop === this.state.offsetTop && offsetBottom === this.state.offsetBottom && width === this.state.width) {
return;
}
var _state = this.state;
var offsetTop = _state.offsetTop;
var offsetBottom = _state.offsetBottom;
var width = _state.width;
this.setState({ offsetTop: offsetTop, offsetBottom: offsetBottom, width: width });
};
AutoAffix.prototype.render = function render() {
var _props = this.props;
var container = _props.container;
var autoWidth = _props.autoWidth;
var viewportOffsetTop = _props.viewportOffsetTop;
var children = _props.children;
delete props.container;
var props = _objectWithoutProperties(_props, ['container', 'autoWidth', 'viewportOffsetTop', 'children']);
var effectiveOffsetTop = Math.max(offsetTop, viewportOffsetTop || 0);
var _state = this.state;
var offsetTop = _state.offsetTop;
var offsetBottom = _state.offsetBottom;
var width = _state.width;
var _props2 = this.props;
var affixStyle = _props2.affixStyle;
var bottomStyle = _props2.bottomStyle;
var effectiveOffsetTop = Math.max(offsetTop, viewportOffsetTop || 0);
if (autoWidth) {
affixStyle = _extends({ width: width }, affixStyle);
bottomStyle = _extends({ width: width }, bottomStyle);
}
var _props2 = this.props;
var affixStyle = _props2.affixStyle;
var bottomStyle = _props2.bottomStyle;
if (autoWidth) {
affixStyle = _extends({ width: width }, affixStyle);
bottomStyle = _extends({ width: width }, bottomStyle);
return _react2.default.createElement(
'div',
null,
_react2.default.createElement('div', { ref: 'positioner' }),
_react2.default.createElement(
_Affix2.default,
_extends({}, props, {
offsetTop: effectiveOffsetTop,
viewportOffsetTop: viewportOffsetTop,
offsetBottom: offsetBottom,
affixStyle: affixStyle,
bottomStyle: bottomStyle
}),
children
)
);
}
}]);
return _react2['default'].createElement(
'div',
null,
_react2['default'].createElement('div', { ref: 'positioner' }),
_react2['default'].createElement(
_Affix2['default'],
_extends({}, props, {
offsetTop: effectiveOffsetTop,
viewportOffsetTop: viewportOffsetTop,
offsetBottom: offsetBottom,
affixStyle: affixStyle,
bottomStyle: bottomStyle
}),
children
)
);
};
return AutoAffix;
})(_react2['default'].Component);
}(_react2.default.Component);
AutoAffix.propTypes = _extends({}, _Affix2['default'].propTypes, {
AutoAffix.propTypes = _extends({}, _Affix2.default.propTypes, {
/**

@@ -234,7 +256,7 @@ * The logical container node or component for determining offset from bottom

*/
container: _react2['default'].PropTypes.oneOfType([_reactPropTypesLibMountable2['default'], _react2['default'].PropTypes.func]),
container: _react2.default.PropTypes.oneOfType([_mountable2.default, _react2.default.PropTypes.func]),
/**
* Automatically set width when affixed
*/
autoWidth: _react2['default'].PropTypes.bool
autoWidth: _react2.default.PropTypes.bool
});

@@ -249,3 +271,3 @@

exports['default'] = AutoAffix;
exports.default = AutoAffix;
module.exports = exports['default'];

29

lib/index.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Transition = exports.Position = exports.Portal = exports.Overlay = exports.Modal = exports.AutoAffix = exports.Affix = undefined;
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _Affix2 = require('./Affix');

@@ -11,4 +12,2 @@

exports.Affix = _Affix3['default'];
var _AutoAffix2 = require('./AutoAffix');

@@ -18,4 +17,2 @@

exports.AutoAffix = _AutoAffix3['default'];
var _Modal2 = require('./Modal');

@@ -25,4 +22,2 @@

exports.Modal = _Modal3['default'];
var _Overlay2 = require('./Overlay');

@@ -32,4 +27,2 @@

exports.Overlay = _Overlay3['default'];
var _Portal2 = require('./Portal');

@@ -39,4 +32,2 @@

exports.Portal = _Portal3['default'];
var _Position2 = require('./Position');

@@ -46,4 +37,2 @@

exports.Position = _Position3['default'];
var _Transition2 = require('./Transition');

@@ -53,2 +42,10 @@

exports.Transition = _Transition3['default'];
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.Affix = _Affix3.default;
exports.AutoAffix = _AutoAffix3.default;
exports.Modal = _Modal3.default;
exports.Overlay = _Overlay3.default;
exports.Portal = _Portal3.default;
exports.Position = _Position3.default;
exports.Transition = _Transition3.default;

193

lib/Modal.js

@@ -1,12 +0,10 @@

/*eslint-disable react/prop-types */
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /*eslint-disable react/prop-types */
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var _react = require('react');

@@ -20,9 +18,9 @@

var _reactPropTypesLibMountable = require('react-prop-types/lib/mountable');
var _mountable = require('react-prop-types/lib/mountable');
var _reactPropTypesLibMountable2 = _interopRequireDefault(_reactPropTypesLibMountable);
var _mountable2 = _interopRequireDefault(_mountable);
var _reactPropTypesLibElementType = require('react-prop-types/lib/elementType');
var _elementType = require('react-prop-types/lib/elementType');
var _reactPropTypesLibElementType2 = _interopRequireDefault(_reactPropTypesLibElementType);
var _elementType2 = _interopRequireDefault(_elementType);

@@ -37,32 +35,34 @@ var _Portal = require('./Portal');

var _utilsOwnerDocument = require('./utils/ownerDocument');
var _ownerDocument = require('./utils/ownerDocument');
var _utilsOwnerDocument2 = _interopRequireDefault(_utilsOwnerDocument);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _utilsAddEventListener = require('./utils/addEventListener');
var _addEventListener = require('./utils/addEventListener');
var _utilsAddEventListener2 = _interopRequireDefault(_utilsAddEventListener);
var _addEventListener2 = _interopRequireDefault(_addEventListener);
var _utilsAddFocusListener = require('./utils/addFocusListener');
var _addFocusListener = require('./utils/addFocusListener');
var _utilsAddFocusListener2 = _interopRequireDefault(_utilsAddFocusListener);
var _addFocusListener2 = _interopRequireDefault(_addFocusListener);
var _domHelpersUtilInDOM = require('dom-helpers/util/inDOM');
var _inDOM = require('dom-helpers/util/inDOM');
var _domHelpersUtilInDOM2 = _interopRequireDefault(_domHelpersUtilInDOM);
var _inDOM2 = _interopRequireDefault(_inDOM);
var _domHelpersActiveElement = require('dom-helpers/activeElement');
var _activeElement = require('dom-helpers/activeElement');
var _domHelpersActiveElement2 = _interopRequireDefault(_domHelpersActiveElement);
var _activeElement2 = _interopRequireDefault(_activeElement);
var _domHelpersQueryContains = require('dom-helpers/query/contains');
var _contains = require('dom-helpers/query/contains');
var _domHelpersQueryContains2 = _interopRequireDefault(_domHelpersQueryContains);
var _contains2 = _interopRequireDefault(_contains);
var _utilsGetContainer = require('./utils/getContainer');
var _getContainer = require('./utils/getContainer');
var _utilsGetContainer2 = _interopRequireDefault(_utilsGetContainer);
var _getContainer2 = _interopRequireDefault(_getContainer);
var modalManager = new _ModalManager2['default']();
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var modalManager = new _ModalManager2.default();
/**

@@ -88,11 +88,12 @@ * Love them or hate them, `<Modal/>` provides a solid foundation for creating dialogs, lightboxes, or whatever else.

*/
var Modal = _react2['default'].createClass({
var Modal = _react2.default.createClass({
displayName: 'Modal',
propTypes: _extends({}, _Portal2['default'].propTypes, {
propTypes: _extends({}, _Portal2.default.propTypes, {
/**
* Set the visibility of the Modal
*/
show: _react2['default'].PropTypes.bool,
show: _react2.default.PropTypes.bool,

@@ -105,3 +106,3 @@ /**

*/
container: _react2['default'].PropTypes.oneOfType([_reactPropTypesLibMountable2['default'], _react2['default'].PropTypes.func]),
container: _react2.default.PropTypes.oneOfType([_mountable2.default, _react2.default.PropTypes.func]),

@@ -111,3 +112,3 @@ /**

*/
onShow: _react2['default'].PropTypes.func,
onShow: _react2.default.PropTypes.func,

@@ -120,3 +121,3 @@ /**

*/
onHide: _react2['default'].PropTypes.func,
onHide: _react2.default.PropTypes.func,

@@ -126,3 +127,3 @@ /**

*/
backdrop: _react2['default'].PropTypes.oneOfType([_react2['default'].PropTypes.bool, _react2['default'].PropTypes.oneOf(['static'])]),
backdrop: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.bool, _react2.default.PropTypes.oneOf(['static'])]),

@@ -132,3 +133,3 @@ /**

*/
onEscapeKeyUp: _react2['default'].PropTypes.func,
onEscapeKeyUp: _react2.default.PropTypes.func,

@@ -138,3 +139,3 @@ /**

*/
onBackdropClick: _react2['default'].PropTypes.func,
onBackdropClick: _react2.default.PropTypes.func,

@@ -144,3 +145,3 @@ /**

*/
backdropStyle: _react2['default'].PropTypes.object,
backdropStyle: _react2.default.PropTypes.object,

@@ -150,3 +151,3 @@ /**

*/
backdropClassName: _react2['default'].PropTypes.string,
backdropClassName: _react2.default.PropTypes.string,

@@ -157,3 +158,3 @@ /**

*/
containerClassName: _react2['default'].PropTypes.string,
containerClassName: _react2.default.PropTypes.string,

@@ -163,3 +164,3 @@ /**

*/
keyboard: _react2['default'].PropTypes.bool,
keyboard: _react2.default.PropTypes.bool,

@@ -169,3 +170,3 @@ /**

*/
transition: _reactPropTypesLibElementType2['default'],
transition: _elementType2.default,

@@ -178,3 +179,3 @@ /**

*/
dialogTransitionTimeout: _react2['default'].PropTypes.number,
dialogTransitionTimeout: _react2.default.PropTypes.number,

@@ -187,3 +188,3 @@ /**

*/
backdropTransitionTimeout: _react2['default'].PropTypes.number,
backdropTransitionTimeout: _react2.default.PropTypes.number,

@@ -198,3 +199,3 @@ /**

*/
autoFocus: _react2['default'].PropTypes.bool,
autoFocus: _react2.default.PropTypes.bool,

@@ -207,3 +208,3 @@ /**

*/
enforceFocus: _react2['default'].PropTypes.bool,
enforceFocus: _react2.default.PropTypes.bool,

@@ -213,3 +214,3 @@ /**

*/
onEnter: _react2['default'].PropTypes.func,
onEnter: _react2.default.PropTypes.func,

@@ -219,3 +220,3 @@ /**

*/
onEntering: _react2['default'].PropTypes.func,
onEntering: _react2.default.PropTypes.func,

@@ -225,3 +226,3 @@ /**

*/
onEntered: _react2['default'].PropTypes.func,
onEntered: _react2.default.PropTypes.func,

@@ -231,3 +232,3 @@ /**

*/
onExit: _react2['default'].PropTypes.func,
onExit: _react2.default.PropTypes.func,

@@ -237,3 +238,3 @@ /**

*/
onExiting: _react2['default'].PropTypes.func,
onExiting: _react2.default.PropTypes.func,

@@ -243,3 +244,3 @@ /**

*/
onExited: _react2['default'].PropTypes.func
onExited: _react2.default.PropTypes.func

@@ -260,9 +261,9 @@ }),

},
getInitialState: function getInitialState() {
return { exited: !this.props.show };
},
render: function render() {
var _props = this.props;
var show = _props.show;
var container = _props.container;
var children = _props.children;

@@ -272,16 +273,14 @@ var Transition = _props.transition;

var dialogTransitionTimeout = _props.dialogTransitionTimeout;
var className = _props.className;
var style = _props.style;
var onExit = _props.onExit;
var onExiting = _props.onExiting;
var onEnter = _props.onEnter;
var onEntering = _props.onEntering;
var onEntered = _props.onEntered;
var props = _objectWithoutProperties(_props, ['children', 'transition', 'backdrop', 'dialogTransitionTimeout']);
var onExit = props.onExit;
var onExiting = props.onExiting;
var onEnter = props.onEnter;
var onEntering = props.onEntering;
var onEntered = props.onEntered;
var dialog = _react2.default.Children.only(children);
var show = !!props.show;
var dialog = _react2['default'].Children.only(this.props.children);
var mountModal = show || Transition && !this.state.exited;
if (!mountModal) {

@@ -295,4 +294,5 @@ return null;

if (role === undefined || tabIndex === undefined) {
dialog = _react.cloneElement(dialog, {
dialog = (0, _react.cloneElement)(dialog, {
role: role === undefined ? 'document' : role,

@@ -304,3 +304,3 @@ tabIndex: tabIndex == null ? '-1' : tabIndex

if (Transition) {
dialog = _react2['default'].createElement(
dialog = _react2.default.createElement(
Transition,

@@ -323,15 +323,15 @@ {

return _react2['default'].createElement(
_Portal2['default'],
return _react2.default.createElement(
_Portal2.default,
{
ref: this.setMountNode,
container: props.container
container: container
},
_react2['default'].createElement(
_react2.default.createElement(
'div',
{
ref: 'modal',
role: props.role || 'dialog',
style: props.style,
className: props.className
role: role || 'dialog',
style: style,
className: className
},

@@ -343,3 +343,2 @@ backdrop && this.renderBackdrop(),

},
renderBackdrop: function renderBackdrop() {

@@ -350,3 +349,4 @@ var _props2 = this.props;

var backdrop = _react2['default'].createElement('div', { ref: 'backdrop',
var backdrop = _react2.default.createElement('div', { ref: 'backdrop',
style: this.props.backdropStyle,

@@ -358,3 +358,3 @@ className: this.props.backdropClassName,

if (Transition) {
backdrop = _react2['default'].createElement(
backdrop = _react2.default.createElement(
Transition,

@@ -371,3 +371,2 @@ { transitionAppear: true,

},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {

@@ -381,9 +380,7 @@ if (nextProps.show) {

},
componentWillUpdate: function componentWillUpdate(nextProps) {
if (nextProps.show) {
if (!this.props.show && nextProps.show) {
this.checkForFocus();
}
},
componentDidMount: function componentDidMount() {

@@ -394,6 +391,6 @@ if (this.props.show) {

},
componentDidUpdate: function componentDidUpdate(prevProps) {
var transition = this.props.transition;
if (prevProps.show && !this.props.show && !transition) {

@@ -406,3 +403,2 @@ // Otherwise handleHidden will call this.

},
componentWillUnmount: function componentWillUnmount() {

@@ -413,2 +409,3 @@ var _props3 = this.props;

if (show || transition && !this.state.exited) {

@@ -418,12 +415,11 @@ this.onHide();

},
onShow: function onShow() {
var doc = _utilsOwnerDocument2['default'](this);
var container = _utilsGetContainer2['default'](this.props.container, doc.body);
var doc = (0, _ownerDocument2.default)(this);
var container = (0, _getContainer2.default)(this.props.container, doc.body);
modalManager.add(this, container, this.props.containerClassName);
this._onDocumentKeyupListener = _utilsAddEventListener2['default'](doc, 'keyup', this.handleDocumentKeyUp);
this._onDocumentKeyupListener = (0, _addEventListener2.default)(doc, 'keyup', this.handleDocumentKeyUp);
this._onFocusinListener = _utilsAddFocusListener2['default'](this.enforceFocus);
this._onFocusinListener = (0, _addFocusListener2.default)(this.enforceFocus);

@@ -436,3 +432,2 @@ this.focus();

},
onHide: function onHide() {

@@ -447,7 +442,5 @@ modalManager.remove(this);

},
setMountNode: function setMountNode(ref) {
this.mountNode = ref ? ref.getMountNode() : ref;
},
handleHidden: function handleHidden() {

@@ -463,3 +456,2 @@ this.setState({ exited: true });

},
handleBackdropClick: function handleBackdropClick(e) {

@@ -478,3 +470,2 @@ if (e.target !== e.currentTarget) {

},
handleDocumentKeyUp: function handleDocumentKeyUp(e) {

@@ -488,14 +479,12 @@ if (this.props.keyboard && e.keyCode === 27 && this.isTopModal()) {

},
checkForFocus: function checkForFocus() {
if (_domHelpersUtilInDOM2['default']) {
this.lastFocus = _domHelpersActiveElement2['default']();
if (_inDOM2.default) {
this.lastFocus = (0, _activeElement2.default)();
}
},
focus: function focus() {
var autoFocus = this.props.autoFocus;
var modalContent = this.getDialogElement();
var current = _domHelpersActiveElement2['default'](_utilsOwnerDocument2['default'](this));
var focusInModal = current && _domHelpersQueryContains2['default'](modalContent, current);
var current = (0, _activeElement2.default)((0, _ownerDocument2.default)(this));
var focusInModal = current && (0, _contains2.default)(modalContent, current);

@@ -507,3 +496,3 @@ if (modalContent && autoFocus && !focusInModal) {

modalContent.setAttribute('tabIndex', -1);
_warning2['default'](false, 'The modal content node does not accept focus. ' + 'For the benefit of assistive technologies, the tabIndex of the node is being set to "-1".');
(0, _warning2.default)(false, 'The modal content node does not accept focus. ' + 'For the benefit of assistive technologies, the tabIndex of the node is being set to "-1".');
}

@@ -514,3 +503,2 @@

},
restoreLastFocus: function restoreLastFocus() {

@@ -523,6 +511,6 @@ // Support: <=IE11 doesn't support `focus()` on svg elements (RB: #917)

},
enforceFocus: function enforceFocus() {
var enforceFocus = this.props.enforceFocus;
if (!enforceFocus || !this.isMounted() || !this.isTopModal()) {

@@ -532,6 +520,6 @@ return;

var active = _domHelpersActiveElement2['default'](_utilsOwnerDocument2['default'](this));
var active = (0, _activeElement2.default)((0, _ownerDocument2.default)(this));
var modal = this.getDialogElement();
if (modal && modal !== active && !_domHelpersQueryContains2['default'](modal, active)) {
if (modal && modal !== active && !(0, _contains2.default)(modal, active)) {
modal.focus();

@@ -541,2 +529,3 @@ }

//instead of a ref, which might conflict with one the parent applied.

@@ -547,7 +536,5 @@ getDialogElement: function getDialogElement() {

},
isTopModal: function isTopModal() {
return modalManager.isTopModal(this);
}
});

@@ -557,3 +544,3 @@

exports['default'] = Modal;
exports.default = Modal;
module.exports = exports['default'];

173

lib/ModalManager.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
var _style = require('dom-helpers/style');
var _domHelpersStyle = require('dom-helpers/style');
var _style2 = _interopRequireDefault(_style);
var _domHelpersStyle2 = _interopRequireDefault(_domHelpersStyle);
var _class = require('dom-helpers/class');
var _domHelpersClass = require('dom-helpers/class');
var _class2 = _interopRequireDefault(_class);
var _domHelpersClass2 = _interopRequireDefault(_domHelpersClass);
var _scrollbarSize = require('dom-helpers/util/scrollbarSize');
var _domHelpersUtilScrollbarSize = require('dom-helpers/util/scrollbarSize');
var _scrollbarSize2 = _interopRequireDefault(_scrollbarSize);
var _domHelpersUtilScrollbarSize2 = _interopRequireDefault(_domHelpersUtilScrollbarSize);
var _isOverflowing = require('./utils/isOverflowing');
var _utilsIsOverflowing = require('./utils/isOverflowing');
var _isOverflowing2 = _interopRequireDefault(_isOverflowing);
var _utilsIsOverflowing2 = _interopRequireDefault(_utilsIsOverflowing);
var _manageAriaHidden = require('./utils/manageAriaHidden');
var _utilsManageAriaHidden = require('./utils/manageAriaHidden');
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 findIndexOf(arr, cb) {

@@ -50,3 +54,3 @@ var idx = -1;

var ModalManager = (function () {
var ModalManager = function () {
function ModalManager() {

@@ -63,96 +67,101 @@ var hideSiblingNodes = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];

ModalManager.prototype.add = function add(modal, container, className) {
var modalIdx = this.modals.indexOf(modal);
var containerIdx = this.containers.indexOf(container);
_createClass(ModalManager, [{
key: 'add',
value: function add(modal, container, className) {
var modalIdx = this.modals.indexOf(modal);
var containerIdx = this.containers.indexOf(container);
if (modalIdx !== -1) {
return modalIdx;
}
if (modalIdx !== -1) {
return modalIdx;
}
modalIdx = this.modals.length;
this.modals.push(modal);
modalIdx = this.modals.length;
this.modals.push(modal);
if (this.hideSiblingNodes) {
_utilsManageAriaHidden.hideSiblings(container, modal.mountNode);
}
if (this.hideSiblingNodes) {
(0, _manageAriaHidden.hideSiblings)(container, modal.mountNode);
}
if (containerIdx !== -1) {
this.data[containerIdx].modals.push(modal);
return modalIdx;
}
var data = {
modals: [modal],
//right now only the first modal of a container will have its classes applied
classes: className ? className.split(/\s+/) : [],
//we are only interested in the actual `style` here becasue we will override it
style: {
overflow: container.style.overflow,
paddingRight: container.style.paddingRight
if (containerIdx !== -1) {
this.data[containerIdx].modals.push(modal);
return modalIdx;
}
};
var style = { overflow: 'hidden' };
var data = {
modals: [modal],
//right now only the first modal of a container will have its classes applied
classes: className ? className.split(/\s+/) : [],
//we are only interested in the actual `style` here becasue we will override it
style: {
overflow: container.style.overflow,
paddingRight: container.style.paddingRight
}
};
data.overflowing = _utilsIsOverflowing2['default'](container);
var style = { overflow: 'hidden' };
if (data.overflowing) {
// use computed style, here to get the real padding
// to add our scrollbar width
style.paddingRight = parseInt(_domHelpersStyle2['default'](container, 'paddingRight') || 0, 10) + _domHelpersUtilScrollbarSize2['default']() + 'px';
}
data.overflowing = (0, _isOverflowing2.default)(container);
_domHelpersStyle2['default'](container, style);
if (data.overflowing) {
// use computed style, here to get the real padding
// to add our scrollbar width
style.paddingRight = parseInt((0, _style2.default)(container, 'paddingRight') || 0, 10) + (0, _scrollbarSize2.default)() + 'px';
}
data.classes.forEach(_domHelpersClass2['default'].addClass.bind(null, container));
(0, _style2.default)(container, style);
this.containers.push(container);
this.data.push(data);
data.classes.forEach(_class2.default.addClass.bind(null, container));
return modalIdx;
};
this.containers.push(container);
this.data.push(data);
ModalManager.prototype.remove = function remove(modal) {
var modalIdx = this.modals.indexOf(modal);
if (modalIdx === -1) {
return;
return modalIdx;
}
}, {
key: 'remove',
value: function remove(modal) {
var modalIdx = this.modals.indexOf(modal);
var containerIdx = findContainer(this.data, modal);
var data = this.data[containerIdx];
var container = this.containers[containerIdx];
if (modalIdx === -1) {
return;
}
data.modals.splice(data.modals.indexOf(modal), 1);
var containerIdx = findContainer(this.data, modal);
var data = this.data[containerIdx];
var container = this.containers[containerIdx];
this.modals.splice(modalIdx, 1);
data.modals.splice(data.modals.indexOf(modal), 1);
// if that was the last modal in a container,
// clean up the container stylinhg.
if (data.modals.length === 0) {
Object.keys(data.style).forEach(function (key) {
return container.style[key] = data.style[key];
});
this.modals.splice(modalIdx, 1);
data.classes.forEach(_domHelpersClass2['default'].removeClass.bind(null, container));
// if that was the last modal in a container,
// clean up the container stylinhg.
if (data.modals.length === 0) {
Object.keys(data.style).forEach(function (key) {
return container.style[key] = data.style[key];
});
if (this.hideSiblingNodes) {
_utilsManageAriaHidden.showSiblings(container, modal.mountNode);
data.classes.forEach(_class2.default.removeClass.bind(null, container));
if (this.hideSiblingNodes) {
(0, _manageAriaHidden.showSiblings)(container, modal.mountNode);
}
this.containers.splice(containerIdx, 1);
this.data.splice(containerIdx, 1);
} else if (this.hideSiblingNodes) {
//otherwise make sure the next top modal is visible to a SR
(0, _manageAriaHidden.ariaHidden)(false, data.modals[data.modals.length - 1].mountNode);
}
this.containers.splice(containerIdx, 1);
this.data.splice(containerIdx, 1);
} else if (this.hideSiblingNodes) {
//otherwise make sure the next top modal is visible to a SR
_utilsManageAriaHidden.ariaHidden(false, data.modals[data.modals.length - 1].mountNode);
}
};
}, {
key: 'isTopModal',
value: function isTopModal(modal) {
return !!this.modals.length && this.modals[this.modals.length - 1] === modal;
}
}]);
ModalManager.prototype.isTopModal = function isTopModal(modal) {
return !!this.modals.length && this.modals[this.modals.length - 1] === modal;
};
return ModalManager;
})();
}();
exports['default'] = ModalManager;
exports.default = ModalManager;
module.exports = exports['default'];

216

lib/Overlay.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
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 _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var _react = require('react');

@@ -31,6 +27,16 @@

var _reactPropTypesLibElementType = require('react-prop-types/lib/elementType');
var _elementType = require('react-prop-types/lib/elementType');
var _reactPropTypesLibElementType2 = _interopRequireDefault(_reactPropTypesLibElementType);
var _elementType2 = _interopRequireDefault(_elementType);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**

@@ -40,3 +46,3 @@ * Built on top of `<Position/>` and `<Portal/>`, the overlay component is great for custom tooltip overlays.

var Overlay = (function (_React$Component) {
var Overlay = function (_React$Component) {
_inherits(Overlay, _React$Component);

@@ -47,102 +53,111 @@

_React$Component.call(this, props, context);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Overlay).call(this, props, context));
this.state = { exited: !props.show };
this.onHiddenListener = this.handleHidden.bind(this);
_this.state = { exited: !props.show };
_this.onHiddenListener = _this.handleHidden.bind(_this);
return _this;
}
Overlay.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (nextProps.show) {
this.setState({ exited: false });
} else if (!nextProps.transition) {
// Otherwise let handleHidden take care of marking exited.
this.setState({ exited: true });
_createClass(Overlay, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.show) {
this.setState({ exited: false });
} else if (!nextProps.transition) {
// Otherwise let handleHidden take care of marking exited.
this.setState({ exited: true });
}
}
};
}, {
key: 'render',
value: function render() {
var _props = this.props;
var container = _props.container;
var containerPadding = _props.containerPadding;
var target = _props.target;
var placement = _props.placement;
var shouldUpdatePosition = _props.shouldUpdatePosition;
var rootClose = _props.rootClose;
var children = _props.children;
var Transition = _props.transition;
Overlay.prototype.render = function render() {
var _props = this.props;
var container = _props.container;
var containerPadding = _props.containerPadding;
var target = _props.target;
var placement = _props.placement;
var shouldUpdatePosition = _props.shouldUpdatePosition;
var rootClose = _props.rootClose;
var children = _props.children;
var Transition = _props.transition;
var props = _objectWithoutProperties(_props, ['container', 'containerPadding', 'target', 'placement', 'shouldUpdatePosition', 'rootClose', 'children', 'transition']);
var props = _objectWithoutProperties(_props, ['container', 'containerPadding', 'target', 'placement', 'shouldUpdatePosition', 'rootClose', 'children', 'transition']);
// Don't un-render the overlay while it's transitioning out.
// Don't un-render the overlay while it's transitioning out.
var mountOverlay = props.show || Transition && !this.state.exited;
if (!mountOverlay) {
// Don't bother showing anything if we don't have to.
return null;
}
var child = children;
var mountOverlay = props.show || Transition && !this.state.exited;
if (!mountOverlay) {
// Don't bother showing anything if we don't have to.
return null;
}
// Position is be inner-most because it adds inline styles into the child,
// which the other wrappers don't forward correctly.
child = _react2['default'].createElement(
_Position2['default'],
{ container: container, containerPadding: containerPadding, target: target, placement: placement, shouldUpdatePosition: shouldUpdatePosition },
child
);
var child = children;
if (Transition) {
var onExit = props.onExit;
var onExiting = props.onExiting;
var onEnter = props.onEnter;
var onEntering = props.onEntering;
var onEntered = props.onEntered;
// This animates the child node by injecting props, so it must precede
// anything that adds a wrapping div.
child = _react2['default'].createElement(
Transition,
{
'in': props.show,
transitionAppear: true,
onExit: onExit,
onExiting: onExiting,
onExited: this.onHiddenListener,
onEnter: onEnter,
onEntering: onEntering,
onEntered: onEntered
},
// Position is be inner-most because it adds inline styles into the child,
// which the other wrappers don't forward correctly.
child = _react2.default.createElement(
_Position2.default,
{ container: container, containerPadding: containerPadding, target: target, placement: placement, shouldUpdatePosition: shouldUpdatePosition },
child
);
}
// This goes after everything else because it adds a wrapping div.
if (rootClose) {
child = _react2['default'].createElement(
_RootCloseWrapper2['default'],
{ onRootClose: props.onHide },
if (Transition) {
var onExit = props.onExit;
var onExiting = props.onExiting;
var onEnter = props.onEnter;
var onEntering = props.onEntering;
var onEntered = props.onEntered;
// This animates the child node by injecting props, so it must precede
// anything that adds a wrapping div.
child = _react2.default.createElement(
Transition,
{
'in': props.show,
transitionAppear: true,
onExit: onExit,
onExiting: onExiting,
onExited: this.onHiddenListener,
onEnter: onEnter,
onEntering: onEntering,
onEntered: onEntered
},
child
);
}
// This goes after everything else because it adds a wrapping div.
if (rootClose) {
child = _react2.default.createElement(
_RootCloseWrapper2.default,
{ onRootClose: props.onHide },
child
);
}
return _react2.default.createElement(
_Portal2.default,
{ container: container },
child
);
}
}, {
key: 'handleHidden',
value: function handleHidden() {
this.setState({ exited: true });
return _react2['default'].createElement(
_Portal2['default'],
{ container: container },
child
);
};
if (this.props.onExited) {
var _props2;
Overlay.prototype.handleHidden = function handleHidden() {
this.setState({ exited: true });
if (this.props.onExited) {
var _props2;
(_props2 = this.props).onExited.apply(_props2, arguments);
(_props2 = this.props).onExited.apply(_props2, arguments);
}
}
};
}]);
return Overlay;
})(_react2['default'].Component);
}(_react2.default.Component);
Overlay.propTypes = _extends({}, _Portal2['default'].propTypes, _Position2['default'].propTypes, {
Overlay.propTypes = _extends({}, _Portal2.default.propTypes, _Position2.default.propTypes, {

@@ -152,3 +167,3 @@ /**

*/
show: _react2['default'].PropTypes.bool,
show: _react2.default.PropTypes.bool,

@@ -158,3 +173,3 @@ /**

*/
rootClose: _react2['default'].PropTypes.bool,
rootClose: _react2.default.PropTypes.bool,

@@ -169,3 +184,3 @@ /**

onHide: function onHide(props, name, cname) {
var pt = _react2['default'].PropTypes.func;
var pt = _react2.default.PropTypes.func;

@@ -176,6 +191,7 @@ if (props.rootClose) pt = pt.isRequired;

/**
* A `<Transition/>` component used to animate the overlay changes visibility.
*/
transition: _reactPropTypesLibElementType2['default'],
transition: _elementType2.default,

@@ -185,3 +201,3 @@ /**

*/
onEnter: _react2['default'].PropTypes.func,
onEnter: _react2.default.PropTypes.func,

@@ -191,3 +207,3 @@ /**

*/
onEntering: _react2['default'].PropTypes.func,
onEntering: _react2.default.PropTypes.func,

@@ -197,3 +213,3 @@ /**

*/
onEntered: _react2['default'].PropTypes.func,
onEntered: _react2.default.PropTypes.func,

@@ -203,3 +219,3 @@ /**

*/
onExit: _react2['default'].PropTypes.func,
onExit: _react2.default.PropTypes.func,

@@ -209,3 +225,3 @@ /**

*/
onExiting: _react2['default'].PropTypes.func,
onExiting: _react2.default.PropTypes.func,

@@ -215,6 +231,6 @@ /**

*/
onExited: _react2['default'].PropTypes.func
onExited: _react2.default.PropTypes.func
});
exports['default'] = Overlay;
exports.default = Overlay;
module.exports = exports['default'];

49

lib/Portal.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _react = require('react');

@@ -15,14 +15,16 @@

var _reactPropTypesLibMountable = require('react-prop-types/lib/mountable');
var _mountable = require('react-prop-types/lib/mountable');
var _reactPropTypesLibMountable2 = _interopRequireDefault(_reactPropTypesLibMountable);
var _mountable2 = _interopRequireDefault(_mountable);
var _utilsOwnerDocument = require('./utils/ownerDocument');
var _ownerDocument = require('./utils/ownerDocument');
var _utilsOwnerDocument2 = _interopRequireDefault(_utilsOwnerDocument);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _utilsGetContainer = require('./utils/getContainer');
var _getContainer = require('./utils/getContainer');
var _utilsGetContainer2 = _interopRequireDefault(_utilsGetContainer);
var _getContainer2 = _interopRequireDefault(_getContainer);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**

@@ -33,3 +35,3 @@ * The `<Portal/>` component renders its children into a new "subtree" outside of current component hierarchy.

*/
var Portal = _react2['default'].createClass({
var Portal = _react2.default.createClass({

@@ -43,3 +45,3 @@ displayName: 'Portal',

*/
container: _react2['default'].PropTypes.oneOfType([_reactPropTypesLibMountable2['default'], _react2['default'].PropTypes.func])
container: _react2.default.PropTypes.oneOfType([_mountable2.default, _react2.default.PropTypes.func])
},

@@ -50,15 +52,12 @@

},
componentDidUpdate: function componentDidUpdate() {
this._renderOverlay();
},
componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
if (this._overlayTarget && nextProps.container !== this.props.container) {
this._portalContainerNode.removeChild(this._overlayTarget);
this._portalContainerNode = _utilsGetContainer2['default'](nextProps.container, _utilsOwnerDocument2['default'](this).body);
this._portalContainerNode = (0, _getContainer2.default)(nextProps.container, (0, _ownerDocument2.default)(this).body);
this._portalContainerNode.appendChild(this._overlayTarget);
}
},
componentWillUnmount: function componentWillUnmount() {

@@ -68,11 +67,9 @@ this._unrenderOverlay();

},
_mountOverlayTarget: function _mountOverlayTarget() {
if (!this._overlayTarget) {
this._overlayTarget = document.createElement('div');
this._portalContainerNode = _utilsGetContainer2['default'](this.props.container, _utilsOwnerDocument2['default'](this).body);
this._portalContainerNode = (0, _getContainer2.default)(this.props.container, (0, _ownerDocument2.default)(this).body);
this._portalContainerNode.appendChild(this._overlayTarget);
}
},
_unmountOverlayTarget: function _unmountOverlayTarget() {

@@ -85,6 +82,5 @@ if (this._overlayTarget) {

},
_renderOverlay: function _renderOverlay() {
var overlay = !this.props.children ? null : _react2['default'].Children.only(this.props.children);
var overlay = !this.props.children ? null : _react2.default.Children.only(this.props.children);

@@ -94,3 +90,3 @@ // Save reference for future access.

this._mountOverlayTarget();
this._overlayInstance = _reactDom2['default'].unstable_renderSubtreeIntoContainer(this, overlay, this._overlayTarget);
this._overlayInstance = _reactDom2.default.unstable_renderSubtreeIntoContainer(this, overlay, this._overlayTarget);
} else {

@@ -102,18 +98,14 @@ // Unrender if the component is null for transitions to null

},
_unrenderOverlay: function _unrenderOverlay() {
if (this._overlayTarget) {
_reactDom2['default'].unmountComponentAtNode(this._overlayTarget);
_reactDom2.default.unmountComponentAtNode(this._overlayTarget);
this._overlayInstance = null;
}
},
render: function render() {
return null;
},
getMountNode: function getMountNode() {
return this._overlayTarget;
},
getOverlayDOMNode: function getOverlayDOMNode() {

@@ -128,3 +120,3 @@ if (!this.isMounted()) {

} else {
return _reactDom2['default'].findDOMNode(this._overlayInstance);
return _reactDom2.default.findDOMNode(this._overlayInstance);
}

@@ -135,6 +127,5 @@ }

}
});
exports['default'] = Portal;
exports.default = Portal;
module.exports = exports['default'];

219

lib/Position.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
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 _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var _react = require('react');

@@ -27,16 +23,26 @@

var _utilsOwnerDocument = require('./utils/ownerDocument');
var _ownerDocument = require('./utils/ownerDocument');
var _utilsOwnerDocument2 = _interopRequireDefault(_utilsOwnerDocument);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _utilsGetContainer = require('./utils/getContainer');
var _getContainer = require('./utils/getContainer');
var _utilsGetContainer2 = _interopRequireDefault(_utilsGetContainer);
var _getContainer2 = _interopRequireDefault(_getContainer);
var _utilsOverlayPositionUtils = require('./utils/overlayPositionUtils');
var _overlayPositionUtils = require('./utils/overlayPositionUtils');
var _reactPropTypesLibMountable = require('react-prop-types/lib/mountable');
var _mountable = require('react-prop-types/lib/mountable');
var _reactPropTypesLibMountable2 = _interopRequireDefault(_reactPropTypesLibMountable);
var _mountable2 = _interopRequireDefault(_mountable);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**

@@ -51,3 +57,3 @@ * The Position component calculates the coordinates for its child, to

var Position = (function (_React$Component) {
var Position = function (_React$Component) {
_inherits(Position, _React$Component);

@@ -58,5 +64,5 @@

_React$Component.call(this, props, context);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Position).call(this, props, context));
this.state = {
_this.state = {
positionLeft: 0,

@@ -68,100 +74,113 @@ positionTop: 0,

this._needsFlush = false;
this._lastTarget = null;
_this._needsFlush = false;
_this._lastTarget = null;
return _this;
}
Position.prototype.componentDidMount = function componentDidMount() {
this.updatePosition();
};
Position.prototype.componentWillReceiveProps = function componentWillReceiveProps() {
this._needsFlush = true;
};
Position.prototype.componentDidUpdate = function componentDidUpdate(prevProps) {
if (this._needsFlush) {
this._needsFlush = false;
this.updatePosition(prevProps.placement !== this.props.placement);
_createClass(Position, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.updatePosition();
}
};
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps() {
this._needsFlush = true;
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate(prevProps) {
if (this._needsFlush) {
this._needsFlush = false;
this.updatePosition(prevProps.placement !== this.props.placement);
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
// Probably not necessary, but just in case holding a reference to the
// target causes problems somewhere.
this._lastTarget = null;
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var className = _props.className;
Position.prototype.componentWillUnmount = function componentWillUnmount() {
// Probably not necessary, but just in case holding a reference to the
// target causes problems somewhere.
this._lastTarget = null;
};
var props = _objectWithoutProperties(_props, ['children', 'className']);
Position.prototype.render = function render() {
var _props = this.props;
var children = _props.children;
var className = _props.className;
var _state = this.state;
var positionLeft = _state.positionLeft;
var positionTop = _state.positionTop;
var props = _objectWithoutProperties(_props, ['children', 'className']);
var arrowPosition = _objectWithoutProperties(_state, ['positionLeft', 'positionTop']);
var _state = this.state;
var positionLeft = _state.positionLeft;
var positionTop = _state.positionTop;
// These should not be forwarded to the child.
var arrowPosition = _objectWithoutProperties(_state, ['positionLeft', 'positionTop']);
// These should not be forwarded to the child.
delete props.target;
delete props.container;
delete props.containerPadding;
delete props.target;
delete props.container;
delete props.containerPadding;
delete props.shouldUpdatePosition;
var child = _react2['default'].Children.only(children);
return _react.cloneElement(child, _extends({}, props, arrowPosition, {
//do we need to also forward positionLeft and positionTop if they are set to style?
positionLeft: positionLeft,
positionTop: positionTop,
className: _classnames2['default'](className, child.props.className),
style: _extends({}, child.props.style, {
left: positionLeft,
top: positionTop
})
}));
};
Position.prototype.getTargetSafe = function getTargetSafe() {
if (!this.props.target) {
return null;
var child = _react2.default.Children.only(children);
return (0, _react.cloneElement)(child, _extends({}, props, arrowPosition, {
//do we need to also forward positionLeft and positionTop if they are set to style?
positionLeft: positionLeft,
positionTop: positionTop,
className: (0, _classnames2.default)(className, child.props.className),
style: _extends({}, child.props.style, {
left: positionLeft,
top: positionTop
})
}));
}
}, {
key: 'getTargetSafe',
value: function getTargetSafe() {
if (!this.props.target) {
return null;
}
var target = this.props.target(this.props);
if (!target) {
// This is so we can just use === check below on all falsy targets.
return null;
var target = this.props.target(this.props);
if (!target) {
// This is so we can just use === check below on all falsy targets.
return null;
}
return target;
}
}, {
key: 'updatePosition',
value: function updatePosition(placementChanged) {
var target = this.getTargetSafe();
return target;
};
if (!this.props.shouldUpdatePosition && target === this._lastTarget && !placementChanged) {
return;
}
Position.prototype.updatePosition = function updatePosition(placementChanged) {
var target = this.getTargetSafe();
this._lastTarget = target;
if (!this.props.shouldUpdatePosition && target === this._lastTarget && !placementChanged) {
return;
}
if (!target) {
this.setState({
positionLeft: 0,
positionTop: 0,
arrowOffsetLeft: null,
arrowOffsetTop: null
});
this._lastTarget = target;
return;
}
if (!target) {
this.setState({
positionLeft: 0,
positionTop: 0,
arrowOffsetLeft: null,
arrowOffsetTop: null
});
var overlay = _reactDom2.default.findDOMNode(this);
var container = (0, _getContainer2.default)(this.props.container, (0, _ownerDocument2.default)(this).body);
return;
this.setState((0, _overlayPositionUtils.calcOverlayPosition)(this.props.placement, overlay, target, container, this.props.containerPadding));
}
}]);
var overlay = _reactDom2['default'].findDOMNode(this);
var container = _utilsGetContainer2['default'](this.props.container, _utilsOwnerDocument2['default'](this).body);
this.setState(_utilsOverlayPositionUtils.calcOverlayPosition(this.props.placement, overlay, target, container, this.props.containerPadding));
};
return Position;
})(_react2['default'].Component);
}(_react2.default.Component);

@@ -173,3 +192,3 @@ Position.propTypes = {

*/
target: _react2['default'].PropTypes.func,
target: _react2.default.PropTypes.func,

@@ -179,15 +198,15 @@ /**

*/
container: _react2['default'].PropTypes.oneOfType([_reactPropTypesLibMountable2['default'], _react2['default'].PropTypes.func]),
container: _react2.default.PropTypes.oneOfType([_mountable2.default, _react2.default.PropTypes.func]),
/**
* Minimum spacing in pixels between container border and component border
*/
containerPadding: _react2['default'].PropTypes.number,
containerPadding: _react2.default.PropTypes.number,
/**
* How to position the component relative to the target
*/
placement: _react2['default'].PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
placement: _react2.default.PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
/**
* Whether the position should be changed on each update
*/
shouldUpdatePosition: _react2['default'].PropTypes.bool
shouldUpdatePosition: _react2.default.PropTypes.bool
};

@@ -203,3 +222,3 @@

exports['default'] = Position;
exports.default = Position;
module.exports = exports['default'];

201

lib/RootCloseWrapper.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
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 _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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var _react = require('react');

@@ -19,14 +17,24 @@

var _utilsAddEventListener = require('./utils/addEventListener');
var _addEventListener = require('./utils/addEventListener');
var _utilsAddEventListener2 = _interopRequireDefault(_utilsAddEventListener);
var _addEventListener2 = _interopRequireDefault(_addEventListener);
var _utilsCreateChainedFunction = require('./utils/createChainedFunction');
var _createChainedFunction = require('./utils/createChainedFunction');
var _utilsCreateChainedFunction2 = _interopRequireDefault(_utilsCreateChainedFunction);
var _createChainedFunction2 = _interopRequireDefault(_createChainedFunction);
var _utilsOwnerDocument = require('./utils/ownerDocument');
var _ownerDocument = require('./utils/ownerDocument');
var _utilsOwnerDocument2 = _interopRequireDefault(_utilsOwnerDocument);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
// TODO: Consider using an ES6 symbol here, once we use babel-runtime.

@@ -58,3 +66,3 @@ var CLICK_WAS_INSIDE = '__click_was_inside';

var RootCloseWrapper = (function (_React$Component) {
var RootCloseWrapper = function (_React$Component) {
_inherits(RootCloseWrapper, _React$Component);

@@ -65,6 +73,6 @@

_React$Component.call(this, props);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(RootCloseWrapper).call(this, props));
this.handleDocumentClick = this.handleDocumentClick.bind(this);
this.handleDocumentKeyUp = this.handleDocumentKeyUp.bind(this);
_this.handleDocumentMouse = _this.handleDocumentMouse.bind(_this);
_this.handleDocumentKeyUp = _this.handleDocumentKeyUp.bind(_this);

@@ -76,94 +84,113 @@ var _getSuppressRootClose = getSuppressRootClose();

this._suppressRootId = id;
this._suppressRootCloseHandler = suppressRootClose;
_this._suppressRootId = id;
_this._suppressRootCloseHandler = suppressRootClose;
return _this;
}
RootCloseWrapper.prototype.bindRootCloseHandlers = function bindRootCloseHandlers() {
var doc = _utilsOwnerDocument2['default'](this);
_createClass(RootCloseWrapper, [{
key: 'bindRootCloseHandlers',
value: function bindRootCloseHandlers() {
var doc = (0, _ownerDocument2.default)(this);
this._onDocumentClickListener = _utilsAddEventListener2['default'](doc, 'click', this.handleDocumentClick);
this._onDocumentMouseListener = (0, _addEventListener2.default)(doc, this.props.event, this.handleDocumentMouse);
this._onDocumentKeyupListener = _utilsAddEventListener2['default'](doc, 'keyup', this.handleDocumentKeyUp);
};
RootCloseWrapper.prototype.handleDocumentClick = function handleDocumentClick(e) {
// This is now the native event.
if (e[this._suppressRootId]) {
return;
this._onDocumentKeyupListener = (0, _addEventListener2.default)(doc, 'keyup', this.handleDocumentKeyUp);
}
}, {
key: 'handleDocumentMouse',
value: function handleDocumentMouse(e) {
// This is now the native event.
if (e[this._suppressRootId]) {
return;
}
if (isModifiedEvent(e) || !isLeftClickEvent(e)) {
return;
}
if (this.props.disabled || isModifiedEvent(e) || !isLeftClickEvent(e)) {
return;
}
this.props.onRootClose();
};
RootCloseWrapper.prototype.handleDocumentKeyUp = function handleDocumentKeyUp(e) {
if (e.keyCode === 27) {
this.props.onRootClose();
this.props.onRootClose && this.props.onRootClose();
}
};
RootCloseWrapper.prototype.unbindRootCloseHandlers = function unbindRootCloseHandlers() {
if (this._onDocumentClickListener) {
this._onDocumentClickListener.remove();
}, {
key: 'handleDocumentKeyUp',
value: function handleDocumentKeyUp(e) {
if (e.keyCode === 27 && this.props.onRootClose) {
this.props.onRootClose();
}
}
}, {
key: 'unbindRootCloseHandlers',
value: function unbindRootCloseHandlers() {
if (this._onDocumentMouseListener) {
this._onDocumentMouseListener.remove();
}
if (this._onDocumentKeyupListener) {
this._onDocumentKeyupListener.remove();
if (this._onDocumentKeyupListener) {
this._onDocumentKeyupListener.remove();
}
}
};
}, {
key: 'componentDidMount',
value: function componentDidMount() {
this.bindRootCloseHandlers();
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var event = _props.event;
var noWrap = _props.noWrap;
var children = _props.children;
RootCloseWrapper.prototype.componentDidMount = function componentDidMount() {
this.bindRootCloseHandlers();
};
var child = _react2.default.Children.only(children);
RootCloseWrapper.prototype.render = function render() {
var _props = this.props;
var noWrap = _props.noWrap;
var children = _props.children;
var handlerName = event == 'click' ? 'onClick' : 'onMouseDown';
var child = _react2['default'].Children.only(children);
if (noWrap) {
return _react2.default.cloneElement(child, _defineProperty({}, handlerName, (0, _createChainedFunction2.default)(this._suppressRootCloseHandler, child.props[handlerName])));
}
if (noWrap) {
return _react2['default'].cloneElement(child, {
onClick: _utilsCreateChainedFunction2['default'](this._suppressRootCloseHandler, child.props.onClick)
});
// Wrap the child in a new element, so the child won't have to handle
// potentially combining multiple onClick listeners.
return _react2.default.createElement(
'div',
_defineProperty({}, handlerName, this._suppressRootCloseHandler),
child
);
}
}, {
key: 'getWrappedDOMNode',
value: function getWrappedDOMNode() {
// We can't use a ref to identify the wrapped child, since we might be
// stealing the ref from the owner, but we know exactly the DOM structure
// that will be rendered, so we can just do this to get the child's DOM
// node for doing size calculations in OverlayMixin.
var node = _reactDom2.default.findDOMNode(this);
return this.props.noWrap ? node : node.firstChild;
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this.unbindRootCloseHandlers();
}
}]);
// Wrap the child in a new element, so the child won't have to handle
// potentially combining multiple onClick listeners.
return _react2['default'].createElement(
'div',
{ onClick: this._suppressRootCloseHandler },
child
);
};
return RootCloseWrapper;
}(_react2.default.Component);
RootCloseWrapper.prototype.getWrappedDOMNode = function getWrappedDOMNode() {
// We can't use a ref to identify the wrapped child, since we might be
// stealing the ref from the owner, but we know exactly the DOM structure
// that will be rendered, so we can just do this to get the child's DOM
// node for doing size calculations in OverlayMixin.
var node = _reactDom2['default'].findDOMNode(this);
return this.props.noWrap ? node : node.firstChild;
};
exports.default = RootCloseWrapper;
RootCloseWrapper.prototype.componentWillUnmount = function componentWillUnmount() {
this.unbindRootCloseHandlers();
};
return RootCloseWrapper;
})(_react2['default'].Component);
exports['default'] = RootCloseWrapper;
RootCloseWrapper.displayName = 'RootCloseWrapper';
RootCloseWrapper.propTypes = {
onRootClose: _react2['default'].PropTypes.func.isRequired,
onRootClose: _react2.default.PropTypes.func,
/**
* Disable the the RootCloseWrapper, preventing it from triggering
* `onRootClose`.
*/
disabled: _react2.default.PropTypes.bool,
/**
* Passes the suppress click handler directly to the child component instead

@@ -173,4 +200,12 @@ * of placing it on a wrapping div. Only use when you can be sure the child

*/
noWrap: _react2['default'].PropTypes.bool
noWrap: _react2.default.PropTypes.bool,
/**
* Choose which document mouse event to bind to
*/
event: _react2.default.PropTypes.oneOf(['click', 'mousedown'])
};
RootCloseWrapper.defaultProps = {
event: 'click'
};
module.exports = exports['default'];

374

lib/Transition.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.EXITING = exports.ENTERED = exports.ENTERING = exports.EXITED = exports.UNMOUNTED = undefined;
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
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 _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var _react = require('react');

@@ -23,9 +20,9 @@

var _domHelpersTransitionProperties = require('dom-helpers/transition/properties');
var _properties = require('dom-helpers/transition/properties');
var _domHelpersTransitionProperties2 = _interopRequireDefault(_domHelpersTransitionProperties);
var _properties2 = _interopRequireDefault(_properties);
var _domHelpersEventsOn = require('dom-helpers/events/on');
var _on = require('dom-helpers/events/on');
var _domHelpersEventsOn2 = _interopRequireDefault(_domHelpersEventsOn);
var _on2 = _interopRequireDefault(_on);

@@ -36,15 +33,20 @@ var _classnames = require('classnames');

var transitionEndEvent = _domHelpersTransitionProperties2['default'].end;
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var UNMOUNTED = 0;
exports.UNMOUNTED = UNMOUNTED;
var EXITED = 1;
exports.EXITED = EXITED;
var ENTERING = 2;
exports.ENTERING = ENTERING;
var ENTERED = 3;
exports.ENTERED = ENTERED;
var EXITING = 4;
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
exports.EXITING = EXITING;
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
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) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var transitionEndEvent = _properties2.default.end;
var UNMOUNTED = exports.UNMOUNTED = 0;
var EXITED = exports.EXITED = 1;
var ENTERING = exports.ENTERING = 2;
var ENTERED = exports.ENTERED = 3;
var EXITING = exports.EXITING = 4;
/**

@@ -60,3 +62,3 @@ * The Transition component lets you define and run css transitions with a simple declarative api.

var Transition = (function (_React$Component) {
var Transition = function (_React$Component) {
_inherits(Transition, _React$Component);

@@ -67,6 +69,6 @@

_React$Component.call(this, props, context);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Transition).call(this, props, context));
var initialStatus = undefined;
if (props['in']) {
var initialStatus = void 0;
if (props.in) {
// Start enter transition in componentDidMount.

@@ -77,51 +79,56 @@ initialStatus = props.transitionAppear ? EXITED : ENTERED;

}
this.state = { status: initialStatus };
_this.state = { status: initialStatus };
this.nextCallback = null;
_this.nextCallback = null;
return _this;
}
Transition.prototype.componentDidMount = function componentDidMount() {
if (this.props.transitionAppear && this.props['in']) {
this.performEnter(this.props);
_createClass(Transition, [{
key: 'componentDidMount',
value: function componentDidMount() {
if (this.props.transitionAppear && this.props.in) {
this.performEnter(this.props);
}
}
};
Transition.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (nextProps['in'] && this.props.unmountOnExit) {
if (this.state.status === UNMOUNTED) {
// Start enter transition in componentDidUpdate.
this.setState({ status: EXITED });
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.in && this.props.unmountOnExit) {
if (this.state.status === UNMOUNTED) {
// Start enter transition in componentDidUpdate.
this.setState({ status: EXITED });
}
} else {
this._needsUpdate = true;
}
} else {
this._needsUpdate = true;
}
};
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
var status = this.state.status;
Transition.prototype.componentDidUpdate = function componentDidUpdate() {
var status = this.state.status;
if (this.props.unmountOnExit && status === EXITED) {
// EXITED is always a transitional state to either ENTERING or UNMOUNTED
// when using unmountOnExit.
if (this.props.in) {
this.performEnter(this.props);
} else {
this.setState({ status: UNMOUNTED });
}
if (this.props.unmountOnExit && status === EXITED) {
// EXITED is always a transitional state to either ENTERING or UNMOUNTED
// when using unmountOnExit.
if (this.props['in']) {
this.performEnter(this.props);
} else {
this.setState({ status: UNMOUNTED });
return;
}
return;
}
// guard ensures we are only responding to prop changes
if (this._needsUpdate) {
this._needsUpdate = false;
// guard ensures we are only responding to prop changes
if (this._needsUpdate) {
this._needsUpdate = false;
if (this.props['in']) {
if (status === EXITING) {
this.performEnter(this.props);
} else if (status === EXITED) {
this.performEnter(this.props);
}
// Otherwise we're already entering or entered.
} else {
if (this.props.in) {
if (status === EXITING) {
this.performEnter(this.props);
} else if (status === EXITED) {
this.performEnter(this.props);
}
// Otherwise we're already entering or entered.
} else {
if (status === ENTERING || status === ENTERED) {

@@ -132,130 +139,139 @@ this.performExit(this.props);

}
}
}
};
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this.cancelNextCallback();
}
}, {
key: 'performEnter',
value: function performEnter(props) {
var _this2 = this;
Transition.prototype.componentWillUnmount = function componentWillUnmount() {
this.cancelNextCallback();
};
this.cancelNextCallback();
var node = _reactDom2.default.findDOMNode(this);
Transition.prototype.performEnter = function performEnter(props) {
var _this = this;
// Not this.props, because we might be about to receive new props.
props.onEnter(node);
this.cancelNextCallback();
var node = _reactDom2['default'].findDOMNode(this);
this.safeSetState({ status: ENTERING }, function () {
_this2.props.onEntering(node);
// Not this.props, because we might be about to receive new props.
props.onEnter(node);
this.safeSetState({ status: ENTERING }, function () {
_this.props.onEntering(node);
_this.onTransitionEnd(node, function () {
_this.safeSetState({ status: ENTERED }, function () {
_this.props.onEntered(node);
_this2.onTransitionEnd(node, function () {
_this2.safeSetState({ status: ENTERED }, function () {
_this2.props.onEntered(node);
});
});
});
});
};
}
}, {
key: 'performExit',
value: function performExit(props) {
var _this3 = this;
Transition.prototype.performExit = function performExit(props) {
var _this2 = this;
this.cancelNextCallback();
var node = _reactDom2.default.findDOMNode(this);
this.cancelNextCallback();
var node = _reactDom2['default'].findDOMNode(this);
// Not this.props, because we might be about to receive new props.
props.onExit(node);
// Not this.props, because we might be about to receive new props.
props.onExit(node);
this.safeSetState({ status: EXITING }, function () {
_this3.props.onExiting(node);
this.safeSetState({ status: EXITING }, function () {
_this2.props.onExiting(node);
_this2.onTransitionEnd(node, function () {
_this2.safeSetState({ status: EXITED }, function () {
_this2.props.onExited(node);
_this3.onTransitionEnd(node, function () {
_this3.safeSetState({ status: EXITED }, function () {
_this3.props.onExited(node);
});
});
});
});
};
Transition.prototype.cancelNextCallback = function cancelNextCallback() {
if (this.nextCallback !== null) {
this.nextCallback.cancel();
this.nextCallback = null;
}
};
}, {
key: 'cancelNextCallback',
value: function cancelNextCallback() {
if (this.nextCallback !== null) {
this.nextCallback.cancel();
this.nextCallback = null;
}
}
}, {
key: 'safeSetState',
value: function safeSetState(nextState, callback) {
// This shouldn't be necessary, but there are weird race conditions with
// setState callbacks and unmounting in testing, so always make sure that
// we can cancel any pending setState callbacks after we unmount.
this.setState(nextState, this.setNextCallback(callback));
}
}, {
key: 'setNextCallback',
value: function setNextCallback(callback) {
var _this4 = this;
Transition.prototype.safeSetState = function safeSetState(nextState, callback) {
// This shouldn't be necessary, but there are weird race conditions with
// setState callbacks and unmounting in testing, so always make sure that
// we can cancel any pending setState callbacks after we unmount.
this.setState(nextState, this.setNextCallback(callback));
};
var active = true;
Transition.prototype.setNextCallback = function setNextCallback(callback) {
var _this3 = this;
this.nextCallback = function (event) {
if (active) {
active = false;
_this4.nextCallback = null;
var active = true;
callback(event);
}
};
this.nextCallback = function (event) {
if (active) {
this.nextCallback.cancel = function () {
active = false;
_this3.nextCallback = null;
};
callback(event);
}
};
this.nextCallback.cancel = function () {
active = false;
};
return this.nextCallback;
};
Transition.prototype.onTransitionEnd = function onTransitionEnd(node, handler) {
this.setNextCallback(handler);
if (node) {
_domHelpersEventsOn2['default'](node, transitionEndEvent, this.nextCallback);
setTimeout(this.nextCallback, this.props.timeout);
} else {
setTimeout(this.nextCallback, 0);
return this.nextCallback;
}
};
}, {
key: 'onTransitionEnd',
value: function onTransitionEnd(node, handler) {
this.setNextCallback(handler);
Transition.prototype.render = function render() {
var status = this.state.status;
if (status === UNMOUNTED) {
return null;
if (node) {
(0, _on2.default)(node, transitionEndEvent, this.nextCallback);
setTimeout(this.nextCallback, this.props.timeout);
} else {
setTimeout(this.nextCallback, 0);
}
}
}, {
key: 'render',
value: function render() {
var status = this.state.status;
if (status === UNMOUNTED) {
return null;
}
var _props = this.props;
var children = _props.children;
var className = _props.className;
var _props = this.props;
var children = _props.children;
var className = _props.className;
var childProps = _objectWithoutProperties(_props, ['children', 'className']);
var childProps = _objectWithoutProperties(_props, ['children', 'className']);
Object.keys(Transition.propTypes).forEach(function (key) {
return delete childProps[key];
});
Object.keys(Transition.propTypes).forEach(function (key) {
return delete childProps[key];
});
var transitionClassName = undefined;
if (status === EXITED) {
transitionClassName = this.props.exitedClassName;
} else if (status === ENTERING) {
transitionClassName = this.props.enteringClassName;
} else if (status === ENTERED) {
transitionClassName = this.props.enteredClassName;
} else if (status === EXITING) {
transitionClassName = this.props.exitingClassName;
var transitionClassName = void 0;
if (status === EXITED) {
transitionClassName = this.props.exitedClassName;
} else if (status === ENTERING) {
transitionClassName = this.props.enteringClassName;
} else if (status === ENTERED) {
transitionClassName = this.props.enteredClassName;
} else if (status === EXITING) {
transitionClassName = this.props.exitingClassName;
}
var child = _react2.default.Children.only(children);
return _react2.default.cloneElement(child, _extends({}, childProps, {
className: (0, _classnames2.default)(child.props.className, className, transitionClassName)
}));
}
}]);
var child = _react2['default'].Children.only(children);
return _react2['default'].cloneElement(child, _extends({}, childProps, {
className: _classnames2['default'](child.props.className, className, transitionClassName)
}));
};
return Transition;
})(_react2['default'].Component);
}(_react2.default.Component);

@@ -266,3 +282,3 @@ Transition.propTypes = {

*/
'in': _react2['default'].PropTypes.bool,
in: _react2.default.PropTypes.bool,

@@ -272,3 +288,3 @@ /**

*/
unmountOnExit: _react2['default'].PropTypes.bool,
unmountOnExit: _react2.default.PropTypes.bool,

@@ -279,3 +295,3 @@ /**

*/
transitionAppear: _react2['default'].PropTypes.bool,
transitionAppear: _react2.default.PropTypes.bool,

@@ -290,3 +306,3 @@ /**

*/
timeout: _react2['default'].PropTypes.number,
timeout: _react2.default.PropTypes.number,

@@ -296,15 +312,15 @@ /**

*/
exitedClassName: _react2['default'].PropTypes.string,
exitedClassName: _react2.default.PropTypes.string,
/**
* CSS class or classes applied while the component is exiting
*/
exitingClassName: _react2['default'].PropTypes.string,
exitingClassName: _react2.default.PropTypes.string,
/**
* CSS class or classes applied when the component is entered
*/
enteredClassName: _react2['default'].PropTypes.string,
enteredClassName: _react2.default.PropTypes.string,
/**
* CSS class or classes applied while the component is entering
*/
enteringClassName: _react2['default'].PropTypes.string,
enteringClassName: _react2.default.PropTypes.string,

@@ -314,23 +330,23 @@ /**

*/
onEnter: _react2['default'].PropTypes.func,
onEnter: _react2.default.PropTypes.func,
/**
* Callback fired after the "entering" classes are applied
*/
onEntering: _react2['default'].PropTypes.func,
onEntering: _react2.default.PropTypes.func,
/**
* Callback fired after the "enter" classes are applied
*/
onEntered: _react2['default'].PropTypes.func,
onEntered: _react2.default.PropTypes.func,
/**
* Callback fired before the "exiting" classes are applied
*/
onExit: _react2['default'].PropTypes.func,
onExit: _react2.default.PropTypes.func,
/**
* Callback fired after the "exiting" classes are applied
*/
onExiting: _react2['default'].PropTypes.func,
onExiting: _react2.default.PropTypes.func,
/**
* Callback fired after the "exited" classes are applied
*/
onExited: _react2['default'].PropTypes.func
onExited: _react2.default.PropTypes.func
};

@@ -344,3 +360,3 @@

Transition.defaultProps = {
'in': false,
in: false,
unmountOnExit: false,

@@ -360,2 +376,2 @@ transitionAppear: false,

exports['default'] = Transition;
exports.default = Transition;

30

lib/utils/addEventListener.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _domHelpersEventsOn = require('dom-helpers/events/on');
var _domHelpersEventsOn2 = _interopRequireDefault(_domHelpersEventsOn);
var _domHelpersEventsOff = require('dom-helpers/events/off');
var _domHelpersEventsOff2 = _interopRequireDefault(_domHelpersEventsOff);
exports['default'] = function (node, event, handler) {
_domHelpersEventsOn2['default'](node, event, handler);
exports.default = function (node, event, handler) {
(0, _on2.default)(node, event, handler);
return {
remove: function remove() {
_domHelpersEventsOff2['default'](node, event, handler);
(0, _off2.default)(node, event, handler);
}

@@ -24,2 +16,12 @@ };

var _on = require('dom-helpers/events/on');
var _on2 = _interopRequireDefault(_on);
var _off = require('dom-helpers/events/off');
var _off2 = _interopRequireDefault(_off);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
module.exports = exports['default'];

18

lib/utils/addFocusListener.js

@@ -0,1 +1,7 @@

'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = addFocusListener;
/**

@@ -7,14 +13,9 @@ * Firefox doesn't have a focusin event so using capture is easiest way to get bubbling

*/
'use strict';
exports.__esModule = true;
exports['default'] = addFocusListener;
function addFocusListener(handler) {
var useFocusin = !document.addEventListener;
var remove = undefined;
var remove = void 0;
if (useFocusin) {
document.attachEvent('onfocusin', handler);
remove = function () {
remove = function remove() {
return document.detachEvent('onfocusin', handler);

@@ -24,3 +25,3 @@ };

document.addEventListener('focus', handler, true);
remove = function () {
remove = function remove() {
return document.removeEventListener('focus', handler, true);

@@ -32,3 +33,2 @@ };

}
module.exports = exports['default'];

10

lib/utils/createChainedFunction.js

@@ -0,1 +1,6 @@

'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
/**

@@ -10,5 +15,2 @@ * Safe chained function

*/
'use strict';
exports.__esModule = true;
function createChainedFunction() {

@@ -41,3 +43,3 @@ for (var _len = arguments.length, funcs = Array(_len), _key = 0; _key < _len; _key++) {

exports['default'] = createChainedFunction;
exports.default = createChainedFunction;
module.exports = exports['default'];

13

lib/utils/getContainer.js
'use strict';
exports.__esModule = true;
exports['default'] = getContainer;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = getContainer;
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _reactDom = require('react-dom');

@@ -12,7 +12,8 @@

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function getContainer(container, defaultContainer) {
container = typeof container === 'function' ? container() : container;
return _reactDom2['default'].findDOMNode(container) || defaultContainer;
return _reactDom2.default.findDOMNode(container) || defaultContainer;
}
module.exports = exports['default'];

17

lib/utils/getDocumentHeight.js

@@ -1,14 +0,15 @@

/**
* Get the height of the document
*
* @returns {documentHeight: number}
*/
"use strict";
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = function (doc) {
exports.default = function (doc) {
return Math.max(doc.documentElement.offsetHeight || 0, doc.height || 0, doc.body.scrollHeight || 0, doc.body.offsetHeight || 0);
};
module.exports = exports["default"];
module.exports = exports["default"]; /**
* Get the height of the document
*
* @returns {documentHeight: number}
*/

23

lib/utils/isOverflowing.js
'use strict';
exports.__esModule = true;
exports['default'] = isOverflowing;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isOverflowing;
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _isWindow = require('dom-helpers/query/isWindow');
var _domHelpersQueryIsWindow = require('dom-helpers/query/isWindow');
var _isWindow2 = _interopRequireDefault(_isWindow);
var _domHelpersQueryIsWindow2 = _interopRequireDefault(_domHelpersQueryIsWindow);
var _ownerDocument = require('dom-helpers/ownerDocument');
var _domHelpersOwnerDocument = require('dom-helpers/ownerDocument');
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _domHelpersOwnerDocument2 = _interopRequireDefault(_domHelpersOwnerDocument);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -21,4 +23,4 @@ function isBody(node) {

function bodyIsOverflowing(node) {
var doc = _domHelpersOwnerDocument2['default'](node);
var win = _domHelpersQueryIsWindow2['default'](doc);
var doc = (0, _ownerDocument2.default)(node);
var win = (0, _isWindow2.default)(doc);
var fullWidth = win.innerWidth;

@@ -36,7 +38,6 @@

function isOverflowing(container) {
var win = _domHelpersQueryIsWindow2['default'](container);
var win = (0, _isWindow2.default)(container);
return win || isBody(container) ? bodyIsOverflowing(container) : container.scrollHeight > container.clientHeight;
}
module.exports = exports['default'];

4

lib/utils/manageAriaHidden.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ariaHidden = ariaHidden;

@@ -5,0 +7,0 @@ exports.hideSiblings = hideSiblings;

50

lib/utils/overlayPositionUtils.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _ownerDocument = require('./ownerDocument');

@@ -11,20 +11,21 @@

var _domHelpersQueryOffset = require('dom-helpers/query/offset');
var _offset = require('dom-helpers/query/offset');
var _domHelpersQueryOffset2 = _interopRequireDefault(_domHelpersQueryOffset);
var _offset2 = _interopRequireDefault(_offset);
var _domHelpersQueryPosition = require('dom-helpers/query/position');
var _position = require('dom-helpers/query/position');
var _domHelpersQueryPosition2 = _interopRequireDefault(_domHelpersQueryPosition);
var _position2 = _interopRequireDefault(_position);
var _domHelpersQueryScrollTop = require('dom-helpers/query/scrollTop');
var _scrollTop = require('dom-helpers/query/scrollTop');
var _domHelpersQueryScrollTop2 = _interopRequireDefault(_domHelpersQueryScrollTop);
var _scrollTop2 = _interopRequireDefault(_scrollTop);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var utils = {
getContainerDimensions: function getContainerDimensions(containerNode) {
var width = undefined,
height = undefined,
scroll = undefined;
var width = void 0,
height = void 0,
scroll = void 0;

@@ -35,5 +36,5 @@ if (containerNode.tagName === 'BODY') {

scroll = _domHelpersQueryScrollTop2['default'](_ownerDocument2['default'](containerNode).documentElement) || _domHelpersQueryScrollTop2['default'](containerNode);
scroll = (0, _scrollTop2.default)((0, _ownerDocument2.default)(containerNode).documentElement) || (0, _scrollTop2.default)(containerNode);
} else {
var _getOffset = _domHelpersQueryOffset2['default'](containerNode);
var _getOffset = (0, _offset2.default)(containerNode);

@@ -43,3 +44,3 @@ width = _getOffset.width;

scroll = _domHelpersQueryScrollTop2['default'](containerNode);
scroll = (0, _scrollTop2.default)(containerNode);
}

@@ -49,13 +50,11 @@

},
getPosition: function getPosition(target, container) {
var offset = container.tagName === 'BODY' ? _domHelpersQueryOffset2['default'](target) : _domHelpersQueryPosition2['default'](target, container);
var offset = container.tagName === 'BODY' ? (0, _offset2.default)(target) : (0, _position2.default)(target, container);
return offset;
},
calcOverlayPosition: function calcOverlayPosition(placement, overlayNode, target, container, padding) {
var childOffset = utils.getPosition(target, container);
var _getOffset2 = _domHelpersQueryOffset2['default'](overlayNode);
var _getOffset2 = (0, _offset2.default)(overlayNode);

@@ -65,7 +64,8 @@ var overlayHeight = _getOffset2.height;

var positionLeft = undefined,
positionTop = undefined,
arrowOffsetLeft = undefined,
arrowOffsetTop = undefined;
var positionLeft = void 0,
positionTop = void 0,
arrowOffsetLeft = void 0,
arrowOffsetTop = void 0;
if (placement === 'left' || placement === 'right') {

@@ -138,3 +138,3 @@ positionTop = childOffset.top + (childOffset.height - overlayHeight) / 2;

}
exports['default'] = utils;
exports.default = utils;
module.exports = exports['default'];

16

lib/utils/ownerDocument.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
exports.default = function (componentOrElement) {
return (0, _ownerDocument2.default)(_reactDom2.default.findDOMNode(componentOrElement));
};

@@ -11,10 +15,8 @@ var _reactDom = require('react-dom');

var _domHelpersOwnerDocument = require('dom-helpers/ownerDocument');
var _ownerDocument = require('dom-helpers/ownerDocument');
var _domHelpersOwnerDocument2 = _interopRequireDefault(_domHelpersOwnerDocument);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
exports['default'] = function (componentOrElement) {
return _domHelpersOwnerDocument2['default'](_reactDom2['default'].findDOMNode(componentOrElement));
};
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
module.exports = exports['default'];

16

lib/utils/ownerWindow.js
'use strict';
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
exports.default = function (componentOrElement) {
return (0, _ownerWindow2.default)(_reactDom2.default.findDOMNode(componentOrElement));
};

@@ -11,10 +15,8 @@ var _reactDom = require('react-dom');

var _domHelpersOwnerWindow = require('dom-helpers/ownerWindow');
var _ownerWindow = require('dom-helpers/ownerWindow');
var _domHelpersOwnerWindow2 = _interopRequireDefault(_domHelpersOwnerWindow);
var _ownerWindow2 = _interopRequireDefault(_ownerWindow);
exports['default'] = function (componentOrElement) {
return _domHelpersOwnerWindow2['default'](_reactDom2['default'].findDOMNode(componentOrElement));
};
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
module.exports = exports['default'];

8

lib/utils/requiredIf.js
"use strict";
exports.__esModule = true;
exports["default"] = requiredIf;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = requiredIf;
function requiredIf(propType, matcher) {

@@ -17,3 +18,2 @@ return function () {

}
module.exports = exports["default"];

116

package.json
{
"name": "react-overlays",
"version": "0.6.3",
"version": "0.6.4",
"description": "Utilities for creating robust overlay components",

@@ -10,4 +10,3 @@ "author": "Jason Quense <monastic.panic@gmail.com>",

"files": [
"lib/",
"CHANGELOG.md"
"lib"
],

@@ -29,8 +28,8 @@ "keywords": [

"build": "npm run clean && babel src --out-dir lib",
"build:examples": "npm run clean:examples && babel-node ./webpack/run-webpack --config docs.config.js",
"examples": "npm run clean:examples && babel-node ./examples/server.js",
"lint": "eslint src test",
"test": "npm run lint && karma start --single-run",
"build:examples": "npm run clean:examples && webpack --config webpack/docs.config.js",
"examples": "npm run clean:examples && babel-node examples/server.js",
"lint": "eslint examples/*.js src test *.js",
"test": "npm run lint && npm run testonly",
"testonly": "karma start --single-run",
"tdd": "karma start",
"coverage": "COVERAGE=true karma start --single-run",
"release": "release"

@@ -43,59 +42,62 @@ },

"devDependencies": {
"@jquense/component-playground": "jquense/component-playground",
"babel": "5.6.14",
"babel-core": "^5.8.34",
"babel-eslint": "^4.1.6",
"babel-loader": "^5.3.0",
"@monastic.panic/component-playground": "^2.0.0",
"babel-cli": "^6.10.1",
"babel-core": "^6.10.4",
"babel-eslint": "^6.1.2",
"babel-loader": "^6.2.4",
"babel-plugin-add-module-exports": "^0.2.1",
"babel-plugin-object-assign": "^1.2.1",
"chai": "^3.2.0",
"component-metadata-loader": "^2.0.0",
"css-loader": "^0.15.6",
"es5-shim": "^4.1.7",
"eslint": "^1.10.1",
"eslint-plugin-babel": "^3.0.0",
"eslint-plugin-mocha": "^1.1.0",
"eslint-plugin-react": "^3.1.0",
"isparta-loader": "^0.2.0",
"jquery": "^2.1.4",
"karma": "^0.13.3",
"karma-chrome-launcher": "^0.2.0",
"karma-cli": "^0.1.0",
"karma-coverage": "^0.4.2",
"karma-coveralls": "^1.1.0",
"karma-mocha": "^0.2.0",
"karma-mocha-reporter": "^1.0.4",
"karma-sinon-chai": "^1.0.0",
"karma-sourcemap-loader": "^0.3.5",
"babel-preset-es2015": "^6.9.0",
"babel-preset-react": "^6.11.1",
"babel-preset-stage-1": "^6.5.0",
"chai": "^3.5.0",
"component-metadata-loader": "^2.0.3",
"css-loader": "^0.23.1",
"es5-shim": "^4.5.9",
"eslint": "^3.0.1",
"eslint-plugin-mocha": "^4.0.0",
"eslint-plugin-react": "^5.2.2",
"isparta-loader": "^2.0.0",
"jquery": "^3.1.0",
"karma": "^1.1.1",
"karma-chrome-launcher": "^1.0.1",
"karma-cli": "^1.0.1",
"karma-coverage": "^1.1.0",
"karma-coveralls": "^1.1.2",
"karma-mocha": "^1.1.1",
"karma-mocha-reporter": "^2.0.4",
"karma-sinon-chai": "^1.2.2",
"karma-sourcemap-loader": "^0.3.7",
"karma-webpack": "^1.7.0",
"less": "^2.5.1",
"less-loader": "^2.2.0",
"lodash": "^3.10.0",
"lolex": "^1.4.0",
"less": "^2.7.1",
"less-loader": "^2.2.3",
"lodash": "^4.13.1",
"lolex": "^1.5.0",
"marked": "^0.3.5",
"mocha": "^2.2.5",
"node-libs-browser": "^0.5.2",
"mocha": "^2.5.3",
"node-libs-browser": "^1.0.0",
"raw-loader": "^0.5.1",
"react": "^0.14.0",
"react-addons-test-utils": "^0.14.0",
"react-bootstrap": "^0.27.3",
"react-component-metadata": "^1.2.2",
"react-dom": "^0.14.0",
"react-hot-loader": "^1.2.7",
"release-script": "^0.2.1",
"rimraf": "^2.4.2",
"simulant": "^0.1.5",
"sinon": "^1.15.4",
"react": "^15.2.1",
"react-addons-test-utils": "^15.2.1",
"react-bootstrap": "^0.29.5",
"react-component-metadata": "^3.0.0",
"react-dom": "^15.2.1",
"react-hot-loader": "^1.3.0",
"release-script": "^1.0.2",
"rimraf": "^2.5.3",
"simulant": "^0.2.2",
"sinon": "^1.17.4",
"sinon-chai": "^2.8.0",
"style-loader": "^0.12.3",
"teaspoon": "^6.1.1",
"webpack": "^1.12.2",
"webpack-dev-server": "^1.12.0",
"yargs": "^3.14.0"
"style-loader": "^0.13.1",
"teaspoon": "^6.4.1",
"webpack": "^1.13.1",
"webpack-dev-server": "^1.14.1",
"yargs": "^4.7.1"
},
"dependencies": {
"classnames": "^2.1.3",
"dom-helpers": "^2.3.0",
"react-prop-types": "^0.2.1",
"warning": "^2.1.0"
"classnames": "^2.2.5",
"dom-helpers": "^2.4.0",
"react-prop-types": "^0.3.2",
"warning": "^3.0.0"
}
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc