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

react-height

Package Overview
Dependencies
Maintainers
1
Versions
16
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-height - npm Package Compare versions

Comparing version 2.2.1 to 3.0.0

1302

build/react-height.js

@@ -10,3 +10,3 @@ (function webpackUniversalModuleDefinition(root, factory) {

root["ReactHeight"] = factory(root["React"]);
})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {
})(this, function(__WEBPACK_EXTERNAL_MODULE_6__) {
return /******/ (function(modules) { // webpackBootstrap

@@ -77,3 +77,3 @@ /******/ // The module cache

/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 3);
/******/ return __webpack_require__(__webpack_require__.s = 1);
/******/ })

@@ -86,94 +86,30 @@ /************************************************************************/

"use strict";
/**
* Copyright (c) 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*/
/**
* Use invariant() to assert state which your program assumes to be true.
*
* Provide sprintf-style format (only %s is supported) and arguments
* to provide information about what broke and what you were
* expecting.
*
* The invariant message will be stripped in production, but the invariant
* will remain to ensure logic does not differ in production.
*/
var validateFormat = function validateFormat(format) {};
if (false) {
validateFormat = function validateFormat(format) {
if (format === undefined) {
throw new Error('invariant requires an error message argument');
}
};
}
function invariant(condition, format, a, b, c, d, e, f) {
validateFormat(format);
if (!condition) {
var error;
if (format === undefined) {
error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');
} else {
var args = [a, b, c, d, e, f];
var argIndex = 0;
error = new Error(format.replace(/%s/g, function () {
return args[argIndex++];
}));
error.name = 'Invariant Violation';
}
error.framesToPop = 1; // we don't care about invariant's own frame
throw error;
}
}
module.exports = invariant;
/***/ }),
/* 1 */
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
/***/ }),
/* 2 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ReactHeight = 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; };
var _react = __webpack_require__(1);
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; }; }();
var _react = __webpack_require__(6);
var _react2 = _interopRequireDefault(_react);
var _propTypes = __webpack_require__(11);
var _propTypes = __webpack_require__(5);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _createReactClass = __webpack_require__(5);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _createReactClass2 = _interopRequireDefault(_createReactClass);
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 _ReactComponentWithPureRenderMixin = __webpack_require__(12);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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 _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; } /* eslint "react/no-did-mount-set-state":0 */
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; } /* eslint "react/no-did-mount-set-state":0 */
/* eslint "react/no-did-update-set-state":0 */

@@ -185,54 +121,29 @@

var ReactHeight = (0, _createReactClass2.default)({
propTypes: {
children: _propTypes2.default.node.isRequired,
onHeightReady: _propTypes2.default.func.isRequired,
hidden: _propTypes2.default.bool,
dirty: _propTypes2.default.bool,
getElementHeight: _propTypes2.default.func
},
var ReactHeight = exports.ReactHeight = function (_PureComponent) {
_inherits(ReactHeight, _PureComponent);
getDefaultProps: function getDefaultProps() {
return {
hidden: false,
dirty: true,
getElementHeight: getElementHeight
};
},
getInitialState: function getInitialState() {
return {
height: 0, dirty: this.props.dirty
};
},
componentDidMount: function componentDidMount() {
var _this = this;
function ReactHeight(props) {
_classCallCheck(this, ReactHeight);
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
var _this = _possibleConstructorReturn(this, (ReactHeight.__proto__ || Object.getPrototypeOf(ReactHeight)).call(this, props));
this.setState({ height: height, dirty: dirty }, function () {
return _this.props.onHeightReady(_this.state.height);
});
},
componentWillReceiveProps: function componentWillReceiveProps(_ref) {
var children = _ref.children,
dirty = _ref.dirty;
_this.setWrapperRef = function (el) {
_this.wrapper = el;
};
if (children !== this.props.children || dirty) {
this.setState({ dirty: true });
}
},
_this.state = {
dirty: props.dirty,
height: 0
};
return _this;
}
_createClass(ReactHeight, [{
key: 'componentDidMount',
value: function componentDidMount() {
var _this2 = this;
shouldComponentUpdate: _ReactComponentWithPureRenderMixin.shouldComponentUpdate,
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
componentDidUpdate: function componentDidUpdate() {
var _this2 = this;
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
if (height === this.state.height) {
this.setState({ dirty: dirty });
} else {
this.setState({ height: height, dirty: dirty }, function () {

@@ -242,820 +153,97 @@ return _this2.props.onHeightReady(_this2.state.height);

}
},
setWrapperRef: function setWrapperRef(el) {
this.wrapper = el;
},
render: function render() {
var _props = this.props,
_onHeightReady = _props.onHeightReady,
_getElementHeight = _props.getElementHeight,
_dirty = _props.dirty,
hidden = _props.hidden,
children = _props.children,
props = _objectWithoutProperties(_props, ['onHeightReady', 'getElementHeight', 'dirty', 'hidden', 'children']);
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(_ref) {
var children = _ref.children,
dirty = _ref.dirty;
var dirty = this.state.dirty;
if (hidden && !dirty) {
return null;
}
if (hidden) {
return _react2.default.createElement(
'div',
{ style: { height: 0, overflow: 'hidden' } },
_react2.default.createElement(
'div',
_extends({ ref: this.setWrapperRef }, props),
children
)
);
}
return _react2.default.createElement(
'div',
_extends({ ref: this.setWrapperRef }, props),
children
);
}
});
exports.default = ReactHeight;
/***/ }),
/* 3 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// Babel6 does not hack the default behaviour of ES Modules anymore, so we should export
var ReactHeight = __webpack_require__(2).default;
module.exports = ReactHeight;
/***/ }),
/* 4 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*/
var _assign = __webpack_require__(9);
var emptyObject = __webpack_require__(7);
var _invariant = __webpack_require__(0);
if (false) {
var warning = require('fbjs/lib/warning');
}
var MIXINS_KEY = 'mixins';
// Helper function to allow the creation of anonymous functions which do not
// have .name set to the name of the variable being assigned to.
function identity(fn) {
return fn;
}
var ReactPropTypeLocationNames;
if (false) {
ReactPropTypeLocationNames = {
prop: 'prop',
context: 'context',
childContext: 'child context',
};
} else {
ReactPropTypeLocationNames = {};
}
function factory(ReactComponent, isValidElement, ReactNoopUpdateQueue) {
/**
* Policies that describe methods in `ReactClassInterface`.
*/
var injectedMixins = [];
/**
* Composite components are higher-level components that compose other composite
* or host components.
*
* To create a new type of `ReactClass`, pass a specification of
* your new class to `React.createClass`. The only requirement of your class
* specification is that you implement a `render` method.
*
* var MyComponent = React.createClass({
* render: function() {
* return <div>Hello World</div>;
* }
* });
*
* The class specification supports a specific protocol of methods that have
* special meaning (e.g. `render`). See `ReactClassInterface` for
* more the comprehensive protocol. Any other properties and methods in the
* class specification will be available on the prototype.
*
* @interface ReactClassInterface
* @internal
*/
var ReactClassInterface = {
/**
* An array of Mixin objects to include when defining your component.
*
* @type {array}
* @optional
*/
mixins: 'DEFINE_MANY',
/**
* An object containing properties and methods that should be defined on
* the component's constructor instead of its prototype (static methods).
*
* @type {object}
* @optional
*/
statics: 'DEFINE_MANY',
/**
* Definition of prop types for this component.
*
* @type {object}
* @optional
*/
propTypes: 'DEFINE_MANY',
/**
* Definition of context types for this component.
*
* @type {object}
* @optional
*/
contextTypes: 'DEFINE_MANY',
/**
* Definition of context types this component sets for its children.
*
* @type {object}
* @optional
*/
childContextTypes: 'DEFINE_MANY',
// ==== Definition methods ====
/**
* Invoked when the component is mounted. Values in the mapping will be set on
* `this.props` if that prop is not specified (i.e. using an `in` check).
*
* This method is invoked before `getInitialState` and therefore cannot rely
* on `this.state` or use `this.setState`.
*
* @return {object}
* @optional
*/
getDefaultProps: 'DEFINE_MANY_MERGED',
/**
* Invoked once before the component is mounted. The return value will be used
* as the initial value of `this.state`.
*
* getInitialState: function() {
* return {
* isOn: false,
* fooBaz: new BazFoo()
* }
* }
*
* @return {object}
* @optional
*/
getInitialState: 'DEFINE_MANY_MERGED',
/**
* @return {object}
* @optional
*/
getChildContext: 'DEFINE_MANY_MERGED',
/**
* Uses props from `this.props` and state from `this.state` to render the
* structure of the component.
*
* No guarantees are made about when or how often this method is invoked, so
* it must not have side effects.
*
* render: function() {
* var name = this.props.name;
* return <div>Hello, {name}!</div>;
* }
*
* @return {ReactComponent}
* @nosideeffects
* @required
*/
render: 'DEFINE_ONCE',
// ==== Delegate methods ====
/**
* Invoked when the component is initially created and about to be mounted.
* This may have side effects, but any external subscriptions or data created
* by this method must be cleaned up in `componentWillUnmount`.
*
* @optional
*/
componentWillMount: 'DEFINE_MANY',
/**
* Invoked when the component has been mounted and has a DOM representation.
* However, there is no guarantee that the DOM node is in the document.
*
* Use this as an opportunity to operate on the DOM when the component has
* been mounted (initialized and rendered) for the first time.
*
* @param {DOMElement} rootNode DOM element representing the component.
* @optional
*/
componentDidMount: 'DEFINE_MANY',
/**
* Invoked before the component receives new props.
*
* Use this as an opportunity to react to a prop transition by updating the
* state using `this.setState`. Current props are accessed via `this.props`.
*
* componentWillReceiveProps: function(nextProps, nextContext) {
* this.setState({
* likesIncreasing: nextProps.likeCount > this.props.likeCount
* });
* }
*
* NOTE: There is no equivalent `componentWillReceiveState`. An incoming prop
* transition may cause a state change, but the opposite is not true. If you
* need it, you are probably looking for `componentWillUpdate`.
*
* @param {object} nextProps
* @optional
*/
componentWillReceiveProps: 'DEFINE_MANY',
/**
* Invoked while deciding if the component should be updated as a result of
* receiving new props, state and/or context.
*
* Use this as an opportunity to `return false` when you're certain that the
* transition to the new props/state/context will not require a component
* update.
*
* shouldComponentUpdate: function(nextProps, nextState, nextContext) {
* return !equal(nextProps, this.props) ||
* !equal(nextState, this.state) ||
* !equal(nextContext, this.context);
* }
*
* @param {object} nextProps
* @param {?object} nextState
* @param {?object} nextContext
* @return {boolean} True if the component should update.
* @optional
*/
shouldComponentUpdate: 'DEFINE_ONCE',
/**
* Invoked when the component is about to update due to a transition from
* `this.props`, `this.state` and `this.context` to `nextProps`, `nextState`
* and `nextContext`.
*
* Use this as an opportunity to perform preparation before an update occurs.
*
* NOTE: You **cannot** use `this.setState()` in this method.
*
* @param {object} nextProps
* @param {?object} nextState
* @param {?object} nextContext
* @param {ReactReconcileTransaction} transaction
* @optional
*/
componentWillUpdate: 'DEFINE_MANY',
/**
* Invoked when the component's DOM representation has been updated.
*
* Use this as an opportunity to operate on the DOM when the component has
* been updated.
*
* @param {object} prevProps
* @param {?object} prevState
* @param {?object} prevContext
* @param {DOMElement} rootNode DOM element representing the component.
* @optional
*/
componentDidUpdate: 'DEFINE_MANY',
/**
* Invoked when the component is about to be removed from its parent and have
* its DOM representation destroyed.
*
* Use this as an opportunity to deallocate any external resources.
*
* NOTE: There is no `componentDidUnmount` since your component will have been
* destroyed by that point.
*
* @optional
*/
componentWillUnmount: 'DEFINE_MANY',
// ==== Advanced methods ====
/**
* Updates the component's currently mounted DOM representation.
*
* By default, this implements React's rendering and reconciliation algorithm.
* Sophisticated clients may wish to override this.
*
* @param {ReactReconcileTransaction} transaction
* @internal
* @overridable
*/
updateComponent: 'OVERRIDE_BASE'
};
/**
* Mapping from class specification keys to special processing functions.
*
* Although these are declared like instance properties in the specification
* when defining classes using `React.createClass`, they are actually static
* and are accessible on the constructor instead of the prototype. Despite
* being static, they must be defined outside of the "statics" key under
* which all other static methods are defined.
*/
var RESERVED_SPEC_KEYS = {
displayName: function (Constructor, displayName) {
Constructor.displayName = displayName;
},
mixins: function (Constructor, mixins) {
if (mixins) {
for (var i = 0; i < mixins.length; i++) {
mixSpecIntoComponent(Constructor, mixins[i]);
}
if (children !== this.props.children || dirty) {
this.setState({ dirty: true });
}
},
childContextTypes: function (Constructor, childContextTypes) {
if (false) {
validateTypeDef(Constructor, childContextTypes, 'childContext');
}
Constructor.childContextTypes = _assign({}, Constructor.childContextTypes, childContextTypes);
},
contextTypes: function (Constructor, contextTypes) {
if (false) {
validateTypeDef(Constructor, contextTypes, 'context');
}
Constructor.contextTypes = _assign({}, Constructor.contextTypes, contextTypes);
},
/**
* Special case getDefaultProps which should move into statics but requires
* automatic merging.
*/
getDefaultProps: function (Constructor, getDefaultProps) {
if (Constructor.getDefaultProps) {
Constructor.getDefaultProps = createMergedResultFunction(Constructor.getDefaultProps, getDefaultProps);
} else {
Constructor.getDefaultProps = getDefaultProps;
}
},
propTypes: function (Constructor, propTypes) {
if (false) {
validateTypeDef(Constructor, propTypes, 'prop');
}
Constructor.propTypes = _assign({}, Constructor.propTypes, propTypes);
},
statics: function (Constructor, statics) {
mixStaticSpecIntoComponent(Constructor, statics);
},
autobind: function () {} };
function validateTypeDef(Constructor, typeDef, location) {
for (var propName in typeDef) {
if (typeDef.hasOwnProperty(propName)) {
// use a warning instead of an _invariant so components
// don't show up in prod but only in __DEV__
false ? warning(typeof typeDef[propName] === 'function', '%s: %s type `%s` is invalid; it must be a function, usually from ' + 'React.PropTypes.', Constructor.displayName || 'ReactClass', ReactPropTypeLocationNames[location], propName) : void 0;
}
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
var _this3 = this;
function validateMethodOverride(isAlreadyDefined, name) {
var specPolicy = ReactClassInterface.hasOwnProperty(name) ? ReactClassInterface[name] : null;
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
// Disallow overriding of base class methods unless explicitly allowed.
if (ReactClassMixin.hasOwnProperty(name)) {
_invariant(specPolicy === 'OVERRIDE_BASE', 'ReactClassInterface: You are attempting to override ' + '`%s` from your class specification. Ensure that your method names ' + 'do not overlap with React methods.', name);
}
// Disallow defining methods more than once unless explicitly allowed.
if (isAlreadyDefined) {
_invariant(specPolicy === 'DEFINE_MANY' || specPolicy === 'DEFINE_MANY_MERGED', 'ReactClassInterface: You are attempting to define ' + '`%s` on your component more than once. This conflict may be due ' + 'to a mixin.', name);
}
}
/**
* Mixin helper which handles policy validation and reserved
* specification keys when building React classes.
*/
function mixSpecIntoComponent(Constructor, spec) {
if (!spec) {
if (false) {
var typeofSpec = typeof spec;
var isMixinValid = typeofSpec === 'object' && spec !== null;
process.env.NODE_ENV !== 'production' ? warning(isMixinValid, '%s: You\'re attempting to include a mixin that is either null ' + 'or not an object. Check the mixins included by the component, ' + 'as well as any mixins they include themselves. ' + 'Expected object but got %s.', Constructor.displayName || 'ReactClass', spec === null ? null : typeofSpec) : void 0;
}
return;
}
_invariant(typeof spec !== 'function', 'ReactClass: You\'re attempting to ' + 'use a component class or function as a mixin. Instead, just use a ' + 'regular object.');
_invariant(!isValidElement(spec), 'ReactClass: You\'re attempting to ' + 'use a component as a mixin. Instead, just use a regular object.');
var proto = Constructor.prototype;
var autoBindPairs = proto.__reactAutoBindPairs;
// By handling mixins before any other properties, we ensure the same
// chaining order is applied to methods with DEFINE_MANY policy, whether
// mixins are listed before or after these methods in the spec.
if (spec.hasOwnProperty(MIXINS_KEY)) {
RESERVED_SPEC_KEYS.mixins(Constructor, spec.mixins);
}
for (var name in spec) {
if (!spec.hasOwnProperty(name)) {
continue;
}
if (name === MIXINS_KEY) {
// We have already handled mixins in a special case above.
continue;
}
var property = spec[name];
var isAlreadyDefined = proto.hasOwnProperty(name);
validateMethodOverride(isAlreadyDefined, name);
if (RESERVED_SPEC_KEYS.hasOwnProperty(name)) {
RESERVED_SPEC_KEYS[name](Constructor, property);
if (height === this.state.height) {
this.setState({ dirty: dirty });
} else {
// Setup methods on prototype:
// The following member methods should not be automatically bound:
// 1. Expected ReactClass methods (in the "interface").
// 2. Overridden methods (that were mixed in).
var isReactClassMethod = ReactClassInterface.hasOwnProperty(name);
var isFunction = typeof property === 'function';
var shouldAutoBind = isFunction && !isReactClassMethod && !isAlreadyDefined && spec.autobind !== false;
if (shouldAutoBind) {
autoBindPairs.push(name, property);
proto[name] = property;
} else {
if (isAlreadyDefined) {
var specPolicy = ReactClassInterface[name];
// These cases should already be caught by validateMethodOverride.
_invariant(isReactClassMethod && (specPolicy === 'DEFINE_MANY_MERGED' || specPolicy === 'DEFINE_MANY'), 'ReactClass: Unexpected spec policy %s for key %s ' + 'when mixing in component specs.', specPolicy, name);
// For methods which are defined more than once, call the existing
// methods before calling the new property, merging if appropriate.
if (specPolicy === 'DEFINE_MANY_MERGED') {
proto[name] = createMergedResultFunction(proto[name], property);
} else if (specPolicy === 'DEFINE_MANY') {
proto[name] = createChainedFunction(proto[name], property);
}
} else {
proto[name] = property;
if (false) {
// Add verbose displayName to the function, which helps when looking
// at profiling tools.
if (typeof property === 'function' && spec.displayName) {
proto[name].displayName = spec.displayName + '_' + name;
}
}
}
}
this.setState({ height: height, dirty: dirty }, function () {
return _this3.props.onHeightReady(_this3.state.height);
});
}
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props,
_onHeightReady = _props.onHeightReady,
_getElementHeight = _props.getElementHeight,
_dirty = _props.dirty,
hidden = _props.hidden,
children = _props.children,
props = _objectWithoutProperties(_props, ['onHeightReady', 'getElementHeight', 'dirty', 'hidden', 'children']);
function mixStaticSpecIntoComponent(Constructor, statics) {
if (!statics) {
return;
}
for (var name in statics) {
var property = statics[name];
if (!statics.hasOwnProperty(name)) {
continue;
}
var dirty = this.state.dirty;
var isReserved = name in RESERVED_SPEC_KEYS;
_invariant(!isReserved, 'ReactClass: You are attempting to define a reserved ' + 'property, `%s`, that shouldn\'t be on the "statics" key. Define it ' + 'as an instance property instead; it will still be accessible on the ' + 'constructor.', name);
var isInherited = name in Constructor;
_invariant(!isInherited, 'ReactClass: You are attempting to define ' + '`%s` on your component more than once. This conflict may be ' + 'due to a mixin.', name);
Constructor[name] = property;
}
}
/**
* Merge two objects, but throw if both contain the same key.
*
* @param {object} one The first object, which is mutated.
* @param {object} two The second object
* @return {object} one after it has been mutated to contain everything in two.
*/
function mergeIntoWithNoDuplicateKeys(one, two) {
_invariant(one && two && typeof one === 'object' && typeof two === 'object', 'mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.');
for (var key in two) {
if (two.hasOwnProperty(key)) {
_invariant(one[key] === undefined, 'mergeIntoWithNoDuplicateKeys(): ' + 'Tried to merge two objects with the same key: `%s`. This conflict ' + 'may be due to a mixin; in particular, this may be caused by two ' + 'getInitialState() or getDefaultProps() methods returning objects ' + 'with clashing keys.', key);
one[key] = two[key];
if (hidden && !dirty) {
return null;
}
}
return one;
}
/**
* Creates a function that invokes two functions and merges their return values.
*
* @param {function} one Function to invoke first.
* @param {function} two Function to invoke second.
* @return {function} Function that invokes the two argument functions.
* @private
*/
function createMergedResultFunction(one, two) {
return function mergedResult() {
var a = one.apply(this, arguments);
var b = two.apply(this, arguments);
if (a == null) {
return b;
} else if (b == null) {
return a;
if (hidden) {
return _react2.default.createElement(
'div',
{ style: { height: 0, overflow: 'hidden' } },
_react2.default.createElement(
'div',
_extends({ ref: this.setWrapperRef }, props),
children
)
);
}
var c = {};
mergeIntoWithNoDuplicateKeys(c, a);
mergeIntoWithNoDuplicateKeys(c, b);
return c;
};
}
/**
* Creates a function that invokes two functions and ignores their return vales.
*
* @param {function} one Function to invoke first.
* @param {function} two Function to invoke second.
* @return {function} Function that invokes the two argument functions.
* @private
*/
function createChainedFunction(one, two) {
return function chainedFunction() {
one.apply(this, arguments);
two.apply(this, arguments);
};
}
/**
* Binds a method to the component.
*
* @param {object} component Component whose method is going to be bound.
* @param {function} method Method to be bound.
* @return {function} The bound method.
*/
function bindAutoBindMethod(component, method) {
var boundMethod = method.bind(component);
if (false) {
boundMethod.__reactBoundContext = component;
boundMethod.__reactBoundMethod = method;
boundMethod.__reactBoundArguments = null;
var componentName = component.constructor.displayName;
var _bind = boundMethod.bind;
boundMethod.bind = function (newThis) {
for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
args[_key - 1] = arguments[_key];
}
// User is trying to bind() an autobound method; we effectively will
// ignore the value of "this" that the user is trying to use, so
// let's warn.
if (newThis !== component && newThis !== null) {
process.env.NODE_ENV !== 'production' ? warning(false, 'bind(): React component methods may only be bound to the ' + 'component instance. See %s', componentName) : void 0;
} else if (!args.length) {
process.env.NODE_ENV !== 'production' ? warning(false, 'bind(): You are binding a component method to the component. ' + 'React does this for you automatically in a high-performance ' + 'way, so you can safely remove this call. See %s', componentName) : void 0;
return boundMethod;
}
var reboundMethod = _bind.apply(boundMethod, arguments);
reboundMethod.__reactBoundContext = component;
reboundMethod.__reactBoundMethod = method;
reboundMethod.__reactBoundArguments = args;
return reboundMethod;
};
return _react2.default.createElement(
'div',
_extends({ ref: this.setWrapperRef }, props),
children
);
}
return boundMethod;
}
}]);
/**
* Binds all auto-bound methods in a component.
*
* @param {object} component Component whose method is going to be bound.
*/
function bindAutoBindMethods(component) {
var pairs = component.__reactAutoBindPairs;
for (var i = 0; i < pairs.length; i += 2) {
var autoBindKey = pairs[i];
var method = pairs[i + 1];
component[autoBindKey] = bindAutoBindMethod(component, method);
}
}
return ReactHeight;
}(_react.PureComponent);
var IsMountedMixin = {
componentDidMount: function () {
this.__isMounted = true;
},
componentWillUnmount: function () {
this.__isMounted = false;
}
};
ReactHeight.propTypes = {
children: _propTypes2.default.node.isRequired,
onHeightReady: _propTypes2.default.func.isRequired,
hidden: _propTypes2.default.bool,
dirty: _propTypes2.default.bool,
getElementHeight: _propTypes2.default.func
};
ReactHeight.defaultProps = {
hidden: false,
dirty: true,
getElementHeight: getElementHeight
};
/**
* Add more to the ReactClass base class. These are all legacy features and
* therefore not already part of the modern ReactComponent.
*/
var ReactClassMixin = {
/**
* TODO: This will be deprecated because state should always keep a consistent
* type signature and the only use case for this, is to avoid that.
*/
replaceState: function (newState, callback) {
this.updater.enqueueReplaceState(this, newState, callback);
},
/**
* Checks whether or not this composite component is mounted.
* @return {boolean} True if mounted, false otherwise.
* @protected
* @final
*/
isMounted: function () {
if (false) {
process.env.NODE_ENV !== 'production' ? warning(this.__didWarnIsMounted, '%s: isMounted is deprecated. Instead, make sure to clean up ' + 'subscriptions and pending requests in componentWillUnmount to ' + 'prevent memory leaks.', this.constructor && this.constructor.displayName || this.name || 'Component') : void 0;
this.__didWarnIsMounted = true;
}
return !!this.__isMounted;
}
};
var ReactClassComponent = function () {};
_assign(ReactClassComponent.prototype, ReactComponent.prototype, ReactClassMixin);
/**
* Creates a composite component class given a class specification.
* See https://facebook.github.io/react/docs/top-level-api.html#react.createclass
*
* @param {object} spec Class specification (which must define `render`).
* @return {function} Component constructor function.
* @public
*/
function createClass(spec) {
// To keep our warnings more understandable, we'll use a little hack here to
// ensure that Constructor.name !== 'Constructor'. This makes sure we don't
// unnecessarily identify a class without displayName as 'Constructor'.
var Constructor = identity(function (props, context, updater) {
// This constructor gets overridden by mocks. The argument is used
// by mocks to assert on what gets mounted.
if (false) {
process.env.NODE_ENV !== 'production' ? warning(this instanceof Constructor, 'Something is calling a React component directly. Use a factory or ' + 'JSX instead. See: https://fb.me/react-legacyfactory') : void 0;
}
// Wire up auto-binding
if (this.__reactAutoBindPairs.length) {
bindAutoBindMethods(this);
}
this.props = props;
this.context = context;
this.refs = emptyObject;
this.updater = updater || ReactNoopUpdateQueue;
this.state = null;
// ReactClasses doesn't have constructors. Instead, they use the
// getInitialState and componentWillMount methods for initialization.
var initialState = this.getInitialState ? this.getInitialState() : null;
if (false) {
// We allow auto-mocks to proceed as if they're returning null.
if (initialState === undefined && this.getInitialState._isMockFunction) {
// This is probably bad practice. Consider warning here and
// deprecating this convenience.
initialState = null;
}
}
_invariant(typeof initialState === 'object' && !Array.isArray(initialState), '%s.getInitialState(): must return an object or null', Constructor.displayName || 'ReactCompositeComponent');
this.state = initialState;
});
Constructor.prototype = new ReactClassComponent();
Constructor.prototype.constructor = Constructor;
Constructor.prototype.__reactAutoBindPairs = [];
injectedMixins.forEach(mixSpecIntoComponent.bind(null, Constructor));
mixSpecIntoComponent(Constructor, IsMountedMixin);
mixSpecIntoComponent(Constructor, spec);
// Initialize the defaultProps property after all mixins have been merged.
if (Constructor.getDefaultProps) {
Constructor.defaultProps = Constructor.getDefaultProps();
}
if (false) {
// This is a tag to indicate that the use of these method names is ok,
// since it's used with createClass. If it's not, then it's likely a
// mistake so we'll warn you to use the static property, property
// initializer or constructor respectively.
if (Constructor.getDefaultProps) {
Constructor.getDefaultProps.isReactClassApproved = {};
}
if (Constructor.prototype.getInitialState) {
Constructor.prototype.getInitialState.isReactClassApproved = {};
}
}
_invariant(Constructor.prototype.render, 'createClass(...): Class specification must implement a `render` method.');
if (false) {
process.env.NODE_ENV !== 'production' ? warning(!Constructor.prototype.componentShouldUpdate, '%s has a method called ' + 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' + 'The name is phrased as a question because the function is ' + 'expected to return a value.', spec.displayName || 'A component') : void 0;
process.env.NODE_ENV !== 'production' ? warning(!Constructor.prototype.componentWillRecieveProps, '%s has a method called ' + 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?', spec.displayName || 'A component') : void 0;
}
// Reduce time spent doing lookups by setting these on the prototype.
for (var methodName in ReactClassInterface) {
if (!Constructor.prototype[methodName]) {
Constructor.prototype[methodName] = null;
}
}
return Constructor;
}
return createClass;
}
module.exports = factory;
/***/ }),
/* 5 */
/* 1 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*/
var _require = __webpack_require__(0),
ReactHeight = _require.ReactHeight;
var React = __webpack_require__(1);
var factory = __webpack_require__(4);
ReactHeight.ReactHeight = ReactHeight;
module.exports = ReactHeight;
// Hack to grab NoopUpdateQueue from isomorphic React
var ReactNoopUpdateQueue = new React.Component().updater;
module.exports = factory(
React.Component,
React.isValidElement,
ReactNoopUpdateQueue
);
/***/ }),
/* 6 */
/* 2 */
/***/ (function(module, exports, __webpack_require__) {

@@ -1104,3 +292,3 @@

/***/ }),
/* 7 */
/* 3 */
/***/ (function(module, exports, __webpack_require__) {

@@ -1121,185 +309,51 @@

var emptyObject = {};
if (false) {
Object.freeze(emptyObject);
}
module.exports = emptyObject;
/***/ }),
/* 8 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**
* Copyright (c) 2013-present, Facebook, Inc.
* All rights reserved.
* Use invariant() to assert state which your program assumes to be true.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
* Provide sprintf-style format (only %s is supported) and arguments
* to provide information about what broke and what you were
* expecting.
*
* @typechecks
*
* The invariant message will be stripped in production, but the invariant
* will remain to ensure logic does not differ in production.
*/
/*eslint-disable no-self-compare */
var validateFormat = function validateFormat(format) {};
var hasOwnProperty = Object.prototype.hasOwnProperty;
/**
* inlined Object.is polyfill to avoid requiring consumers ship their own
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
*/
function is(x, y) {
// SameValue algorithm
if (x === y) {
// Steps 1-5, 7-10
// Steps 6.b-6.e: +0 != -0
// Added the nonzero y check to make Flow happy, but it is redundant
return x !== 0 || y !== 0 || 1 / x === 1 / y;
} else {
// Step 6.a: NaN == NaN
return x !== x && y !== y;
}
if (false) {
validateFormat = function validateFormat(format) {
if (format === undefined) {
throw new Error('invariant requires an error message argument');
}
};
}
/**
* Performs equality by iterating through keys on an object and returning false
* when any key has values which are not strictly equal between the arguments.
* Returns true when the values of all keys are strictly equal.
*/
function shallowEqual(objA, objB) {
if (is(objA, objB)) {
return true;
}
function invariant(condition, format, a, b, c, d, e, f) {
validateFormat(format);
if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
return false;
}
if (!condition) {
var error;
if (format === undefined) {
error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');
} else {
var args = [a, b, c, d, e, f];
var argIndex = 0;
error = new Error(format.replace(/%s/g, function () {
return args[argIndex++];
}));
error.name = 'Invariant Violation';
}
var keysA = Object.keys(objA);
var keysB = Object.keys(objB);
if (keysA.length !== keysB.length) {
return false;
error.framesToPop = 1; // we don't care about invariant's own frame
throw error;
}
// Test for A's keys different from B.
for (var i = 0; i < keysA.length; i++) {
if (!hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {
return false;
}
}
return true;
}
module.exports = shallowEqual;
module.exports = invariant;
/***/ }),
/* 9 */
/* 4 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/
/* eslint-disable no-unused-vars */
var getOwnPropertySymbols = Object.getOwnPropertySymbols;
var hasOwnProperty = Object.prototype.hasOwnProperty;
var propIsEnumerable = Object.prototype.propertyIsEnumerable;
function toObject(val) {
if (val === null || val === undefined) {
throw new TypeError('Object.assign cannot be called with null or undefined');
}
return Object(val);
}
function shouldUseNative() {
try {
if (!Object.assign) {
return false;
}
// Detect buggy property enumeration order in older V8 versions.
// https://bugs.chromium.org/p/v8/issues/detail?id=4118
var test1 = new String('abc'); // eslint-disable-line no-new-wrappers
test1[5] = 'de';
if (Object.getOwnPropertyNames(test1)[0] === '5') {
return false;
}
// https://bugs.chromium.org/p/v8/issues/detail?id=3056
var test2 = {};
for (var i = 0; i < 10; i++) {
test2['_' + String.fromCharCode(i)] = i;
}
var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
return test2[n];
});
if (order2.join('') !== '0123456789') {
return false;
}
// https://bugs.chromium.org/p/v8/issues/detail?id=3056
var test3 = {};
'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
test3[letter] = letter;
});
if (Object.keys(Object.assign({}, test3)).join('') !==
'abcdefghijklmnopqrst') {
return false;
}
return true;
} catch (err) {
// We don't expect any of the above to throw, but better to be safe.
return false;
}
}
module.exports = shouldUseNative() ? Object.assign : function (target, source) {
var from;
var to = toObject(target);
var symbols;
for (var s = 1; s < arguments.length; s++) {
from = Object(arguments[s]);
for (var key in from) {
if (hasOwnProperty.call(from, key)) {
to[key] = from[key];
}
}
if (getOwnPropertySymbols) {
symbols = getOwnPropertySymbols(from);
for (var i = 0; i < symbols.length; i++) {
if (propIsEnumerable.call(from, symbols[i])) {
to[symbols[i]] = from[symbols[i]];
}
}
}
}
return to;
};
/***/ }),
/* 10 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**

@@ -1316,4 +370,4 @@ * Copyright 2013-present, Facebook, Inc.

var emptyFunction = __webpack_require__(6);
var invariant = __webpack_require__(0);
var emptyFunction = __webpack_require__(2);
var invariant = __webpack_require__(3);

@@ -1363,3 +417,3 @@ module.exports = function() {

/***/ }),
/* 11 */
/* 5 */
/***/ (function(module, exports, __webpack_require__) {

@@ -1395,3 +449,3 @@

// http://fb.me/prop-types-in-prod
module.exports = __webpack_require__(10)();
module.exports = __webpack_require__(4)();
}

@@ -1401,87 +455,9 @@

/***/ }),
/* 12 */
/***/ (function(module, exports, __webpack_require__) {
/* 6 */
/***/ (function(module, exports) {
"use strict";
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*/
module.exports = __WEBPACK_EXTERNAL_MODULE_6__;
var shallowCompare = __webpack_require__(13);
/**
* If your React component's render function is "pure", e.g. it will render the
* same result given the same props and state, provide this mixin for a
* considerable performance boost.
*
* Most React components have pure render functions.
*
* Example:
*
* var ReactComponentWithPureRenderMixin =
* require('ReactComponentWithPureRenderMixin');
* React.createClass({
* mixins: [ReactComponentWithPureRenderMixin],
*
* render: function() {
* return <div className={this.props.className}>foo</div>;
* }
* });
*
* Note: This only checks shallow equality for props and state. If these contain
* complex data structures this mixin may have false-negatives for deeper
* differences. Only mixin to components which have simple props and state, or
* use `forceUpdate()` when you know deep data structures have changed.
*
* See https://facebook.github.io/react/docs/pure-render-mixin.html
*/
var ReactComponentWithPureRenderMixin = {
shouldComponentUpdate: function (nextProps, nextState) {
return shallowCompare(this, nextProps, nextState);
}
};
module.exports = ReactComponentWithPureRenderMixin;
/***/ }),
/* 13 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*/
var shallowEqual = __webpack_require__(8);
/**
* Does a shallow comparison for props and state.
* See ReactComponentWithPureRenderMixin
* See also https://facebook.github.io/react/docs/shallow-compare.html
*/
function shallowCompare(instance, nextProps, nextState) {
return !shallowEqual(instance.props, nextProps) || !shallowEqual(instance.state, nextState);
}
module.exports = shallowCompare;
/***/ })
/******/ ]);
});
//# sourceMappingURL=react-height.js.map
});

7

build/react-height.min.js

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

!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports.ReactHeight=e(require("react")):t.ReactHeight=e(t.React)}(this,function(t){return function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=3)}([function(t,e,n){"use strict";function r(t,e,n,r,i,a,s,u){if(o(e),!t){var c;if(void 0===e)c=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var p=[n,r,i,a,s,u],f=0;c=new Error(e.replace(/%s/g,function(){return p[f++]})),c.name="Invariant Violation"}throw c.framesToPop=1,c}}var o=function(t){};t.exports=r},function(e,n){e.exports=t},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){var n={};for(var r in t)e.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n}Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},a=n(1),s=r(a),u=n(11),c=r(u),p=n(5),f=r(p),l=n(12),h=function(t){return t.clientHeight},d=(0,f.default)({propTypes:{children:c.default.node.isRequired,onHeightReady:c.default.func.isRequired,hidden:c.default.bool,dirty:c.default.bool,getElementHeight:c.default.func},getDefaultProps:function(){return{hidden:!1,dirty:!0,getElementHeight:h}},getInitialState:function(){return{height:0,dirty:this.props.dirty}},componentDidMount:function(){var t=this,e=this.props.getElementHeight(this.wrapper);this.setState({height:e,dirty:!1},function(){return t.props.onHeightReady(t.state.height)})},componentWillReceiveProps:function(t){var e=t.children,n=t.dirty;(e!==this.props.children||n)&&this.setState({dirty:!0})},shouldComponentUpdate:l.shouldComponentUpdate,componentDidUpdate:function(){var t=this,e=this.props.getElementHeight(this.wrapper);e===this.state.height?this.setState({dirty:!1}):this.setState({height:e,dirty:!1},function(){return t.props.onHeightReady(t.state.height)})},setWrapperRef:function(t){this.wrapper=t},render:function(){var t=this.props,e=(t.onHeightReady,t.getElementHeight,t.dirty,t.hidden),n=t.children,r=o(t,["onHeightReady","getElementHeight","dirty","hidden","children"]),a=this.state.dirty;return e&&!a?null:e?s.default.createElement("div",{style:{height:0,overflow:"hidden"}},s.default.createElement("div",i({ref:this.setWrapperRef},r),n)):s.default.createElement("div",i({ref:this.setWrapperRef},r),n)}});e.default=d},function(t,e,n){"use strict";var r=n(2).default;t.exports=r},function(t,e,n){"use strict";function r(t){return t}function o(t,e,n){function o(t,e){var n=E.hasOwnProperty(e)?E[e]:null;N.hasOwnProperty(e)&&s("OVERRIDE_BASE"===n,"ReactClassInterface: You are attempting to override `%s` from your class specification. Ensure that your method names do not overlap with React methods.",e),t&&s("DEFINE_MANY"===n||"DEFINE_MANY_MERGED"===n,"ReactClassInterface: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",e)}function c(t,n){if(n){s("function"!=typeof n,"ReactClass: You're attempting to use a component class or function as a mixin. Instead, just use a regular object."),s(!e(n),"ReactClass: You're attempting to use a component as a mixin. Instead, just use a regular object.");var r=t.prototype,i=r.__reactAutoBindPairs;n.hasOwnProperty(u)&&v.mixins(t,n.mixins);for(var a in n)if(n.hasOwnProperty(a)&&a!==u){var c=n[a],p=r.hasOwnProperty(a);if(o(p,a),v.hasOwnProperty(a))v[a](t,c);else{var f=E.hasOwnProperty(a),d="function"==typeof c,y=d&&!f&&!p&&!1!==n.autobind;if(y)i.push(a,c),r[a]=c;else if(p){var m=E[a];s(f&&("DEFINE_MANY_MERGED"===m||"DEFINE_MANY"===m),"ReactClass: Unexpected spec policy %s for key %s when mixing in component specs.",m,a),"DEFINE_MANY_MERGED"===m?r[a]=l(r[a],c):"DEFINE_MANY"===m&&(r[a]=h(r[a],c))}else r[a]=c}}}else;}function p(t,e){if(e)for(var n in e){var r=e[n];if(e.hasOwnProperty(n)){var o=n in v;s(!o,'ReactClass: You are attempting to define a reserved property, `%s`, that shouldn\'t be on the "statics" key. Define it as an instance property instead; it will still be accessible on the constructor.',n);var i=n in t;s(!i,"ReactClass: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",n),t[n]=r}}}function f(t,e){s(t&&e&&"object"==typeof t&&"object"==typeof e,"mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.");for(var n in e)e.hasOwnProperty(n)&&(s(void 0===t[n],"mergeIntoWithNoDuplicateKeys(): Tried to merge two objects with the same key: `%s`. This conflict may be due to a mixin; in particular, this may be caused by two getInitialState() or getDefaultProps() methods returning objects with clashing keys.",n),t[n]=e[n]);return t}function l(t,e){return function(){var n=t.apply(this,arguments),r=e.apply(this,arguments);if(null==n)return r;if(null==r)return n;var o={};return f(o,n),f(o,r),o}}function h(t,e){return function(){t.apply(this,arguments),e.apply(this,arguments)}}function d(t,e){var n=e.bind(t);return n}function y(t){for(var e=t.__reactAutoBindPairs,n=0;n<e.length;n+=2){var r=e[n],o=e[n+1];t[r]=d(t,o)}}function m(t){var e=r(function(t,r,o){this.__reactAutoBindPairs.length&&y(this),this.props=t,this.context=r,this.refs=a,this.updater=o||n,this.state=null;var i=this.getInitialState?this.getInitialState():null;s("object"==typeof i&&!Array.isArray(i),"%s.getInitialState(): must return an object or null",e.displayName||"ReactCompositeComponent"),this.state=i});e.prototype=new _,e.prototype.constructor=e,e.prototype.__reactAutoBindPairs=[],g.forEach(c.bind(null,e)),c(e,b),c(e,t),e.getDefaultProps&&(e.defaultProps=e.getDefaultProps()),s(e.prototype.render,"createClass(...): Class specification must implement a `render` method.");for(var o in E)e.prototype[o]||(e.prototype[o]=null);return e}var g=[],E={mixins:"DEFINE_MANY",statics:"DEFINE_MANY",propTypes:"DEFINE_MANY",contextTypes:"DEFINE_MANY",childContextTypes:"DEFINE_MANY",getDefaultProps:"DEFINE_MANY_MERGED",getInitialState:"DEFINE_MANY_MERGED",getChildContext:"DEFINE_MANY_MERGED",render:"DEFINE_ONCE",componentWillMount:"DEFINE_MANY",componentDidMount:"DEFINE_MANY",componentWillReceiveProps:"DEFINE_MANY",shouldComponentUpdate:"DEFINE_ONCE",componentWillUpdate:"DEFINE_MANY",componentDidUpdate:"DEFINE_MANY",componentWillUnmount:"DEFINE_MANY",updateComponent:"OVERRIDE_BASE"},v={displayName:function(t,e){t.displayName=e},mixins:function(t,e){if(e)for(var n=0;n<e.length;n++)c(t,e[n])},childContextTypes:function(t,e){t.childContextTypes=i({},t.childContextTypes,e)},contextTypes:function(t,e){t.contextTypes=i({},t.contextTypes,e)},getDefaultProps:function(t,e){t.getDefaultProps?t.getDefaultProps=l(t.getDefaultProps,e):t.getDefaultProps=e},propTypes:function(t,e){t.propTypes=i({},t.propTypes,e)},statics:function(t,e){p(t,e)},autobind:function(){}},b={componentDidMount:function(){this.__isMounted=!0},componentWillUnmount:function(){this.__isMounted=!1}},N={replaceState:function(t,e){this.updater.enqueueReplaceState(this,t,e)},isMounted:function(){return!!this.__isMounted}},_=function(){};return i(_.prototype,t.prototype,N),m}var i=n(9),a=n(7),s=n(0),u="mixins";t.exports=o},function(t,e,n){"use strict";var r=n(1),o=n(4),i=(new r.Component).updater;t.exports=o(r.Component,r.isValidElement,i)},function(t,e,n){"use strict";function r(t){return function(){return t}}var o=function(){};o.thatReturns=r,o.thatReturnsFalse=r(!1),o.thatReturnsTrue=r(!0),o.thatReturnsNull=r(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(t){return t},t.exports=o},function(t,e,n){"use strict";var r={};t.exports=r},function(t,e,n){"use strict";function r(t,e){return t===e?0!==t||0!==e||1/t==1/e:t!==t&&e!==e}function o(t,e){if(r(t,e))return!0;if("object"!=typeof t||null===t||"object"!=typeof e||null===e)return!1;var n=Object.keys(t),o=Object.keys(e);if(n.length!==o.length)return!1;for(var a=0;a<n.length;a++)if(!i.call(e,n[a])||!r(t[n[a]],e[n[a]]))return!1;return!0}var i=Object.prototype.hasOwnProperty;t.exports=o},function(t,e,n){"use strict";function r(t){if(null===t||void 0===t)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(t)}/*
object-assign
(c) Sindre Sorhus
@license MIT
*/
var o=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,a=Object.prototype.propertyIsEnumerable;t.exports=function(){try{if(!Object.assign)return!1;var t=new String("abc");if(t[5]="de","5"===Object.getOwnPropertyNames(t)[0])return!1;for(var e={},n=0;n<10;n++)e["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(e).map(function(t){return e[t]}).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach(function(t){r[t]=t}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(t){return!1}}()?Object.assign:function(t,e){for(var n,s,u=r(t),c=1;c<arguments.length;c++){n=Object(arguments[c]);for(var p in n)i.call(n,p)&&(u[p]=n[p]);if(o){s=o(n);for(var f=0;f<s.length;f++)a.call(n,s[f])&&(u[s[f]]=n[s[f]])}}return u}},function(t,e,n){"use strict";var r=n(6),o=n(0);t.exports=function(){function t(){o(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function e(){return t}t.isRequired=t;var n={array:t,bool:t,func:t,number:t,object:t,string:t,symbol:t,any:t,arrayOf:e,element:t,instanceOf:e,node:t,objectOf:e,oneOf:e,oneOfType:e,shape:e};return n.checkPropTypes=r,n.PropTypes=n,n}},function(t,e,n){t.exports=n(10)()},function(t,e,n){"use strict";var r=n(13),o={shouldComponentUpdate:function(t,e){return r(this,t,e)}};t.exports=o},function(t,e,n){"use strict";function r(t,e,n){return!o(t.props,e)||!o(t.state,n)}var o=n(8);t.exports=r}])});
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.ReactHeight=t(require("react")):e.ReactHeight=t(e.React)}(this,function(e){return function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var r={};return t.m=e,t.c=r,t.i=function(e){return e},t.d=function(e,r,n){t.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:n})},t.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(r,"a",r),r},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{default:e}}function o(e,t){var r={};for(var n in e)t.indexOf(n)>=0||Object.prototype.hasOwnProperty.call(e,n)&&(r[n]=e[n]);return r}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0}),t.ReactHeight=void 0;var c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},s=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),f=r(6),p=n(f),l=r(5),h=n(l),d=function(e){return e.clientHeight},y=t.ReactHeight=function(e){function t(e){i(this,t);var r=u(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return r.setWrapperRef=function(e){r.wrapper=e},r.state={dirty:e.dirty,height:0},r}return a(t,e),s(t,[{key:"componentDidMount",value:function(){var e=this,t=this.props.getElementHeight(this.wrapper);this.setState({height:t,dirty:!1},function(){return e.props.onHeightReady(e.state.height)})}},{key:"componentWillReceiveProps",value:function(e){var t=e.children,r=e.dirty;(t!==this.props.children||r)&&this.setState({dirty:!0})}},{key:"componentDidUpdate",value:function(){var e=this,t=this.props.getElementHeight(this.wrapper);t===this.state.height?this.setState({dirty:!1}):this.setState({height:t,dirty:!1},function(){return e.props.onHeightReady(e.state.height)})}},{key:"render",value:function(){var e=this.props,t=(e.onHeightReady,e.getElementHeight,e.dirty,e.hidden),r=e.children,n=o(e,["onHeightReady","getElementHeight","dirty","hidden","children"]),i=this.state.dirty;return t&&!i?null:t?p.default.createElement("div",{style:{height:0,overflow:"hidden"}},p.default.createElement("div",c({ref:this.setWrapperRef},n),r)):p.default.createElement("div",c({ref:this.setWrapperRef},n),r)}}]),t}(f.PureComponent);y.propTypes={children:h.default.node.isRequired,onHeightReady:h.default.func.isRequired,hidden:h.default.bool,dirty:h.default.bool,getElementHeight:h.default.func},y.defaultProps={hidden:!1,dirty:!0,getElementHeight:d}},function(e,t,r){"use strict";var n=r(0),o=n.ReactHeight;o.ReactHeight=o,e.exports=o},function(e,t,r){"use strict";function n(e){return function(){return e}}var o=function(){};o.thatReturns=n,o.thatReturnsFalse=n(!1),o.thatReturnsTrue=n(!0),o.thatReturnsNull=n(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(e){return e},e.exports=o},function(e,t,r){"use strict";function n(e,t,r,n,i,u,a,c){if(o(t),!e){var s;if(void 0===t)s=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var f=[r,n,i,u,a,c],p=0;s=new Error(t.replace(/%s/g,function(){return f[p++]})),s.name="Invariant Violation"}throw s.framesToPop=1,s}}var o=function(e){};e.exports=n},function(e,t,r){"use strict";var n=r(2),o=r(3);e.exports=function(){function e(){o(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function t(){return e}e.isRequired=e;var r={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t};return r.checkPropTypes=n,r.PropTypes=r,r}},function(e,t,r){e.exports=r(4)()},function(t,r){t.exports=e}])});

