Completely updated React, fixed #11, (hopefully)

This commit is contained in:
2018-03-04 19:11:49 -05:00
parent 6e0afd6e2a
commit 34e5f5139a
13674 changed files with 333464 additions and 473223 deletions

View File

@@ -8,8 +8,6 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);

View File

@@ -8,8 +8,6 @@ var _createClass = function () { function defineProperties(target, props) { for
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
@@ -78,7 +76,8 @@ Manager.childContextTypes = {
popperManager: _propTypes2.default.object.isRequired
};
Manager.propTypes = {
tag: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.bool])
tag: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.bool]),
children: _propTypes2.default.oneOfType([_propTypes2.default.node, _propTypes2.default.func])
};
Manager.defaultProps = {
tag: 'div'

View File

@@ -10,8 +10,6 @@ var _createClass = function () { function defineProperties(target, props) { for
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
@@ -22,8 +20,6 @@ var _popper2 = _interopRequireDefault(_popper);
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 _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"); } }
@@ -32,10 +28,6 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen
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 noop = function noop() {
return null;
};
var Popper = function (_Component) {
_inherits(Popper, _Component);
@@ -76,8 +68,6 @@ var Popper = function (_Component) {
}, _this._getPopperStyle = function () {
var data = _this.state.data;
// If Popper isn't instantiated, hide the popperElement
// to avoid flash of unstyled content
if (!_this._popper || !data) {
return {
@@ -87,17 +77,11 @@ var Popper = function (_Component) {
};
}
var _data$offsets$popper = data.offsets.popper,
top = _data$offsets$popper.top,
left = _data$offsets$popper.left,
position = _data$offsets$popper.position;
return _extends({
position: position
position: data.offsets.popper.position
}, data.styles);
}, _this._getPopperPlacement = function () {
return !!_this.state.data ? _this.state.data.placement : undefined;
return _this.state.data ? _this.state.data.placement : undefined;
}, _this._getPopperHide = function () {
return !!_this.state.data && _this.state.data.hide ? '' : undefined;
}, _this._getArrowStyle = function () {
@@ -110,6 +94,18 @@ var Popper = function (_Component) {
return { top: top, left: left };
}
}, _this._handlePopperRef = function (node) {
_this._popperNode = node;
if (node) {
_this._createPopper();
} else {
_this._destroyPopper();
}
if (_this.props.innerRef) {
_this.props.innerRef(node);
}
}, _this._scheduleUpdate = function () {
_this._popper && _this._popper.scheduleUpdate();
}, _temp), _possibleConstructorReturn(_this, _ret);
}
@@ -123,20 +119,15 @@ var Popper = function (_Component) {
}
};
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
this._updatePopper();
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate(lastProps) {
if (lastProps.placement !== this.props.placement || lastProps.eventsEnabled !== this.props.eventsEnabled) {
this._updatePopper();
this._destroyPopper();
this._createPopper();
}
if (this._popper && lastProps.children !== this.props.children) {
this._popper.scheduleUpdate();
if (lastProps.children !== this.props.children) {
this._scheduleUpdate();
}
}
}, {
@@ -144,17 +135,11 @@ var Popper = function (_Component) {
value: function componentWillUnmount() {
this._destroyPopper();
}
}, {
key: '_updatePopper',
value: function _updatePopper() {
this._destroyPopper();
if (this._node) {
this._createPopper();
}
}
}, {
key: '_createPopper',
value: function _createPopper() {
var _this2 = this;
var _props = this.props,
placement = _props.placement,
eventsEnabled = _props.eventsEnabled;
@@ -163,22 +148,21 @@ var Popper = function (_Component) {
applyStyle: { enabled: false },
updateState: this._updateStateModifier
});
if (this._arrowNode) {
modifiers.arrow = {
element: this._arrowNode
};
}
this._popper = new _popper2.default(this._getTargetNode(), this._node, {
this._popper = new _popper2.default(this._getTargetNode(), this._popperNode, {
placement: placement,
eventsEnabled: eventsEnabled,
modifiers: modifiers
});
// schedule an update to make sure everything gets positioned correct
// after being instantiated
this._popper.scheduleUpdate();
// TODO: look into setTimeout scheduleUpdate call, without it, the popper will not position properly on creation
setTimeout(function () {
return _this2._scheduleUpdate();
});
}
}, {
key: '_destroyPopper',
@@ -190,8 +174,6 @@ var Popper = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props2 = this.props,
component = _props2.component,
innerRef = _props2.innerRef,
@@ -201,27 +183,21 @@ var Popper = function (_Component) {
children = _props2.children,
restProps = _objectWithoutProperties(_props2, ['component', 'innerRef', 'placement', 'eventsEnabled', 'modifiers', 'children']);
var popperRef = function popperRef(node) {
_this2._node = node;
if (typeof innerRef === 'function') {
innerRef(node);
}
};
var popperStyle = this._getPopperStyle();
var popperPlacement = this._getPopperPlacement();
var popperHide = this._getPopperHide();
if (typeof children === 'function') {
var _popperProps;
var popperProps = (_popperProps = {
ref: popperRef,
style: popperStyle
}, _defineProperty(_popperProps, 'data-placement', popperPlacement), _defineProperty(_popperProps, 'data-x-out-of-boundaries', popperHide), _popperProps);
var popperProps = {
ref: this._handlePopperRef,
style: popperStyle,
'data-placement': popperPlacement,
'data-x-out-of-boundaries': popperHide
};
return children({
popperProps: popperProps,
restProps: restProps,
scheduleUpdate: this._popper && this._popper.scheduleUpdate
scheduleUpdate: this._scheduleUpdate
});
}
@@ -232,9 +208,9 @@ var Popper = function (_Component) {
});
if (typeof component === 'string') {
componentProps.ref = popperRef;
componentProps.ref = this._handlePopperRef;
} else {
componentProps.innerRef = popperRef;
componentProps.innerRef = this._handlePopperRef;
}
return (0, _react.createElement)(component, componentProps, children);

View File

@@ -8,8 +8,6 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);

View File

@@ -3,27 +3,41 @@
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Arrow = exports.Popper = exports.Target = exports.Manager = undefined;
var _Manager2 = require('./Manager');
var _Manager = require('./Manager');
var _Manager3 = _interopRequireDefault(_Manager2);
Object.defineProperty(exports, 'Manager', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_Manager).default;
}
});
var _Target2 = require('./Target');
var _Target = require('./Target');
var _Target3 = _interopRequireDefault(_Target2);
Object.defineProperty(exports, 'Target', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_Target).default;
}
});
var _Popper2 = require('./Popper');
var _Popper = require('./Popper');
var _Popper3 = _interopRequireDefault(_Popper2);
Object.defineProperty(exports, 'Popper', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_Popper).default;
}
});
var _Arrow2 = require('./Arrow');
var _Arrow = require('./Arrow');
var _Arrow3 = _interopRequireDefault(_Arrow2);
Object.defineProperty(exports, 'Arrow', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_Arrow).default;
}
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.Manager = _Manager3.default;
exports.Target = _Target3.default;
exports.Popper = _Popper3.default;
exports.Arrow = _Arrow3.default;
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }