all files / src/ component.js

84.62% Statements 22/26
44.44% Branches 8/18
60% Functions 3/5
87.5% Lines 21/24
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110    11× 11×   11×   11×   11×   11×                           39×   39×   39×   39×   39×   39×     11×                                                                                     22× 22× 22× 22× 22×                                         11×  
'use strict';
 
exports.__esModule = true;
exports['default'] = Component;
 
var _hooks = require('./hooks');
 
var _util = require('./util');
 
var _linkedState = require('./linked-state');
 
var _vdomComponent = require('./vdom/component');
 
/** Base Component class, for he ES6 Class method of creating Components
 *	@public
 *
 *	@example
 *	class MyFoo extends Component {
 *		render(props, state) {
 *			return <div />;
 *		}
 *	}
 */
 
function Component(props, context) {
	/** @private */
	this._dirty = true;
	/** @public */
	this._disableRendering = false;
	/** @public */
	this.prevState = this.prevProps = this.prevContext = this.base = this.nextBase = this._parentComponent = this._component = this.__ref = this.__key = this._linkedStates = this._renderCallbacks = null;
	/** @public */
	this.context = context || {};
	/** @type {object} */
	this.props = props;
	/** @type {object} */
	this.state = _hooks.hook(this, 'getInitialState') || {};
}
 
_util.extend(Component.prototype, {
 
	/** Returns a `boolean` value indicating if the component should re-render when receiving the given `props` and `state`.
  *	@param {object} nextProps
  *	@param {object} nextState
  *	@param {object} nextContext
  *	@returns {Boolean} should the component re-render
  *	@name shouldComponentUpdate
  *	@function
  */
	// shouldComponentUpdate() {
	// 	return true;
	// },
 
	/** Returns a function that sets a state property when called.
  *	Calling linkState() repeatedly with the same arguments returns a cached link function.
  *
  *	Provides some built-in special cases:
  *		- Checkboxes and radio buttons link their boolean `checked` value
  *		- Inputs automatically link their `value` property
  *		- Event paths fall back to any associated Component if not found on an element
  *		- If linked value is a function, will invoke it and use the result
  *
  *	@param {string} key				The path to set - can be a dot-notated deep key
  *	@param {string} [eventPath]		If set, attempts to find the new state value at a given dot-notated path within the object passed to the linkedState setter.
  *	@returns {function} linkStateSetter(e)
  *
  *	@example Update a "text" state value when an input changes:
  *		<input onChange={ this.linkState('text') } />
  *
  *	@example Set a deep state value on click
  *		<button onClick={ this.linkState('touch.coords', 'touches.0') }>Tap</button
  */
	linkState: function linkState(key, eventPath) {
		var c = this._linkedStates || (this._linkedStates = {}),
		    cacheKey = key + '|' + (eventPath || '');
		return c[cacheKey] || (c[cacheKey] = _linkedState.createLinkedState(this, key, eventPath));
	},
 
	/** Update component state by copying properties from `state` to `this.state`.
  *	@param {object} state		A hash of state properties to update with new values
  */
	setState: function setState(state, callback) {
		var s = this.state;
		if (!this.prevState) this.prevState = _util.clone(s);
		_util.extend(s, _util.isFunction(state) ? state(s, this.props) : state);
		Iif (callback) (this._renderCallbacks = this._renderCallbacks || []).push(callback);
		_vdomComponent.triggerComponentRender(this);
	},
 
	/** Immediately perform a synchronous re-render of the component.
  *	@private
  */
	forceUpdate: function forceUpdate() {
		_vdomComponent.renderComponent(this);
	},
 
	/** Accepts `props` and `state`, and returns a new Virtual DOM tree to build.
  *	Virtual DOM is generally constructed via [JSX](http://jasonformat.com/wtf-is-jsx).
  *	@param {object} props		Props (eg: JSX attributes) received from parent element/component
  *	@param {object} state		The component's current state
  *	@param {object} context		Context object (if a parent component has provided context)
  *	@returns VNode
  */
	render: function render() {
		return null;
	}
 
});
module.exports = exports['default'];