9

lib/index.js
'use strict';
// Babel6 does not hack the default behaviour of ES Modules anymore, so we should export
var _require = require('./ReactHeight'),
ReactHeight = _require.ReactHeight;
var ReactHeight = require('./ReactHeight').default;
module.exports = ReactHeight;
//# sourceMappingURL=index.js.map
ReactHeight.ReactHeight = ReactHeight;
module.exports = ReactHeight;

177

lib/ReactHeight.js

@@ -6,5 +6,8 @@ 'use strict';

});
exports.ReactHeight = 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; };
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; }; }();
var _react = require('react');

@@ -18,11 +21,11 @@

var _createReactClass = require('create-react-class');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _createReactClass2 = _interopRequireDefault(_createReactClass);
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 _ReactComponentWithPureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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 _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; } /* eslint "react/no-did-mount-set-state":0 */
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; } /* eslint "react/no-did-mount-set-state":0 */
/* eslint "react/no-did-update-set-state":0 */

@@ -34,54 +37,29 @@

var ReactHeight = (0, _createReactClass2.default)({
propTypes: {
children: _propTypes2.default.node.isRequired,
onHeightReady: _propTypes2.default.func.isRequired,
hidden: _propTypes2.default.bool,
dirty: _propTypes2.default.bool,
getElementHeight: _propTypes2.default.func
},
var ReactHeight = exports.ReactHeight = function (_PureComponent) {
_inherits(ReactHeight, _PureComponent);
getDefaultProps: function getDefaultProps() {
return {
hidden: false,
dirty: true,
getElementHeight: getElementHeight
};
},
getInitialState: function getInitialState() {
return {
height: 0, dirty: this.props.dirty
};
},
componentDidMount: function componentDidMount() {
var _this = this;
function ReactHeight(props) {
_classCallCheck(this, ReactHeight);
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
var _this = _possibleConstructorReturn(this, (ReactHeight.__proto__ || Object.getPrototypeOf(ReactHeight)).call(this, props));
this.setState({ height: height, dirty: dirty }, function () {
return _this.props.onHeightReady(_this.state.height);
});
},
componentWillReceiveProps: function componentWillReceiveProps(_ref) {
var children = _ref.children,
dirty = _ref.dirty;
_this.setWrapperRef = function (el) {
_this.wrapper = el;
};
if (children !== this.props.children || dirty) {
this.setState({ dirty: true });
}
},
_this.state = {
dirty: props.dirty,
height: 0
};
return _this;
}
_createClass(ReactHeight, [{
key: 'componentDidMount',
value: function componentDidMount() {
var _this2 = this;
shouldComponentUpdate: _ReactComponentWithPureRenderMixin.shouldComponentUpdate,
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
componentDidUpdate: function componentDidUpdate() {
var _this2 = this;
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
if (height === this.state.height) {
this.setState({ dirty: dirty });
} else {
this.setState({ height: height, dirty: dirty }, function () {

@@ -91,43 +69,80 @@ return _this2.props.onHeightReady(_this2.state.height);

}
},
setWrapperRef: function setWrapperRef(el) {
this.wrapper = el;
},
render: function render() {
var _props = this.props,
_onHeightReady = _props.onHeightReady,
_getElementHeight = _props.getElementHeight,
_dirty = _props.dirty,
hidden = _props.hidden,
children = _props.children,
props = _objectWithoutProperties(_props, ['onHeightReady', 'getElementHeight', 'dirty', 'hidden', 'children']);
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(_ref) {
var children = _ref.children,
dirty = _ref.dirty;
var dirty = this.state.dirty;
if (children !== this.props.children || dirty) {
this.setState({ dirty: true });
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
var _this3 = this;
var height = this.props.getElementHeight(this.wrapper);
var dirty = false;
if (hidden && !dirty) {
return null;
if (height === this.state.height) {
this.setState({ dirty: dirty });
} else {
this.setState({ height: height, dirty: dirty }, function () {
return _this3.props.onHeightReady(_this3.state.height);
});
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props,
_onHeightReady = _props.onHeightReady,
_getElementHeight = _props.getElementHeight,
_dirty = _props.dirty,
hidden = _props.hidden,
children = _props.children,
props = _objectWithoutProperties(_props, ['onHeightReady', 'getElementHeight', 'dirty', 'hidden', 'children']);
if (hidden) {
var dirty = this.state.dirty;
if (hidden && !dirty) {
return null;
}
if (hidden) {
return _react2.default.createElement(
'div',
{ style: { height: 0, overflow: 'hidden' } },
_react2.default.createElement(
'div',
_extends({ ref: this.setWrapperRef }, props),
children
)
);
}
return _react2.default.createElement(
'div',
{ style: { height: 0, overflow: 'hidden' } },
_react2.default.createElement(
'div',
_extends({ ref: this.setWrapperRef }, props),
children
)
_extends({ ref: this.setWrapperRef }, props),
children
);
}
}]);
return _react2.default.createElement(
'div',
_extends({ ref: this.setWrapperRef }, props),
children
);
}
});
return ReactHeight;
}(_react.PureComponent);
exports.default = ReactHeight;
//# sourceMappingURL=ReactHeight.js.map
ReactHeight.propTypes = {
children: _propTypes2.default.node.isRequired,
onHeightReady: _propTypes2.default.func.isRequired,
hidden: _propTypes2.default.bool,
dirty: _propTypes2.default.bool,
getElementHeight: _propTypes2.default.func
};
ReactHeight.defaultProps = {
hidden: false,
dirty: true,
getElementHeight: getElementHeight
};

11

package.json
{
"name": "react-height",
"version": "2.2.1",
"version": "3.0.0",
"description": "Component-wrapper to determine and report children elements height",

@@ -11,3 +11,3 @@ "main": "lib/index.js",

"prebuild": "rimraf lib example build",
"build:lib": "cross-env NODE_ENV=production babel src --out-dir lib --source-maps --ignore src/example",
"build:lib": "cross-env NODE_ENV=production babel src --out-dir lib --ignore src/example",
"build:ghPages": "cross-env NODE_ENV=production BUILD=ghPages webpack",

@@ -45,3 +45,3 @@ "build:dist": "cross-env NODE_ENV=production BUILD=dist webpack",

"peerDependencies": {
"react": "^0.14 || ^15"
"react": ">=15.3"
},

@@ -53,2 +53,3 @@ "devDependencies": {

"babel-loader": "6.4.1",
"babel-plugin-transform-class-properties": "6.24.1",
"babel-plugin-transform-object-rest-spread": "6.23.0",

@@ -61,2 +62,3 @@ "babel-preset-es2015": "6.24.1",

"eslint": "3.19.0",
"eslint-plugin-babel": "4.1.1",
"eslint-plugin-react": "6.10.3",

@@ -70,4 +72,4 @@ "glob": "7.1.1",

"parallelshell": "2.0.0",
"react": "15.5.4",
"react-dom": "15.5.4",
"react": "15.5.4",
"rimraf": "2.6.1",

@@ -83,5 +85,4 @@ "sinon": "2.1.0",

"dependencies": {
"create-react-class": "15.5.2",
"prop-types": "15.5.8"
}
}

26

README.md

@@ -32,28 +32,6 @@ # react-height [![npm](https://img.shields.io/npm/v/react-height.svg?style=flat-square)](https://www.npmjs.com/package/react-height)

### Bower:
```sh
bower install --save https://unpkg.com/react-height/bower.zip
```
or in `bower.json`
```json
{
"dependencies": {
"react-height": "https://unpkg.com/react-height/bower.zip"
}
}
```
then include as
```html
<script src="bower_components/react/react.js"></script>
<script src="bower_components/react-height/build/react-height.js"></script>
```
### 1998 Script Tag:
```html
<script src="https://unpkg.com/react/dist/react.js"></script>
<script src="https://unpkg.com/react-height/build/react-height.js"></script>
<script src="https://unpkg.com/react-height/build/react-height.min.js"></script>
(Module exposed as `ReactHeight`)

@@ -73,2 +51,4 @@ ```

```js
import {ReactHeight} from 'react-height';
<ReactHeight onHeightReady={height => console.log(height)}>

@@ -75,0 +55,0 @@ <div>Random content</div>

4

src/index.js
'use strict';
// Babel6 does not hack the default behaviour of ES Modules anymore, so we should export
const ReactHeight = require('./ReactHeight').default;
const {ReactHeight} = require('./ReactHeight');
ReactHeight.ReactHeight = ReactHeight;
module.exports = ReactHeight;

52

src/ReactHeight.js

@@ -5,11 +5,11 @@ /* eslint "react/no-did-mount-set-state":0 */

import React from 'react';
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import createReactClass from 'create-react-class';
import {shouldComponentUpdate} from 'react/lib/ReactComponentWithPureRenderMixin';
const getElementHeight = el => el.clientHeight;
const ReactHeight = createReactClass({
propTypes: {
export class ReactHeight extends PureComponent {
static propTypes = {
children: PropTypes.node.isRequired,

@@ -20,19 +20,19 @@ onHeightReady: PropTypes.func.isRequired,

getElementHeight: PropTypes.func
},
};
getDefaultProps() {
return {
hidden: false,
dirty: true,
getElementHeight
};
},
static defaultProps = {
hidden: false,
dirty: true,
getElementHeight
};
getInitialState() {
return {
height: 0, dirty: this.props.dirty
constructor(props) {
super(props);
this.state = {
dirty: props.dirty,
height: 0
};
},
}

@@ -45,3 +45,3 @@

this.setState({height, dirty}, () => this.props.onHeightReady(this.state.height));
},
}

@@ -53,8 +53,5 @@

}
},
}
shouldComponentUpdate,
componentDidUpdate() {

@@ -69,8 +66,8 @@ const height = this.props.getElementHeight(this.wrapper);

}
},
}
setWrapperRef(el) {
setWrapperRef = el => {
this.wrapper = el;
},
};

@@ -103,5 +100,2 @@

}
});
export default ReactHeight;
}
bower.json
build/react-height.js.map
lib/index.js.map
lib/ReactHeight.js.map
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